@semcore/d3-chart 1.5.6 → 1.6.3

package/lib/es6/ScatterPlot.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/ScatterPlot.js"],"names":["React","Component","sstyled","canUseDOM","CONSTANT","createElement","uniqueIDEnhancement","transition","ClipPath","ScatterPlotRoot","document","visible","props","x","clientX","y","clientY","eventEmitter","asProps","virtualElement","getBoundingClientRect","generateGetBoundingClientRect","VIRTUAL_ELEMENT","emit","width","height","top","right","bottom","left","duration","uid","r","value","radius","selectRect","selection","selectAll","attr","selectRectNode","node","animationCircle","d","i","color","scale","offset","styles","valueColor","xScale","yScale","SScatterPlot","Element","SValue","bindHandlerTooltip","xIndex","data","size","marginX","Math","min","range","marginY","map","renderCircle","bind","style","ScatterPlot"],"mappings":";;;;;;;;;;;;;;;;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,OAApB,QAAmC,eAAnC;AACA,OAAOC,SAAP,MAAsB,8BAAtB;AACA,SAASC,QAAT,QAAyB,SAAzB;AACA,OAAOC,aAAP,MAA0B,iBAA1B;AACA,OAAOC,mBAAP,MAAgC,6BAAhC;AACA,SAASC,UAAT,QAA2B,eAA3B;;;;;;;;;;;;;;;;;;AAEA,OAAOC,QAAP,MAAqB,YAArB;;IAEMC,e;;;;;;;;;;;;;;;;qEAUaN,SAAS,KAAKO,QAAQ,CAACL,aAAT,CAAuB,KAAvB,CAAL,GAAqC,E;;yEAM1C,UAACM,OAAD,EAAUC,KAAV;AAAA,aAAoB,iBAAgC;AAAA,YAApBC,CAAoB,SAA7BC,OAA6B;AAAA,YAARC,CAAQ,SAAjBC,OAAiB;AAAA,YAC/DC,YAD+D,GAC9C,MAAKC,OADyC,CAC/DD,YAD+D;AAEvE,cAAKE,cAAL,CAAoBC,qBAApB,GAA4C,MAAKC,6BAAL,CAAmCR,CAAnC,EAAsCE,CAAtC,CAA5C;AACA,cAAKI,cAAL,CAAoBf,QAAQ,CAACkB,eAA7B,IAAgD,IAAhD;AACAL,QAAAA,YAAY,CAACM,IAAb,CAAkB,kBAAlB,EAAsCZ,OAAtC,EAA+CC,KAA/C,EAAsD,MAAKO,cAA3D;AACD,OALoB;AAAA,K;;;;;;;WAJrB,yCAA4C;AAAA,UAAdN,CAAc,uEAAV,CAAU;AAAA,UAAPE,CAAO,uEAAH,CAAG;AAC1C,aAAO;AAAA,eAAO;AAAES,UAAAA,KAAK,EAAE,CAAT;AAAYC,UAAAA,MAAM,EAAE,CAApB;AAAuBC,UAAAA,GAAG,EAAEX,CAA5B;AAA+BY,UAAAA,KAAK,EAAEd,CAAtC;AAAyCe,UAAAA,MAAM,EAAEb,CAAjD;AAAoDc,UAAAA,IAAI,EAAEhB;AAA1D,SAAP;AAAA,OAAP;AACD;;;WASD,2BAAkB;AAAA,0BACoB,KAAKK,OADzB;AAAA,UACRY,QADQ,iBACRA,QADQ;AAAA,UACEC,GADF,iBACEA,GADF;AAAA,UACOC,CADP,iBACOA,CADP;AAAA,UACUC,KADV,iBACUA,KADV;AAEhB,UAAMC,MAAM,GAAGF,CAAC,GAAGA,CAAH,GAAOC,KAAK,GAAG,EAAH,GAAQ,GAApC;AACA,UAAME,UAAU,GAAG5B,UAAU,GAC1B6B,SADgB,GAEhBC,SAFgB,gBAEEN,GAFF,QAGhBO,IAHgB,CAGX,GAHW,EAGN,CAHM,CAAnB;AAIA,UAAMC,cAAc,GAAGJ,UAAU,CAACK,IAAX,EAAvB;;AAEA,UAAIV,QAAQ,GAAG,CAAX,IAAgBS,cAApB,EAAoC;AAClCJ,QAAAA,UAAU,CACP5B,UADH,GAEGuB,QAFH,CAEYA,QAFZ,EAGGQ,IAHH,CAGQ,GAHR,EAGaJ,MAHb;AAID;AACF;;;WAED,8BAAqB;AACnB,WAAKO,eAAL;AACD;;;WAED,6BAAoB;AAClB,WAAKA,eAAL;AACD;;;WAED,sBAAaC,CAAb,EAAgBC,CAAhB,EAAmB;AAAA;;AAAA,2BAab,KAAKzB,OAbQ;AAAA,UAEf0B,KAFe,kBAEfA,KAFe;AAAA,UAGfC,KAHe,kBAGfA,KAHe;AAAA,UAIfhC,CAJe,kBAIfA,CAJe;AAAA,UAKfE,CALe,kBAKfA,CALe;AAAA,UAMfiB,CANe,kBAMfA,CANe;AAAA,UAOfc,MAPe,kBAOfA,MAPe;AAAA,UAQfC,MARe,kBAQfA,MARe;AAAA,UASfhB,GATe,kBASfA,GATe;AAAA,UAUfD,QAVe,kBAUfA,QAVe;AAAA,UAWfG,KAXe,kBAWfA,KAXe;AAAA,UAYfe,UAZe,kBAYfA,UAZe;;AAAA,kCAcQH,KAdR;AAAA,UAcVI,MAdU;AAAA,UAcFC,MAdE;;AAejB,UAAMC,YAAY,GAAG,KAAKC,OAA1B;AACA,UAAMC,MAAM,GAAG,MAAf;AACA,oBAAOnD,OAAO,CAAC6C,MAAD,CAAd,eACE;AAAA,iCACkBJ,CADlB;AAAA,uBAEe,KAAKW,kBAAL,CAAwB,IAAxB,kCAAmC,KAAK1C,KAAxC;AAA+C2C,UAAAA,MAAM,EAAEZ;AAAvD,WAFf;AAAA,wBAGgB,KAAKW,kBAAL,CAAwB,KAAxB,kCAAoC,KAAK1C,KAAzC;AAAgD2C,UAAAA,MAAM,EAAEZ;AAAxD;AAHhB,uBAKE,oBAAC,YAAD;AAAA,wBACSZ,GADT,SACeY,CADf;AAAA,kBAES,QAFT;AAAA,mCAGoBZ,GAHpB;AAAA,cAIMkB,MAAM,CAACP,CAAC,CAAC7B,CAAD,CAAF,CAAN,GAAeiC,MAAM,CAAC,CAAD,CAJ3B;AAAA,cAKMI,MAAM,CAACR,CAAC,CAAC3B,CAAD,CAAF,CAAN,GAAe+B,MAAM,CAAC,CAAD,CAL3B;AAAA,iBAMSF,KANT;AAAA,aAOKZ,CAPL;AAAA,kCAQmBF,QARnB;AAAA,SALF,EAeGY,CAAC,CAACT,KAAD,CAAD,iBACC,oBAAC,MAAD;AAAA,aACKgB,MAAM,CAACP,CAAC,CAAC7B,CAAD,CAAF,CAAN,GAAeiC,MAAM,CAAC,CAAD,CAD1B;AAAA,aAEKI,MAAM,CAACR,CAAC,CAAC3B,CAAD,CAAF,CAAN,GAAe+B,MAAM,CAAC,CAAD,CAF1B;AAAA,cAGK,MAHL;AAAA,mCAIoBf,GAJpB;AAAA,iBAKSiB;AALT,UAOGN,CAAC,CAACT,KAAD,CAPJ,CAhBJ,CADF;AA6BD;;;WAED,kBAAS;AAAA,2BAC4B,KAAKf,OADjC;AAAA,UACCsC,IADD,kBACCA,IADD;AAAA,UACOzB,GADP,kBACOA,GADP;AAAA,UACY0B,IADZ,kBACYA,IADZ;AAAA,UACkBZ,KADlB,kBACkBA,KADlB;;AAAA,mCAEkBA,KAFlB;AAAA,UAEAI,MAFA;AAAA,UAEQC,MAFR;;AAGP,UAAMQ,OAAO,GAAGC,IAAI,CAACC,GAAL,CAASX,MAAM,CAACY,KAAP,GAAe,CAAf,CAAT,EAA4BZ,MAAM,CAACY,KAAP,GAAe,CAAf,CAA5B,CAAhB;AACA,UAAMC,OAAO,GAAGH,IAAI,CAACC,GAAL,CAASV,MAAM,CAACW,KAAP,GAAe,CAAf,CAAT,EAA4BX,MAAM,CAACW,KAAP,GAAe,CAAf,CAA5B,CAAhB;AAEA,0BACE,0CACGL,IAAI,CAACO,GAAL,CAAS,KAAKC,YAAL,CAAkBC,IAAlB,CAAuB,IAAvB,CAAT,CADH,eAEE,oBAAC,QAAD;AACE,QAAA,EAAE,EAAElC,GADN;AAEE,QAAA,CAAC,EAAE2B,OAFL;AAGE,QAAA,CAAC,EAAEI,OAHL;AAIE,QAAA,KAAK,YAAKL,IAAI,CAAC,CAAD,CAAJ,GAAU,IAAIC,OAAnB,OAJP;AAKE,QAAA,MAAM,YAAKD,IAAI,CAAC,CAAD,CAAJ,GAAU,IAAIK,OAAnB;AALR,QAFF,CADF;AAYD;;;;EAlH2B7D,S;;gBAAxBQ,e,iBACiB,a;;gBADjBA,e,WAEWyD,K;;gBAFXzD,e,aAGa,CAACH,mBAAmB,EAApB,C;;gBAHbG,e,kBAKkB;AACpBqC,EAAAA,MAAM,EAAE,CAAC,CAAD,EAAI,CAAJ,CADY;AAEpBhB,EAAAA,QAAQ,EAAE;AAFU,C;;AAgHxB,IAAMqC,WAAW,GAAG9D,aAAa,CAACI,eAAD,CAAjC;AAEA,eAAe0D,WAAf","sourcesContent":["import React from 'react';\nimport { Component, sstyled } from '@semcore/core';\nimport canUseDOM from '@semcore/utils/lib/canUseDOM';\nimport { CONSTANT } from './utils';\nimport createElement from './createElement';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport { transition } from 'd3-transition';\nimport style from './style/scatterplot.shadow.css';\nimport ClipPath from './ClipPath';\n\nclass ScatterPlotRoot extends Component {\n  static displayName = 'ScatterPlot';\n  static style = style;\n  static enhance = [uniqueIDEnhancement()];\n\n  static defaultProps = {\n    offset: [0, 0],\n    duration: 500,\n  };\n\n  virtualElement = canUseDOM() ? document.createElement('div') : {};\n\n  generateGetBoundingClientRect(x = 0, y = 0) {\n    return () => ({ width: 0, height: 0, top: y, right: x, bottom: y, left: x });\n  }\n\n  bindHandlerTooltip = (visible, props) => ({ clientX: x, clientY: y }) => {\n    const { eventEmitter } = this.asProps;\n    this.virtualElement.getBoundingClientRect = this.generateGetBoundingClientRect(x, y);\n    this.virtualElement[CONSTANT.VIRTUAL_ELEMENT] = true;\n    eventEmitter.emit('onTooltipVisible', visible, props, this.virtualElement);\n  };\n\n  animationCircle() {\n    const { duration, uid, r, value } = this.asProps;\n    const radius = r ? r : value ? 12 : 5.5;\n    const selectRect = transition()\n      .selection()\n      .selectAll(`[id^=${uid}]`)\n      .attr('r', 0);\n    const selectRectNode = selectRect.node();\n\n    if (duration > 0 && selectRectNode) {\n      selectRect\n        .transition()\n        .duration(duration)\n        .attr('r', radius);\n    }\n  }\n\n  componentDidUpdate() {\n    this.animationCircle();\n  }\n\n  componentDidMount() {\n    this.animationCircle();\n  }\n\n  renderCircle(d, i) {\n    const {\n      color,\n      scale,\n      x,\n      y,\n      r,\n      offset,\n      styles,\n      uid,\n      duration,\n      value,\n      valueColor,\n    } = this.asProps;\n    const [xScale, yScale] = scale;\n    const SScatterPlot = this.Element;\n    const SValue = 'text';\n    return sstyled(styles)(\n      <g\n        key={`circle(#${i})`}\n        onMouseMove={this.bindHandlerTooltip(true, { ...this.props, xIndex: i })}\n        onMouseLeave={this.bindHandlerTooltip(false, { ...this.props, xIndex: i })}\n      >\n        <SScatterPlot\n          id={`${uid}${i}`}\n          render=\"circle\"\n          clipPath={`url(#${uid})`}\n          cx={xScale(d[x]) + offset[0]}\n          cy={yScale(d[y]) + offset[1]}\n          color={color}\n          r={r}\n          use:duration={`${duration}ms`}\n        />\n        {d[value] && (\n          <SValue\n            x={xScale(d[x]) + offset[0]}\n            y={yScale(d[y]) + offset[1]}\n            dy=\".3em\"\n            clipPath={`url(#${uid})`}\n            color={valueColor}\n          >\n            {d[value]}\n          </SValue>\n        )}\n      </g>,\n    );\n  }\n\n  render() {\n    const { data, uid, size, scale } = this.asProps;\n    const [xScale, yScale] = scale;\n    const marginX = Math.min(xScale.range()[0], xScale.range()[1]);\n    const marginY = Math.min(yScale.range()[0], yScale.range()[1]);\n\n    return (\n      <>\n        {data.map(this.renderCircle.bind(this))}\n        <ClipPath\n          id={uid}\n          x={marginX}\n          y={marginY}\n          width={`${size[0] - 2 * marginX}px`}\n          height={`${size[1] - 2 * marginY}px`}\n        />\n      </>\n    );\n  }\n}\n\nconst ScatterPlot = createElement(ScatterPlotRoot);\n\nexport default ScatterPlot;\n"],"file":"ScatterPlot.js"}

package/lib/es6/StackBar.js

@@ -27,15 +27,15 @@ var _ref = (
 /*__reshadow_css_start__*/
 __css__(
 /*__inner_css_start__*/
-".___SBar_jj14u_gg_{fill:#50aef4;transition-property:height,width,y;transition-duration:var(--duration);transition-timing-function:ease-in-out}.___SBar_jj14u_gg_.__color_jj14u_gg_{fill:var(--color)}.___SBar_jj14u_gg_.__hide_jj14u_gg_{display:none}.___SBackground_jj14u_gg_{fill:#e4ecf1}"
+".___SBar_fba7j_gg_{fill:#50aef4;transition-property:height,width,y;transition-duration:var(--duration);transition-timing-function:ease-in-out}.___SBar_fba7j_gg_.__color_fba7j_gg_{fill:var(--color)}.___SBar_fba7j_gg_.__hide_fba7j_gg_{display:none}.___SBackground_fba7j_gg_{fill:#e4ecf1}"
 /*__inner_css_end__*/
-, "1iy4upi_gg_")
+, "l0o7g6_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SBar": "___SBar_jj14u_gg_",
-  "_color": "__color_jj14u_gg_",
-  "_hide": "__hide_jj14u_gg_",
-  "__SBackground": "___SBackground_jj14u_gg_"
+  "__SBar": "___SBar_fba7j_gg_",
+  "_color": "__color_fba7j_gg_",
+  "_hide": "__hide_fba7j_gg_",
+  "__SBackground": "___SBackground_fba7j_gg_"
 }),
     style = _extends({}, _ref);
 

