@semcore/d3-chart 3.49.0 → 3.50.0

package/lib/es6/component/Chart/CompactHorizontalBarChart.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompactHorizontalBarChart.js","names":["React","createComponent","scaleBand","scaleLinear","CompactHorizontalBar","AbstractChart","CompactHorizontalBarChartComponent","_AbstractChart","_inherits","_super","_createSuper","_classCallCheck","apply","arguments","_createClass","key","get","_this$asProps$xScale","asProps","xScale","valueScale","_this$asProps$yScale","yScale","categoryScale","value","defaultLegendProps","renderChart","_this$asProps","x","y","onClickHoverRect","onClickBar","createElement","renderCompactHorizontalBarTooltip","Hover","onClick","Annotation","Label","Percent","Value","Bar","Background","Fill","_this$asProps2","data","showTooltip","Tooltip","wMin","_ref","index","children","Fragment","Title","Dot","renderTooltip","_this$asProps3","_this$asProps3$margin","marginY","plotHeight","range","domain","_toConsumableArray","reverse","map","d","paddingInner","paddingOuter","_this$asProps4","_this$asProps4$margin","plotWidth","sum","_get","_getPrototypeOf","prototype","values","reduce","acc","_defineProperty","direction","showXAxis","showYAxis","showLegend","CompactHorizontalBarChart"],"sources":["../../../../src/component/Chart/CompactHorizontalBarChart.tsx"],"sourcesContent":["import React from 'react';\nimport createComponent from '@semcore/core';\nimport { BaseChartProps, BaseLegendProps } from './AbstractChart.type';\nimport {\n  CompactHorizontalBarChartData,\n  CompactHorizontalBarChartProps,\n  CompactHorizontalBarChartType,\n} from './CompactHorizontalBarChart.type';\nimport { scaleBand, scaleLinear } from 'd3-scale';\n// @ts-ignore\nimport { CompactHorizontalBar } from '../..';\nimport { AbstractChart } from './AbstractChart';\n\nclass CompactHorizontalBarChartComponent extends AbstractChart<\n  CompactHorizontalBarChartData,\n  CompactHorizontalBarChartProps\n> {\n  static displayName = 'Chart.CompactHorizontalBar';\n  public static defaultProps: Partial<BaseChartProps<any>> = {\n    direction: 'column',\n    showXAxis: false,\n    showYAxis: false,\n    showTooltip: true,\n    showLegend: false,\n  };\n\n  get xScale() {\n    return this.asProps.xScale ?? this.valueScale;\n  }\n\n  get yScale() {\n    return this.asProps.yScale ?? this.categoryScale;\n  }\n\n  protected defaultLegendProps(): Partial<BaseLegendProps> {\n    return {};\n  }\n\n  renderChart() {\n    const { x, y, onClickHoverRect, onClickBar } = this.asProps;\n\n    return (\n      <CompactHorizontalBar x={x} y={y}>\n        {this.renderCompactHorizontalBarTooltip()}\n        <CompactHorizontalBar.Hover onClick={onClickHoverRect} />\n        <CompactHorizontalBar.Annotation>\n          <CompactHorizontalBar.Label />\n          <CompactHorizontalBar.Percent />\n          <CompactHorizontalBar.Value />\n        </CompactHorizontalBar.Annotation>\n        <CompactHorizontalBar.Bar onClick={onClickBar}>\n          <CompactHorizontalBar.Bar.Background />\n          <CompactHorizontalBar.Bar.Fill />\n        </CompactHorizontalBar.Bar>\n      </CompactHorizontalBar>\n    );\n  }\n\n  protected renderCompactHorizontalBarTooltip(): React.ReactNode {\n    const { data, x, y, showTooltip } = this.asProps;\n\n    if (!showTooltip) {\n      return null;\n    }\n\n    return (\n      <CompactHorizontalBar.Tooltip wMin={100}>\n        {({ index }: any) => {\n          return {\n            children: (\n              <>\n                <CompactHorizontalBar.Tooltip.Title>\n                  {data[index][y]}\n                </CompactHorizontalBar.Tooltip.Title>\n\n                <CompactHorizontalBar.Tooltip.Dot>\n                  {data[index][x]}\n                </CompactHorizontalBar.Tooltip.Dot>\n              </>\n            ),\n          };\n        }}\n      </CompactHorizontalBar.Tooltip>\n    );\n  }\n\n  renderTooltip(): React.ReactNode {\n    return null;\n  }\n\n  private get categoryScale() {\n    const { marginY = 40, plotHeight, data, y } = this.asProps;\n\n    return scaleBand()\n      .range([plotHeight - marginY, marginY])\n      .domain([...data].reverse().map((d) => d[y]) as any)\n      .paddingInner(0.6)\n      .paddingOuter(0.2);\n  }\n\n  private get valueScale() {\n    const { marginY = 0, plotWidth } = this.asProps;\n\n    const sum = [...super.flatValues.values()].reduce((acc, d) => acc + d, 0);\n\n    return scaleLinear().range([marginY, plotWidth]).domain([marginY, sum]);\n  }\n}\n\nexport const CompactHorizontalBarChart: CompactHorizontalBarChartType = createComponent(\n  CompactHorizontalBarChartComponent,\n);\n"],"mappings":"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"}

package/lib/es6/component/Chart/CompactHorizontalBarChart.type.js

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

package/lib/es6/component/Chart/CompactHorizontalBarChart.type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompactHorizontalBarChart.type.js","names":[],"sources":["../../../../src/component/Chart/CompactHorizontalBarChart.type.ts"],"sourcesContent":["import React from 'react';\nimport { Intergalactic } from '@semcore/core';\nimport { Flex } from '@semcore/flex-box';\nimport { ScaleBand, ScaleLinear, ScaleTime } from 'd3-scale';\nimport { BaseChartProps } from './AbstractChart.type';\n\ntype BarKey = string;\n\nexport type CompactHorizontalBarChartData = Array<Record<BarKey, number | string>>;\n\nexport type CompactHorizontalBarChartProps = BaseChartProps<CompactHorizontalBarChartData> & {\n  x: string;\n  y: string;\n  xScale?: ScaleBand<any> | ScaleTime<any, any>;\n  yScale?: ScaleLinear<any, any>;\n\n  /** Handle click by `HoverRect`. `index` is an index of the data array. */\n  onClickHoverRect?: (index: number, e: React.SyntheticEvent) => void;\n\n  /** Handle click by Bar. */\n  onClickBar?: (barItem: number, e: React.SyntheticEvent) => void;\n};\n\nexport type CompactHorizontalBarChartType = Intergalactic.Component<\n  typeof Flex,\n  CompactHorizontalBarChartProps\n>;\n"],"mappings":""}

package/lib/es6/component/Chart/index.js

@@ -1,5 +1,6 @@
 import { LineChart } from './LineChart';
 import { BarChart } from './BarChart';
+import { CompactHorizontalBarChart } from './CompactHorizontalBarChart';
 import { HistogramChart } from './HistogramChart';
 import { ScatterPlotChart } from './ScatterPlotChart';
 import { AreaChart } from './AreaChart';
@@ -18,6 +19,7 @@ export default {
   Donut: DonutChart,
   Venn: VennChart,
   Radar: RadarChart,
-  Cigarette: CigaretteChart
+  Cigarette: CigaretteChart,
+  CompactHorizontalBar: CompactHorizontalBarChart
 };
 //# sourceMappingURL=index.js.map

