@semcore/skeleton 5.0.0-beta.0 → 5.0.0

package/CHANGELOG.md

@@ -4,10 +4,18 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 
 ## [5.0.0] - 2023-07-15
 
-### Break
+### BREAK
 
+- Changed all skeleton for chart from svg to HTMLDivElement with styled background.  
+- Renamed `PieChartSkeleton` to `DonutChartSkeleton`.  
 - Strict, backward incompatible typings.
 
+## [4.4.34] - 2023-06-30
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/utils` [3.53.4 ~> 3.54.0], `@semcore/flex-box` [4.7.31 ~> 4.7.32]).
+
 ## [4.4.33] - 2023-06-27
 
 ### Changed

package/lib/cjs/Charts/Area.js

@@ -1,50 +1,44 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
 var _react = _interopRequireDefault(require("react"));
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
+var _Skeleton = require("../Skeleton");
+/*__reshadow-styles__:"../style/chart.shadow.css"*/
+var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SChartSkeleton_9shre_gg_{height:200px;width:100%;background-image:var(--bgPattern_9shre)}.___SChartSkeleton_9shre_gg_.__bgPosition_9shre_gg_{background-position:var(--bgPosition_9shre)}.___SChartSkeleton_9shre_gg_.__bgSize_9shre_gg_{background-size:var(--bgSize_9shre)}.___SChartSkeleton_9shre_gg_.__bgRepeat_9shre_gg_{background-repeat:var(--bgRepeat_9shre)}" /*__inner_css_end__*/, "9shre_gg_") /*__reshadow_css_end__*/, {
+  "__SChartSkeleton": "___SChartSkeleton_9shre_gg_",
+  "--bgPattern": "--bgPattern_9shre",
+  "_bgPosition": "__bgPosition_9shre_gg_",
+  "--bgPosition": "--bgPosition_9shre",
+  "_bgSize": "__bgSize_9shre_gg_",
+  "--bgSize": "--bgSize_9shre",
+  "_bgRepeat": "__bgRepeat_9shre_gg_",
+  "--bgRepeat": "--bgRepeat_9shre"
+});
+var areaLinearSvg = "PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9Ijg4IiB2aWV3Qm94PSIwIDAgMTI4IDg4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNjMuOTk5OCA0NS45Mzk0QzMyLjAwMDEgNDUuOTM5NCAzMi4wMDAxIDEyIDAgMTJWNzZIMTI4VjEyQzk1Ljk5OTkgMTIgOTUuOTk5OSA0NS45Mzk0IDYzLjk5OTggNDUuOTM5NFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+Cjwvc3ZnPgo=";
+var areaMonotoneSvg = "PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9Ijg4IiB2aWV3Qm94PSIwIDAgMTI4IDg4IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNjMuOTk5OCA0NS45Mzk0TDAgMTJWNzZIMTI4VjEyTDYzLjk5OTggNDUuOTM5NFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+Cjwvc3ZnPgo=";
 var AreaChartSkeleton = function AreaChartSkeleton(props) {
-  var _props$type = props.type,
-    type = _props$type === void 0 ? 'linear' : _props$type;
-  var getDraw = function getDraw(type) {
-    switch (type) {
-      case 'monotone':
-        return ['M2 2c75.665 0 75.665 80 151.329 80 75.665 0 75.665-80 151.33-80 75.667 0 75.667 80 151.333 80S531.658 2' + ' 607.323 2c75.669 0 75.669 80 151.339 80C834.331 82 834.331 2 910 2v164H2V2z', 'M2 2c75.665 0 75.665 80 151.329 80 75.665 0 75.665-80 151.33-80 75.667 0 75.667 80 151.333 80S531.658 2 607.323 2c75.669 0 75.669 80 151.339 80C834.331 82 834.331 2 910 2'];
-      default:
-        return ['M2 2l151.329 80 151.33-80 151.333 80L607.323 2l151.339 80L910 2v164H2z', 'M2 2l151.329 80 151.33-80 151.333 80L607.323 2l151.339 80L910 2'];
-    }
-  };
-  var _getDraw = getDraw(type),
-    _getDraw2 = (0, _slicedToArray2["default"])(_getDraw, 2),
-    drawLine = _getDraw2[0],
-    drawFill = _getDraw2[1];
-  return /*#__PURE__*/_react["default"].createElement(_Skeleton["default"], (0, _extends2["default"])({
-    viewBox: "0 0 908 166",
-    preserveAspectRatio: "xMidYMid meet"
-  }, props), function (_ref) {
-    var gradientUrl = _ref.gradientUrl;
-    return /*#__PURE__*/_react["default"].createElement("g", {
-      fill: "none",
-      fillRule: "nonzero"
-    }, /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillOpacity: ".4",
-      d: drawLine
-    }), /*#__PURE__*/_react["default"].createElement("path", {
-      stroke: gradientUrl,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: "4",
-      d: drawFill
-    }));
-  });
+  var _ref = arguments[0],
+    _ref2,
+    _props$type;
+  var SChartSkeleton = _Skeleton.Skeleton;
+  var patternBase64 = {
+    linear: areaLinearSvg,
+    monotone: areaMonotoneSvg
+  }[(_props$type = props.type) !== null && _props$type !== void 0 ? _props$type : 'linear'];
+  return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SChartSkeleton, _ref2.cn("SChartSkeleton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "bgRepeat": 'repeat-x',
+    "bgPosition": 'left bottom',
+    "bgSize": 'auto 50%',
+    "bgPattern": "url(data:image/svg+xml;base64,".concat(patternBase64, ")")
+  }, _ref))));
 };
-var _default = AreaChartSkeleton;
+var _default = (0, _core["default"])(AreaChartSkeleton);
 exports["default"] = _default;
 //# sourceMappingURL=Area.js.map

package/lib/cjs/Charts/Area.js.map

@@ -1 +1 @@
-{"version":3,"file":"Area.js","names":["_react","_interopRequireDefault","require","_Skeleton","AreaChartSkeleton","props","_props$type","type","getDraw","_getDraw","_getDraw2","_slicedToArray2","drawLine","drawFill","createElement","_extends2","viewBox","preserveAspectRatio","_ref","gradientUrl","fill","fillRule","fillOpacity","d","stroke","strokeLinecap","strokeLinejoin","strokeWidth","_default","exports"],"sources":["../../../src/Charts/Area.jsx"],"sourcesContent":["import React from 'react';\nimport Skeleton from '../Skeleton';\n\nconst AreaChartSkeleton = (props) => {\n  const { type = 'linear' } = props;\n  const getDraw = (type) => {\n    switch (type) {\n      case 'monotone':\n        return [\n          'M2 2c75.665 0 75.665 80 151.329 80 75.665 0 75.665-80 151.33-80 75.667 0 75.667 80 151.333 80S531.658 2' +\n            ' 607.323 2c75.669 0 75.669 80 151.339 80C834.331 82 834.331 2 910 2v164H2V2z',\n          'M2 2c75.665 0 75.665 80 151.329 80 75.665 0 75.665-80 151.33-80 75.667 0 75.667 80 151.333 80S531.658 2 607.323 2c75.669 0 75.669 80 151.339 80C834.331 82 834.331 2 910 2',\n        ];\n      default:\n        return [\n          'M2 2l151.329 80 151.33-80 151.333 80L607.323 2l151.339 80L910 2v164H2z',\n          'M2 2l151.329 80 151.33-80 151.333 80L607.323 2l151.339 80L910 2',\n        ];\n    }\n  };\n\n  const [drawLine, drawFill] = getDraw(type);\n  return (\n    <Skeleton viewBox='0 0 908 166' preserveAspectRatio='xMidYMid meet' {...props}>\n      {({ gradientUrl }) => (\n        <g fill='none' fillRule='nonzero'>\n          <path fill={gradientUrl} fillOpacity='.4' d={drawLine} />\n          <path\n            stroke={gradientUrl}\n            strokeLinecap='round'\n            strokeLinejoin='round'\n            strokeWidth='4'\n            d={drawFill}\n          />\n        </g>\n      )}\n    </Skeleton>\n  );\n};\n\nexport default AreaChartSkeleton;\n"],"mappings":";;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAME,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,KAAK,EAAK;EACnC,IAAAC,WAAA,GAA4BD,KAAK,CAAzBE,IAAI;IAAJA,IAAI,GAAAD,WAAA,cAAG,QAAQ,GAAAA,WAAA;EACvB,IAAME,OAAO,GAAG,SAAVA,OAAOA,CAAID,IAAI,EAAK;IACxB,QAAQA,IAAI;MACV,KAAK,UAAU;QACb,OAAO,CACL,yGAAyG,GACvG,8EAA8E,EAChF,4KAA4K,CAC7K;MACH;QACE,OAAO,CACL,wEAAwE,EACxE,iEAAiE,CAClE;IAAC;EAER,CAAC;EAED,IAAAE,QAAA,GAA6BD,OAAO,CAACD,IAAI,CAAC;IAAAG,SAAA,OAAAC,eAAA,aAAAF,QAAA;IAAnCG,QAAQ,GAAAF,SAAA;IAAEG,QAAQ,GAAAH,SAAA;EACzB,oBACEV,MAAA,YAAAc,aAAA,CAACX,SAAA,WAAQ,MAAAY,SAAA;IAACC,OAAO,EAAC,aAAa;IAACC,mBAAmB,EAAC;EAAe,GAAKZ,KAAK,GAC1E,UAAAa,IAAA;IAAA,IAAGC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IAAA,oBACbnB,MAAA,YAAAc,aAAA;MAAGM,IAAI,EAAC,MAAM;MAACC,QAAQ,EAAC;IAAS,gBAC/BrB,MAAA,YAAAc,aAAA;MAAMM,IAAI,EAAED,WAAY;MAACG,WAAW,EAAC,IAAI;MAACC,CAAC,EAAEX;IAAS,EAAG,eACzDZ,MAAA,YAAAc,aAAA;MACEU,MAAM,EAAEL,WAAY;MACpBM,aAAa,EAAC,OAAO;MACrBC,cAAc,EAAC,OAAO;MACtBC,WAAW,EAAC,GAAG;MACfJ,CAAC,EAAEV;IAAS,EACZ,CACA;EAAA,CACL,CACQ;AAEf,CAAC;AAAC,IAAAe,QAAA,GAEaxB,iBAAiB;AAAAyB,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"Area.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","areaLinearSvg","areaMonotoneSvg","AreaChartSkeleton","props","_ref","arguments[0]","_ref2","_props$type","SChartSkeleton","Skeleton","patternBase64","linear","monotone","type","createElement","cn","_objectSpread2","assignProps","concat","_default","createComponent","exports"],"sources":["../../../src/Charts/Area.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Root, sstyled } from '@semcore/core';\nimport { Skeleton } from '../Skeleton';\nimport styles from '../style/chart.shadow.css';\n\nconst areaLinearSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/area-chart-linear.svg'))\n`;\nconst areaMonotoneSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/area-chart-monotone.svg'))\n`;\n\nconst AreaChartSkeleton = (props) => {\n  const SChartSkeleton = Root;\n  const patternBase64 = { linear: areaLinearSvg, monotone: areaMonotoneSvg }[\n    props.type ?? 'linear'\n  ];\n  return sstyled(styles)(\n    <SChartSkeleton\n      render={Skeleton}\n      bgRepeat='repeat-x'\n      bgPosition='left bottom'\n      bgSize='auto 50%'\n      bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n    />,\n  );\n};\n\nexport default createComponent(AreaChartSkeleton);\n"],"mappings":";;;;;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AADA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAAuC;AAAA,IAAAI,MAAA,+BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAGvC,IAAMC,aAAa,yVAElB;AACD,IAAMC,eAAe,iRAEpB;AAED,IAAMC,iBAAiB,GAAG,SAApBA,iBAAiBA,CAAIC,KAAK,EAAK;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;IAAAC,WAAA;EACnC,IAAMC,cAAc,GAMRC,kBAAQ;EALpB,IAAMC,aAAa,GAAG;IAAEC,MAAM,EAAEX,aAAa;IAAEY,QAAQ,EAAEX;EAAgB,CAAC,EAAAM,WAAA,GACxEJ,KAAK,CAACU,IAAI,cAAAN,WAAA,cAAAA,WAAA,GAAI,QAAQ,CACvB;EACD,OAAAD,KAAA,GAAO,IAAAR,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,YAAAoB,aAAA,CAACN,cAAc,EAAAF,KAAA,CAAAS,EAAA,uBAAAC,cAAA,qBAAAzB,KAAA,CAAA0B,WAAA;IAAA,YAEJ,UAAU;IAAA,cACR,aAAa;IAAA,UACjB,UAAU;IAAA,8CAAAC,MAAA,CAC2BR,aAAa;EAAA,GAAAN,IAAA,IACzD;AAEN,CAAC;AAAC,IAAAe,QAAA,GAEa,IAAAC,gBAAe,EAAClB,iBAAiB,CAAC;AAAAmB,OAAA,cAAAF,QAAA"}