package/lib/es6/StackedArea.js

@@ -26,16 +26,16 @@ var _ref = (
 /*__reshadow_css_start__*/
 __css__(
 /*__inner_css_start__*/
-".___SArea_zz80o_gg_{fill:#50aef4;fill-opacity:.4}.___SArea_zz80o_gg_.__color_zz80o_gg_{fill:var(--color)}.___SAreaLine_zz80o_gg_{stroke:#50aef4;stroke-width:3;fill:transparent}.___SAreaLine_zz80o_gg_.__color_zz80o_gg_{stroke:var(--color)}.___SArea_zz80o_gg_,.___SAreaLine_zz80o_gg_{transition-property:d;transition-duration:var(--duration);transition-timing-function:ease-in-out}.___SNull_zz80o_gg_{fill:transparent;stroke:#bdc4c6;stroke-dasharray:4}.___SNull_zz80o_gg_.__hide_zz80o_gg_{display:none}"
+".___SArea_15h8v_gg_{fill:#50aef4;fill-opacity:.4}.___SArea_15h8v_gg_.__color_15h8v_gg_{fill:var(--color)}.___SAreaLine_15h8v_gg_{stroke:#50aef4;stroke-width:3;fill:transparent}.___SAreaLine_15h8v_gg_.__color_15h8v_gg_{stroke:var(--color)}.___SArea_15h8v_gg_,.___SAreaLine_15h8v_gg_{transition-property:d;transition-duration:var(--duration);transition-timing-function:ease-in-out}.___SNull_15h8v_gg_{fill:transparent;stroke:#bdc4c6;stroke-dasharray:4}.___SNull_15h8v_gg_.__hide_15h8v_gg_{display:none}"
 /*__inner_css_end__*/
-, "1vghdzd_gg_")
+, "1537vkc_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SArea": "___SArea_zz80o_gg_",
-  "_color": "__color_zz80o_gg_",
-  "__SAreaLine": "___SAreaLine_zz80o_gg_",
-  "__SNull": "___SNull_zz80o_gg_",
-  "_hide": "__hide_zz80o_gg_"
+  "__SArea": "___SArea_15h8v_gg_",
+  "_color": "__color_15h8v_gg_",
+  "__SAreaLine": "___SAreaLine_15h8v_gg_",
+  "__SNull": "___SNull_15h8v_gg_",
+  "_hide": "__hide_15h8v_gg_"
 }),
     style = _extends({}, _ref);
 