package/lib/es6/component/Chart/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["LineChart","BarChart","HistogramChart","ScatterPlotChart","AreaChart","BubbleChart","DonutChart","VennChart","RadarChart","CigaretteChart","Line","Bar","Histogram","ScatterPlot","Area","Bubble","Donut","Venn","Radar","Cigarette"],"sources":["../../../../src/component/Chart/index.ts"],"sourcesContent":["import { LineChart } from './LineChart';\nimport { BarChart } from './BarChart';\nimport { HistogramChart } from './HistogramChart';\nimport { ScatterPlotChart } from './ScatterPlotChart';\nimport { AreaChart } from './AreaChart';\nimport { BubbleChart } from './BubbleChart';\nimport { DonutChart } from './DonutChart';\nimport { VennChart } from './VennChart';\nimport { RadarChart } from './RadarChart';\nimport { CigaretteChart } from './CigaretteChart';\n\nexport default {\n  Line: LineChart,\n  Bar: BarChart,\n  Histogram: HistogramChart,\n  ScatterPlot: ScatterPlotChart,\n  Area: AreaChart,\n  Bubble: BubbleChart,\n  Donut: DonutChart,\n  Venn: VennChart,\n  Radar: RadarChart,\n  Cigarette: CigaretteChart,\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,aAAa;AACvC,SAASC,QAAQ,QAAQ,YAAY;AACrC,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,eAAe;EACbC,IAAI,EAAEV,SAAS;EACfW,GAAG,EAAEV,QAAQ;EACbW,SAAS,EAAEV,cAAc;EACzBW,WAAW,EAAEV,gBAAgB;EAC7BW,IAAI,EAAEV,SAAS;EACfW,MAAM,EAAEV,WAAW;EACnBW,KAAK,EAAEV,UAAU;EACjBW,IAAI,EAAEV,SAAS;EACfW,KAAK,EAAEV,UAAU;EACjBW,SAAS,EAAEV;AACb,CAAC"}
+{"version":3,"file":"index.js","names":["LineChart","BarChart","CompactHorizontalBarChart","HistogramChart","ScatterPlotChart","AreaChart","BubbleChart","DonutChart","VennChart","RadarChart","CigaretteChart","Line","Bar","Histogram","ScatterPlot","Area","Bubble","Donut","Venn","Radar","Cigarette","CompactHorizontalBar"],"sources":["../../../../src/component/Chart/index.ts"],"sourcesContent":["import { LineChart } from './LineChart';\nimport { BarChart } from './BarChart';\nimport { CompactHorizontalBarChart } from './CompactHorizontalBarChart';\nimport { HistogramChart } from './HistogramChart';\nimport { ScatterPlotChart } from './ScatterPlotChart';\nimport { AreaChart } from './AreaChart';\nimport { BubbleChart } from './BubbleChart';\nimport { DonutChart } from './DonutChart';\nimport { VennChart } from './VennChart';\nimport { RadarChart } from './RadarChart';\nimport { CigaretteChart } from './CigaretteChart';\n\nexport default {\n  Line: LineChart,\n  Bar: BarChart,\n  Histogram: HistogramChart,\n  ScatterPlot: ScatterPlotChart,\n  Area: AreaChart,\n  Bubble: BubbleChart,\n  Donut: DonutChart,\n  Venn: VennChart,\n  Radar: RadarChart,\n  Cigarette: CigaretteChart,\n  CompactHorizontalBar: CompactHorizontalBarChart,\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,aAAa;AACvC,SAASC,QAAQ,QAAQ,YAAY;AACrC,SAASC,yBAAyB,QAAQ,6BAA6B;AACvE,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,gBAAgB,QAAQ,oBAAoB;AACrD,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,WAAW,QAAQ,eAAe;AAC3C,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,SAAS,QAAQ,aAAa;AACvC,SAASC,UAAU,QAAQ,cAAc;AACzC,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,eAAe;EACbC,IAAI,EAAEX,SAAS;EACfY,GAAG,EAAEX,QAAQ;EACbY,SAAS,EAAEV,cAAc;EACzBW,WAAW,EAAEV,gBAAgB;EAC7BW,IAAI,EAAEV,SAAS;EACfW,MAAM,EAAEV,WAAW;EACnBW,KAAK,EAAEV,UAAU;EACjBW,IAAI,EAAEV,SAAS;EACfW,KAAK,EAAEV,UAAU;EACjBW,SAAS,EAAEV,cAAc;EACzBW,oBAAoB,EAAEnB;AACxB,CAAC"}

package/lib/es6/component/ChartLegend/LegendFlex/LegendFlex.js

@@ -10,10 +10,10 @@ import React from 'react';
 import createComponent, { sstyled, Root } from '@semcore/core';
 import { Flex } from '@semcore/flex-box';
 /*__reshadow-styles__:"./legend-flex.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendFlex_gm5et_gg_._direction_row_gm5et_gg_{align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:8px 16px}.___SLegendFlex_gm5et_gg_._direction_column_gm5et_gg_{align-items:flex-start;flex-wrap:wrap;gap:8px}" /*__inner_css_end__*/, "gm5et_gg_") /*__reshadow_css_end__*/, {
-  "__SLegendFlex": "___SLegendFlex_gm5et_gg_",
-  "_direction_row": "_direction_row_gm5et_gg_",
-  "_direction_column": "_direction_column_gm5et_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendFlex_rhv29_gg_._direction_row_rhv29_gg_{align-items:flex-start;align-content:flex-start;flex-wrap:wrap;gap:8px 16px}.___SLegendFlex_rhv29_gg_._direction_column_rhv29_gg_{align-items:flex-start;flex-wrap:wrap;gap:8px}" /*__inner_css_end__*/, "rhv29_gg_") /*__reshadow_css_end__*/, {
+  "__SLegendFlex": "___SLegendFlex_rhv29_gg_",
+  "_direction_row": "_direction_row_rhv29_gg_",
+  "_direction_column": "_direction_column_rhv29_gg_"
 });
 import { LegendItemComponent } from '../LegendItem/LegendItem';
 import Divider from '@semcore/divider';

package/lib/es6/component/ChartLegend/LegendItem/LegendItem.js