package/lib/cjs/Charts/Bar.js

@@ -1,60 +1,54 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
 var _react = _interopRequireDefault(require("react"));
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
+var _Skeleton = require("../Skeleton");
+/*__reshadow-styles__:"../style/chart.shadow.css"*/
+var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SChartSkeleton_9shre_gg_{height:200px;width:100%;background-image:var(--bgPattern_9shre)}.___SChartSkeleton_9shre_gg_.__bgPosition_9shre_gg_{background-position:var(--bgPosition_9shre)}.___SChartSkeleton_9shre_gg_.__bgSize_9shre_gg_{background-size:var(--bgSize_9shre)}.___SChartSkeleton_9shre_gg_.__bgRepeat_9shre_gg_{background-repeat:var(--bgRepeat_9shre)}" /*__inner_css_end__*/, "9shre_gg_") /*__reshadow_css_end__*/, {
+  "__SChartSkeleton": "___SChartSkeleton_9shre_gg_",
+  "--bgPattern": "--bgPattern_9shre",
+  "_bgPosition": "__bgPosition_9shre_gg_",
+  "--bgPosition": "--bgPosition_9shre",
+  "_bgSize": "__bgSize_9shre_gg_",
+  "--bgSize": "--bgSize_9shre",
+  "_bgRepeat": "__bgRepeat_9shre_gg_",
+  "--bgRepeat": "--bgRepeat_9shre"
+});
+var barVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0wIDBIMTIwQzEyMi4yMDkgMCAxMjQgMS43OTA4NiAxMjQgNFYxMkMxMjQgMTQuMjA5MSAxMjIuMjA5IDE2IDEyMCAxNkgwVjBaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMCAyOEgxNTZDMTU4LjIwOSAyOCAxNjAgMjkuNzkwOSAxNjAgMzJWNDBDMTYwIDQyLjIwOTEgMTU4LjIwOSA0NCAxNTYgNDRIMFYyOFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0wIDU2SDEzOEMxNDAuMjA5IDU2IDE0MiA1Ny43OTA5IDE0MiA2MFY2OEMxNDIgNzAuMjA5MSAxNDAuMjA5IDcyIDEzOCA3MkgwVjU2WiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPHBhdGggZD0iTTAgODRIMTU2QzE1OC4yMDkgODQgMTYwIDg1Ljc5MDkgMTYwIDg4Vjk2QzE2MCA5OC4yMDkxIDE1OC4yMDkgMTAwIDE1NiAxMDBIMFY4NFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0wIDExMkgxMTZDMTE4LjIwOSAxMTIgMTIwIDExMy43OTEgMTIwIDExNlYxMjRDMTIwIDEyNi4yMDkgMTE4LjIwOSAxMjggMTE2IDEyOEgwVjExMloiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+Cjwvc3ZnPgo=";
+var barHorizontalSvg = "PHN2ZyB3aWR0aD0iMTU2IiBoZWlnaHQ9IjE2MCIgdmlld0JveD0iMCAwIDE1NiAxNjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMiAxNkMxMiAxMy43OTA5IDEzLjc5MDkgMTIgMTYgMTJIMjNDMjUuMjA5MSAxMiAyNyAxMy43OTA5IDI3IDE2VjE0OEgxMlYxNloiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik01MSA0MkM1MSAzOS43OTA5IDUyLjc5MDkgMzggNTUgMzhINjJDNjQuMjA5MSAzOCA2NiAzOS43OTA5IDY2IDQyVjE0OEg1MVY0MloiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik05MCA2M0M5MCA2MC43OTA5IDkxLjc5MDkgNTkgOTQgNTlIMTAxQzEwMy4yMDkgNTkgMTA1IDYwLjc5MDkgMTA1IDYzVjE0OEg5MFY2M1oiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0xMjkgMzBDMTI5IDI3Ljc5MDkgMTMwLjc5MSAyNiAxMzMgMjZIMTQwQzE0Mi4yMDkgMjYgMTQ0IDI3Ljc5MDkgMTQ0IDMwVjE0OEgxMjlWMzBaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8L3N2Zz4K";
 var BarChartSkeleton = function BarChartSkeleton(props) {
-  var _props$layout = props.layout,
-    layout = _props$layout === void 0 ? 'horizontal' : _props$layout;
-  return /*#__PURE__*/_react["default"].createElement(_Skeleton["default"], (0, _extends2["default"])({
-    viewBox: "0 0 912 166",
-    preserveAspectRatio: "xMidYMid meet"
-  }, props), function (_ref) {
-    var gradientUrl = _ref.gradientUrl;
-    if (layout === 'vertical') {
-      return /*#__PURE__*/_react["default"].createElement("g", {
-        fill: gradientUrl
-      }, /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "252",
-        height: "15",
-        y: "124",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "360",
-        height: "15",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "306",
-        height: "15",
-        y: "93",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "252",
-        height: "15",
-        y: "31",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "144",
-        height: "15",
-        y: "62",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("path", {
-        fillRule: "nonzero",
-        d: "M18 62h112.5c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0-31h216c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0 62h270c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0-93h324c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4V4c0-2.21 8.059-4 18-4zm0 124h216c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4z"
-      }));
-    }
-    return /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M4 0h7a4 4 0 0 1 4 4v76H0V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28H78V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM43 16h7a4 4 0 0 1 4 4v60H39V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm39-16h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM277 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zM706 0h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM745 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zM472 0h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM511 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4z"
-    });
-  });
+  var _ref = arguments[0],
+    _ref2,
+    _props$layout;
+  var SChartSkeleton = _Skeleton.Skeleton;
+  var layout = (_props$layout = props.layout) !== null && _props$layout !== void 0 ? _props$layout : 'horizontal';
+  var patternBase64 = {
+    vertical: barVerticalSvg,
+    horizontal: barHorizontalSvg
+  }[layout];
+  return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SChartSkeleton, _ref2.cn("SChartSkeleton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "bgRepeat": {
+      vertical: 'repeat-y',
+      horizontal: 'repeat-x'
+    }[layout],
+    "bgPosition": {
+      vertical: 'left top',
+      horizontal: 'left bottom'
+    }[layout],
+    "bgSize": {
+      vertical: 'contain',
+      horizontal: 'auto 50%'
+    }[layout],
+    "bgPattern": "url(data:image/svg+xml;base64,".concat(patternBase64, ")")
+  }, _ref))));
 };