package/lib/es6/Tooltip.js

@@ -33,17 +33,17 @@ var style = (
 /*__reshadow_css_start__*/
 _sstyled.insert(
 /*__inner_css_start__*/
-".___STooltip_1rv9e_gg_{position:relative;background-color:#fff;border-radius:3px;border:1px solid #bdc4c6;box-sizing:border-box;box-shadow:0 2px 5px 0 rgba(0,0,0,.25),0 -2px 5px -2px rgba(0,0,0,.25);padding:12px}.___STitle_1rv9e_gg_{font-size:12px;line-height:1.5;color:#757575;margin-bottom:8px}.___SDotGroup_1rv9e_gg_{display:flex;align-items:center}.___SDot_1rv9e_gg_{width:8px;height:8px;border-radius:50%;margin-right:8px;background:#50aef4}.___SDot_1rv9e_gg_.__color_1rv9e_gg_{background:var(--color_1rmqsj5)}"
+".___STooltip_14lwz_gg_{font-size:12px;line-height:1.5;position:relative;background-color:#fff;border-radius:3px;border:1px solid #bdc4c6;box-sizing:border-box;box-shadow:0 2px 5px 0 rgba(0,0,0,.25),0 -2px 5px -2px rgba(0,0,0,.25);padding:12px}.___STitle_14lwz_gg_{color:#757575;margin-bottom:8px}.___SDotGroup_14lwz_gg_{display:flex;align-items:center}.___SDot_14lwz_gg_{width:8px;height:8px;border-radius:50%;margin-right:8px;background:#50aef4}.___SDot_14lwz_gg_.__color_14lwz_gg_{background:var(--color_drazch)}"
 /*__inner_css_end__*/
-, "1rmqsj5_gg_")
+, "drazch_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__STooltip": "___STooltip_1rv9e_gg_",
-  "__STitle": "___STitle_1rv9e_gg_",
-  "__SDotGroup": "___SDotGroup_1rv9e_gg_",
-  "__SDot": "___SDot_1rv9e_gg_",
-  "_color": "__color_1rv9e_gg_",
-  "--color": "--color_1rmqsj5"
+  "__STooltip": "___STooltip_14lwz_gg_",
+  "__STitle": "___STitle_14lwz_gg_",
+  "__SDotGroup": "___SDotGroup_14lwz_gg_",
+  "__SDot": "___SDot_14lwz_gg_",
+  "_color": "__color_14lwz_gg_",
+  "--color": "--color_drazch"
 });
 
 var TooltipRoot = /*#__PURE__*/function (_Component) {
@@ -167,7 +167,9 @@ function PopperPopper(props) {
 
   var STooltip = props.Element,
       styles = props.styles,
-      $visible = props.$visible;
+      $visible = props.$visible,
+      x = props.x,
+      y = props.y;
   var handlerCancel = useCallback(function () {
     return false;
   }, []);
@@ -175,7 +177,9 @@ function PopperPopper(props) {
   return _ref4 = sstyled(styles), /*#__PURE__*/React.createElement(STooltip, _ref4.cn("STooltip", {
     "render": Popper.Popper,
     "childrenPosition": "inside",
-    "onMouseMove": handlerCancel
+    "onMouseMove": handlerCancel,
+    "x": x,
+    "y": y
   }));
 }
 

package/lib/es6/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Tooltip.js"],"names":["React","useCallback","Component","Root","sstyled","Popper","Box","findComponent","CONSTANT","createElement","resolveColor","TooltipRoot","$visible","asProps","x","y","state","eventEmitter","rootRef","unsubscribeTooltipVisible","subscribe","visible","data","node","setState","VIRTUAL_ELEMENT","current","contains","setPopperTrigger","popper","update","Children","children","tag","other","advanceMode","Tooltip","Trigger","displayName","handlerCancel","allowedAutoPlacements","setTrigger","style","PopperPopper","props","STooltip","Element","styles","Title","STitle","Dot","color","SDotGroup","SDot","Footer"],"mappings":"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","sourcesContent":["import React, { useCallback } from 'react';\nimport { Component, Root, sstyled } from '@semcore/core';\nimport Popper from '@semcore/popper';\nimport { Box } from '@semcore/flex-box';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport { CONSTANT } from './utils';\nimport createElement from './createElement';\nimport resolveColor from '@semcore/utils/lib/color';\n\nimport style from './style/tooltip.shadow.css';\n\nclass TooltipRoot extends Component {\n  static displayName = 'Tooltip';\n\n  static style = style;\n\n  state = {\n    $visible: false,\n  };\n\n  handlerCancel = () => false;\n\n  getTriggerProps() {\n    // TODO: как то убрать\n    const { x, y } = this.asProps;\n    return { x, y };\n  }\n\n  getPopperProps() {\n    return {\n      ...this.state,\n    };\n  }\n\n  componentDidMount() {\n    const { eventEmitter, rootRef } = this.asProps;\n    this.unsubscribeTooltipVisible = eventEmitter.subscribe(\n      'onTooltipVisible',\n      (visible, data, node) => {\n        this.setState(\n          {\n            // TODO: тут бага если одно поля нету,то оно не перезапишет стейт\n            ...data,\n            $visible: visible,\n          },\n          () => {\n            if (node && (node[CONSTANT.VIRTUAL_ELEMENT] || rootRef.current.contains(node))) {\n              this?.setPopperTrigger(node);\n              this.popper.current?.update();\n            }\n          },\n        );\n      },\n    );\n  }\n\n  componentWillUnmount() {\n    if (this.unsubscribeTooltipVisible) {\n      this.unsubscribeTooltipVisible();\n    }\n  }\n\n  render() {\n    const { Children, children, tag, ...other } = this.asProps;\n\n    const advanceMode = !!findComponent(Children, [\n      Tooltip.Trigger.displayName,\n      Tooltip.Popper.displayName,\n    ]);\n    return (\n      <Root\n        render={Popper}\n        visible={this.state.$visible}\n        onFirstUpdate={this.handlerCancel}\n        onOutsideClick={this.handlerCancel}\n        interaction=\"none\"\n        offset={8}\n        flip={{ allowedAutoPlacements: ['left', 'right'] }}\n      >\n        {({ popper, setTrigger }) => {\n          this.setPopperTrigger = setTrigger;\n          this.popper = popper;\n          this.popper.current?.update();\n          return advanceMode ? (\n            <Children />\n          ) : (\n            <>\n              {tag && <Tooltip.Trigger tag={tag} />}\n              <Tooltip.Popper {...other}>{children}</Tooltip.Popper>\n            </>\n          );\n        }}\n      </Root>\n    );\n  }\n}\n\nfunction PopperPopper(props) {\n  const { Element: STooltip, styles, $visible } = props;\n\n  const handlerCancel = useCallback(() => false, []);\n\n  if (!$visible) return null;\n\n  return sstyled(styles)(\n    <STooltip render={Popper.Popper} childrenPosition=\"inside\" onMouseMove={handlerCancel} />,\n  );\n}\n\nfunction Title(props) {\n  const STitle = Root;\n  const { styles } = props;\n  return sstyled(styles)(<STitle render={Box} __excludeProps={['data', 'scale']} />);\n}\n\nfunction Dot(props) {\n  const { styles, color, Children } = props;\n  const SDotGroup = Root;\n  const SDot = Box;\n  return sstyled(styles)(\n    <SDotGroup render={Box}>\n      <SDot __excludeProps={['data', 'scale']} color={resolveColor(color)} />\n      <Children />\n    </SDotGroup>,\n  );\n}\n\nfunction Footer() {\n  return null;\n}\n\nconst Tooltip = createElement(TooltipRoot, {\n  Trigger: Popper.Trigger,\n  Popper: PopperPopper,\n  Title,\n  Footer,\n  Dot,\n});\n\nexport default Tooltip;\n"],"file":"Tooltip.js"}
+{"version":3,"sources":["../../src/Tooltip.js"],"names":["React","useCallback","Component","Root","sstyled","Popper","Box","findComponent","CONSTANT","createElement","resolveColor","TooltipRoot","$visible","asProps","x","y","state","eventEmitter","rootRef","unsubscribeTooltipVisible","subscribe","visible","data","node","setState","VIRTUAL_ELEMENT","current","contains","setPopperTrigger","popper","update","Children","children","tag","other","advanceMode","Tooltip","Trigger","displayName","handlerCancel","allowedAutoPlacements","setTrigger","style","PopperPopper","props","STooltip","Element","styles","Title","STitle","Dot","color","SDotGroup","SDot","Footer"],"mappings":"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","sourcesContent":["import React, { useCallback } from 'react';\nimport { Component, Root, sstyled } from '@semcore/core';\nimport Popper from '@semcore/popper';\nimport { Box } from '@semcore/flex-box';\nimport findComponent from '@semcore/utils/lib/findComponent';\nimport { CONSTANT } from './utils';\nimport createElement from './createElement';\nimport resolveColor from '@semcore/utils/lib/color';\n\nimport style from './style/tooltip.shadow.css';\n\nclass TooltipRoot extends Component {\n  static displayName = 'Tooltip';\n\n  static style = style;\n\n  state = {\n    $visible: false,\n  };\n\n  handlerCancel = () => false;\n\n  getTriggerProps() {\n    // TODO: как то убрать\n    const { x, y } = this.asProps;\n    return { x, y };\n  }\n\n  getPopperProps() {\n    return {\n      ...this.state,\n    };\n  }\n\n  componentDidMount() {\n    const { eventEmitter, rootRef } = this.asProps;\n    this.unsubscribeTooltipVisible = eventEmitter.subscribe(\n      'onTooltipVisible',\n      (visible, data, node) => {\n        this.setState(\n          {\n            // TODO: тут бага если одно поля нету,то оно не перезапишет стейт\n            ...data,\n            $visible: visible,\n          },\n          () => {\n            if (node && (node[CONSTANT.VIRTUAL_ELEMENT] || rootRef.current.contains(node))) {\n              this?.setPopperTrigger(node);\n              this.popper.current?.update();\n            }\n          },\n        );\n      },\n    );\n  }\n\n  componentWillUnmount() {\n    if (this.unsubscribeTooltipVisible) {\n      this.unsubscribeTooltipVisible();\n    }\n  }\n\n  render() {\n    const { Children, children, tag, ...other } = this.asProps;\n\n    const advanceMode = !!findComponent(Children, [\n      Tooltip.Trigger.displayName,\n      Tooltip.Popper.displayName,\n    ]);\n    return (\n      <Root\n        render={Popper}\n        visible={this.state.$visible}\n        onFirstUpdate={this.handlerCancel}\n        onOutsideClick={this.handlerCancel}\n        interaction=\"none\"\n        offset={8}\n        flip={{ allowedAutoPlacements: ['left', 'right'] }}\n      >\n        {({ popper, setTrigger }) => {\n          this.setPopperTrigger = setTrigger;\n          this.popper = popper;\n          this.popper.current?.update();\n          return advanceMode ? (\n            <Children />\n          ) : (\n            <>\n              {tag && <Tooltip.Trigger tag={tag} />}\n              <Tooltip.Popper {...other}>{children}</Tooltip.Popper>\n            </>\n          );\n        }}\n      </Root>\n    );\n  }\n}\n\nfunction PopperPopper(props) {\n  const { Element: STooltip, styles, $visible, x, y } = props;\n\n  const handlerCancel = useCallback(() => false, []);\n\n  if (!$visible) return null;\n\n  return sstyled(styles)(\n    <STooltip\n      render={Popper.Popper}\n      childrenPosition=\"inside\"\n      onMouseMove={handlerCancel}\n      x={x}\n      y={y}\n    />,\n  );\n}\n\nfunction Title(props) {\n  const STitle = Root;\n  const { styles } = props;\n  return sstyled(styles)(<STitle render={Box} __excludeProps={['data', 'scale']} />);\n}\n\nfunction Dot(props) {\n  const { styles, color, Children } = props;\n  const SDotGroup = Root;\n  const SDot = Box;\n  return sstyled(styles)(\n    <SDotGroup render={Box}>\n      <SDot __excludeProps={['data', 'scale']} color={resolveColor(color)} />\n      <Children />\n    </SDotGroup>,\n  );\n}\n\nfunction Footer() {\n  return null;\n}\n\nconst Tooltip = createElement(TooltipRoot, {\n  Trigger: Popper.Trigger,\n  Popper: PopperPopper,\n  Title,\n  Footer,\n  Dot,\n});\n\nexport default Tooltip;\n"],"file":"Tooltip.js"}

package/lib/es6/Venn.js

@@ -26,16 +26,16 @@ var style = (
 /*__reshadow_css_start__*/
 _sstyled.insert(
 /*__inner_css_start__*/
-".___SCircle_c0tdq_gg_{fill:#3ab011;stroke:#fff;stroke-width:2px;fill-opacity:.5;transition-property:cx,cy;transition-duration:var(--duration_1j56sbj);transition-timing-function:ease-in-out}.___SCircle_c0tdq_gg_:hover{fill-opacity:.7}.___SCircle_c0tdq_gg_.__color_c0tdq_gg_{fill:var(--color_1j56sbj)}.___SIntersection_c0tdq_gg_{stroke:#fff;stroke-width:2px;fill-opacity:0}.___SIntersection_c0tdq_gg_:hover{fill-opacity:.1}"
+".___SCircle_8w0ft_gg_{fill:#3ab011;stroke:#fff;stroke-width:2px;fill-opacity:.5;transition-property:cx,cy;transition-duration:var(--duration_1j56sbj);transition-timing-function:ease-in-out}.___SCircle_8w0ft_gg_:hover{fill-opacity:.7}.___SCircle_8w0ft_gg_.__color_8w0ft_gg_{fill:var(--color_1j56sbj)}.___SIntersection_8w0ft_gg_{stroke:#fff;stroke-width:2px;fill-opacity:0}.___SIntersection_8w0ft_gg_:hover{fill-opacity:.1}"
 /*__inner_css_end__*/
 , "1j56sbj_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SCircle": "___SCircle_c0tdq_gg_",
+  "__SCircle": "___SCircle_8w0ft_gg_",
   "--duration": "--duration_1j56sbj",
-  "_color": "__color_c0tdq_gg_",
+  "_color": "__color_8w0ft_gg_",
   "--color": "--color_1j56sbj",
-  "__SIntersection": "___SIntersection_c0tdq_gg_"
+  "__SIntersection": "___SIntersection_8w0ft_gg_"
 });
 
 var VennRoot = /*#__PURE__*/function (_Component) {

package/lib/es6/index.js

@@ -7,6 +7,8 @@ export { default as GroupBar } from './GroupBar';
 export { default as StackBar } from './StackBar';
 export { default as Area } from './Area';
 export { default as StackedArea } from './StackedArea';
+export { default as ScatterPlot } from './ScatterPlot';
+export { default as Bubble } from './Bubble';
 export { default as Donut } from './Donut';
 export { default as Venn } from './Venn';
 export { default as Tooltip } from './Tooltip';

package/lib/es6/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.js"],"names":["default","Plot","XAxis","YAxis","Line","Bar","HorizontalBar","GroupBar","StackBar","Area","StackedArea","Donut","Venn","Tooltip","ResponsiveContainer","HoverLine","HoverRect","minMax","colors"],"mappings":"AAAA,SAASA,OAAO,IAAIC,IAApB,QAAgC,QAAhC;AAEA,SAASC,KAAT,EAAgBC,KAAhB,QAA6B,QAA7B;AAEA,SAASH,OAAO,IAAII,IAApB,QAAgC,QAAhC;AAEA,SAASJ,OAAO,IAAIK,GAApB,QAA+B,OAA/B;AACA,SAASL,OAAO,IAAIM,aAApB,QAAyC,iBAAzC;AACA,SAASN,OAAO,IAAIO,QAApB,QAAoC,YAApC;AACA,SAASP,OAAO,IAAIQ,QAApB,QAAoC,YAApC;AACA,SAASR,OAAO,IAAIS,IAApB,QAAgC,QAAhC;AACA,SAAST,OAAO,IAAIU,WAApB,QAAuC,eAAvC;AACA,SAASV,OAAO,IAAIW,KAApB,QAAiC,SAAjC;AACA,SAASX,OAAO,IAAIY,IAApB,QAAgC,QAAhC;AAEA,SAASZ,OAAO,IAAIa,OAApB,QAAmC,WAAnC;AAEA,SAASb,OAAO,IAAIc,mBAApB,QAA+C,uBAA/C;AAEA,SAASC,SAAT,EAAoBC,SAApB,QAAqC,SAArC;AAEA,SAASC,MAAT,QAAuB,SAAvB;AACA,SAASC,MAAT,QAAuB,SAAvB","sourcesContent":["export { default as Plot } from './Plot';\n\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 Donut } from './Donut';\nexport { default as Venn } from './Venn';\n\nexport { default as Tooltip } from './Tooltip';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\n\nexport { HoverLine, HoverRect } from './Hover';\n\nexport { minMax } from './utils';\nexport { colors } from './color';\n"],"file":"index.js"}
+{"version":3,"sources":["../../src/index.js"],"names":["default","Plot","XAxis","YAxis","Line","Bar","HorizontalBar","GroupBar","StackBar","Area","StackedArea","ScatterPlot","Bubble","Donut","Venn","Tooltip","ResponsiveContainer","HoverLine","HoverRect","minMax","colors"],"mappings":"AAAA,SAASA,OAAO,IAAIC,IAApB,QAAgC,QAAhC;AAEA,SAASC,KAAT,EAAgBC,KAAhB,QAA6B,QAA7B;AAEA,SAASH,OAAO,IAAII,IAApB,QAAgC,QAAhC;AAEA,SAASJ,OAAO,IAAIK,GAApB,QAA+B,OAA/B;AACA,SAASL,OAAO,IAAIM,aAApB,QAAyC,iBAAzC;AACA,SAASN,OAAO,IAAIO,QAApB,QAAoC,YAApC;AACA,SAASP,OAAO,IAAIQ,QAApB,QAAoC,YAApC;AACA,SAASR,OAAO,IAAIS,IAApB,QAAgC,QAAhC;AACA,SAAST,OAAO,IAAIU,WAApB,QAAuC,eAAvC;AACA,SAASV,OAAO,IAAIW,WAApB,QAAuC,eAAvC;AACA,SAASX,OAAO,IAAIY,MAApB,QAAkC,UAAlC;AACA,SAASZ,OAAO,IAAIa,KAApB,QAAiC,SAAjC;AACA,SAASb,OAAO,IAAIc,IAApB,QAAgC,QAAhC;AAEA,SAASd,OAAO,IAAIe,OAApB,QAAmC,WAAnC;AAEA,SAASf,OAAO,IAAIgB,mBAApB,QAA+C,uBAA/C;AAEA,SAASC,SAAT,EAAoBC,SAApB,QAAqC,SAArC;AAEA,SAASC,MAAT,QAAuB,SAAvB;AACA,SAASC,MAAT,QAAuB,SAAvB","sourcesContent":["export { default as Plot } from './Plot';\n\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 Donut } from './Donut';\nexport { default as Venn } from './Venn';\n\nexport { default as Tooltip } from './Tooltip';\n\nexport { default as ResponsiveContainer } from './ResponsiveContainer';\n\nexport { HoverLine, HoverRect } from './Hover';\n\nexport { minMax } from './utils';\nexport { colors } from './color';\n"],"file":"index.js"}

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

@@ -0,0 +1,45 @@
+@import '@semcore/utils/style/var.css';
+@import '@semcore/d3-chart/src/style/var.css';
+
+SBubble {
+  fill: #2bb3ff;
+  stroke: #fff;
+  stroke-width: 2px;
+  transition-property: cx, cy;
+  transition-duration: var(--duration);
+  transition-timing-function: ease-in-out;
+  opacity: 0.5;
+  &:hover {
+    opacity: 0.8;
+  }
+}
+
+SBubble[color] {
+  fill: var(--color);
+}
+
+SCenter {
+  text-anchor: middle;
+  font-size: 11px;
+  stroke: #2bb3ff;
+}
+
+SCenter[color] {
+  stroke: var(--color);
+}
+
+SLabel {
+  fill: #2bb3ff;
+}
+
+SLabel[position='right'] {
+  text-anchor: end;
+}
+
+SLabel[position='left'] {
+  text-anchor: start;
+}
+
+SLabel[color] {
+  fill: var(--color);
+}

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

@@ -0,0 +1,27 @@
+@import '@semcore/utils/style/var.css';
+@import '@semcore/d3-chart/src/style/var.css';
+
+SScatterPlot {
+  fill: #2bb3ff;
+  transition-property: cx, cy;
+  transition-duration: var(--duration);
+  transition-timing-function: ease-in-out;
+  opacity: 0.5;
+  &:hover {
+    opacity: 0.8;
+  }
+}
+
+SScatterPlot[color] {
+  fill: var(--color);
+}
+
+SValue {
+  text-anchor: middle;
+  font-size: 10px;
+  stroke: #008ff8;
+}
+
+SValue[color] {
+  stroke: var(--color);
+}

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

@@ -2,6 +2,8 @@
 @import '@semcore/d3-chart/src/style/var.css';
 
 STooltip {
+  font-size: var(--fs-100);
+  line-height: var(--lh-100);
   position: relative;
   background-color: #fff;
   border-radius: 3px;
@@ -12,8 +14,6 @@ STooltip {
 }
 
 STitle {
-  font-size: var(--fs-100);
-  line-height: var(--lh-100);
   color: var(--gray60);
   margin-bottom: 8px;
 }

package/lib/types/Bubble.d.ts

@@ -0,0 +1,27 @@
+import { CProps, ReturnEl } from '@semcore/core';
+import IContext from './context';
+
+export interface IBubbleProps extends IContext {
+  /** Field from data for XAxis */
+  x: string;
+  /** Field from data for YAxis */
+  y: string;
+  /** Field from data for circle radius */
+  value: string;
+  /** Field from data for circle label */
+  label?: string;
+  /** Circle color */
+  color?: string;
+  /** Cross in the center of the bubble
+   * @default true
+   */
+  markedCross?: boolean;
+  /** Animation duration in ms
+   * @default 500
+   */
+  duration?: number;
+}
+
+declare const Bubble: <T>(props: CProps<IBubbleProps & T>) => ReturnEl;
+
+export default Bubble;

package/lib/types/ScatterPlot.d.ts

@@ -0,0 +1,27 @@
+import { CProps, ReturnEl } from '@semcore/core';
+import IContext from './context';
+
+export interface IScatterPlotProps extends IContext {
+  /** Field from data for XAxis */
+  x: string;
+  /** Field from data for YAxis */
+  y: string;
+  /** Field from data for circle value */
+  value?: string;
+  /** Circle color */
+  color?: string;
+  /** Circle value color */
+  valueColor?: string;
+  /** Animation duration in ms
+   * @default 500
+   */
+  duration?: number;
+  /** Radius of circles
+   * @default 5.5 or 12 with value
+   */
+  r?: number;
+}
+
+declare const ScatterPlot: <T>(props: CProps<IScatterPlotProps & T>) => ReturnEl;
+
+export default ScatterPlot;

package/lib/types/index.d.ts

@@ -39,3 +39,9 @@ export * from './Donut';
 
 export { default as Tooltip } from './Tooltip';
 export * from './Tooltip';
+
+export { default as ScatterPlot } from './ScatterPlot';
+export * from './ScatterPlot';
+
+export { default as Bubble } from './Bubble';
+export * from './Bubble';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/d3-chart",
   "description": "SEMRush D3 Chart Component",
-  "version": "1.5.6",
+  "version": "1.6.3",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",

package/src/Bubble.js

@@ -0,0 +1,189 @@
+import React from 'react';
+import { Component, sstyled } from '@semcore/core';
+import canUseDOM from '@semcore/utils/lib/canUseDOM';
+import { CONSTANT } from './utils';
+import createElement from './createElement';
+import uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';
+import { transition } from 'd3-transition';
+import style from './style/bubble.shadow.css';
+import ClipPath from './ClipPath';
+import { scaleSqrt } from 'd3-scale';
+
+const memoize = (func) => {
+  const results = {};
+  return (argsKey) => {
+    if (!results[argsKey]) {
+      results[argsKey] = func(argsKey);
+    }
+    return results[argsKey];
+  };
+};
+
+const measureText = memoize((text) => {
+  let span = document.createElement('span');
+  span.append(document.createTextNode(text));
+  span.style.display = 'inline-block';
+  document.body.append(span);
+  const textLength = span.offsetWidth;
+  span.remove();
+  return textLength;
+});
+
+class BubbleRoot extends Component {
+  static displayName = 'Bubble';
+  static style = style;
+  static enhance = [uniqueIDEnhancement()];
+
+  static defaultProps = {
+    offset: [0, 0],
+    duration: 500,
+    markedCross: true,
+  };
+
+  virtualElement = canUseDOM() ? document.createElement('div') : {};
+
+  generateGetBoundingClientRect(x = 0, y = 0) {
+    return () => ({ width: 0, height: 0, top: y, right: x, bottom: y, left: x });
+  }
+
+  bindHandlerTooltip = (visible, props) => ({ clientX: x, clientY: y }) => {
+    const { eventEmitter } = this.asProps;
+    this.virtualElement.getBoundingClientRect = this.generateGetBoundingClientRect(x, y);
+    this.virtualElement[CONSTANT.VIRTUAL_ELEMENT] = true;
+    eventEmitter.emit('onTooltipVisible', visible, props, this.virtualElement);
+  };
+
+  animationCircle() {
+    const { duration, uid, data, value } = this.asProps;
+    const z = scaleSqrt()
+      .domain([0, Math.max(...data.map((el) => el[value]))])
+      .range([5.5, 50.5]);
+
+    const selectRect = transition()
+      .selection()
+      .selectAll(`[id^=${uid}${uid}]`)
+      .attr('r', 0);
+
+    const selectRectNode = selectRect.node();
+    if (duration > 0 && selectRectNode) {
+      selectRect
+        .transition()
+        .duration(duration)
+        .attr('r', function(_, ind) {
+          return z(data[ind][value]);
+        });
+    }
+  }
+
+  componentDidUpdate() {
+    this.animationCircle();
+  }
+
+  componentDidMount() {
+    this.animationCircle();
+  }
+
+  renderCircle(d, i) {
+    const {
+      color,
+      scale,
+      x,
+      y,
+      offset,
+      styles,
+      uid,
+      duration,
+      value,
+      label,
+      markedCross,
+      size,
+      data,
+    } = this.asProps;
+    const [xScale, yScale] = scale;
+
+    const SBubble = this.Element;
+    const SCenter = 'text';
+    const SLabel = 'text';
+    const z = scaleSqrt()
+      .domain([0, Math.max(...data.map((el) => el[value]))])
+      .range([5.5, 50.5]);
+
+    const margin = Math.min(xScale.range()[0], xScale.range()[1]);
+
+    const labelPosition =
+      size[0] - 2 * margin - (xScale(d[x]) + offset[0] + z(d[value])) < measureText(d[label])
+        ? 'right'
+        : 'left';
+    const labelDistance = {
+      right: xScale(d[x]) + offset[0] - z(d[value]),
+      left: xScale(d[x]) + offset[0] + z(d[value]),
+    }[labelPosition];
+
+    return sstyled(styles)(
+      <g
+        key={`circle(#${i})`}
+        onMouseMove={this.bindHandlerTooltip(true, { ...this.props, xIndex: i })}
+        onMouseLeave={this.bindHandlerTooltip(false, { ...this.props, xIndex: i })}
+      >
+        {markedCross && (
+          <SCenter
+            x={xScale(d[x]) + offset[0]}
+            y={yScale(d[y]) + offset[1]}
+            dy=".3em"
+            clipPath={`url(#${uid})`}
+            color={d[color] ?? color}
+          >
+            &#43;
+          </SCenter>
+        )}
+        <SBubble
+          id={`${uid}${uid}`}
+          render="circle"
+          clipPath={`url(#${uid})`}
+          cx={xScale(d[x]) + offset[0]}
+          cy={yScale(d[y]) + offset[1]}
+          color={d[color]}
+          r={z(d[value])}
+          use:duration={`${duration}ms`}
+        />
+        {d[label] && (
+          <SLabel
+            x={labelDistance}
+            y={yScale(d[y]) + offset[1]}
+            dy=".3em"
+            clipPath={`url(#${uid})`}
+            position={labelPosition}
+            color={d[color]}
+          >
+            {d[label]}
+          </SLabel>
+        )}
+      </g>,
+    );
+  }
+
+  render() {
+    const { data, uid, size, scale } = this.asProps;
+    const [xScale, yScale] = scale;
+    const marginX = Math.min(xScale.range()[0], xScale.range()[1]);
+    const marginY = Math.min(yScale.range()[0], yScale.range()[1]);
+
+    return (
+      <>
+        {data.map(this.renderCircle.bind(this))}
+        {data.map(this.animationCircle.bind(this))}
+        <ClipPath
+          id={uid}
+          x={marginX}
+          y={marginY}
+          width={`${size[0] - 2 * marginX}px`}
+          height={`${size[1] - 2 * marginY}px`}
+        />
+      </>
+    );
+  }
+}
+
+const Bubble = createElement(BubbleRoot);
+
+export default Bubble;