@@ -19,23 +19,23 @@ import { Flex, Box } from '@semcore/flex-box';
 import Checkbox from '@semcore/checkbox';
 import { Text as TypographyText } from '@semcore/typography';
 /*__reshadow-styles__:"./legend-item.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendItem_10rib_gg_{min-width:0;align-items:flex-start}@media (hover:hover){.___SLegendItem_10rib_gg_:hover{cursor:pointer}.___SLegendItem_10rib_gg_.__disabled_10rib_gg_:hover{cursor:default}}.___SPointShape_10rib_gg_.__color_10rib_gg_{background-color:var(--color_10rib);margin-right:8px;flex-shrink:0}.___SPointShape_10rib_gg_._shape_Circle_10rib_gg_._size_l_10rib_gg_{width:16px;height:16px;border-radius:8px;margin-top:4px}.___SPointShape_10rib_gg_._shape_Circle_10rib_gg_._size_m_10rib_gg_{width:12px;height:12px;border-radius:6px;margin-top:4px}.___SPointShape_10rib_gg_._shape_Line_10rib_gg_._size_l_10rib_gg_{width:16px;height:4px;border-radius:3px;margin-top:9px}.___SPointShape_10rib_gg_._shape_Line_10rib_gg_._size_m_10rib_gg_{width:12px;height:4px;border-radius:3px;margin-top:8px}.___SPointShape_10rib_gg_._shape_Square_10rib_gg_._size_l_10rib_gg_{width:16px;height:16px;border-radius:2px;margin-top:4px}.___SPointShape_10rib_gg_._shape_Square_10rib_gg_._size_m_10rib_gg_{width:12px;height:12px;border-radius:2px;margin-top:4px}.___SPointShape_10rib_gg_._shape_Pattern_10rib_gg_{background-color:transparent;margin-right:4px}.___SIcon_10rib_gg_{line-height:0;margin-right:4px}.___SIcon_10rib_gg_._size_l_10rib_gg_{margin-top:4px}.___SIcon_10rib_gg_._size_m_10rib_gg_{margin-top:2px}.___SLabel_10rib_gg_{min-width:0}.___SAdditionalLabel_10rib_gg_._size_l_10rib_gg_,.___SCount_10rib_gg_._size_l_10rib_gg_,.___SLabel_10rib_gg_._size_l_10rib_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SAdditionalLabel_10rib_gg_._size_m_10rib_gg_,.___SCount_10rib_gg_._size_m_10rib_gg_,.___SLabel_10rib_gg_._size_m_10rib_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SAdditionalLabel_10rib_gg_,.___SCount_10rib_gg_{margin-left:4px}.___SAdditionalLabel_10rib_gg_{white-space:nowrap;display:flex;align-items:flex-start}.___SAdditionalLabel_10rib_gg_::before{content:\"\";display:inline-block;background-color:var(--intergalactic-text-secondary, #6c6e79);height:4px;width:4px;border-radius:2px;margin-right:4px}.___SAdditionalLabel_10rib_gg_._size_l_10rib_gg_::before{margin-top:10px}.___SAdditionalLabel_10rib_gg_._size_m_10rib_gg_::before{margin-top:8px}.___SPatternSymbol_10rib_gg_{transform:scale(.8)}" /*__inner_css_end__*/, "10rib_gg_") /*__reshadow_css_end__*/, {
-  "__SLegendItem": "___SLegendItem_10rib_gg_",
-  "_disabled": "__disabled_10rib_gg_",
-  "__SPointShape": "___SPointShape_10rib_gg_",
-  "_color": "__color_10rib_gg_",
-  "--color": "--color_10rib",
-  "_shape_Circle": "_shape_Circle_10rib_gg_",
-  "_size_l": "_size_l_10rib_gg_",
-  "_size_m": "_size_m_10rib_gg_",
-  "_shape_Line": "_shape_Line_10rib_gg_",
-  "_shape_Square": "_shape_Square_10rib_gg_",
-  "_shape_Pattern": "_shape_Pattern_10rib_gg_",
-  "__SIcon": "___SIcon_10rib_gg_",
-  "__SLabel": "___SLabel_10rib_gg_",
-  "__SAdditionalLabel": "___SAdditionalLabel_10rib_gg_",
-  "__SCount": "___SCount_10rib_gg_",
-  "__SPatternSymbol": "___SPatternSymbol_10rib_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendItem_vhnlj_gg_{min-width:0;align-items:flex-start}@media (hover:hover){.___SLegendItem_vhnlj_gg_:hover{cursor:pointer}.___SLegendItem_vhnlj_gg_.__disabled_vhnlj_gg_:hover{cursor:default}}.___SPointShape_vhnlj_gg_.__color_vhnlj_gg_{background-color:var(--color_vhnlj);margin-right:8px;flex-shrink:0}.___SPointShape_vhnlj_gg_._shape_Circle_vhnlj_gg_._size_l_vhnlj_gg_{width:16px;height:16px;border-radius:8px;margin-top:4px}.___SPointShape_vhnlj_gg_._shape_Circle_vhnlj_gg_._size_m_vhnlj_gg_{width:12px;height:12px;border-radius:6px;margin-top:4px}.___SPointShape_vhnlj_gg_._shape_Line_vhnlj_gg_._size_l_vhnlj_gg_{width:16px;height:4px;border-radius:3px;margin-top:9px}.___SPointShape_vhnlj_gg_._shape_Line_vhnlj_gg_._size_m_vhnlj_gg_{width:12px;height:4px;border-radius:3px;margin-top:8px}.___SPointShape_vhnlj_gg_._shape_Square_vhnlj_gg_._size_l_vhnlj_gg_{width:16px;height:16px;border-radius:2px;margin-top:4px}.___SPointShape_vhnlj_gg_._shape_Square_vhnlj_gg_._size_m_vhnlj_gg_{width:12px;height:12px;border-radius:2px;margin-top:4px}.___SPointShape_vhnlj_gg_._shape_Pattern_vhnlj_gg_{background-color:transparent;margin-right:4px}.___SIcon_vhnlj_gg_{line-height:0;margin-right:4px}.___SIcon_vhnlj_gg_._size_l_vhnlj_gg_{margin-top:4px}.___SIcon_vhnlj_gg_._size_m_vhnlj_gg_{margin-top:2px}.___SLabel_vhnlj_gg_{min-width:0}.___SAdditionalLabel_vhnlj_gg_._size_l_vhnlj_gg_,.___SCount_vhnlj_gg_._size_l_vhnlj_gg_,.___SLabel_vhnlj_gg_._size_l_vhnlj_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___SAdditionalLabel_vhnlj_gg_._size_m_vhnlj_gg_,.___SCount_vhnlj_gg_._size_m_vhnlj_gg_,.___SLabel_vhnlj_gg_._size_m_vhnlj_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SAdditionalLabel_vhnlj_gg_,.___SCount_vhnlj_gg_{margin-left:4px}.___SAdditionalLabel_vhnlj_gg_{white-space:nowrap;display:flex;align-items:flex-start}.___SAdditionalLabel_vhnlj_gg_::before{content:\"\";display:inline-block;background-color:var(--intergalactic-text-secondary, #6c6e79);height:4px;width:4px;border-radius:2px;margin-right:4px}.___SAdditionalLabel_vhnlj_gg_._size_l_vhnlj_gg_::before{margin-top:10px}.___SAdditionalLabel_vhnlj_gg_._size_m_vhnlj_gg_::before{margin-top:8px}.___SPatternSymbol_vhnlj_gg_{transform:scale(.8)}" /*__inner_css_end__*/, "vhnlj_gg_") /*__reshadow_css_end__*/, {
+  "__SLegendItem": "___SLegendItem_vhnlj_gg_",
+  "_disabled": "__disabled_vhnlj_gg_",
+  "__SPointShape": "___SPointShape_vhnlj_gg_",
+  "_color": "__color_vhnlj_gg_",
+  "--color": "--color_vhnlj",
+  "_shape_Circle": "_shape_Circle_vhnlj_gg_",
+  "_size_l": "_size_l_vhnlj_gg_",
+  "_size_m": "_size_m_vhnlj_gg_",
+  "_shape_Line": "_shape_Line_vhnlj_gg_",
+  "_shape_Square": "_shape_Square_vhnlj_gg_",
+  "_shape_Pattern": "_shape_Pattern_vhnlj_gg_",
+  "__SIcon": "___SIcon_vhnlj_gg_",
+  "__SLabel": "___SLabel_vhnlj_gg_",
+  "__SAdditionalLabel": "___SAdditionalLabel_vhnlj_gg_",
+  "__SCount": "___SCount_vhnlj_gg_",
+  "__SPatternSymbol": "___SPatternSymbol_vhnlj_gg_"
 });
 import { StaticShapes } from './LegendItem.type';
 import resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';

package/lib/es6/component/ChartLegend/LegendTable/LegendTable.js