-var _default = BarChartSkeleton;
+var _default = (0, _core["default"])(BarChartSkeleton);
 exports["default"] = _default;
 //# sourceMappingURL=Bar.js.map

package/lib/cjs/Charts/Bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bar.js","names":["_react","_interopRequireDefault","require","_Skeleton","BarChartSkeleton","props","_props$layout","layout","createElement","_extends2","viewBox","preserveAspectRatio","_ref","gradientUrl","fill","width","height","y","rx","fillRule","d","_default","exports"],"sources":["../../../src/Charts/Bar.jsx"],"sourcesContent":["import React from 'react';\nimport Skeleton from '../Skeleton';\n\nconst BarChartSkeleton = (props) => {\n  const { layout = 'horizontal' } = props;\n\n  return (\n    <Skeleton viewBox='0 0 912 166' preserveAspectRatio='xMidYMid meet' {...props}>\n      {({ gradientUrl }) => {\n        if (layout === 'vertical') {\n          return (\n            <g fill={gradientUrl}>\n              <rect width='252' height='15' y='124' rx='4' />\n              <rect width='360' height='15' rx='4' />\n              <rect width='306' height='15' y='93' rx='4' />\n              <rect width='252' height='15' y='31' rx='4' />\n              <rect width='144' height='15' y='62' rx='4' />\n              <path\n                fillRule='nonzero'\n                d='M18 62h112.5c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0-31h216c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0 62h270c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4zm0-93h324c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4V4c0-2.21 8.059-4 18-4zm0 124h216c9.941 0 18 1.79 18 4v7c0 2.21-8.059 4-18 4H18c-9.941 0-18-1.79-18-4v-7c0-2.21 8.059-4 18-4z'\n              />\n            </g>\n          );\n        }\n\n        return (\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M4 0h7a4 4 0 0 1 4 4v76H0V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28H78V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM43 16h7a4 4 0 0 1 4 4v60H39V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm39-16h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM277 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zM706 0h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM745 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zM472 0h7a4 4 0 0 1 4 4v76h-15V4a4 4 0 0 1 4-4zm78 48h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zm39 0h7a4 4 0 0 1 4 4v28h-15V52a4 4 0 0 1 4-4zM511 16h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4zm156 0h7a4 4 0 0 1 4 4v60h-15V20a4 4 0 0 1 4-4z'\n          />\n        );\n      }}\n    </Skeleton>\n  );\n};\n\nexport default BarChartSkeleton;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAME,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,KAAK,EAAK;EAClC,IAAAC,aAAA,GAAkCD,KAAK,CAA/BE,MAAM;IAANA,MAAM,GAAAD,aAAA,cAAG,YAAY,GAAAA,aAAA;EAE7B,oBACEN,MAAA,YAAAQ,aAAA,CAACL,SAAA,WAAQ,MAAAM,SAAA;IAACC,OAAO,EAAC,aAAa;IAACC,mBAAmB,EAAC;EAAe,GAAKN,KAAK,GAC1E,UAAAO,IAAA,EAAqB;IAAA,IAAlBC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IACb,IAAIN,MAAM,KAAK,UAAU,EAAE;MACzB,oBACEP,MAAA,YAAAQ,aAAA;QAAGM,IAAI,EAAED;MAAY,gBACnBb,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,KAAK;QAACC,EAAE,EAAC;MAAG,EAAG,eAC/ClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACE,EAAE,EAAC;MAAG,EAAG,eACvClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,IAAI;QAACC,EAAE,EAAC;MAAG,EAAG,eAC9ClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,IAAI;QAACC,EAAE,EAAC;MAAG,EAAG,eAC9ClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,IAAI;QAACC,EAAE,EAAC;MAAG,EAAG,eAC9ClB,MAAA,YAAAQ,aAAA;QACEW,QAAQ,EAAC,SAAS;QAClBC,CAAC,EAAC;MAA8f,EAChgB,CACA;IAER;IAEA,oBACEpB,MAAA,YAAAQ,aAAA;MACEM,IAAI,EAAED,WAAY;MAClBM,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAA2lC,EAC7lC;EAEN,CAAC,CACQ;AAEf,CAAC;AAAC,IAAAC,QAAA,GAEajB,gBAAgB;AAAAkB,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"Bar.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","barVerticalSvg","barHorizontalSvg","BarChartSkeleton","props","_ref","arguments[0]","_ref2","_props$layout","SChartSkeleton","Skeleton","layout","patternBase64","vertical","horizontal","createElement","cn","_objectSpread2","assignProps","concat","_default","createComponent","exports"],"sources":["../../../src/Charts/Bar.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Root, sstyled } from '@semcore/core';\nimport { Skeleton } from '../Skeleton';\nimport styles from '../style/chart.shadow.css';\n\nconst barVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/bar-chart-vertical.svg'))\n`;\nconst barHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/bar-chart-horizontal.svg'))\n`;\n\nconst BarChartSkeleton = (props) => {\n  const SChartSkeleton = Root;\n  const layout = props.layout ?? 'horizontal';\n  const patternBase64 = { vertical: barVerticalSvg, horizontal: barHorizontalSvg }[layout];\n  return sstyled(styles)(\n    <SChartSkeleton\n      render={Skeleton}\n      bgRepeat={{ vertical: 'repeat-y', horizontal: 'repeat-x' }[layout]}\n      bgPosition={{ vertical: 'left top', horizontal: 'left bottom' }[layout]}\n      bgSize={{ vertical: 'contain', horizontal: 'auto 50%' }[layout]}\n      bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n    />,\n  );\n};\n\nexport default createComponent(BarChartSkeleton);\n"],"mappings":";;;;;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AADA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAAuC;AAAA,IAAAI,MAAA,+BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAGvC,IAAMC,cAAc,69BAEnB;AACD,IAAMC,gBAAgB,izBAErB;AAED,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAIC,KAAK,EAAK;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;IAAAC,aAAA;EAClC,IAAMC,cAAc,GAKRC,kBAAQ;EAJpB,IAAMC,MAAM,IAAAH,aAAA,GAAGJ,KAAK,CAACO,MAAM,cAAAH,aAAA,cAAAA,aAAA,GAAI,YAAY;EAC3C,IAAMI,aAAa,GAAG;IAAEC,QAAQ,EAAEZ,cAAc;IAAEa,UAAU,EAAEZ;EAAiB,CAAC,CAACS,MAAM,CAAC;EACxF,OAAAJ,KAAA,GAAO,IAAAR,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,YAAAoB,aAAA,CAACN,cAAc,EAAAF,KAAA,CAAAS,EAAA,uBAAAC,cAAA,qBAAAzB,KAAA,CAAA0B,WAAA;IAAA,YAEH;MAAEL,QAAQ,EAAE,UAAU;MAAEC,UAAU,EAAE;IAAW,CAAC,CAACH,MAAM,CAAC;IAAA,cACtD;MAAEE,QAAQ,EAAE,UAAU;MAAEC,UAAU,EAAE;IAAc,CAAC,CAACH,MAAM,CAAC;IAAA,UAC/D;MAAEE,QAAQ,EAAE,SAAS;MAAEC,UAAU,EAAE;IAAW,CAAC,CAACH,MAAM,CAAC;IAAA,8CAAAQ,MAAA,CACnBP,aAAa;EAAA,GAAAP,IAAA,IACzD;AAEN,CAAC;AAAC,IAAAe,QAAA,GAEa,IAAAC,gBAAe,EAAClB,gBAAgB,CAAC;AAAAmB,OAAA,cAAAF,QAAA"}

package/lib/cjs/Charts/Bubble.js

@@ -1,43 +1,38 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
 var _react = _interopRequireDefault(require("react"));
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
-var BubbleChartSkeleton = function BubbleChartSkeleton(props) {
-  return /*#__PURE__*/_react["default"].createElement(_Skeleton["default"], (0, _extends2["default"])({
-    visible: true,
-    viewBox: "0 0 460 180",
-    preserveAspectRatio: "xMidYMid meet"
-  }, props), function (_ref) {
-    var gradientUrl = _ref.gradientUrl;
-    return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("g", null, /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M82 172C104.091 172 122 154.091 122 132C122 109.909 104.091 92 82 92C59.9086 92 42 109.909 42 132C42 154.091 59.9086 172 82 172Z"
-    }), /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M114 56C127.255 56 138 45.2548 138 32C138 18.7452 127.255 8 114 8C100.745 8 90 18.7452 90 32C90 45.2548 100.745 56 114 56Z"
-    }), /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M358.5 95C371.479 95 382 84.4787 382 71.5C382 58.5213 371.479 48 358.5 48C345.521 48 335 58.5213 335 71.5C335 84.4787 345.521 95 358.5 95Z"
-    }), /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M402 138C410.837 138 418 130.837 418 122C418 113.163 410.837 106 402 106C393.163 106 386 113.163 386 122C386 130.837 393.163 138 402 138Z"
-    }), /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M230 142C258.719 142 282 118.719 282 90C282 61.2812 258.719 38 230 38C201.281 38 178 61.2812 178 90C178 118.719 201.281 142 230 142Z"
-    })));
-  });
+var _Skeleton = require("../Skeleton");
+/*__reshadow-styles__:"../style/chart.shadow.css"*/
+var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SChartSkeleton_9shre_gg_{height:200px;width:100%;background-image:var(--bgPattern_9shre)}.___SChartSkeleton_9shre_gg_.__bgPosition_9shre_gg_{background-position:var(--bgPosition_9shre)}.___SChartSkeleton_9shre_gg_.__bgSize_9shre_gg_{background-size:var(--bgSize_9shre)}.___SChartSkeleton_9shre_gg_.__bgRepeat_9shre_gg_{background-repeat:var(--bgRepeat_9shre)}" /*__inner_css_end__*/, "9shre_gg_") /*__reshadow_css_end__*/, {
+  "__SChartSkeleton": "___SChartSkeleton_9shre_gg_",
+  "--bgPattern": "--bgPattern_9shre",
+  "_bgPosition": "__bgPosition_9shre_gg_",
+  "--bgPosition": "--bgPosition_9shre",
+  "_bgSize": "__bgSize_9shre_gg_",
+  "--bgSize": "--bgSize_9shre",
+  "_bgRepeat": "__bgRepeat_9shre_gg_",
+  "--bgRepeat": "--bgRepeat_9shre"
+});
+var bubbleSvg = "PHN2ZyB3aWR0aD0iMzc2IiBoZWlnaHQ9IjE2NCIgdmlld0JveD0iMCAwIDM3NiAxNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik00OCAxNjRDNzAuMDkxNCAxNjQgODggMTQ2LjA5MSA4OCAxMjRDODggMTAxLjkwOSA3MC4wOTE0IDg0IDQ4IDg0QzI1LjkwODYgODQgOCAxMDEuOTA5IDggMTI0QzggMTQ2LjA5MSAyNS45MDg2IDE2NCA0OCAxNjRaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNODggNDhDMTAxLjI1NSA0OCAxMTIgMzcuMjU0OCAxMTIgMjRDMTEyIDEwLjc0NTIgMTAxLjI1NSAwIDg4IDBDNzQuNzQ1MiAwIDY0IDEwLjc0NTIgNjQgMjRDNjQgMzcuMjU0OCA3NC43NDUyIDQ4IDg4IDQ4WiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPHBhdGggZD0iTTI5Mi41IDU1QzMwNS40NzkgNTUgMzE2IDQ0LjQ3ODcgMzE2IDMxLjVDMzE2IDE4LjUyMTMgMzA1LjQ3OSA4IDI5Mi41IDhDMjc5LjUyMSA4IDI2OSAxOC41MjEzIDI2OSAzMS41QzI2OSA0NC40Nzg3IDI3OS41MjEgNTUgMjkyLjUgNTVaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMzQ0IDk4QzM1Mi44MzcgOTggMzYwIDkwLjgzNjYgMzYwIDgyQzM2MCA3My4xNjM0IDM1Mi44MzcgNjYgMzQ0IDY2QzMzNS4xNjMgNjYgMzI4IDczLjE2MzQgMzI4IDgyQzMyOCA5MC44MzY2IDMzNS4xNjMgOTggMzQ0IDk4WiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPHBhdGggZD0iTTE4OCAxMzRDMjE2LjcxOSAxMzQgMjQwIDExMC43MTkgMjQwIDgyQzI0MCA1My4yODEyIDIxNi43MTkgMzAgMTg4IDMwQzE1OS4yODEgMzAgMTM2IDUzLjI4MTIgMTM2IDgyQzEzNiAxMTAuNzE5IDE1OS4yODEgMTM0IDE4OCAxMzRaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8L3N2Zz4K";
+var BubbleChartSkeleton = function BubbleChartSkeleton() {
+  var _ref = arguments[0],
+    _ref2;
+  var SChartSkeleton = _Skeleton.Skeleton;
+  return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SChartSkeleton, _ref2.cn("SChartSkeleton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "bgRepeat": 'repeat-x',
+    "bgPosition": 'left center',
+    "bgSize": 'auto 50%',
+    "bgPattern": "url(data:image/svg+xml;base64,".concat(bubbleSvg, ")")
+  }, _ref))));
 };
