@alfalab/core-components-chart 3.1.6 → 3.1.8

package/cssm/hooks/useSettings/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-19b064c1.js');
+var tslib = require('tslib');
 var React = require('react');
 var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
 var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');
@@ -15,7 +15,7 @@ var useSettings = function (options) {
     var _d = React.useState(0), filterCount = _d[0], setFilterCount = _d[1];
     React.useEffect(function () {
         var _a;
-        var settings = tslib_es6.__assign({}, options);
+        var settings = tslib.__assign({}, options);
         var brush = settings.brush, legend = settings.legend, series = settings.series, labels = settings.labels, composeChart = settings.composeChart, xAxis = settings.xAxis;
         if (((_a = settings.legend) === null || _a === void 0 ? void 0 : _a.margin) && brush && legend)
             settings.legend.margin.top = hooks_useSettings_utils_setLegendMargin.setLegendMargin(brush, legend);

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../../tslib.es6-19b064c1.js');
+var tslib = require('tslib');
 
 var setDatas = function (series, labels) {
     var initData = [];
@@ -25,7 +25,7 @@ var setDatas = function (series, labels) {
                 if (index === -1)
                     initData.push(obj);
                 else
-                    initData[index] = tslib_es6.__assign(tslib_es6.__assign({}, initData[index]), obj);
+                    initData[index] = tslib.__assign(tslib.__assign({}, initData[index]), obj);
             }
             return null;
         });

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../../tslib.es6-19b064c1.js');
+var tslib = require('tslib');
 
 var setGradientCharts = function (series) {
     var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });
@@ -17,7 +17,7 @@ var setGradientCharts = function (series) {
                     };
                 });
             }