@@ -11,12 +11,12 @@ import React from 'react';
 import createComponent, { sstyled, Root } from '@semcore/core';
 import { Box } from '@semcore/flex-box';
 /*__reshadow-styles__:"./legend-table.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendTable_1354m_gg_.__columns-count_1354m_gg_{font-feature-settings:\"tnum\";font-variant-numeric:tabular-nums;display:grid;grid-template-columns:auto .2fr;align-items:center;height:-moz-fit-content;height:fit-content;grid-column-gap:16px;grid-row-gap:8px}.___SColumnItem_1354m_gg_._size_l_1354m_gg_{font-size:var(--intergalactic-fs-300, 16px);text-align:right}.___SColumnItem_1354m_gg_._size_m_1354m_gg_{font-size:var(--intergalactic-fs-200, 14px);text-align:right}" /*__inner_css_end__*/, "1354m_gg_") /*__reshadow_css_end__*/, {
-  "__SLegendTable": "___SLegendTable_1354m_gg_",
-  "_columns-count": "__columns-count_1354m_gg_",
-  "__SColumnItem": "___SColumnItem_1354m_gg_",
-  "_size_l": "_size_l_1354m_gg_",
-  "_size_m": "_size_m_1354m_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SLegendTable_1ni0a_gg_.__columns-count_1ni0a_gg_{font-feature-settings:\"tnum\";font-variant-numeric:tabular-nums;display:grid;grid-template-columns:auto .2fr;align-items:center;height:-moz-fit-content;height:fit-content;grid-column-gap:16px;grid-row-gap:8px}.___SColumnItem_1ni0a_gg_._size_l_1ni0a_gg_{font-size:var(--intergalactic-fs-300, 16px);text-align:right}.___SColumnItem_1ni0a_gg_._size_m_1ni0a_gg_{font-size:var(--intergalactic-fs-200, 14px);text-align:right}" /*__inner_css_end__*/, "1ni0a_gg_") /*__reshadow_css_end__*/, {
+  "__SLegendTable": "___SLegendTable_1ni0a_gg_",
+  "_columns-count": "__columns-count_1ni0a_gg_",
+  "__SColumnItem": "___SColumnItem_1ni0a_gg_",
+  "_size_l": "_size_l_1ni0a_gg_",
+  "_size_m": "_size_m_1ni0a_gg_"
 });
 import { LegendItemComponent } from '../LegendItem/LegendItem';
 import { BaseLegend } from '../BaseLegend';

package/lib/es6/index.js

@@ -4,6 +4,7 @@ export { default as Chart } from './component/Chart';
 export { XAxis, YAxis } from './Axis';
 export { default as Line } from './Line';
 export { default as Bar } from './Bar';
+export { default as CompactHorizontalBar } from './CompactHorizontalBar';
 export { default as HorizontalBar } from './HorizontalBar';
 export { default as GroupBar } from './GroupBar';
 export { default as StackBar } from './StackBar';