-var _default = BubbleChartSkeleton;
+var _default = (0, _core["default"])(BubbleChartSkeleton);
 exports["default"] = _default;
 //# sourceMappingURL=Bubble.js.map

package/lib/cjs/Charts/Bubble.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bubble.js","names":["_react","_interopRequireDefault","require","_Skeleton","BubbleChartSkeleton","props","createElement","_extends2","visible","viewBox","preserveAspectRatio","_ref","gradientUrl","Fragment","fill","fillRule","d","_default","exports"],"sources":["../../../src/Charts/Bubble.jsx"],"sourcesContent":["import React from 'react';\nimport Skeleton from '../Skeleton';\n\nconst BubbleChartSkeleton = (props) => (\n  <Skeleton visible viewBox='0 0 460 180' preserveAspectRatio='xMidYMid meet' {...props}>\n    {({ gradientUrl }) => (\n      <>\n        <g>\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M82 172C104.091 172 122 154.091 122 132C122 109.909 104.091 92 82 92C59.9086 92 42 109.909 42 132C42 154.091 59.9086 172 82 172Z'\n          />\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M114 56C127.255 56 138 45.2548 138 32C138 18.7452 127.255 8 114 8C100.745 8 90 18.7452 90 32C90 45.2548 100.745 56 114 56Z'\n          />\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M358.5 95C371.479 95 382 84.4787 382 71.5C382 58.5213 371.479 48 358.5 48C345.521 48 335 58.5213 335 71.5C335 84.4787 345.521 95 358.5 95Z'\n          />\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M402 138C410.837 138 418 130.837 418 122C418 113.163 410.837 106 402 106C393.163 106 386 113.163 386 122C386 130.837 393.163 138 402 138Z'\n          />\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M230 142C258.719 142 282 118.719 282 90C282 61.2812 258.719 38 230 38C201.281 38 178 61.2812 178 90C178 118.719 201.281 142 230 142Z'\n          />\n        </g>\n      </>\n    )}\n  </Skeleton>\n);\n\nexport default BubbleChartSkeleton;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAME,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAIC,KAAK;EAAA,oBAChCL,MAAA,YAAAM,aAAA,CAACH,SAAA,WAAQ,MAAAI,SAAA;IAACC,OAAO;IAACC,OAAO,EAAC,aAAa;IAACC,mBAAmB,EAAC;EAAe,GAAKL,KAAK,GAClF,UAAAM,IAAA;IAAA,IAAGC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IAAA,oBACbZ,MAAA,YAAAM,aAAA,CAAAN,MAAA,YAAAa,QAAA,qBACEb,MAAA,YAAAM,aAAA,yBACEN,MAAA,YAAAM,aAAA;MACEQ,IAAI,EAAEF,WAAY;MAClBG,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAAkI,EACpI,eACFhB,MAAA,YAAAM,aAAA;MACEQ,IAAI,EAAEF,WAAY;MAClBG,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAA4H,EAC9H,eACFhB,MAAA,YAAAM,aAAA;MACEQ,IAAI,EAAEF,WAAY;MAClBG,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAA4I,EAC9I,eACFhB,MAAA,YAAAM,aAAA;MACEQ,IAAI,EAAEF,WAAY;MAClBG,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAA2I,EAC7I,eACFhB,MAAA,YAAAM,aAAA;MACEQ,IAAI,EAAEF,WAAY;MAClBG,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAAsI,EACxI,CACA,CACH;EAAA,CACJ,CACQ;AAAA,CACZ;AAAC,IAAAC,QAAA,GAEab,mBAAmB;AAAAc,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"Bubble.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","bubbleSvg","BubbleChartSkeleton","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","createElement","cn","_objectSpread2","assignProps","concat","_default","createComponent","exports"],"sources":["../../../src/Charts/Bubble.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Root, sstyled } from '@semcore/core';\nimport { Skeleton } from '../Skeleton';\nimport styles from '../style/chart.shadow.css';\n\nconst bubbleSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/bubble-chart.svg'))\n`;\n\nconst BubbleChartSkeleton = () => {\n  const SChartSkeleton = Root;\n  return sstyled(styles)(\n    <SChartSkeleton\n      render={Skeleton}\n      bgRepeat='repeat-x'\n      bgPosition='left center'\n      bgSize='auto 50%'\n      bgPattern={`url(data:image/svg+xml;base64,${bubbleSvg})`}\n    />,\n  );\n};\n\nexport default createComponent(BubbleChartSkeleton);\n"],"mappings":";;;;;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AADA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAAuC;AAAA,IAAAI,MAAA,+BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAGvC,IAAMC,SAAS,6xCAEd;AAED,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAA,EAAS;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAChC,IAAMC,cAAc,GAGRC,kBAAQ;EAFpB,OAAAF,KAAA,GAAO,IAAAN,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,YAAAa,aAAA,CAACF,cAAc,EAAAD,KAAA,CAAAI,EAAA,uBAAAC,cAAA,qBAAAlB,KAAA,CAAAmB,WAAA;IAAA,YAEJ,UAAU;IAAA,cACR,aAAa;IAAA,UACjB,UAAU;IAAA,8CAAAC,MAAA,CAC2BX,SAAS;EAAA,GAAAE,IAAA,IACrD;AAEN,CAAC;AAAC,IAAAU,QAAA,GAEa,IAAAC,gBAAe,EAACZ,mBAAmB,CAAC;AAAAa,OAAA,cAAAF,QAAA"}

package/lib/cjs/Charts/Donut.js

@@ -0,0 +1,48 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
+var _react = _interopRequireDefault(require("react"));
+var _Skeleton = require("../Skeleton");
+/*__reshadow-styles__:"../style/chart.shadow.css"*/
+var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SChartSkeleton_9shre_gg_{height:200px;width:100%;background-image:var(--bgPattern_9shre)}.___SChartSkeleton_9shre_gg_.__bgPosition_9shre_gg_{background-position:var(--bgPosition_9shre)}.___SChartSkeleton_9shre_gg_.__bgSize_9shre_gg_{background-size:var(--bgSize_9shre)}.___SChartSkeleton_9shre_gg_.__bgRepeat_9shre_gg_{background-repeat:var(--bgRepeat_9shre)}" /*__inner_css_end__*/, "9shre_gg_") /*__reshadow_css_end__*/, {
+  "__SChartSkeleton": "___SChartSkeleton_9shre_gg_",
+  "--bgPattern": "--bgPattern_9shre",
+  "_bgPosition": "__bgPosition_9shre_gg_",
+  "--bgPosition": "--bgPosition_9shre",
+  "_bgSize": "__bgSize_9shre_gg_",
+  "--bgSize": "--bgSize_9shre",
+  "_bgRepeat": "__bgRepeat_9shre_gg_",
+  "--bgRepeat": "--bgRepeat_9shre"
+});
+var donutFullSvg = "PHN2ZyB3aWR0aD0iMTgwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDE4MCAxODAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxnIGlkPSJwYXJhZ3JhcGg9ZmFsc2UsIGNoYXJ0IHR5cGU9JiMyNDA7JiMxNTk7JiMxNDE7JiMxNjk7IGRvbnV0IGNoYXJ0LCBwaWN0dXJlIGRpdj1mYWxzZSI+CjxnIGlkPSJkb251dC1jaGFydCI+CjxwYXRoIGQ9Ik0xNTguODYzIDE0NS43NDJDMTcxLjQ1MyAxMzAuMjU5IDE4MCAxMTEuNTExIDE4MCA5MEMxODAgNjguNjE2OCAxNzIuNTQzIDQ4Ljk3NTMgMTYwLjA4NyAzMy41MzQzTDEzNy43MzEgNTUuMTQ1OUMxNTEuNzk5IDgyLjA2NzMgMTUxLjQ3NSA5NS40NDAzIDEzNy43OTMgMTIzLjcyNEwxNTguODYzIDE0NS43NDJaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNOTAgMTgwQzExNy4xMTIgMTgwIDE0MC40MjUgMTY3LjAxMSAxNTYuOTI1IDE0OC4wNDZMMTM1LjgyNyAxMjZDMTI0LjgyNyAxMzkuNTcgMTA4LjMzIDE0OSA4OS41IDE0OUM1Ni4zNjI5IDE0OSAyOSAxMjMuMTM3IDI5IDkwQzI4LjU2MzEgNTcuODU3NiA1NC44NzYyIDMxLjU3OTkgODcgMzBWMC4wNDkwNThDMzguNjgzMSAxLjYzMTUyIDAgNDEuMjk4MyAwIDkwQzAgMTM5LjcwNiA0MC4yOTQ0IDE4MCA5MCAxODBaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMTU4LjA0NiAzMS4zMzI3TDEzNS42MzQgNTNDMTI1LjEzMiAzOS42MTYxIDEwOS44NzQgMzAuNDU1MiA5MCAzMFYwQzExNy45MTUgMCAxNDEuNTM4IDExLjM4NTEgMTU4LjA0NiAzMS4zMzI3WiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPC9nPgo8L2c+Cjwvc3ZnPgo=";
+var donutHalfSvg = "PHN2ZyB3aWR0aD0iMTgwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTgwIDkwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMTU2LjkyNSAzMS45NTM4QzE0MC40MjUgMTIuOTg4NiAxMTcuMTEyIDAgOTAgMEM0MC4yOTQ0IDAgMCA0MC4yOTQ0IDAgOTBIMjlDMjkgNTYuODYyOSA1Ni4zNjI5IDMxIDg5LjUgMzFDMTA4LjMzIDMxIDEyNC44MjcgNDAuNDI5NiAxMzUuODI3IDU0TDE1Ni45MjUgMzEuOTUzOFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0xODAgOTBIMTQ4LjE1MkMxNDcuODg2IDgwLjA5ODkgMTQ0LjM5NSA2OS45MjMzIDEzNy43OTMgNTYuMjc2NEwxNTguODYzIDM0LjI1ODFDMTcxLjQ1MyA0OS43NDA3IDE4MCA2OC40ODkgMTgwIDkwWiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPC9zdmc+Cg==";
+var DonutChartSkeleton = function DonutChartSkeleton(props) {
+  var _ref = arguments[0],
+    _ref2,
+    _props$halfsize;
+  var SChartSkeleton = _Skeleton.Skeleton;
+  var halfsize = (_props$halfsize = props.halfsize) !== null && _props$halfsize !== void 0 ? _props$halfsize : false;
+  var patternBase64 = {
+    "true": donutHalfSvg,
+    "false": donutFullSvg
+  }[halfsize];
+  return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SChartSkeleton, _ref2.cn("SChartSkeleton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "bgRepeat": 'no-repeat',
+    "bgPosition": {
+      "true": 'center bottom',
+      "false": 'center'
+    }[halfsize],
+    "bgSize": 'contain',
+    "bgPattern": "url(data:image/svg+xml;base64,".concat(patternBase64, ")")
+  }, _ref))));
+};
+var _default = (0, _core["default"])(DonutChartSkeleton);
+exports["default"] = _default;
+//# sourceMappingURL=Donut.js.map

package/lib/cjs/Charts/Donut.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Donut.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","donutFullSvg","donutHalfSvg","DonutChartSkeleton","props","_ref","arguments[0]","_ref2","_props$halfsize","SChartSkeleton","Skeleton","halfsize","patternBase64","createElement","cn","_objectSpread2","assignProps","concat","_default","createComponent","exports"],"sources":["../../../src/Charts/Donut.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Root, sstyled } from '@semcore/core';\nimport { Skeleton } from '../Skeleton';\nimport styles from '../style/chart.shadow.css';\n\nconst donutFullSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/donut-chart.svg'))\n`;\nconst donutHalfSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/donut-chart-halfsize.svg'))\n`;\n\nconst DonutChartSkeleton = (props) => {\n  const SChartSkeleton = Root;\n  const halfsize = props.halfsize ?? false;\n  const patternBase64 = { true: donutHalfSvg, false: donutFullSvg }[halfsize];\n  return sstyled(styles)(\n    <SChartSkeleton\n      render={Skeleton}\n      bgRepeat='no-repeat'\n      bgPosition={{ true: 'center bottom', false: 'center' }[halfsize]}\n      bgSize='contain'\n      bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n    />,\n  );\n};\n\nexport default createComponent(DonutChartSkeleton);\n"],"mappings":";;;;;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AADA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAAuC;AAAA,IAAAI,MAAA,+BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAGvC,IAAMC,YAAY,6qCAEjB;AACD,IAAMC,YAAY,6nBAEjB;AAED,IAAMC,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIC,KAAK,EAAK;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;IAAAC,eAAA;EACpC,IAAMC,cAAc,GAKRC,kBAAQ;EAJpB,IAAMC,QAAQ,IAAAH,eAAA,GAAGJ,KAAK,CAACO,QAAQ,cAAAH,eAAA,cAAAA,eAAA,GAAI,KAAK;EACxC,IAAMI,aAAa,GAAG;IAAE,QAAMV,YAAY;IAAE,SAAOD;EAAa,CAAC,CAACU,QAAQ,CAAC;EAC3E,OAAAJ,KAAA,GAAO,IAAAR,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,YAAAkB,aAAA,CAACJ,cAAc,EAAAF,KAAA,CAAAO,EAAA,uBAAAC,cAAA,qBAAAvB,KAAA,CAAAwB,WAAA;IAAA,YAEJ,WAAW;IAAA,cACR;MAAE,QAAM,eAAe;MAAE,SAAO;IAAS,CAAC,CAACL,QAAQ,CAAC;IAAA,UACzD,SAAS;IAAA,8CAAAM,MAAA,CAC4BL,aAAa;EAAA,GAAAP,IAAA,IACzD;AAEN,CAAC;AAAC,IAAAa,QAAA,GAEa,IAAAC,gBAAe,EAAChB,kBAAkB,CAAC;AAAAiB,OAAA,cAAAF,QAAA"}

package/lib/cjs/Charts/Histogram.js

@@ -1,55 +1,54 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _core = _interopRequireWildcard(require("@semcore/core"));
 var _react = _interopRequireDefault(require("react"));
-var _Skeleton = _interopRequireDefault(require("../Skeleton"));
+var _Skeleton = require("../Skeleton");
+/*__reshadow-styles__:"../style/chart.shadow.css"*/
+var styles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SChartSkeleton_9shre_gg_{height:200px;width:100%;background-image:var(--bgPattern_9shre)}.___SChartSkeleton_9shre_gg_.__bgPosition_9shre_gg_{background-position:var(--bgPosition_9shre)}.___SChartSkeleton_9shre_gg_.__bgSize_9shre_gg_{background-size:var(--bgSize_9shre)}.___SChartSkeleton_9shre_gg_.__bgRepeat_9shre_gg_{background-repeat:var(--bgRepeat_9shre)}" /*__inner_css_end__*/, "9shre_gg_") /*__reshadow_css_end__*/, {
+  "__SChartSkeleton": "___SChartSkeleton_9shre_gg_",
+  "--bgPattern": "--bgPattern_9shre",
+  "_bgPosition": "__bgPosition_9shre_gg_",
+  "--bgPosition": "--bgPosition_9shre",
+  "_bgSize": "__bgSize_9shre_gg_",
+  "--bgSize": "--bgSize_9shre",
+  "_bgRepeat": "__bgRepeat_9shre_gg_",
+  "--bgRepeat": "--bgRepeat_9shre"
+});
+var histogramVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0wIDBIMTIwQzEyMi4yMDkgMCAxMjQgMS43OTA4NiAxMjQgNFYyMEMxMjQgMjIuMjA5MSAxMjIuMjA5IDI0IDEyMCAyNEgwVjBaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMCAyOEgxNTZDMTU4LjIwOSAyOCAxNjAgMjkuNzkwOSAxNjAgMzJWNDhDMTYwIDUwLjIwOTEgMTU4LjIwOSA1MiAxNTYgNTJIMFYyOFoiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0wIDU2SDEzOEMxNDAuMjA5IDU2IDE0MiA1Ny43OTA5IDE0MiA2MFY3NkMxNDIgNzguMjA5MSAxNDAuMjA5IDgwIDEzOCA4MEgwVjU2WiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPHBhdGggZD0iTTAgODRIMTU2QzE1OC4yMDkgODQgMTYwIDg1Ljc5MDkgMTYwIDg4VjEwNEMxNjAgMTA2LjIwOSAxNTguMjA5IDEwOCAxNTYgMTA4SDBWODRaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMCAxMTJIMTE2QzExOC4yMDkgMTEyIDEyMCAxMTMuNzkxIDEyMCAxMTZWMTMyQzEyMCAxMzQuMjA5IDExOC4yMDkgMTM2IDExNiAxMzZIMFYxMTJaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8L3N2Zz4K";
+var histogramHorizontalSvg = "PHN2ZyB3aWR0aD0iNDU2IiBoZWlnaHQ9IjEwNCIgdmlld0JveD0iMCAwIDQ1NiAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0yIDE0QzIgMTIuODk1NCAyLjg5NTQzIDEyIDQgMTJIMTEwLjkwMUMxMTIuMDA1IDEyIDExMi45MDEgMTIuODk1NCAxMTIuOTAxIDE0VjkySDJWMTRaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8cGF0aCBkPSJNMTE2LjkwMSAzMEMxMTYuOTAxIDI4Ljg5NTQgMTE3Ljc5NiAyOCAxMTguOTAxIDI4SDIyNC44MDJDMjI1LjkwNiAyOCAyMjYuODAyIDI4Ljg5NTQgMjI2LjgwMiAzMFY5MkgxMTYuOTAxVjMwWiIgZmlsbD0iI0UwRTFFOSIgZmlsbC1vcGFjaXR5PSIwLjgiLz4KPHBhdGggZD0iTTIzMC44MDIgNjJDMjMwLjgwMiA2MC44OTU0IDIzMS42OTcgNjAgMjMyLjgwMiA2MEgzMzguNzAyQzMzOS44MDcgNjAgMzQwLjcwMiA2MC44OTU0IDM0MC43MDIgNjJWOTJIMjMwLjgwMlY2MloiIGZpbGw9IiNFMEUxRTkiIGZpbGwtb3BhY2l0eT0iMC44Ii8+CjxwYXRoIGQ9Ik0zNDQuNzAyIDQ0QzM0NC43MDIgNDIuODk1NCAzNDUuNTk4IDQyIDM0Ni43MDIgNDJINDUxLjYwM0M0NTIuNzA4IDQyIDQ1My42MDMgNDIuODk1NCA0NTMuNjAzIDQ0VjkySDM0NC43MDJWNDRaIiBmaWxsPSIjRTBFMUU5IiBmaWxsLW9wYWNpdHk9IjAuOCIvPgo8L3N2Zz4K";
 var HistogramChartSkeleton = function HistogramChartSkeleton(props) {
-  var _props$layout = props.layout,
-    layout = _props$layout === void 0 ? 'horizontal' : _props$layout;
-  return /*#__PURE__*/_react["default"].createElement(_Skeleton["default"], (0, _extends2["default"])({
-    viewBox: "0 0 908 166",
-    preserveAspectRatio: "xMidYMid meet"
-  }, props), function (_ref) {
-    var gradientUrl = _ref.gradientUrl;
-    if (layout === 'vertical') {
-      return /*#__PURE__*/_react["default"].createElement("g", {
-        fill: gradientUrl
-      }, /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "252",
-        height: "24",
-        y: "112",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "360",
-        height: "24",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "306",
-        height: "24",
-        y: "84",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("rect", {
-        width: "140",
-        height: "24",
-        y: "56",
-        rx: "4"
-      }), /*#__PURE__*/_react["default"].createElement("path", {
-        fillRule: "nonzero",
-        d: "M4 28h235a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4z"
-      }));
-    }
-    return /*#__PURE__*/_react["default"].createElement("path", {
-      fill: gradientUrl,
-      fillRule: "nonzero",
-      d: "M0 0h110.9v80H0zM228.802 48h109.9v32h-109.9zM342.702 30h108.901v50h-108.9zM114.9 16h109.902v64H114.9z M454 0h109.9v80H454zM681.802 48h109.9v32h-109.9zM795.702 30h108.901v50h-108.9zM567.9 16h109.902v64H567.9z"
-    });
-  });
+  var _ref = arguments[0],
+    _ref2,
+    _props$layout;
+  var SChartSkeleton = _Skeleton.Skeleton;
+  var layout = (_props$layout = props.layout) !== null && _props$layout !== void 0 ? _props$layout : 'horizontal';
+  var patternBase64 = {
+    vertical: histogramVerticalSvg,
+    horizontal: histogramHorizontalSvg
+  }[layout];
+  return _ref2 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SChartSkeleton, _ref2.cn("SChartSkeleton", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
+    "bgRepeat": {
+      vertical: 'repeat-y',
+      horizontal: 'repeat-x'
+    }[layout],
+    "bgPosition": {
+      vertical: 'left top',
+      horizontal: 'left bottom'
+    }[layout],
+    "bgSize": {
+      vertical: 'contain',
+      horizontal: 'auto 50%'
+    }[layout],
+    "bgPattern": "url(data:image/svg+xml;base64,".concat(patternBase64, ")")
+  }, _ref))));
 };