-            accum.push(tslib_es6.__assign(tslib_es6.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib_es6.__assign(tslib_es6.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
+            accum.push(tslib.__assign(tslib.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib.__assign(tslib.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
         }
         accum.push(item);
         return accum;

package/cssm/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var Component = require('./Component.js');
-require('./tslib.es6-19b064c1.js');
+require('tslib');
 require('react');
 require('classnames');
 require('recharts');

package/cssm/index.module.css

@@ -1,25 +1,27 @@
 :root {
+} /* deprecated */ :root {
     --color-light-text-primary: #0b1f35;
-}
-:root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-.coreChart :global(.recharts-line path) {
+} :root {
+} :root {
+} :root {
+} :root {
+} .coreChart :global(.recharts-line path) {
         transition: d 0.2s ease-out;
-    }
-.coreChart :global(.recharts-text tspan) {
+    } .coreChart :global(.recharts-text tspan) {
         fill: var(--color-light-text-primary);
         font-size: 16px;
         line-height: 22px;
-    }
-.bar {
+    } .bar {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
-}
-.unfocused {
+} .unfocused {
     opacity: 0.3;
 }

package/esm/Component.js

@@ -1,4 +1,4 @@
-import { _ as __assign } from './tslib.es6-44e6acd2.js';
+import { __assign } from 'tslib';
 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';
@@ -29,7 +29,7 @@ var CustomizedHOC = function (Component, options) {
     return NewComponent;
 };
 
-var styles = {"coreChart":"chart__coreChart_12np2","bar":"chart__bar_12np2","unfocused":"chart__unfocused_12np2"};
+var styles = {"coreChart":"chart__coreChart_l53sx","bar":"chart__bar_l53sx","unfocused":"chart__unfocused_l53sx"};
 require('./index.css')
 
 var Chart = function (props) {

package/esm/components/Dot/index.css

@@ -1,19 +1,19 @@
-/* hash: 6blwv */
-.chart__dotUnfocused_1ysgs {
+/* hash: 1g8f5 */
+.chart__dotUnfocused_112s3 {
     opacity: 0.3;
 }
 
-.chart__dot_1ysgs,
-.chart__dotItem_1ysgs,
-.chart__dotWrap_1ysgs {
+.chart__dot_112s3,
+.chart__dotItem_112s3,
+.chart__dotWrap_112s3 {
     transition: all 0.2s ease;
 }
 
-.chart__dot_1ysgs {
-    animation: chart__showDot_1ysgs 0.5s ease;
+.chart__dot_112s3 {
+    animation: chart__showDot_112s3 0.5s ease;
 }
 
-@keyframes chart__showDot_1ysgs {
+@keyframes chart__showDot_112s3 {
     from {
         opacity: 0;
     }

package/esm/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_1ysgs","dot":"chart__dot_1ysgs","dotItem":"chart__dotItem_1ysgs","dotWrap":"chart__dotWrap_1ysgs","showDot":"chart__showDot_1ysgs"};
+var styles = {"dotUnfocused":"chart__dotUnfocused_112s3","dot":"chart__dot_112s3","dotItem":"chart__dotItem_112s3","dotWrap":"chart__dotWrap_112s3","showDot":"chart__showDot_112s3"};
 require('./index.css')
 
 var Dot = React.forwardRef(function (_a, ref) {

package/esm/components/Legends/index.css

@@ -1,40 +1,39 @@
-/* hash: li1ih */
+/* hash: 18ofx */
 :root {
+} /* deprecated */ :root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-:root {
+} :root {
+} :root {
     --gap-2xl: 32px;
-}
-.chart__legendContent_vxgym {
+} :root {
+} :root {
+} .chart__legendContent_v620y {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
-}
-.chart__legendWrap_vxgym {
+} .chart__legendWrap_v620y {
     width: 100%;
     margin: 0;
     padding: 0;
-}
-.chart__legendItem_vxgym {
+} .chart__legendItem_v620y {
     margin-right: var(--gap-2xl);
     cursor: pointer;
     display: inline-block;
-}
-.chart__legendItem_vxgym:last-child {
+} .chart__legendItem_v620y:last-child {
     margin-right: 0;
-}
-.chart__legendUnactive_vxgym {
+} .chart__legendUnactive_v620y {
     opacity: 0.3;
-}
-.chart__legendIcon_vxgym {
+} .chart__legendIcon_v620y {
     margin-right: 13px;
     display: flex;
-}
-.chart__legendValue_vxgym {
+} .chart__legendValue_v620y {
     text-transform: capitalize;
 }

package/esm/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_vxgym","legendWrap":"chart__legendWrap_vxgym","legendItem":"chart__legendItem_vxgym","legendUnactive":"chart__legendUnactive_vxgym","legendIcon":"chart__legendIcon_vxgym","legendValue":"chart__legendValue_vxgym"};
+var styles = {"legendContent":"chart__legendContent_v620y","legendWrap":"chart__legendWrap_v620y","legendItem":"chart__legendItem_v620y","legendUnactive":"chart__legendUnactive_v620y","legendIcon":"chart__legendIcon_v620y","legendValue":"chart__legendValue_v620y"};
 require('./index.css')
 
 var icons = {

package/esm/components/Tick/index.css

@@ -1,27 +1,30 @@
-/* hash: iolvt */
+/* hash: iq4ad */
 :root {
+} /* deprecated */ :root {
     --color-dark-bg-primary: #0b1f35;
     --color-light-text-primary: #0b1f35;
-}
-:root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-.chart__tickText_gmual {
+} :root {
+} :root {
+} :root {
+} :root {
+} .chart__tickText_sx2d9 {
     fill: var(--color-light-text-primary);
     font-size: 16px;
     line-height: 24px;
     font-weight: 400;
-}
-.chart__circle_gmual {
+} .chart__circle_sx2d9 {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
-}
-.chart__circle_gmual {
+} .chart__circle_sx2d9 {
     opacity: 0.3;
     fill: var(--color-dark-bg-primary);
 }

package/esm/components/Tick/index.js

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

package/esm/components/TooltipContent/index.css

@@ -1,9 +1,11 @@
-/* hash: ion8l */
+/* hash: kl17q */
 :root {
+} /* deprecated */ :root {
     --color-light-bg-primary: #fff;
     --color-light-border-primary: #dbdee1;
-}
-:root {
+} :root {
+} :root {
+} :root {
     --shadow-l: 0 0 24px rgba(11, 31, 53, 0.12), 0 12px 24px rgba(11, 31, 53, 0.24);
 
     /* Hard */
@@ -11,15 +13,14 @@
     /* Up */
 
     /* Hard up */
-}
-:root {
+} :root {
+    --border-radius-m: 8px;
+} :root {
     --gap-s: 12px;
     --gap-m: 16px;
-}
-:root {
-    --border-radius-m: 8px;
-}
-.chart__tooltip_59a0x {
+} :root {
+} :root {
+} .chart__tooltip_1g2qp {
     background-color: var(--color-light-bg-primary);
     border: 1px solid var(--color-light-border-primary);
     box-shadow: var(--shadow-l);
@@ -27,18 +28,15 @@
     padding: var(--gap-s) var(--gap-m);
     pointer-events: none;
     position: relative;
-}
-.chart__tooltipList_59a0x {
+} .chart__tooltipList_1g2qp {
     position: relative;
     z-index: 5;
     list-style-type: none;
     padding: 0;
     margin: 0;
-}
-.chart__tooltipItem_59a0x {
+} .chart__tooltipItem_1g2qp {
     margin-bottom: 10px;
-}
-.chart__tooltipArrow_59a0x {
+} .chart__tooltipArrow_1g2qp {
     position: absolute;
     left: 0;
     top: 50%;
@@ -47,8 +45,7 @@
     height: 10px;
     border: 1px solid var(--color-light-border-primary);
     background-color: var(--color-light-bg-primary);
-}
-.chart__tooltipArrow_59a0x:before {
+} .chart__tooltipArrow_1g2qp:before {
     content: '';
     position: absolute;
     left: -2px;
@@ -58,8 +55,7 @@
     border-style: solid;
     border-width: 0 24px 24px 0;
     border-color: transparent var(--color-light-bg-primary) transparent transparent;
-}
-.chart__tooltipArrowRight_59a0x {
+} .chart__tooltipArrowRight_1g2qp {
     left: 100%;
     transform: translate(-50%, -50%) scale(-1, 1) rotate(45deg);
 }

package/esm/components/TooltipContent/index.js

@@ -2,7 +2,7 @@ import React from 'react';
 import cn from 'classnames';
 import { Typography } from '@alfalab/core-components-typography/esm';
 
-var styles = {"tooltip":"chart__tooltip_59a0x","tooltipList":"chart__tooltipList_59a0x","tooltipItem":"chart__tooltipItem_59a0x","tooltipArrow":"chart__tooltipArrow_59a0x","tooltipArrowRight":"chart__tooltipArrowRight_59a0x"};
+var styles = {"tooltip":"chart__tooltip_1g2qp","tooltipList":"chart__tooltipList_1g2qp","tooltipItem":"chart__tooltipItem_1g2qp","tooltipArrow":"chart__tooltipArrow_1g2qp","tooltipArrowRight":"chart__tooltipArrowRight_1g2qp"};
 require('./index.css')
 
 var TooltipContent = function (_a) {

package/esm/hooks/useSettings/index.js

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

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

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

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

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

package/esm/index.css

@@ -1,26 +1,28 @@
-/* hash: 1uc1h */
+/* hash: 175n2 */
 :root {
+} /* deprecated */ :root {
     --color-light-text-primary: #0b1f35;
-}
-:root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-.chart__coreChart_12np2 .recharts-line path {
+} :root {
+} :root {
+} :root {
+} :root {
+} .chart__coreChart_l53sx .recharts-line path {
         transition: d 0.2s ease-out;
-    }
-.chart__coreChart_12np2 .recharts-text tspan {
+    } .chart__coreChart_l53sx .recharts-text tspan {
         fill: var(--color-light-text-primary);
         font-size: 16px;
         line-height: 22px;
-    }
-.chart__bar_12np2 {
+    } .chart__bar_l53sx {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
-}
-.chart__unfocused_12np2 {
+} .chart__unfocused_l53sx {
     opacity: 0.3;
 }

package/esm/index.js

@@ -1,5 +1,5 @@
 export { Chart } from './Component.js';
-import './tslib.es6-44e6acd2.js';
+import 'tslib';
 import 'react';
 import 'classnames';
 import 'recharts';

package/hooks/useSettings/index.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-0a16d1e2.js');
+var tslib = require('tslib');
 var React = require('react');
 var hooks_useSettings_utils_setComposedChartsMargin = require('./utils/setComposedChartsMargin.js');
 var hooks_useSettings_utils_setDatas = require('./utils/setDatas.js');
@@ -15,7 +15,7 @@ var useSettings = function (options) {
     var _d = React.useState(0), filterCount = _d[0], setFilterCount = _d[1];
     React.useEffect(function () {
         var _a;
-        var settings = tslib_es6.__assign({}, options);
+        var settings = tslib.__assign({}, options);
         var brush = settings.brush, legend = settings.legend, series = settings.series, labels = settings.labels, composeChart = settings.composeChart, xAxis = settings.xAxis;
         if (((_a = settings.legend) === null || _a === void 0 ? void 0 : _a.margin) && brush && legend)
             settings.legend.margin.top = hooks_useSettings_utils_setLegendMargin.setLegendMargin(brush, legend);

package/hooks/useSettings/utils/setDatas.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../../tslib.es6-0a16d1e2.js');
+var tslib = require('tslib');
 
 var setDatas = function (series, labels) {
     var initData = [];
@@ -25,7 +25,7 @@ var setDatas = function (series, labels) {
                 if (index === -1)
                     initData.push(obj);
                 else
-                    initData[index] = tslib_es6.__assign(tslib_es6.__assign({}, initData[index]), obj);
+                    initData[index] = tslib.__assign(tslib.__assign({}, initData[index]), obj);
             }
             return null;
         });

package/hooks/useSettings/utils/setGradientCharts.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var tslib_es6 = require('../../../tslib.es6-0a16d1e2.js');
+var tslib = require('tslib');
 
 var setGradientCharts = function (series) {
     var filterSeries = series.filter(function (item) { return item.chart !== 'gradient'; });
@@ -17,7 +17,7 @@ var setGradientCharts = function (series) {
                     };
                 });
             }
-            accum.push(tslib_es6.__assign(tslib_es6.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib_es6.__assign(tslib_es6.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
+            accum.push(tslib.__assign(tslib.__assign({}, item), { zIndex: -100, chart: 'gradient', hideLegend: true, hideTooltip: true, properties: tslib.__assign(tslib.__assign({}, item.properties), { dataKey: "".concat(item.properties.dataKey, "-gradient"), fill: fill }), data: newData || item.data }));
         }
         accum.push(item);
         return accum;

package/index.css

@@ -1,26 +1,28 @@
-/* hash: 1uc1h */
+/* hash: 175n2 */
 :root {
+} /* deprecated */ :root {
     --color-light-text-primary: #0b1f35;
-}
-:root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-.chart__coreChart_12np2 .recharts-line path {
+} :root {
+} :root {
+} :root {
+} :root {
+} .chart__coreChart_l53sx .recharts-line path {
         transition: d 0.2s ease-out;
-    }
-.chart__coreChart_12np2 .recharts-text tspan {
+    } .chart__coreChart_l53sx .recharts-text tspan {
         fill: var(--color-light-text-primary);
         font-size: 16px;
         line-height: 22px;
-    }
-.chart__bar_12np2 {
+    } .chart__bar_l53sx {
     transition: opacity 0.2s ease-out, d 0.2s ease-out;
-}
-.chart__unfocused_12np2 {
+} .chart__unfocused_l53sx {
     opacity: 0.3;
 }

package/index.js

@@ -1,7 +1,7 @@
 'use strict';
 
 var Component = require('./Component.js');
-require('./tslib.es6-0a16d1e2.js');
+require('tslib');
 require('react');
 require('classnames');
 require('recharts');

package/modern/Component.js

@@ -28,7 +28,7 @@ const CustomizedHOC = (Component, options) => {
     return NewComponent;
 };
 
-const styles = {"coreChart":"chart__coreChart_12np2","bar":"chart__bar_12np2","unfocused":"chart__unfocused_12np2"};
+const styles = {"coreChart":"chart__coreChart_l53sx","bar":"chart__bar_l53sx","unfocused":"chart__unfocused_l53sx"};
 require('./index.css')
 
 const Chart = (props) => {

package/modern/components/Dot/index.css

@@ -1,19 +1,19 @@
-/* hash: 6blwv */
-.chart__dotUnfocused_1ysgs {
+/* hash: 1g8f5 */
+.chart__dotUnfocused_112s3 {
     opacity: 0.3;
 }
 
-.chart__dot_1ysgs,
-.chart__dotItem_1ysgs,
-.chart__dotWrap_1ysgs {
+.chart__dot_112s3,
+.chart__dotItem_112s3,
+.chart__dotWrap_112s3 {
     transition: all 0.2s ease;
 }
 
-.chart__dot_1ysgs {
-    animation: chart__showDot_1ysgs 0.5s ease;
+.chart__dot_112s3 {
+    animation: chart__showDot_112s3 0.5s ease;
 }
 
-@keyframes chart__showDot_1ysgs {
+@keyframes chart__showDot_112s3 {
     from {
         opacity: 0;
     }

package/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';
 
-const styles = {"dotUnfocused":"chart__dotUnfocused_1ysgs","dot":"chart__dot_1ysgs","dotItem":"chart__dotItem_1ysgs","dotWrap":"chart__dotWrap_1ysgs","showDot":"chart__showDot_1ysgs"};
+const styles = {"dotUnfocused":"chart__dotUnfocused_112s3","dot":"chart__dot_112s3","dotItem":"chart__dotItem_112s3","dotWrap":"chart__dotWrap_112s3","showDot":"chart__showDot_112s3"};
 require('./index.css')
 
 const Dot = React.forwardRef(({ cx, cy, index, activeDot, dataKey, dotSettings, value, stroke }, ref) => {

package/modern/components/Legends/index.css

@@ -1,40 +1,39 @@
-/* hash: li1ih */
+/* hash: 18ofx */
 :root {
+} /* deprecated */ :root {
+} :root {
+} :root {
+} :root {
 
     /* Hard */
 
     /* Up */
 
     /* Hard up */
-}
-:root {
+} :root {
+} :root {
     --gap-2xl: 32px;
-}
-.chart__legendContent_vxgym {
+} :root {
+} :root {
+} .chart__legendContent_v620y {
     display: flex;
     align-items: center;
     flex-wrap: wrap;
-}
-.chart__legendWrap_vxgym {
+} .chart__legendWrap_v620y {
     width: 100%;
     margin: 0;
     padding: 0;
-}
-.chart__legendItem_vxgym {
+} .chart__legendItem_v620y {
     margin-right: var(--gap-2xl);
     cursor: pointer;
     display: inline-block;
-}
-.chart__legendItem_vxgym:last-child {
+} .chart__legendItem_v620y:last-child {
     margin-right: 0;
-}
-.chart__legendUnactive_vxgym {
+} .chart__legendUnactive_v620y {
     opacity: 0.3;
-}
-.chart__legendIcon_vxgym {
+} .chart__legendIcon_v620y {
     margin-right: 13px;
     display: flex;
-}
-.chart__legendValue_vxgym {
+} .chart__legendValue_v620y {
     text-transform: capitalize;
 }

package/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';
 
-const styles = {"legendContent":"chart__legendContent_vxgym","legendWrap":"chart__legendWrap_vxgym","legendItem":"chart__legendItem_vxgym","legendUnactive":"chart__legendUnactive_vxgym","legendIcon":"chart__legendIcon_vxgym","legendValue":"chart__legendValue_vxgym"};
+const styles = {"legendContent":"chart__legendContent_v620y","legendWrap":"chart__legendWrap_v620y","legendItem":"chart__legendItem_v620y","legendUnactive":"chart__legendUnactive_v620y","legendIcon":"chart__legendIcon_v620y","legendValue":"chart__legendValue_v620y"};
 require('./index.css')
 
 const icons = {