package/lib/es6/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["default","Plot","ChartLegend","ChartLegendTable","Chart","XAxis","YAxis","Line","Bar","HorizontalBar","GroupBar","StackBar","Area","StackedArea","ScatterPlot","Bubble","RadialTree","Donut","Venn","Radar","getLabelOffsetPosition","Tooltip","ResponsiveContainer","ReferenceLine","ReferenceBackground","ReferenceStripes","HoverLine","HoverRect","minMax","interpolateValue","getBubbleChartValueScale","getScatterPlotRadius","calculateBubbleDomain","PlotEventEmitter","colors","makeDataHintsContainer","PatternFill","PatternSymbol","getPatternSymbolSize"],"sources":["../../src/index.js"],"sourcesContent":["export { default as Plot } from './Plot';\nexport { ChartLegend, ChartLegendTable } from './component/ChartLegend';\nexport { default as Chart } from './component/Chart';\nexport { XAxis, YAxis } from './Axis';\n\nexport { default as Line } from './Line';\n\nexport { default as Bar } from './Bar';\nexport { default as HorizontalBar } from './HorizontalBar';\nexport { default as GroupBar } from './GroupBar';\nexport { default as StackBar } from './StackBar';\nexport { default as Area } from './Area';\nexport { default as StackedArea } from './StackedArea';\nexport { default as ScatterPlot } from './ScatterPlot';\nexport { default as Bubble } from './Bubble';\nexport { default as RadialTree } from './RadialTree';\nexport { default as Donut } from './Donut';\nexport { default as Venn } from './Venn';\nexport { default as Radar, getLabelOffsetPosition } from './Radar';\n\nexport { default as Tooltip } from './Tooltip';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\nexport { ReferenceLine, ReferenceBackground, ReferenceStripes } from './Reference';\n\nexport { HoverLine, HoverRect } from './Hover';\n\nexport {\n  minMax,\n  interpolateValue,\n  getBubbleChartValueScale,\n  getScatterPlotRadius,\n  calculateBubbleDomain,\n  PlotEventEmitter,\n} from './utils';\nexport { colors } from './color';\n\nexport { makeDataHintsContainer } from './a11y/hints';\n\nexport { PatternFill, PatternSymbol, getPatternSymbolSize } from './Pattern';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,IAAI,QAAQ,QAAQ;AACxC,SAASC,WAAW,EAAEC,gBAAgB,QAAQ,yBAAyB;AACvE,SAASH,OAAO,IAAII,KAAK,QAAQ,mBAAmB;AACpD,SAASC,KAAK,EAAEC,KAAK,QAAQ,QAAQ;AAErC,SAASN,OAAO,IAAIO,IAAI,QAAQ,QAAQ;AAExC,SAASP,OAAO,IAAIQ,GAAG,QAAQ,OAAO;AACtC,SAASR,OAAO,IAAIS,aAAa,QAAQ,iBAAiB;AAC1D,SAAST,OAAO,IAAIU,QAAQ,QAAQ,YAAY;AAChD,SAASV,OAAO,IAAIW,QAAQ,QAAQ,YAAY;AAChD,SAASX,OAAO,IAAIY,IAAI,QAAQ,QAAQ;AACxC,SAASZ,OAAO,IAAIa,WAAW,QAAQ,eAAe;AACtD,SAASb,OAAO,IAAIc,WAAW,QAAQ,eAAe;AACtD,SAASd,OAAO,IAAIe,MAAM,QAAQ,UAAU;AAC5C,SAASf,OAAO,IAAIgB,UAAU,QAAQ,cAAc;AACpD,SAAShB,OAAO,IAAIiB,KAAK,QAAQ,SAAS;AAC1C,SAASjB,OAAO,IAAIkB,IAAI,QAAQ,QAAQ;AACxC,SAASlB,OAAO,IAAImB,KAAK,EAAEC,sBAAsB,QAAQ,SAAS;AAElE,SAASpB,OAAO,IAAIqB,OAAO,QAAQ,WAAW;AAE9C,SAASrB,OAAO,IAAIsB,mBAAmB,QAAQ,uBAAuB;AACtE,SAASC,aAAa,EAAEC,mBAAmB,EAAEC,gBAAgB,QAAQ,aAAa;AAElF,SAASC,SAAS,EAAEC,SAAS,QAAQ,SAAS;AAE9C,SACEC,MAAM,EACNC,gBAAgB,EAChBC,wBAAwB,EACxBC,oBAAoB,EACpBC,qBAAqB,EACrBC,gBAAgB,QACX,SAAS;AAChB,SAASC,MAAM,QAAQ,SAAS;AAEhC,SAASC,sBAAsB,QAAQ,cAAc;AAErD,SAASC,WAAW,EAAEC,aAAa,EAAEC,oBAAoB,QAAQ,WAAW"}
+{"version":3,"file":"index.js","names":["default","Plot","ChartLegend","ChartLegendTable","Chart","XAxis","YAxis","Line","Bar","CompactHorizontalBar","HorizontalBar","GroupBar","StackBar","Area","StackedArea","ScatterPlot","Bubble","RadialTree","Donut","Venn","Radar","getLabelOffsetPosition","Tooltip","ResponsiveContainer","ReferenceLine","ReferenceBackground","ReferenceStripes","HoverLine","HoverRect","minMax","interpolateValue","getBubbleChartValueScale","getScatterPlotRadius","calculateBubbleDomain","PlotEventEmitter","colors","makeDataHintsContainer","PatternFill","PatternSymbol","getPatternSymbolSize"],"sources":["../../src/index.js"],"sourcesContent":["export { default as Plot } from './Plot';\nexport { ChartLegend, ChartLegendTable } from './component/ChartLegend';\nexport { default as Chart } from './component/Chart';\nexport { XAxis, YAxis } from './Axis';\n\nexport { default as Line } from './Line';\n\nexport { default as Bar } from './Bar';\nexport { default as CompactHorizontalBar } from './CompactHorizontalBar';\nexport { default as HorizontalBar } from './HorizontalBar';\nexport { default as GroupBar } from './GroupBar';\nexport { default as StackBar } from './StackBar';\nexport { default as Area } from './Area';\nexport { default as StackedArea } from './StackedArea';\nexport { default as ScatterPlot } from './ScatterPlot';\nexport { default as Bubble } from './Bubble';\nexport { default as RadialTree } from './RadialTree';\nexport { default as Donut } from './Donut';\nexport { default as Venn } from './Venn';\nexport { default as Radar, getLabelOffsetPosition } from './Radar';\n\nexport { default as Tooltip } from './Tooltip';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\nexport { ReferenceLine, ReferenceBackground, ReferenceStripes } from './Reference';\n\nexport { HoverLine, HoverRect } from './Hover';\n\nexport {\n  minMax,\n  interpolateValue,\n  getBubbleChartValueScale,\n  getScatterPlotRadius,\n  calculateBubbleDomain,\n  PlotEventEmitter,\n} from './utils';\nexport { colors } from './color';\n\nexport { makeDataHintsContainer } from './a11y/hints';\n\nexport { PatternFill, PatternSymbol, getPatternSymbolSize } from './Pattern';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,IAAI,QAAQ,QAAQ;AACxC,SAASC,WAAW,EAAEC,gBAAgB,QAAQ,yBAAyB;AACvE,SAASH,OAAO,IAAII,KAAK,QAAQ,mBAAmB;AACpD,SAASC,KAAK,EAAEC,KAAK,QAAQ,QAAQ;AAErC,SAASN,OAAO,IAAIO,IAAI,QAAQ,QAAQ;AAExC,SAASP,OAAO,IAAIQ,GAAG,QAAQ,OAAO;AACtC,SAASR,OAAO,IAAIS,oBAAoB,QAAQ,wBAAwB;AACxE,SAAST,OAAO,IAAIU,aAAa,QAAQ,iBAAiB;AAC1D,SAASV,OAAO,IAAIW,QAAQ,QAAQ,YAAY;AAChD,SAASX,OAAO,IAAIY,QAAQ,QAAQ,YAAY;AAChD,SAASZ,OAAO,IAAIa,IAAI,QAAQ,QAAQ;AACxC,SAASb,OAAO,IAAIc,WAAW,QAAQ,eAAe;AACtD,SAASd,OAAO,IAAIe,WAAW,QAAQ,eAAe;AACtD,SAASf,OAAO,IAAIgB,MAAM,QAAQ,UAAU;AAC5C,SAAShB,OAAO,IAAIiB,UAAU,QAAQ,cAAc;AACpD,SAASjB,OAAO,IAAIkB,KAAK,QAAQ,SAAS;AAC1C,SAASlB,OAAO,IAAImB,IAAI,QAAQ,QAAQ;AACxC,SAASnB,OAAO,IAAIoB,KAAK,EAAEC,sBAAsB,QAAQ,SAAS;AAElE,SAASrB,OAAO,IAAIsB,OAAO,QAAQ,WAAW;AAE9C,SAAStB,OAAO,IAAIuB,mBAAmB,QAAQ,uBAAuB;AACtE,SAASC,aAAa,EAAEC,mBAAmB,EAAEC,gBAAgB,QAAQ,aAAa;AAElF,SAASC,SAAS,EAAEC,SAAS,QAAQ,SAAS;AAE9C,SACEC,MAAM,EACNC,gBAAgB,EAChBC,wBAAwB,EACxBC,oBAAoB,EACpBC,qBAAqB,EACrBC,gBAAgB,QACX,SAAS;AAChB,SAASC,MAAM,QAAQ,SAAS;AAEhC,SAASC,sBAAsB,QAAQ,cAAc;AAErD,SAASC,WAAW,EAAEC,aAAa,EAAEC,oBAAoB,QAAQ,WAAW"}

package/lib/es6/style/bar.shadow.css

@@ -25,6 +25,42 @@ SBar[transparent] {
   opacity: 0.3;
 }
 
+SBar[onClick] {
+  cursor: pointer;
+}
+
 SBackground {
   fill: var(--intergalactic-chart-grid-bar-chart-base-bg, #e0e1e9);
+}
+SBackground[onClick] {
+  cursor: pointer;
+}
+
+SBarAnnotation {
+  display: flex;
+  justify-content: space-between;
+}
+SBarLabel {
+  color: var(--intergalactic-text-primary, #191b23);
+  margin-right: auto;
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+}
+SBarPercent {
+  color: var(--intergalactic-text-secondary, #6c6e79);
+  margin-right: var(--intergalactic-spacing-2x, 8px);
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+}
+SBarValue {
+  min-width: 52px;
+  display: flex;
+  justify-content: flex-end;
+  color: var(--intergalactic-text-primary, #191b23);
+  font-size: var(--intergalactic-fs-200, 14px);
+  line-height: var(--intergalactic-lh-200, 142%);
+  text-align: right;
+}
+SCompactHorizontalBarHoverRect {
+  fill: var(--intergalactic-chart-grid-bar-chart-hover, rgba(196, 199, 207, 0.3));
 }

package/lib/es6/types/CompactHorizontalBar.d.js

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

package/lib/es6/types/CompactHorizontalBar.d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompactHorizontalBar.d.js","names":[],"sources":["../../../src/types/CompactHorizontalBar.d.ts"],"sourcesContent":["import React from 'react';\nimport { UnknownProperties } from '@semcore/core';\nimport { Context } from './context';\nimport { BarContext, BackgroundProps } from './Bar';\nimport { IntergalacticD3Component } from './Plot';\nimport { PatternsConfig } from './Pattern';\nimport { BoxProps } from '@semcore/flex-box';\nimport { TooltipType } from './Tooltip';\n\nexport type CompactHorizontalBarProps = Context & {\n  /** Field name from `data` array item for the XAxis */\n  x?: string;\n  /** Field name from `data` array item for the YAxis */\n  y?: string;\n  /** Line color */\n  color?: string;\n  /**\n   * Bars rounded corners\n   * @default 2\n   */\n  radius?: number;\n  /** Animation duration in ms\n   * @default 500\n   */\n  duration?: number;\n  /** Enables element transparency */\n  transparent?: boolean;\n  /** Enables charts patterns that enhances charts accessibility */\n  patterns?: PatternsConfig;\n};\n\nexport type CompactHorizontalBarHoverProps = BoxProps;\ntype Hover = IntergalacticD3Component<'rect', CompactHorizontalBarHoverProps, Context>;\nexport type CompactHorizontalBarAnnotationProps = BoxProps;\ntype Annotation = IntergalacticD3Component<\n  'foreignObject',\n  CompactHorizontalBarAnnotationProps,\n  Context\n>;\nexport type CompactHorizontalBarLabelProps = BoxProps;\ntype Label = IntergalacticD3Component<'div', CompactHorizontalBarLabelProps, Context>;\nexport type CompactHorizontalBarPercentProps = BoxProps;\nexport type CompactHorizontalBarPercentContext = { formatted: string; percent: number };\ntype Percent = IntergalacticD3Component<\n  'div',\n  CompactHorizontalBarPercentProps,\n  Context & CompactHorizontalBarPercentContext\n>;\nexport type CompactHorizontalBarValueProps = BoxProps;\nexport type CompactHorizontalBarValueContext = { formatted: string; value: number };\ntype Value = IntergalacticD3Component<\n  'div',\n  CompactHorizontalBarValueProps,\n  Context & CompactHorizontalBarValueContext\n>;\nexport type CompactHorizontalBarBarProps = {};\ntype Bar = IntergalacticD3Component<'g', CompactHorizontalBarBarProps, Context>;\nexport type CompactHorizontalBarBackgroundProps = BoxProps;\ntype Background = IntergalacticD3Component<'rect', BackgroundProps, Context>;\nexport type CompactHorizontalBarFillProps = BoxProps & {\n  patterns?: PatternsConfig;\n  color?: string;\n  transparent?: boolean;\n  hide?: boolean;\n};\ntype Fill = IntergalacticD3Component<'rect', CompactHorizontalBarFillProps, Context>;\n\ndeclare const CompactHorizontalBar: IntergalacticD3Component<\n  'g',\n  CompactHorizontalBarProps,\n  BarContext\n> & {\n  Hover: Hover;\n  Annotation: Annotation;\n  Label: Label;\n  Percent: Percent;\n  Value: Value;\n  Bar: Bar & {\n    Background: Background;\n    Fill: Fill;\n  };\n  Tooltip: TooltipType<{\n    /** Index in `data` array of the current items */\n    index: number;\n  }>;\n};\n\nexport default CompactHorizontalBar;\n"],"mappings":""}

package/lib/es6/types/index.d.js

@@ -22,6 +22,8 @@ export { default as Bar } from './Bar';
 export * from './Bar';
 export { default as HorizontalBar } from './HorizontalBar';
 export * from './HorizontalBar';
+export { default as CompactHorizontalBar } from './CompactHorizontalBar';
+export * from './CompactHorizontalBar';
 export { default as GroupBar } from './GroupBar';
 export * from './GroupBar';
 export { default as StackBar } from './StackBar';

package/lib/es6/types/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":["PlotEventEmitter","makeDataHintsContainer","default","Plot","ResponsiveContainer","Line","Bar","HorizontalBar","GroupBar","StackBar","Area","StackedArea","Radar","Donut","Tooltip","ScatterPlot","Bubble","Venn","RadialTree","ChartLegend","ChartLegendTable","Chart"],"sources":["../../../src/types/index.d.ts"],"sourcesContent":["// Utils\n// @ts-ignore\nimport { interpolateValue as intValue, PlotEventEmitter } from './utils';\n\nexport declare const interpolateValue: typeof intValue;\nexport declare function minMax(data: any, key: string | number): any;\nexport declare function calculateBubbleDomain(\n  data: Array<{ value: number; x: number; y: number }>,\n  key: 'x' | 'y',\n  range: [number, number],\n): [min: number, max: number];\nexport { PlotEventEmitter };\n\nexport { makeDataHintsContainer } from './a11y/hints';\n\n// Color\n/**\n * @deprecated\n * This export will be removed in the next major release.\n */\nexport declare const colors: { [key: string]: string };\n\nexport { default as Plot } from './Plot';\nexport * from './Plot';\n\nexport * from './Axis';\nexport * from './Hover';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\nexport * from './ResponsiveContainer';\n\nexport { default as Line } from './Line';\nexport * from './Line';\n\nexport { default as Bar } from './Bar';\nexport * from './Bar';\n\nexport { default as HorizontalBar } from './HorizontalBar';\nexport * from './HorizontalBar';\n\nexport { default as GroupBar } from './GroupBar';\nexport * from './GroupBar';\n\nexport { default as StackBar } from './StackBar';\nexport * from './StackBar';\n\nexport { default as Area } from './Area';\nexport * from './Area';\n\nexport { default as StackedArea } from './StackedArea';\nexport * from './StackedArea';\n\nexport { default as Radar } from './Radar';\nexport * from './Radar';\n\nexport { default as Donut } from './Donut';\nexport * from './Donut';\n\nexport { default as Tooltip } from './Tooltip';\nexport * from './Tooltip';\n\nexport { default as ScatterPlot } from './ScatterPlot';\nexport * from './ScatterPlot';\n\nexport { default as Bubble } from './Bubble';\nexport * from './Bubble';\n\nexport * from './Reference';\n\nexport { default as Venn } from './Venn';\nexport * from './Venn';\n\n/** It becomes resolvable after building and moving file to lib dir */\n\n// @ts-ignore\nexport { default as RadialTree } from './RadialTree';\n\n// @ts-ignore\nexport * from './RadialTree';\n\n// @ts-ignore\nexport { ChartLegend, ChartLegendTable } from './component/ChartLegend';\n\n// @ts-ignore\nexport * from './component/ChartLegend/LegendFlex/LegendFlex.type';\n// @ts-ignore\nexport * from './component/ChartLegend/LegendTable/LegendTable.type';\n// @ts-ignore\nexport * from './component/ChartLegend/LegendItem/LegendItem.type';\n\n// @ts-ignore\nexport * from './Pattern';\n\nexport { default as Chart } from './component/Chart';\nexport * from './component/Chart/AbstractChart.type';\nexport * from './component/Chart/LineChart.type';\nexport * from './component/Chart/BarChart.type';\nexport * from './component/Chart/HistogramChart.type';\nexport * from './component/Chart/ScatterPlotChart.type';\nexport * from './component/Chart/AreaChart.type';\nexport * from './component/Chart/BubbleChart.type';\nexport * from './component/Chart/DonutChart.type';\nexport * from './component/Chart/VennChart.type';\nexport * from './component/Chart/RadarChart.type';\nexport * from './component/Chart/ScatterPlotChart.type';\nexport * from './component/Chart/CigaretteChart.type';\n"],"mappings":"AAAA;AACA;AACA,SAAuCA,gBAAgB,QAAQ,SAAS;AASxE,SAASA,gBAAgB;AAEzB,SAASC,sBAAsB,QAAQ,cAAc;;AAErD;AACA;AACA;AACA;AACA;;AAGA,SAASC,OAAO,IAAIC,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,cAAc,QAAQ;AACtB,cAAc,SAAS;AAEvB,SAASD,OAAO,IAAIE,mBAAmB,QAAQ,uBAAuB;AACtE,cAAc,uBAAuB;AAErC,SAASF,OAAO,IAAIG,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,SAASH,OAAO,IAAII,GAAG,QAAQ,OAAO;AACtC,cAAc,OAAO;AAErB,SAASJ,OAAO,IAAIK,aAAa,QAAQ,iBAAiB;AAC1D,cAAc,iBAAiB;AAE/B,SAASL,OAAO,IAAIM,QAAQ,QAAQ,YAAY;AAChD,cAAc,YAAY;AAE1B,SAASN,OAAO,IAAIO,QAAQ,QAAQ,YAAY;AAChD,cAAc,YAAY;AAE1B,SAASP,OAAO,IAAIQ,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,SAASR,OAAO,IAAIS,WAAW,QAAQ,eAAe;AACtD,cAAc,eAAe;AAE7B,SAAST,OAAO,IAAIU,KAAK,QAAQ,SAAS;AAC1C,cAAc,SAAS;AAEvB,SAASV,OAAO,IAAIW,KAAK,QAAQ,SAAS;AAC1C,cAAc,SAAS;AAEvB,SAASX,OAAO,IAAIY,OAAO,QAAQ,WAAW;AAC9C,cAAc,WAAW;AAEzB,SAASZ,OAAO,IAAIa,WAAW,QAAQ,eAAe;AACtD,cAAc,eAAe;AAE7B,SAASb,OAAO,IAAIc,MAAM,QAAQ,UAAU;AAC5C,cAAc,UAAU;AAExB,cAAc,aAAa;AAE3B,SAASd,OAAO,IAAIe,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;;AAEtB;;AAEA;AACA,SAASf,OAAO,IAAIgB,UAAU,QAAQ,cAAc;;AAEpD;AACA,cAAc,cAAc;;AAE5B;AACA,SAASC,WAAW,EAAEC,gBAAgB,QAAQ,yBAAyB;;AAEvE;AACA,cAAc,oDAAoD;AAClE;AACA,cAAc,sDAAsD;AACpE;AACA,cAAc,oDAAoD;;AAElE;AACA,cAAc,WAAW;AAEzB,SAASlB,OAAO,IAAImB,KAAK,QAAQ,mBAAmB;AACpD,cAAc,sCAAsC;AACpD,cAAc,kCAAkC;AAChD,cAAc,iCAAiC;AAC/C,cAAc,uCAAuC;AACrD,cAAc,yCAAyC;AACvD,cAAc,kCAAkC;AAChD,cAAc,oCAAoC;AAClD,cAAc,mCAAmC;AACjD,cAAc,kCAAkC;AAChD,cAAc,mCAAmC;AACjD,cAAc,yCAAyC;AACvD,cAAc,uCAAuC"}
+{"version":3,"file":"index.d.js","names":["PlotEventEmitter","makeDataHintsContainer","default","Plot","ResponsiveContainer","Line","Bar","HorizontalBar","CompactHorizontalBar","GroupBar","StackBar","Area","StackedArea","Radar","Donut","Tooltip","ScatterPlot","Bubble","Venn","RadialTree","ChartLegend","ChartLegendTable","Chart"],"sources":["../../../src/types/index.d.ts"],"sourcesContent":["// Utils\n// @ts-ignore\nimport { interpolateValue as intValue, PlotEventEmitter } from './utils';\n\nexport declare const interpolateValue: typeof intValue;\nexport declare function minMax(data: any, key: string | number): any;\nexport declare function calculateBubbleDomain(\n  data: Array<{ value: number; x: number; y: number }>,\n  key: 'x' | 'y',\n  range: [number, number],\n): [min: number, max: number];\nexport { PlotEventEmitter };\n\nexport { makeDataHintsContainer } from './a11y/hints';\n\n// Color\n/**\n * @deprecated\n * This export will be removed in the next major release.\n */\nexport declare const colors: { [key: string]: string };\n\nexport { default as Plot } from './Plot';\nexport * from './Plot';\n\nexport * from './Axis';\nexport * from './Hover';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\nexport * from './ResponsiveContainer';\n\nexport { default as Line } from './Line';\nexport * from './Line';\n\nexport { default as Bar } from './Bar';\nexport * from './Bar';\n\nexport { default as HorizontalBar } from './HorizontalBar';\nexport * from './HorizontalBar';\n\nexport { default as CompactHorizontalBar } from './CompactHorizontalBar';\nexport * from './CompactHorizontalBar';\n\nexport { default as GroupBar } from './GroupBar';\nexport * from './GroupBar';\n\nexport { default as StackBar } from './StackBar';\nexport * from './StackBar';\n\nexport { default as Area } from './Area';\nexport * from './Area';\n\nexport { default as StackedArea } from './StackedArea';\nexport * from './StackedArea';\n\nexport { default as Radar } from './Radar';\nexport * from './Radar';\n\nexport { default as Donut } from './Donut';\nexport * from './Donut';\n\nexport { default as Tooltip } from './Tooltip';\nexport * from './Tooltip';\n\nexport { default as ScatterPlot } from './ScatterPlot';\nexport * from './ScatterPlot';\n\nexport { default as Bubble } from './Bubble';\nexport * from './Bubble';\n\nexport * from './Reference';\n\nexport { default as Venn } from './Venn';\nexport * from './Venn';\n\n/** It becomes resolvable after building and moving file to lib dir */\n\n// @ts-ignore\nexport { default as RadialTree } from './RadialTree';\n\n// @ts-ignore\nexport * from './RadialTree';\n\n// @ts-ignore\nexport { ChartLegend, ChartLegendTable } from './component/ChartLegend';\n\n// @ts-ignore\nexport * from './component/ChartLegend/LegendFlex/LegendFlex.type';\n// @ts-ignore\nexport * from './component/ChartLegend/LegendTable/LegendTable.type';\n// @ts-ignore\nexport * from './component/ChartLegend/LegendItem/LegendItem.type';\n\n// @ts-ignore\nexport * from './Pattern';\n\nexport { default as Chart } from './component/Chart';\nexport * from './component/Chart/AbstractChart.type';\nexport * from './component/Chart/LineChart.type';\nexport * from './component/Chart/BarChart.type';\nexport * from './component/Chart/HistogramChart.type';\nexport * from './component/Chart/ScatterPlotChart.type';\nexport * from './component/Chart/AreaChart.type';\nexport * from './component/Chart/BubbleChart.type';\nexport * from './component/Chart/DonutChart.type';\nexport * from './component/Chart/VennChart.type';\nexport * from './component/Chart/RadarChart.type';\nexport * from './component/Chart/ScatterPlotChart.type';\nexport * from './component/Chart/CigaretteChart.type';\n"],"mappings":"AAAA;AACA;AACA,SAAuCA,gBAAgB,QAAQ,SAAS;AASxE,SAASA,gBAAgB;AAEzB,SAASC,sBAAsB,QAAQ,cAAc;;AAErD;AACA;AACA;AACA;AACA;;AAGA,SAASC,OAAO,IAAIC,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,cAAc,QAAQ;AACtB,cAAc,SAAS;AAEvB,SAASD,OAAO,IAAIE,mBAAmB,QAAQ,uBAAuB;AACtE,cAAc,uBAAuB;AAErC,SAASF,OAAO,IAAIG,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,SAASH,OAAO,IAAII,GAAG,QAAQ,OAAO;AACtC,cAAc,OAAO;AAErB,SAASJ,OAAO,IAAIK,aAAa,QAAQ,iBAAiB;AAC1D,cAAc,iBAAiB;AAE/B,SAASL,OAAO,IAAIM,oBAAoB,QAAQ,wBAAwB;AACxE,cAAc,wBAAwB;AAEtC,SAASN,OAAO,IAAIO,QAAQ,QAAQ,YAAY;AAChD,cAAc,YAAY;AAE1B,SAASP,OAAO,IAAIQ,QAAQ,QAAQ,YAAY;AAChD,cAAc,YAAY;AAE1B,SAASR,OAAO,IAAIS,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;AAEtB,SAAST,OAAO,IAAIU,WAAW,QAAQ,eAAe;AACtD,cAAc,eAAe;AAE7B,SAASV,OAAO,IAAIW,KAAK,QAAQ,SAAS;AAC1C,cAAc,SAAS;AAEvB,SAASX,OAAO,IAAIY,KAAK,QAAQ,SAAS;AAC1C,cAAc,SAAS;AAEvB,SAASZ,OAAO,IAAIa,OAAO,QAAQ,WAAW;AAC9C,cAAc,WAAW;AAEzB,SAASb,OAAO,IAAIc,WAAW,QAAQ,eAAe;AACtD,cAAc,eAAe;AAE7B,SAASd,OAAO,IAAIe,MAAM,QAAQ,UAAU;AAC5C,cAAc,UAAU;AAExB,cAAc,aAAa;AAE3B,SAASf,OAAO,IAAIgB,IAAI,QAAQ,QAAQ;AACxC,cAAc,QAAQ;;AAEtB;;AAEA;AACA,SAAShB,OAAO,IAAIiB,UAAU,QAAQ,cAAc;;AAEpD;AACA,cAAc,cAAc;;AAE5B;AACA,SAASC,WAAW,EAAEC,gBAAgB,QAAQ,yBAAyB;;AAEvE;AACA,cAAc,oDAAoD;AAClE;AACA,cAAc,sDAAsD;AACpE;AACA,cAAc,oDAAoD;;AAElE;AACA,cAAc,WAAW;AAEzB,SAASnB,OAAO,IAAIoB,KAAK,QAAQ,mBAAmB;AACpD,cAAc,sCAAsC;AACpD,cAAc,kCAAkC;AAChD,cAAc,iCAAiC;AAC/C,cAAc,uCAAuC;AACrD,cAAc,yCAAyC;AACvD,cAAc,kCAAkC;AAChD,cAAc,oCAAoC;AAClD,cAAc,mCAAmC;AACjD,cAAc,kCAAkC;AAChD,cAAc,mCAAmC;AACjD,cAAc,yCAAyC;AACvD,cAAc,uCAAuC"}

package/lib/types/CompactHorizontalBar.d.ts

@@ -0,0 +1,88 @@
+import React from 'react';
+import { UnknownProperties } from '@semcore/core';
+import { Context } from './context';
+import { BarContext, BackgroundProps } from './Bar';
+import { IntergalacticD3Component } from './Plot';
+import { PatternsConfig } from './Pattern';
+import { BoxProps } from '@semcore/flex-box';
+import { TooltipType } from './Tooltip';
+
+export type CompactHorizontalBarProps = Context & {
+  /** Field name from `data` array item for the XAxis */
+  x?: string;
+  /** Field name from `data` array item for the YAxis */
+  y?: string;
+  /** Line color */
+  color?: string;
+  /**
+   * Bars rounded corners
+   * @default 2
+   */
+  radius?: number;
+  /** Animation duration in ms
+   * @default 500
+   */
+  duration?: number;
+  /** Enables element transparency */
+  transparent?: boolean;
+  /** Enables charts patterns that enhances charts accessibility */
+  patterns?: PatternsConfig;
+};
+
+export type CompactHorizontalBarHoverProps = BoxProps;
+type Hover = IntergalacticD3Component<'rect', CompactHorizontalBarHoverProps, Context>;
+export type CompactHorizontalBarAnnotationProps = BoxProps;
+type Annotation = IntergalacticD3Component<
+  'foreignObject',
+  CompactHorizontalBarAnnotationProps,
+  Context
+>;
+export type CompactHorizontalBarLabelProps = BoxProps;
+type Label = IntergalacticD3Component<'div', CompactHorizontalBarLabelProps, Context>;
+export type CompactHorizontalBarPercentProps = BoxProps;
+export type CompactHorizontalBarPercentContext = { formatted: string; percent: number };
+type Percent = IntergalacticD3Component<
+  'div',
+  CompactHorizontalBarPercentProps,
+  Context & CompactHorizontalBarPercentContext
+>;
+export type CompactHorizontalBarValueProps = BoxProps;
+export type CompactHorizontalBarValueContext = { formatted: string; value: number };
+type Value = IntergalacticD3Component<
+  'div',
+  CompactHorizontalBarValueProps,
+  Context & CompactHorizontalBarValueContext
+>;
+export type CompactHorizontalBarBarProps = {};
+type Bar = IntergalacticD3Component<'g', CompactHorizontalBarBarProps, Context>;
+export type CompactHorizontalBarBackgroundProps = BoxProps;
+type Background = IntergalacticD3Component<'rect', BackgroundProps, Context>;
+export type CompactHorizontalBarFillProps = BoxProps & {
+  patterns?: PatternsConfig;
+  color?: string;
+  transparent?: boolean;
+  hide?: boolean;
+};
+type Fill = IntergalacticD3Component<'rect', CompactHorizontalBarFillProps, Context>;
+
+declare const CompactHorizontalBar: IntergalacticD3Component<
+  'g',
+  CompactHorizontalBarProps,
+  BarContext
+> & {
+  Hover: Hover;
+  Annotation: Annotation;
+  Label: Label;
+  Percent: Percent;
+  Value: Value;
+  Bar: Bar & {
+    Background: Background;
+    Fill: Fill;
+  };
+  Tooltip: TooltipType<{
+    /** Index in `data` array of the current items */
+    index: number;
+  }>;
+};
+
+export default CompactHorizontalBar;

package/lib/types/component/Chart/CompactHorizontalBarChart.d.ts

@@ -0,0 +1,2 @@
+import { CompactHorizontalBarChartType } from './CompactHorizontalBarChart.type';
+export declare const CompactHorizontalBarChart: CompactHorizontalBarChartType;

package/lib/types/component/Chart/CompactHorizontalBarChart.type.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { Intergalactic } from '@semcore/core';
+import { Flex } from '@semcore/flex-box';
+import { ScaleBand, ScaleLinear, ScaleTime } from 'd3-scale';
+import { BaseChartProps } from './AbstractChart.type';
+type BarKey = string;
+export type CompactHorizontalBarChartData = Array<Record<BarKey, number | string>>;
+export type CompactHorizontalBarChartProps = BaseChartProps<CompactHorizontalBarChartData> & {
+    x: string;
+    y: string;
+    xScale?: ScaleBand<any> | ScaleTime<any, any>;
+    yScale?: ScaleLinear<any, any>;
+    /** Handle click by `HoverRect`. `index` is an index of the data array. */
+    onClickHoverRect?: (index: number, e: React.SyntheticEvent) => void;
+    /** Handle click by Bar. */
+    onClickBar?: (barItem: number, e: React.SyntheticEvent) => void;
+};
+export type CompactHorizontalBarChartType = Intergalactic.Component<typeof Flex, CompactHorizontalBarChartProps>;
+export {};

package/lib/types/component/Chart/index.d.ts

@@ -9,5 +9,6 @@ declare const _default: {
     Venn: import("./VennChart.type").VennChartType;
     Radar: import("./RadarChart.type").RadarChartType;
     Cigarette: import("./CigaretteChart.type").CigaretteChartType;
+    CompactHorizontalBar: import("./CompactHorizontalBarChart.type").CompactHorizontalBarChartType;
 };
 export default _default;

package/lib/types/index.d.ts

@@ -38,6 +38,9 @@ export * from './Bar';
 export { default as HorizontalBar } from './HorizontalBar';
 export * from './HorizontalBar';
 
+export { default as CompactHorizontalBar } from './CompactHorizontalBar';
+export * from './CompactHorizontalBar';
+
 export { default as GroupBar } from './GroupBar';
 export * from './GroupBar';
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/d3-chart",
   "description": "Semrush D3 Chart Component",
-  "version": "3.49.0",
+  "version": "3.50.0",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -18,7 +18,7 @@
     "@semcore/animation": "2.30.0",
     "@semcore/divider": "4.29.0",
     "@semcore/flex-box": "5.30.0",
-    "@semcore/popper": "5.38.0",
+    "@semcore/popper": "5.38.1",
     "@semcore/utils": "4.31.0",
     "@types/d3-shape": "^3.1.0",
     "@upsetjs/venn.js": "1.4.2",