-var _default = HistogramChartSkeleton;
+var _default = (0, _core["default"])(HistogramChartSkeleton);
 exports["default"] = _default;
 //# sourceMappingURL=Histogram.js.map

package/lib/cjs/Charts/Histogram.js.map

@@ -1 +1 @@
-{"version":3,"file":"Histogram.js","names":["_react","_interopRequireDefault","require","_Skeleton","HistogramChartSkeleton","props","_props$layout","layout","createElement","_extends2","viewBox","preserveAspectRatio","_ref","gradientUrl","fill","width","height","y","rx","fillRule","d","_default","exports"],"sources":["../../../src/Charts/Histogram.jsx"],"sourcesContent":["import React from 'react';\nimport Skeleton from '../Skeleton';\n\nconst HistogramChartSkeleton = (props) => {\n  const { layout = 'horizontal' } = props;\n\n  return (\n    <Skeleton viewBox='0 0 908 166' preserveAspectRatio='xMidYMid meet' {...props}>\n      {({ gradientUrl }) => {\n        if (layout === 'vertical') {\n          return (\n            <g fill={gradientUrl}>\n              <rect width='252' height='24' y='112' rx='4' />\n              <rect width='360' height='24' rx='4' />\n              <rect width='306' height='24' y='84' rx='4' />\n              <rect width='140' height='24' y='56' rx='4' />\n              <path\n                fillRule='nonzero'\n                d='M4 28h235a4 4 0 0 1 4 4v16a4 4 0 0 1-4 4H4a4 4 0 0 1-4-4V32a4 4 0 0 1 4-4z'\n              />\n            </g>\n          );\n        }\n\n        return (\n          <path\n            fill={gradientUrl}\n            fillRule='nonzero'\n            d='M0 0h110.9v80H0zM228.802 48h109.9v32h-109.9zM342.702 30h108.901v50h-108.9zM114.9 16h109.902v64H114.9z M454 0h109.9v80H454zM681.802 48h109.9v32h-109.9zM795.702 30h108.901v50h-108.9zM567.9 16h109.902v64H567.9z'\n          />\n        );\n      }}\n    </Skeleton>\n  );\n};\n\nexport default HistogramChartSkeleton;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAME,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAIC,KAAK,EAAK;EACxC,IAAAC,aAAA,GAAkCD,KAAK,CAA/BE,MAAM;IAANA,MAAM,GAAAD,aAAA,cAAG,YAAY,GAAAA,aAAA;EAE7B,oBACEN,MAAA,YAAAQ,aAAA,CAACL,SAAA,WAAQ,MAAAM,SAAA;IAACC,OAAO,EAAC,aAAa;IAACC,mBAAmB,EAAC;EAAe,GAAKN,KAAK,GAC1E,UAAAO,IAAA,EAAqB;IAAA,IAAlBC,WAAW,GAAAD,IAAA,CAAXC,WAAW;IACb,IAAIN,MAAM,KAAK,UAAU,EAAE;MACzB,oBACEP,MAAA,YAAAQ,aAAA;QAAGM,IAAI,EAAED;MAAY,gBACnBb,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,KAAK;QAACC,EAAE,EAAC;MAAG,EAAG,eAC/ClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACE,EAAE,EAAC;MAAG,EAAG,eACvClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,IAAI;QAACC,EAAE,EAAC;MAAG,EAAG,eAC9ClB,MAAA,YAAAQ,aAAA;QAAMO,KAAK,EAAC,KAAK;QAACC,MAAM,EAAC,IAAI;QAACC,CAAC,EAAC,IAAI;QAACC,EAAE,EAAC;MAAG,EAAG,eAC9ClB,MAAA,YAAAQ,aAAA;QACEW,QAAQ,EAAC,SAAS;QAClBC,CAAC,EAAC;MAA4E,EAC9E,CACA;IAER;IAEA,oBACEpB,MAAA,YAAAQ,aAAA;MACEM,IAAI,EAAED,WAAY;MAClBM,QAAQ,EAAC,SAAS;MAClBC,CAAC,EAAC;IAAiN,EACnN;EAEN,CAAC,CACQ;AAEf,CAAC;AAAC,IAAAC,QAAA,GAEajB,sBAAsB;AAAAkB,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"Histogram.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","histogramVerticalSvg","histogramHorizontalSvg","HistogramChartSkeleton","props","_ref","arguments[0]","_ref2","_props$layout","SChartSkeleton","Skeleton","layout","patternBase64","vertical","horizontal","createElement","cn","_objectSpread2","assignProps","concat","_default","createComponent","exports"],"sources":["../../../src/Charts/Histogram.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Root, sstyled } from '@semcore/core';\nimport { Skeleton } from '../Skeleton';\nimport styles from '../style/chart.shadow.css';\n\nconst histogramVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/histogram-chart-vertical.svg'))\n`;\nconst histogramHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../svg/histogram-chart-horizontal.svg'))\n`;\n\nconst HistogramChartSkeleton = (props) => {\n  const SChartSkeleton = Root;\n  const layout = props.layout ?? 'horizontal';\n  const patternBase64 = { vertical: histogramVerticalSvg, horizontal: histogramHorizontalSvg }[\n    layout\n  ];\n  return sstyled(styles)(\n    <SChartSkeleton\n      render={Skeleton}\n      bgRepeat={{ vertical: 'repeat-y', horizontal: 'repeat-x' }[layout]}\n      bgPosition={{ vertical: 'left top', horizontal: 'left bottom' }[layout]}\n      bgSize={{ vertical: 'contain', horizontal: 'auto 50%' }[layout]}\n      bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n    />,\n  );\n};\n\nexport default createComponent(HistogramChartSkeleton);\n"],"mappings":";;;;;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AADA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,SAAA,GAAAH,OAAA;AAAuC;AAAA,IAAAI,MAAA,+BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAGvC,IAAMC,oBAAoB,69BAEzB;AACD,IAAMC,sBAAsB,y7BAE3B;AAED,IAAMC,sBAAsB,GAAG,SAAzBA,sBAAsBA,CAAIC,KAAK,EAAK;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;IAAAC,aAAA;EACxC,IAAMC,cAAc,GAORC,kBAAQ;EANpB,IAAMC,MAAM,IAAAH,aAAA,GAAGJ,KAAK,CAACO,MAAM,cAAAH,aAAA,cAAAA,aAAA,GAAI,YAAY;EAC3C,IAAMI,aAAa,GAAG;IAAEC,QAAQ,EAAEZ,oBAAoB;IAAEa,UAAU,EAAEZ;EAAuB,CAAC,CAC1FS,MAAM,CACP;EACD,OAAAJ,KAAA,GAAO,IAAAR,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,YAAAoB,aAAA,CAACN,cAAc,EAAAF,KAAA,CAAAS,EAAA,uBAAAC,cAAA,qBAAAzB,KAAA,CAAA0B,WAAA;IAAA,YAEH;MAAEL,QAAQ,EAAE,UAAU;MAAEC,UAAU,EAAE;IAAW,CAAC,CAACH,MAAM,CAAC;IAAA,cACtD;MAAEE,QAAQ,EAAE,UAAU;MAAEC,UAAU,EAAE;IAAc,CAAC,CAACH,MAAM,CAAC;IAAA,UAC/D;MAAEE,QAAQ,EAAE,SAAS;MAAEC,UAAU,EAAE;IAAW,CAAC,CAACH,MAAM,CAAC;IAAA,8CAAAQ,MAAA,CACnBP,aAAa;EAAA,GAAAP,IAAA,IACzD;AAEN,CAAC;AAAC,IAAAe,QAAA,GAEa,IAAAC,gBAAe,EAAClB,sBAAsB,CAAC;AAAAmB,OAAA,cAAAF,QAAA"}