@alfalab/core-components-chart 1.2.0 → 2.0.0

package/dist/esm/components/Tick/index.css

@@ -1,4 +1,4 @@
-/* hash: 1cwrr */
+/* hash: 1umff */
 :root {
     --color-dark-bg-primary: #0b1f35;
     --color-light-text-primary: #0b1f35;
@@ -11,17 +11,17 @@
 
     /* Hard up */
 }
-.chart__tickText_1cwrr {
+.chart__tickText_sxzxj {
     fill: var(--color-light-text-primary);
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
 }
-.chart__circle_1cwrr {
+.chart__circle_sxzxj {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }
-.chart__circle_1cwrr {
+.chart__circle_sxzxj {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }

package/dist/esm/components/Tick/index.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import cn from 'classnames';
 
-var styles = {"tickText":"chart__tickText_1cwrr","circle":"chart__circle_1cwrr"};
+var styles = {"tickText":"chart__tickText_sxzxj","circle":"chart__circle_sxzxj"};
 require('./index.css')
 
 var Tick = function (_a) {

package/dist/esm/components/TooltipContent/index.css

@@ -1,4 +1,4 @@
-/* hash: 8ie71 */
+/* hash: 1ie0c */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
@@ -19,7 +19,7 @@
 :root {
     --border-radius-m: 8px;
 }
-.chart__tooltip_8ie71 {
+.chart__tooltip_csamk {
     background-color: var(--color-light-bg-primary);
     border: 1px solid var(--color-light-border-primary);
     box-shadow: var(--shadow-l);
@@ -28,17 +28,17 @@
     pointer-events: none;
     position: relative;
 }
-.chart__tooltipList_8ie71 {
+.chart__tooltipList_csamk {
     position: relative;
     z-index: 5;
     list-style-type: none;
     padding: 0;
     margin: 0;
 }
-.chart__tooltipItem_8ie71 {
+.chart__tooltipItem_csamk {
     margin-bottom: 10px;
 }
-.chart__tooltipArrow_8ie71 {
+.chart__tooltipArrow_csamk {
     position: absolute;
     left: 0;
     top: 50%;
@@ -48,7 +48,7 @@
     border: 1px solid var(--color-light-border-primary);
     background-color: var(--color-light-bg-primary);
 }
-.chart__tooltipArrow_8ie71:before {
+.chart__tooltipArrow_csamk:before {
     content: '';
     position: absolute;
     left: -2px;
@@ -59,7 +59,7 @@
     border-width: 0 24px 24px 0;
     border-color: transparent var(--color-light-bg-primary) transparent transparent;
 }
-.chart__tooltipArrowRight_8ie71 {
+.chart__tooltipArrowRight_csamk {
     left: 100%;
     transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
 }

package/dist/esm/components/TooltipContent/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Typography } from '@alfalab/core-components-typography/dist/esm';
 
-var styles = {"tooltip":"chart__tooltip_8ie71","tooltipList":"chart__tooltipList_8ie71","tooltipItem":"chart__tooltipItem_8ie71","tooltipArrow":"chart__tooltipArrow_8ie71","tooltipArrowRight":"chart__tooltipArrowRight_8ie71"};
+var styles = {"tooltip":"chart__tooltip_csamk","tooltipList":"chart__tooltipList_csamk","tooltipItem":"chart__tooltipItem_csamk","tooltipArrow":"chart__tooltipArrow_csamk","tooltipArrowRight":"chart__tooltipArrowRight_csamk"};
 require('./index.css')
 
 var TooltipContent = function (_a) {

package/dist/esm/hooks/useSettings/index.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../../tslib.es6-606922e2.js';
+import { _ as __assign } from '../../tslib.es6-6de29960.js';
 import { useState, useEffect } from 'react';
 import { setComposedChartsMargin } from './utils/setComposedChartsMargin.js';
 import { setDatas } from './utils/setDatas.js';

package/dist/esm/hooks/useSettings/utils/setDatas.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../../../tslib.es6-606922e2.js';
+import { _ as __assign } from '../../../tslib.es6-6de29960.js';
 
 var setDatas = function (series, labels) {
     var initData = [];

package/dist/esm/hooks/useSettings/utils/setGradientCharts.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from '../../../tslib.es6-606922e2.js';
+import { _ as __assign } from '../../../tslib.es6-6de29960.js';
 
 var setGradientCharts = function (series) {
     var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });

package/dist/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1btmk */
+/* hash: 1x30x */
 :root {
 
     /* Hard */
@@ -7,9 +7,9 @@
 
     /* Hard up */
 }
-.chart__bar_1btmk {
+.chart__bar_4ogl7 {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
 }
-.chart__unfocused_1btmk {
+.chart__unfocused_4ogl7 {
     opacity: 0.3;
 }

package/dist/esm/index.d.ts

@@ -1 +1,2 @@
 export * from "./Component";
+export * from "./types/index";

package/dist/esm/index.js

@@ -1,8 +1,8 @@
-import './tslib.es6-606922e2.js';
+import './tslib.es6-6de29960.js';
 import 'react';
 import 'classnames';
 import 'recharts';
-import './Component.js';
+export { Chart } from './Component.js';
 import './components/LinearGradient.js';
 import '@alfalab/core-components-typography/dist/esm';
 import './icons/Circle.js';

package/dist/esm/types/index.d.ts

@@ -0,0 +1,14 @@
+export * from "./utils/index";
+export * from "./brush.types";
+export * from "./cartesianGrid.types";
+export * from "./chart.types";
+export * from "./composedChart.types";
+export * from "./labelList.types";
+export * from "./legend.types";
+export * from "./options.types";
+export * from "./payload.types";
+export * from "./responsiveContainer.types";
+export * from "./seria.types";
+export * from "./tooltip.types";
+export * from "./xAxis.types";
+export * from "./yAxis.types";

package/dist/esm/types/index.js

@@ -0,0 +1 @@
+

package/dist/esm/types/utils/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./axis.types";
+export * from "./coordinates.types";
+export * from "./data.types";
+export * from "./dot.types";
+export * from "./gradient.types";
+export * from "./tick.types";

package/dist/esm/types/utils/index.js

@@ -0,0 +1 @@
+

package/dist/hooks/useSettings/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../tslib.es6-3d19766a.js');
+var tslib_es6 = require('../../tslib.es6-c72c948d.js');
 var React = require('react');
 var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
 var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');

package/dist/hooks/useSettings/utils/setDatas.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../../tslib.es6-3d19766a.js');
+var tslib_es6 = require('../../../tslib.es6-c72c948d.js');
 
 var setDatas = function (series, labels) {
     var initData = [];

package/dist/hooks/useSettings/utils/setGradientCharts.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('../../../tslib.es6-3d19766a.js');
+var tslib_es6 = require('../../../tslib.es6-c72c948d.js');
 
 var setGradientCharts = function (series) {
     var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });

package/dist/index.css

@@ -1,4 +1,4 @@
-/* hash: 1btmk */
+/* hash: 1x30x */
 :root {
 
     /* Hard */
@@ -7,9 +7,9 @@
 
     /* Hard up */
 }
-.chart__bar_1btmk {
+.chart__bar_4ogl7 {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
 }
-.chart__unfocused_1btmk {
+.chart__unfocused_4ogl7 {
     opacity: 0.3;
 }

package/dist/index.d.ts

@@ -1 +1,2 @@
 export * from "./Component";
+export * from "./types/index";

package/dist/index.js

@@ -1,10 +1,12 @@
 'use strict';
 
-require('./tslib.es6-3d19766a.js');
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('./tslib.es6-c72c948d.js');
 require('react');
 require('classnames');
 require('recharts');
-require('./Component.js');
+var Component = require('./Component.js');
 require('./components/LinearGradient.js');
 require('@alfalab/core-components-typography');
 require('./icons/Circle.js');
@@ -27,3 +29,6 @@ require('./components/RectBar.js');
 require('./components/Tick/index.js');
 require('./components/TooltipContent/index.js');
 
+
+
+exports.Chart = Component.Chart;

package/dist/modern/Component.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-import React from 'react';
 import { OptionsProps } from "./types/options.types";
-declare const _default: React.MemoExoticComponent<(props: OptionsProps) => JSX.Element | null>;
-export { _default as default };
+declare const Chart: (props: OptionsProps) => JSX.Element | null;
+export { Chart };

package/dist/modern/Component.js

@@ -19,7 +19,7 @@ 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 { RectBar } from './components/RectBar.js';
 import { Tick } from './components/Tick/index.js';
 import { TooltipContent } from './components/TooltipContent/index.js';
 
@@ -30,7 +30,7 @@ const CustomizedHOC = (Component, options) => {
     return NewComponent;
 };
 
-var styles = {"coreChart":"chart__coreChart_1btmk","bar":"chart__bar_1btmk","unfocused":"chart__unfocused_1btmk"};
+var styles = {"coreChart":"chart__coreChart_4ogl7","bar":"chart__bar_4ogl7","unfocused":"chart__unfocused_4ogl7"};
 require('./index.css')
 
 const Chart = (props) => {
@@ -263,6 +263,5 @@ const Chart = (props) => {
                 state.brush && renderBrush,
                 state.legend && renderLegend))));
 };
-var Component = React.memo(Chart);
 
-export default Component;
+export { Chart };

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

@@ -1,19 +1,19 @@
-/* hash: 9g95g */
-.chart__dotUnfocused_9g95g {
+/* hash: 11tnr */
+.chart__dotUnfocused_13nr2 {
     opacity: 0.3;
 }
 
-.chart__dot_9g95g,
-.chart__dotItem_9g95g,
-.chart__dotWrap_9g95g {
+.chart__dot_13nr2,
+.chart__dotItem_13nr2,
+.chart__dotWrap_13nr2 {
     transition: all 0.2s ease;
 }
 
-.chart__dot_9g95g {
-    animation: chart__showDot_9g95g 0.5s ease;
+.chart__dot_13nr2 {
+    animation: chart__showDot_13nr2 0.5s ease;
 }
 
-@keyframes chart__showDot_9g95g {
+@keyframes chart__showDot_13nr2 {
     from {
         opacity: 0;
     }

package/dist/modern/components/Dot/index.js

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import cn from 'classnames';
 import { PointIcon } from '../../icons/Point.js';
 
-var styles = {"dotUnfocused":"chart__dotUnfocused_9g95g","dot":"chart__dot_9g95g","dotItem":"chart__dotItem_9g95g","dotWrap":"chart__dotWrap_9g95g","showDot":"chart__showDot_9g95g"};
+var styles = {"dotUnfocused":"chart__dotUnfocused_13nr2","dot":"chart__dot_13nr2","dotItem":"chart__dotItem_13nr2","dotWrap":"chart__dotWrap_13nr2","showDot":"chart__showDot_13nr2"};
 require('./index.css')
 
 const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings, value, stroke }, ref) => {

package/dist/modern/components/Legends/index.css

@@ -1,4 +1,4 @@
-/* hash: v8ezw */
+/* hash: 1hoci */
 :root {
 
     /* Hard */
@@ -10,31 +10,31 @@
 :root {
     --gap-2xl: 32px;
 }
-.chart__legendContent_v8ezw {
+.chart__legendContent_1e90m {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
 }
-.chart__legendWrap_v8ezw {
+.chart__legendWrap_1e90m {
     width: 100%;
     margin: 0;
     padding: 0;
 }
-.chart__legendItem_v8ezw {
+.chart__legendItem_1e90m {
     margin-right: var(--gap-2xl);
     cursor: pointer;
     display: inline-block;
 }
-.chart__legendItem_v8ezw:last-child {
+.chart__legendItem_1e90m:last-child {
     margin-right: 0;
 }
-.chart__legendUnactive_v8ezw {
+.chart__legendUnactive_1e90m {
     opacity: 0.3;
 }
-.chart__legendIcon_v8ezw {
+.chart__legendIcon_1e90m {
     margin-right: 13px;
     display: flex;
 }
-.chart__legendValue_v8ezw {
+.chart__legendValue_1e90m {
     text-transform: capitalize;
 }

package/dist/modern/components/Legends/index.js

@@ -6,7 +6,7 @@ import { CircleLineIcon } from '../../icons/CircleLine.js';
 import { FilledCircleIcon } from '../../icons/FilledCircle.js';
 import { StrokeCircleIcon } from '../../icons/StrokeCircle.js';
 
-var styles = {"legendContent":"chart__legendContent_v8ezw","legendWrap":"chart__legendWrap_v8ezw","legendItem":"chart__legendItem_v8ezw","legendUnactive":"chart__legendUnactive_v8ezw","legendIcon":"chart__legendIcon_v8ezw","legendValue":"chart__legendValue_v8ezw"};
+var styles = {"legendContent":"chart__legendContent_1e90m","legendWrap":"chart__legendWrap_1e90m","legendItem":"chart__legendItem_1e90m","legendUnactive":"chart__legendUnactive_1e90m","legendIcon":"chart__legendIcon_1e90m","legendValue":"chart__legendValue_1e90m"};
 require('./index.css')
 
 const icons = {

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

@@ -1,4 +1,3 @@
 /// <reference types="react" />
-import React from 'react';
-declare const _default: React.MemoExoticComponent<({ fill, x, y, width, height, radius, background }: any) => JSX.Element>;
-export { _default as default };
+declare const RectBar: ({ fill, x, y, width, height, radius, background }: any) => JSX.Element;
+export { RectBar };

package/dist/modern/components/RectBar.js

@@ -28,6 +28,5 @@ const RectBar = ({ fill, x, y, width, height, radius, background }) => {
     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);
 };
-var RectBar$1 = React.memo(RectBar);
 
-export default RectBar$1;
+export { RectBar };

package/dist/modern/components/Tick/index.css

@@ -1,4 +1,4 @@
-/* hash: 1cwrr */
+/* hash: 1umff */
 :root {
     --color-dark-bg-primary: #0b1f35;
     --color-light-text-primary: #0b1f35;
@@ -11,17 +11,17 @@
 
     /* Hard up */
 }
-.chart__tickText_1cwrr {
+.chart__tickText_sxzxj {
     fill: var(--color-light-text-primary);
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
 }
-.chart__circle_1cwrr {
+.chart__circle_sxzxj {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }
-.chart__circle_1cwrr {
+.chart__circle_sxzxj {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }

package/dist/modern/components/Tick/index.js

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

package/dist/modern/components/TooltipContent/index.css

@@ -1,4 +1,4 @@
-/* hash: 8ie71 */
+/* hash: 1ie0c */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
@@ -19,7 +19,7 @@
 :root {
     --border-radius-m: 8px;
 }
-.chart__tooltip_8ie71 {
+.chart__tooltip_csamk {
     background-color: var(--color-light-bg-primary);
     border: 1px solid var(--color-light-border-primary);
     box-shadow: var(--shadow-l);
@@ -28,17 +28,17 @@
     pointer-events: none;
     position: relative;
 }
-.chart__tooltipList_8ie71 {
+.chart__tooltipList_csamk {
     position: relative;
     z-index: 5;
     list-style-type: none;
     padding: 0;
     margin: 0;
 }
-.chart__tooltipItem_8ie71 {
+.chart__tooltipItem_csamk {
     margin-bottom: 10px;
 }
-.chart__tooltipArrow_8ie71 {
+.chart__tooltipArrow_csamk {
     position: absolute;
     left: 0;
     top: 50%;
@@ -48,7 +48,7 @@
     border: 1px solid var(--color-light-border-primary);
     background-color: var(--color-light-bg-primary);
 }
-.chart__tooltipArrow_8ie71:before {
+.chart__tooltipArrow_csamk:before {
     content: '';
     position: absolute;
     left: -2px;
@@ -59,7 +59,7 @@
     border-width: 0 24px 24px 0;
     border-color: transparent var(--color-light-bg-primary) transparent transparent;
 }
-.chart__tooltipArrowRight_8ie71 {
+.chart__tooltipArrowRight_csamk {
     left: 100%;
     transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
 }

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

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Typography } from '@alfalab/core-components-typography/dist/modern';
 
-var styles = {"tooltip":"chart__tooltip_8ie71","tooltipList":"chart__tooltipList_8ie71","tooltipItem":"chart__tooltipItem_8ie71","tooltipArrow":"chart__tooltipArrow_8ie71","tooltipArrowRight":"chart__tooltipArrowRight_8ie71"};
+var styles = {"tooltip":"chart__tooltip_csamk","tooltipList":"chart__tooltipList_csamk","tooltipItem":"chart__tooltipItem_csamk","tooltipArrow":"chart__tooltipArrow_csamk","tooltipArrowRight":"chart__tooltipArrowRight_csamk"};
 require('./index.css')
 
 const TooltipContent = ({ payload, separator, label, tooltipArrowSide, arrow, series, labelFormatter, labelStyle, }) => {

package/dist/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 1btmk */
+/* hash: 1x30x */
 :root {
 
     /* Hard */
@@ -7,9 +7,9 @@
 
     /* Hard up */
 }
-.chart__bar_1btmk {
+.chart__bar_4ogl7 {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
 }
-.chart__unfocused_1btmk {
+.chart__unfocused_4ogl7 {
     opacity: 0.3;
 }

package/dist/modern/index.d.ts

@@ -1 +1,2 @@
 export * from "./Component";
+export * from "./types/index";

package/dist/modern/index.js

@@ -1,7 +1,7 @@
 import 'react';
 import 'classnames';
 import 'recharts';
-import './Component.js';
+export { Chart } from './Component.js';
 import './components/LinearGradient.js';
 import '@alfalab/core-components-typography/dist/modern';
 import './icons/Circle.js';

package/dist/modern/types/index.d.ts

@@ -0,0 +1,14 @@
+export * from "./utils/index";
+export * from "./brush.types";
+export * from "./cartesianGrid.types";
+export * from "./chart.types";
+export * from "./composedChart.types";
+export * from "./labelList.types";
+export * from "./legend.types";
+export * from "./options.types";
+export * from "./payload.types";
+export * from "./responsiveContainer.types";
+export * from "./seria.types";
+export * from "./tooltip.types";
+export * from "./xAxis.types";
+export * from "./yAxis.types";

package/dist/modern/types/index.js

@@ -0,0 +1 @@
+

package/dist/modern/types/utils/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./axis.types";
+export * from "./coordinates.types";
+export * from "./data.types";
+export * from "./dot.types";
+export * from "./gradient.types";
+export * from "./tick.types";

package/dist/modern/types/utils/index.js

@@ -0,0 +1 @@
+

package/dist/types/index.d.ts

@@ -0,0 +1,14 @@
+export * from "./utils/index";
+export * from "./brush.types";
+export * from "./cartesianGrid.types";
+export * from "./chart.types";
+export * from "./composedChart.types";
+export * from "./labelList.types";
+export * from "./legend.types";
+export * from "./options.types";
+export * from "./payload.types";
+export * from "./responsiveContainer.types";
+export * from "./seria.types";
+export * from "./tooltip.types";
+export * from "./xAxis.types";
+export * from "./yAxis.types";

package/dist/types/index.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/dist/types/utils/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./axis.types";
+export * from "./coordinates.types";
+export * from "./data.types";
+export * from "./dot.types";
+export * from "./gradient.types";
+export * from "./tick.types";

package/dist/types/utils/index.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-chart",
-    "version": "1.2.0",
+    "version": "2.0.0",
     "description": "Chart component",
     "keywords": [],
     "license": "MIT",
@@ -15,9 +15,8 @@
         "access": "public"
     },
     "dependencies": {
-        "@alfalab/core-components-typography": "^2.0.1",
+        "@alfalab/core-components-typography": "^2.4.0",
         "classnames": "^2.2.6",
-        "moment": "^2.29.1",
         "recharts": "^2.0.10"
     },
     "devDependencies": {
@@ -26,5 +25,5 @@
     "peerDependencies": {
         "react": "^16.9.0 || ^17.0.1"
     },
-    "gitHead": "86042776f9e45c24fd7bc9fe7d81c98748f66081"
+    "gitHead": "ddf4fab6035139cf412e0acb7174ef388f23e4f2"
 }