@widergy/energy-ui 3.172.1 → 3.172.3

package/dist/components/UTGraph/components/Points/utils.js

@@ -1,147 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.renderPointsForSideNumerical = exports.renderPointsForSideCategorical = exports.getSizeExtent = void 0;
-var _react = _interopRequireDefault(require("react"));
-var d3 = _interopRequireWildcard(require("d3"));
-var _constants = require("../../constants");
-var _constants2 = require("./constants");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const renderPointsForSideCategorical = _ref => {
-  let {
-    items,
-    valuesByCategory,
-    mainAxis,
-    mainAxisDomain,
-    crossAxis,
-    color,
-    sizeScale
-  } = _ref;
-  return items.map(_ref2 => {
-    let {
-      rangeCode,
-      sizeCode,
-      colorCode
-    } = _ref2;
-    return /*#__PURE__*/_react.default.createElement("g", {
-      key: "points-".concat(rangeCode)
-    }, mainAxisDomain.map(category => {
-      var _mainAxis$bandwidth, _mainAxis$bandwidth2;
-      const row = valuesByCategory.get(category);
-      if (!row) return null;
-      const yVal = row[rangeCode];
-      if (!Number.isFinite(yVal)) return null;
-      const sizeVal = sizeCode ? row[sizeCode] : undefined;
-      const r = sizeCode && Number.isFinite(sizeVal) && sizeScale ? sizeScale(sizeVal) : _constants2.DEFAULT_RADIUS;
-      const cx = mainAxis(category) + ((_mainAxis$bandwidth = (_mainAxis$bandwidth2 = mainAxis.bandwidth) === null || _mainAxis$bandwidth2 === void 0 ? void 0 : _mainAxis$bandwidth2.call(mainAxis)) !== null && _mainAxis$bandwidth !== void 0 ? _mainAxis$bandwidth : 0) / 2;
-      const cy = crossAxis(yVal);
-      const colorKey = colorCode && row[colorCode] != null ? row[colorCode] : rangeCode;
-      return /*#__PURE__*/_react.default.createElement("circle", {
-        key: "pt-".concat(rangeCode, "-").concat(category),
-        cx: cx,
-        cy: cy,
-        r: r,
-        fill: color(colorKey)
-      });
-    }));
-  });
-};
-exports.renderPointsForSideCategorical = renderPointsForSideCategorical;
-const renderPointsForSideNumerical = _ref3 => {
-  let {
-    items,
-    rows,
-    mainAxis,
-    crossAxis,
-    color,
-    sizeScale
-  } = _ref3;
-  return items.map(_ref4 => {
-    let {
-      rangeCode,
-      sizeCode,
-      domainCode,
-      colorCode
-    } = _ref4;
-    return /*#__PURE__*/_react.default.createElement("g", {
-      key: "points-num-".concat(rangeCode)
-    }, rows.map(row => {
-      const xVal = row[domainCode];
-      const yVal = row[rangeCode];
-      if (!Number.isFinite(xVal) || !Number.isFinite(yVal)) return null;
-      const sizeVal = sizeCode ? row[sizeCode] : undefined;
-      const r = sizeCode && Number.isFinite(sizeVal) && sizeScale ? sizeScale(sizeVal) : _constants2.DEFAULT_RADIUS;
-      const cx = mainAxis(xVal);
-      const cy = crossAxis(yVal);
-      const colorKey = colorCode && row[colorCode] != null ? row[colorCode] : rangeCode;
-      return /*#__PURE__*/_react.default.createElement("circle", {
-        key: "pt-num-".concat(rangeCode),
-        cx: cx,
-        cy: cy,
-        r: r,
-        fill: color(colorKey)
-      });
-    }));
-  });
-};
-exports.renderPointsForSideNumerical = renderPointsForSideNumerical;
-const getSizeValues = _ref5 => {
-  let {
-    tab,
-    splitPointClusters,
-    mainAxisDomain,
-    valuesByCategory,
-    rows
-  } = _ref5;
-  const values = [];
-  splitPointClusters.forEach(_ref6 => {
-    let {
-      leftItems,
-      rightItems
-    } = _ref6;
-    [...leftItems, ...rightItems].forEach(item => {
-      if (!item.sizeCode) return;
-      if (tab.domain.binding === _constants.DOMAIN_CATEGORICAL) {
-        mainAxisDomain.forEach(category => {
-          const row = valuesByCategory.get(category);
-          const val = row === null || row === void 0 ? void 0 : row[item.sizeCode];
-          if (Number.isFinite(val)) values.push(val);
-        });
-      } else {
-        rows.forEach(row => {
-          const val = row === null || row === void 0 ? void 0 : row[item.sizeCode];
-          if (Number.isFinite(val)) values.push(val);
-        });
-      }
-    });
-  });
-  return values;
-};
-const getMinMaxValues = values => {
-  if (values.length === 0) return null;
-  const [min, max] = d3.extent(values);
-  if (!Number.isFinite(min) || !Number.isFinite(max)) return null;
-  if (min === max) return [min, max + 1];
-  return [min, max];
-};
-const getSizeExtent = _ref7 => {
-  let {
-    tab,
-    splitPointClusters,
-    valuesByCategory,
-    mainAxisDomain,
-    rows
-  } = _ref7;
-  const values = getSizeValues({
-    tab,
-    splitPointClusters,
-    mainAxisDomain,
-    valuesByCategory,
-    rows
-  });
-  return getMinMaxValues(values);
-};
-exports.getSizeExtent = getSizeExtent;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.renderPointsForSideNumerical=exports.renderPointsForSideCategorical=exports.getSizeExtent=void 0;var _react=_interopRequireDefault(require("react")),d3=_interopRequireWildcard(require("d3")),_constants=require("../../constants"),_constants2=require("./constants");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const renderPointsForSideCategorical=_ref=>{let{items:items,valuesByCategory:valuesByCategory,mainAxis:mainAxis,mainAxisDomain:mainAxisDomain,crossAxis:crossAxis,color:color,sizeScale:sizeScale}=_ref;return items.map(_ref2=>{let{rangeCode:rangeCode,sizeCode:sizeCode,colorCode:colorCode}=_ref2;return _react.default.createElement("g",{key:"points-".concat(rangeCode)},mainAxisDomain.map(category=>{var _mainAxis$bandwidth,_mainAxis$bandwidth2;const row=valuesByCategory.get(category);if(!row)return null;const yVal=row[rangeCode];if(!Number.isFinite(yVal))return null;const sizeVal=sizeCode?row[sizeCode]:void 0,r=sizeCode&&Number.isFinite(sizeVal)&&sizeScale?sizeScale(sizeVal):_constants2.DEFAULT_RADIUS,cx=mainAxis(category)+(null!==(_mainAxis$bandwidth=null===(_mainAxis$bandwidth2=mainAxis.bandwidth)||void 0===_mainAxis$bandwidth2?void 0:_mainAxis$bandwidth2.call(mainAxis))&&void 0!==_mainAxis$bandwidth?_mainAxis$bandwidth:0)/2,cy=crossAxis(yVal),colorKey=colorCode&&null!=row[colorCode]?row[colorCode]:rangeCode;return _react.default.createElement("circle",{key:"pt-".concat(rangeCode,"-").concat(category),cx:cx,cy:cy,r:r,fill:color(colorKey)})}))})};exports.renderPointsForSideCategorical=renderPointsForSideCategorical;const renderPointsForSideNumerical=_ref3=>{let{items:items,rows:rows,mainAxis:mainAxis,crossAxis:crossAxis,color:color,sizeScale:sizeScale}=_ref3;return items.map(_ref4=>{let{rangeCode:rangeCode,sizeCode:sizeCode,domainCode:domainCode,colorCode:colorCode}=_ref4;return _react.default.createElement("g",{key:"points-num-".concat(rangeCode)},rows.map(row=>{const xVal=row[domainCode],yVal=row[rangeCode];if(!Number.isFinite(xVal)||!Number.isFinite(yVal))return null;const sizeVal=sizeCode?row[sizeCode]:void 0,r=sizeCode&&Number.isFinite(sizeVal)&&sizeScale?sizeScale(sizeVal):_constants2.DEFAULT_RADIUS,cx=mainAxis(xVal),cy=crossAxis(yVal),colorKey=colorCode&&null!=row[colorCode]?row[colorCode]:rangeCode;return _react.default.createElement("circle",{key:"pt-num-".concat(rangeCode),cx:cx,cy:cy,r:r,fill:color(colorKey)})}))})};exports.renderPointsForSideNumerical=renderPointsForSideNumerical;const getSizeValues=_ref5=>{let{tab:tab,splitPointClusters:splitPointClusters,mainAxisDomain:mainAxisDomain,valuesByCategory:valuesByCategory,rows:rows}=_ref5;const values=[];return splitPointClusters.forEach(_ref6=>{let{leftItems:leftItems,rightItems:rightItems}=_ref6;[...leftItems,...rightItems].forEach(item=>{item.sizeCode&&(tab.domain.binding===_constants.DOMAIN_CATEGORICAL?mainAxisDomain.forEach(category=>{const row=valuesByCategory.get(category),val=null==row?void 0:row[item.sizeCode];Number.isFinite(val)&&values.push(val)}):rows.forEach(row=>{const val=null==row?void 0:row[item.sizeCode];Number.isFinite(val)&&values.push(val)}))})}),values},getMinMaxValues=values=>{if(0===values.length)return null;const[min,max]=d3.extent(values);return Number.isFinite(min)&&Number.isFinite(max)?min===max?[min,max+1]:[min,max]:null},getSizeExtent=_ref7=>{let{tab:tab,splitPointClusters:splitPointClusters,valuesByCategory:valuesByCategory,mainAxisDomain:mainAxisDomain,rows:rows}=_ref7;const values=getSizeValues({tab:tab,splitPointClusters:splitPointClusters,mainAxisDomain:mainAxisDomain,valuesByCategory:valuesByCategory,rows:rows});return getMinMaxValues(values)};exports.getSizeExtent=getSizeExtent;

package/dist/components/UTGraph/components/RadialChart/constants.js

@@ -1,10 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RING_GAP = exports.PAD_ANGLE = exports.CORNER_RADIUS = exports.BASE_INNER_RADIUS_RATIO = void 0;
-const BASE_INNER_RADIUS_RATIO = exports.BASE_INNER_RADIUS_RATIO = 0.45;
-const CORNER_RADIUS = exports.CORNER_RADIUS = 4;
-const PAD_ANGLE = exports.PAD_ANGLE = 0.01;
-const RING_GAP = exports.RING_GAP = 3;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RING_GAP=exports.PAD_ANGLE=exports.CORNER_RADIUS=exports.BASE_INNER_RADIUS_RATIO=void 0;const BASE_INNER_RADIUS_RATIO=exports.BASE_INNER_RADIUS_RATIO=.45,CORNER_RADIUS=exports.CORNER_RADIUS=4,PAD_ANGLE=exports.PAD_ANGLE=.01,RING_GAP=exports.RING_GAP=3;

package/dist/components/UTGraph/components/RadialChart/index.js

@@ -1,140 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var d3 = _interopRequireWildcard(require("d3"));
-var _propTypes = require("prop-types");
-var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
-var _UTTooltip = _interopRequireDefault(require("../../../UTTooltip"));
-var _UTIcon = _interopRequireDefault(require("../../../UTIcon"));
-var _constants = require("../../constants");
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-var _utils = require("./utils");
-var _constants2 = require("./constants");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const RadialChart = _ref => {
-  var _configuration$baseIn, _configuration$corner, _configuration$padAng, _configuration$ringGa, _dataset$domain, _tab$configuration;
-  let {
-    tab,
-    width,
-    height,
-    dataset,
-    color,
-    configuration
-  } = _ref;
-  const cX = width / 2;
-  const cY = height / 2;
-  const outerRadius = Math.max(0, Math.min(cX, cY));
-  const baseInnerRadius = outerRadius * ((_configuration$baseIn = configuration === null || configuration === void 0 ? void 0 : configuration.baseInnerRadiusRatio) !== null && _configuration$baseIn !== void 0 ? _configuration$baseIn : _constants2.BASE_INNER_RADIUS_RATIO);
-  const cornerRadius = (_configuration$corner = configuration === null || configuration === void 0 ? void 0 : configuration.cornerRadius) !== null && _configuration$corner !== void 0 ? _configuration$corner : _constants2.CORNER_RADIUS;
-  const padAngle = (_configuration$padAng = configuration === null || configuration === void 0 ? void 0 : configuration.padAngle) !== null && _configuration$padAng !== void 0 ? _configuration$padAng : _constants2.PAD_ANGLE;
-  const ringGap = (_configuration$ringGa = configuration === null || configuration === void 0 ? void 0 : configuration.ringGap) !== null && _configuration$ringGa !== void 0 ? _configuration$ringGa : _constants2.RING_GAP;
-  const domainEntry = dataset === null || dataset === void 0 || (_dataset$domain = dataset.domain) === null || _dataset$domain === void 0 ? void 0 : _dataset$domain[0];
-  const clusters = (0, _react.useMemo)(() => tab.subitems || [], [tab]);
-  const valueByCode = (0, _react.useMemo)(() => (0, _utils.getValueMapByCode)(domainEntry === null || domainEntry === void 0 ? void 0 : domainEntry.concepts), [domainEntry]);
-  const pieInputsByCluster = (0, _react.useMemo)(() => clusters.map(cluster => cluster.map(series => {
-    var _valueByCode$get;
-    const code = series.bindings.range;
-    return {
-      code,
-      value: Number((_valueByCode$get = valueByCode.get(code)) !== null && _valueByCode$get !== void 0 ? _valueByCode$get : 0)
-    };
-  })), [clusters, valueByCode]);
-  const pie = (0, _react.useMemo)(() => d3.pie().value(d => d.value).sort(null).padAngle(padAngle), [padAngle]);
-  const ringCount = clusters.length || 1;
-  const totalRadialSpace = outerRadius - baseInnerRadius;
-  const ringThickness = Math.max(1, (totalRadialSpace - (ringCount - 1) * ringGap) / ringCount);
-  const innerMostRadius = outerRadius - ringCount * ringThickness - (ringCount - 1) * ringGap;
-  const rings = (0, _react.useMemo)(() => pieInputsByCluster.map((pieInput, clusterIndex) => {
-    const visibleInput = pieInput.filter(d => d.value > 0);
-    const ringOuter = outerRadius - clusterIndex * (ringThickness + ringGap);
-    const ringInner = ringOuter - ringThickness;
-    const arcs = pie(visibleInput);
-    const arcGen = d3.arc().innerRadius(ringInner).outerRadius(ringOuter).cornerRadius(cornerRadius);
-    return {
-      clusterIndex,
-      arcs,
-      arcGen
-    };
-  }), [pieInputsByCluster, pie, outerRadius, ringThickness, ringGap, cornerRadius]);
-  const {
-    title,
-    tooltip,
-    value,
-    icon
-  } = ((_tab$configuration = tab.configuration) === null || _tab$configuration === void 0 ? void 0 : _tab$configuration.radialCenter) || {};
-  return /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      position: 'relative',
-      width,
-      height
-    }
-  }, /*#__PURE__*/_react.default.createElement("svg", {
-    width: width,
-    height: height
-  }, /*#__PURE__*/_react.default.createElement("g", {
-    transform: "translate(".concat(cX, ", ").concat(cY, ")")
-  }, rings.map(_ref2 => {
-    let {
-      clusterIndex,
-      arcs,
-      arcGen
-    } = _ref2;
-    return /*#__PURE__*/_react.default.createElement("g", {
-      key: "ring-".concat(clusterIndex)
-    }, arcs.map(arcDatum => {
-      const d = arcGen(arcDatum);
-      const {
-        code
-      } = arcDatum.data;
-      return /*#__PURE__*/_react.default.createElement("path", {
-        key: code,
-        d: d,
-        fill: color(code),
-        stroke: "white",
-        strokeWidth: 1
-      });
-    }));
-  }))), /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      position: 'absolute',
-      inset: 0,
-      display: 'flex',
-      flexDirection: 'column',
-      justifyContent: 'center',
-      alignItems: 'center'
-    }
-  }, title && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    weight: "medium",
-    variant: "xsmall",
-    colorTheme: "gray",
-    title: title
-  }, title), (value === null || value === void 0 ? void 0 : value.code) && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    weight: "medium",
-    variant: "title2",
-    title: value.code
-  }, value.format ? d3.format(value.format)(valueByCode.get(value.code)) : valueByCode.get(value.code)), tooltip && /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
-    content: tooltip
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.tooltipIcon
-  }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-    name: "IconInfoCircle",
-    size: _constants.TOOLTIP_SIZE
-  }))), icon && /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-    name: icon,
-    size: Math.max(innerMostRadius - ringGap, 0)
-  })));
-};
-RadialChart.propTypes = {
-  tab: _propTypes.object,
-  width: _propTypes.number,
-  height: _propTypes.number,
-  dataset: _propTypes.object,
-  color: _propTypes.func,
-  configuration: _propTypes.object
-};
-var _default = exports.default = RadialChart;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),d3=_interopRequireWildcard(require("d3")),_propTypes=require("prop-types"),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_UTTooltip=_interopRequireDefault(require("../../../UTTooltip")),_UTIcon=_interopRequireDefault(require("../../../UTIcon")),_constants=require("../../constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_utils=require("./utils"),_constants2=require("./constants");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}const RadialChart=_ref=>{var _configuration$baseIn,_configuration$corner,_configuration$padAng,_configuration$ringGa,_dataset$domain,_tab$configuration;let{tab:tab,width:width,height:height,dataset:dataset,color:color,configuration:configuration}=_ref;const cX=width/2,cY=height/2,outerRadius=Math.max(0,Math.min(cX,cY)),baseInnerRadius=outerRadius*(null!==(_configuration$baseIn=null==configuration?void 0:configuration.baseInnerRadiusRatio)&&void 0!==_configuration$baseIn?_configuration$baseIn:_constants2.BASE_INNER_RADIUS_RATIO),cornerRadius=null!==(_configuration$corner=null==configuration?void 0:configuration.cornerRadius)&&void 0!==_configuration$corner?_configuration$corner:_constants2.CORNER_RADIUS,padAngle=null!==(_configuration$padAng=null==configuration?void 0:configuration.padAngle)&&void 0!==_configuration$padAng?_configuration$padAng:_constants2.PAD_ANGLE,ringGap=null!==(_configuration$ringGa=null==configuration?void 0:configuration.ringGap)&&void 0!==_configuration$ringGa?_configuration$ringGa:_constants2.RING_GAP,domainEntry=null==dataset||null===(_dataset$domain=dataset.domain)||void 0===_dataset$domain?void 0:_dataset$domain[0],clusters=(0,_react.useMemo)(()=>tab.subitems||[],[tab]),valueByCode=(0,_react.useMemo)(()=>(0,_utils.getValueMapByCode)(null==domainEntry?void 0:domainEntry.concepts),[domainEntry]),pieInputsByCluster=(0,_react.useMemo)(()=>clusters.map(cluster=>cluster.map(series=>{var _valueByCode$get;const code=series.bindings.range;return{code:code,value:Number(null!==(_valueByCode$get=valueByCode.get(code))&&void 0!==_valueByCode$get?_valueByCode$get:0)}})),[clusters,valueByCode]),pie=(0,_react.useMemo)(()=>d3.pie().value(d=>d.value).sort(null).padAngle(padAngle),[padAngle]),ringCount=clusters.length||1,totalRadialSpace=outerRadius-baseInnerRadius,ringThickness=Math.max(1,(totalRadialSpace-(ringCount-1)*ringGap)/ringCount),innerMostRadius=outerRadius-ringCount*ringThickness-(ringCount-1)*ringGap,rings=(0,_react.useMemo)(()=>pieInputsByCluster.map((pieInput,clusterIndex)=>{const visibleInput=pieInput.filter(d=>d.value>0),ringOuter=outerRadius-clusterIndex*(ringThickness+ringGap),ringInner=ringOuter-ringThickness;return{clusterIndex:clusterIndex,arcs:pie(visibleInput),arcGen:d3.arc().innerRadius(ringInner).outerRadius(ringOuter).cornerRadius(cornerRadius)}}),[pieInputsByCluster,pie,outerRadius,ringThickness,ringGap,cornerRadius]),{title:title,tooltip:tooltip,value:value,icon:icon}=(null===(_tab$configuration=tab.configuration)||void 0===_tab$configuration?void 0:_tab$configuration.radialCenter)||{};return _react.default.createElement("div",{style:{position:"relative",width:width,height:height}},_react.default.createElement("svg",{width:width,height:height},_react.default.createElement("g",{transform:"translate(".concat(cX,", ").concat(cY,")")},rings.map(_ref2=>{let{clusterIndex:clusterIndex,arcs:arcs,arcGen:arcGen}=_ref2;return _react.default.createElement("g",{key:"ring-".concat(clusterIndex)},arcs.map(arcDatum=>{const d=arcGen(arcDatum),{code:code}=arcDatum.data;return _react.default.createElement("path",{key:code,d:d,fill:color(code),stroke:"white",strokeWidth:1})}))}))),_react.default.createElement("div",{style:{position:"absolute",inset:0,display:"flex",flexDirection:"column",justifyContent:"center",alignItems:"center"}},title&&_react.default.createElement(_UTLabel.default,{weight:"medium",variant:"xsmall",colorTheme:"gray",title:title},title),(null==value?void 0:value.code)&&_react.default.createElement(_UTLabel.default,{weight:"medium",variant:"title2",title:value.code},value.format?d3.format(value.format)(valueByCode.get(value.code)):valueByCode.get(value.code)),tooltip&&_react.default.createElement(_UTTooltip.default,{content:tooltip},_react.default.createElement("div",{className:_stylesModule.default.tooltipIcon},_react.default.createElement(_UTIcon.default,{name:"IconInfoCircle",size:_constants.TOOLTIP_SIZE}))),icon&&_react.default.createElement(_UTIcon.default,{name:icon,size:Math.max(innerMostRadius-ringGap,0)})))};RadialChart.propTypes={tab:_propTypes.object,width:_propTypes.number,height:_propTypes.number,dataset:_propTypes.object,color:_propTypes.func,configuration:_propTypes.object};var _default=exports.default=RadialChart;

package/dist/components/UTGraph/components/RadialChart/utils.js

@@ -1,13 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getValueMapByCode = void 0;
-const getValueMapByCode = concepts => {
-  const map = new Map();
-  if (!concepts) return map;
-  concepts.forEach(concept => map.set(concept.code, concept.value));
-  return map;
-};
-exports.getValueMapByCode = getValueMapByCode;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getValueMapByCode=void 0;const getValueMapByCode=concepts=>{const map=new Map;return concepts?(concepts.forEach(concept=>map.set(concept.code,concept.value)),map):map};exports.getValueMapByCode=getValueMapByCode;

package/dist/components/UTGraph/constants.js

@@ -1,34 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TOOLTIP_SIZE = exports.RIGHT_SIDE = exports.POINT_TYPE = exports.MIN_BAR_WIDTH = exports.MAX_BAR_WIDTH = exports.LINE_TYPE = exports.LEGEND_TYPE_STYLES = exports.LEFT_SIDE = exports.DOMAIN_NUMERICAL = exports.DOMAIN_CATEGORICAL = exports.DEFAULT_RANGE_TICK_FORMAT = exports.DEFAULT_RANGE_TICKS = exports.DEFAULT_DOMAIN_TICK_FORMAT = exports.DEFAULT_DOMAIN_TICKS = exports.DEFAULT_CARTESIAN_PLANE_MARGINS = exports.DEFAULT_BAR_WIDTH = exports.BAR_TYPE = void 0;
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const LEFT_SIDE = exports.LEFT_SIDE = 'left';
-const RIGHT_SIDE = exports.RIGHT_SIDE = 'right';
-const LINE_TYPE = exports.LINE_TYPE = 'line';
-const BAR_TYPE = exports.BAR_TYPE = 'bar';
-const POINT_TYPE = exports.POINT_TYPE = 'point';
-const DOMAIN_CATEGORICAL = exports.DOMAIN_CATEGORICAL = 'categorical';
-const DOMAIN_NUMERICAL = exports.DOMAIN_NUMERICAL = 'numerical';
-const TOOLTIP_SIZE = exports.TOOLTIP_SIZE = 17;
-const DEFAULT_DOMAIN_TICK_FORMAT = exports.DEFAULT_DOMAIN_TICK_FORMAT = '~s';
-const DEFAULT_DOMAIN_TICKS = exports.DEFAULT_DOMAIN_TICKS = 4;
-const DEFAULT_RANGE_TICK_FORMAT = exports.DEFAULT_RANGE_TICK_FORMAT = '~s';
-const DEFAULT_RANGE_TICKS = exports.DEFAULT_RANGE_TICKS = 4;
-const DEFAULT_CARTESIAN_PLANE_MARGINS = exports.DEFAULT_CARTESIAN_PLANE_MARGINS = {
-  top: 24,
-  right: 24,
-  bottom: 24,
-  left: 24
-};
-const MIN_BAR_WIDTH = exports.MIN_BAR_WIDTH = 4;
-const MAX_BAR_WIDTH = exports.MAX_BAR_WIDTH = 20;
-const DEFAULT_BAR_WIDTH = exports.DEFAULT_BAR_WIDTH = 10;
-const LEGEND_TYPE_STYLES = exports.LEGEND_TYPE_STYLES = {
-  [POINT_TYPE]: _stylesModule.default.legendPoint,
-  [BAR_TYPE]: _stylesModule.default.legendBar,
-  [LINE_TYPE]: _stylesModule.default.legendLine
-};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.TOOLTIP_SIZE=exports.RIGHT_SIDE=exports.POINT_TYPE=exports.MIN_BAR_WIDTH=exports.MAX_BAR_WIDTH=exports.LINE_TYPE=exports.LEGEND_TYPE_STYLES=exports.LEFT_SIDE=exports.DOMAIN_NUMERICAL=exports.DOMAIN_CATEGORICAL=exports.DEFAULT_RANGE_TICK_FORMAT=exports.DEFAULT_RANGE_TICKS=exports.DEFAULT_DOMAIN_TICK_FORMAT=exports.DEFAULT_DOMAIN_TICKS=exports.DEFAULT_CARTESIAN_PLANE_MARGINS=exports.DEFAULT_BAR_WIDTH=exports.BAR_TYPE=void 0;var _stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const LEFT_SIDE=exports.LEFT_SIDE="left",RIGHT_SIDE=exports.RIGHT_SIDE="right",LINE_TYPE=exports.LINE_TYPE="line",BAR_TYPE=exports.BAR_TYPE="bar",POINT_TYPE=exports.POINT_TYPE="point",DOMAIN_CATEGORICAL=exports.DOMAIN_CATEGORICAL="categorical",DOMAIN_NUMERICAL=exports.DOMAIN_NUMERICAL="numerical",TOOLTIP_SIZE=exports.TOOLTIP_SIZE=17,DEFAULT_DOMAIN_TICK_FORMAT=exports.DEFAULT_DOMAIN_TICK_FORMAT="~s",DEFAULT_DOMAIN_TICKS=exports.DEFAULT_DOMAIN_TICKS=4,DEFAULT_RANGE_TICK_FORMAT=exports.DEFAULT_RANGE_TICK_FORMAT="~s",DEFAULT_RANGE_TICKS=exports.DEFAULT_RANGE_TICKS=4,DEFAULT_CARTESIAN_PLANE_MARGINS=exports.DEFAULT_CARTESIAN_PLANE_MARGINS={top:24,right:24,bottom:24,left:24},MIN_BAR_WIDTH=exports.MIN_BAR_WIDTH=4,MAX_BAR_WIDTH=exports.MAX_BAR_WIDTH=20,DEFAULT_BAR_WIDTH=exports.DEFAULT_BAR_WIDTH=10,LEGEND_TYPE_STYLES=exports.LEGEND_TYPE_STYLES={[POINT_TYPE]:_stylesModule.default.legendPoint,[BAR_TYPE]:_stylesModule.default.legendBar,[LINE_TYPE]:_stylesModule.default.legendLine};

package/dist/components/UTGraph/index.js

@@ -1,233 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var d3 = _interopRequireWildcard(require("d3"));
-var _propTypes = require("prop-types");
-var _classesUtils = require("../../utils/classesUtils");
-var _WithTheme = _interopRequireDefault(require("../WithTheme"));
-var _UTLabel = _interopRequireDefault(require("../UTLabel"));
-var _UTButtonGroup = _interopRequireDefault(require("../UTButtonGroup"));
-var _UTIcon = _interopRequireDefault(require("../UTIcon"));
-var _UTTooltip = _interopRequireDefault(require("../UTTooltip"));
-var _Bars = _interopRequireDefault(require("./components/Bars"));
-var _Lines = _interopRequireDefault(require("./components/Lines"));
-var _CartesianPlane = _interopRequireDefault(require("./components/CartesianPlane"));
-var _RadialChart = _interopRequireDefault(require("./components/RadialChart"));
-var _utils = require("./utils");
-var _constants = require("./constants");
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-var _theme = require("./theme");
-var _Points = _interopRequireDefault(require("./components/Points"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const UTGraph = _ref => {
-  var _meta$configuration, _meta$configuration2;
-  let {
-    meta,
-    datasets,
-    classNames,
-    classes: theme
-  } = _ref;
-  const {
-    margin: cartesianPlaneMargin,
-    rangeLeftTickFormat,
-    rangeLeftTicks,
-    rangeRightTickFormat,
-    rangeRightTicks,
-    domainTickFormat,
-    domainTicks
-  } = ((_meta$configuration = meta.configuration) === null || _meta$configuration === void 0 ? void 0 : _meta$configuration.cartesianPlane) || {};
-  const styles = (0, _react.useMemo)(() => (0, _classesUtils.mergeMultipleClassNames)(_stylesModule.default, theme, classNames), [_stylesModule.default, theme, classNames]);
-  const [selectedTab, setSelectedTab] = (0, _react.useState)(meta.chart_tabs[0]);
-  const tabOptions = (0, _react.useMemo)(() => {
-    var _meta$chart_tabs;
-    return meta.chart_tabs ? (_meta$chart_tabs = meta.chart_tabs) === null || _meta$chart_tabs === void 0 ? void 0 : _meta$chart_tabs.map(tab => ({
-      Icon: tab.icon,
-      id: tab.code,
-      onClick: () => setSelectedTab(tab),
-      value: tab.code
-    })) : [];
-  }, [meta.chart_tabs]);
-  const dataset = (0, _react.useMemo)(() => datasets.find(ds => ds.code === selectedTab.code), [datasets, selectedTab]);
-  const mainAxisDomain = (0, _react.useMemo)(() => {
-    var _selectedTab$domain;
-    if (!dataset) return [];
-    if (((_selectedTab$domain = selectedTab.domain) === null || _selectedTab$domain === void 0 ? void 0 : _selectedTab$domain.binding) === _constants.DOMAIN_NUMERICAL) return (0, _utils.applyHeadroom)((0, _utils.computeMainAxisExtentNumerical)(selectedTab, dataset), {
-      padBottom: 0.08
-    });
-    return dataset.domain.map(item => item.domain_value);
-  }, [dataset, selectedTab]);
-  const crossAxisLeftDomain = (0, _react.useMemo)(() => (0, _utils.applyHeadroom)((0, _utils.computeCrossAxisDomainForSide)(selectedTab, dataset, _constants.LEFT_SIDE)), [selectedTab, dataset]);
-  const crossAxisRightDomain = (0, _react.useMemo)(() => (0, _utils.applyHeadroom)((0, _utils.computeCrossAxisDomainForSide)(selectedTab, dataset, _constants.RIGHT_SIDE)), [selectedTab, dataset]);
-  const {
-    hasLeft,
-    hasRight
-  } = (0, _utils.detectAxisSides)(selectedTab);
-
-  // TBD: colors should be retrieved from the report's meta
-  const colorDomain = (0, _react.useMemo)(() => {
-    const seriesCodes = selectedTab.subitems.flatMap(cluster => cluster.map(series => series.bindings.range).filter(Boolean));
-    const colorCodesUsed = new Set(selectedTab.subitems.flatMap(cluster => cluster.map(s => {
-      var _s$bindings;
-      return (_s$bindings = s.bindings) === null || _s$bindings === void 0 ? void 0 : _s$bindings.color;
-    }).filter(Boolean)));
-    const colorValues = [];
-    if (dataset && colorCodesUsed.size > 0) {
-      const codes = Array.from(colorCodesUsed);
-      dataset.domain.forEach(record => {
-        const dict = Object.fromEntries(record.concepts.map(d => [d.code, d.value]));
-        codes.forEach(cc => {
-          const v = dict[cc];
-          if (v != null && !colorValues.includes(v)) colorValues.push(v);
-        });
-      });
-    }
-    return Array.from(new Set([...seriesCodes, ...colorValues]));
-  }, [selectedTab, dataset]);
-  const color = (0, _react.useMemo)(() => d3.scaleOrdinal(colorDomain, d3.schemeTableau10), [colorDomain]);
-  const legendItems = (0, _react.useMemo)(() => {
-    const seen = new Set();
-    return selectedTab.subitems.flat().filter(series => {
-      const code = series.bindings.range;
-      if (!code || seen.has(code)) return false;
-      seen.add(code);
-      return true;
-    }).map(series => ({
-      code: series.bindings.range,
-      name: series.name,
-      type: series.type
-    }));
-  }, [selectedTab]);
-  const containerRef = (0, _react.useRef)(null);
-  const planeWrapperRef = (0, _react.useRef)(null);
-  const [containerSize, setContainerSize] = (0, _react.useState)({
-    width: 0,
-    height: 0
-  });
-  (0, _react.useEffect)(() => {
-    if (!containerRef.current || !planeWrapperRef.current) return;
-    const resizeObserver = new ResizeObserver(entries => {
-      if (!entries[0]) return;
-      const {
-        width,
-        height
-      } = entries[0].contentRect;
-      setContainerSize(prev => {
-        const next = {
-          width,
-          height: Math.max(height, 0)
-        };
-        if (Math.abs(prev.width - next.width) < 1 && Math.abs(prev.height - next.height) < 1) return prev;
-        return next;
-      });
-    });
-    resizeObserver.observe(planeWrapperRef.current);
-    return () => {
-      resizeObserver.disconnect();
-    };
-  }, []);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.container,
-    ref: containerRef
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.header
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.title
-  }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    variant: "subtitle1",
-    weight: "medium",
-    title: selectedTab.name
-  }, selectedTab.name), (selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.tooltip) && /*#__PURE__*/_react.default.createElement(_UTTooltip.default, {
-    content: selectedTab.tooltip
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.tooltipIcon
-  }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-    name: "IconInfoCircle",
-    size: _constants.TOOLTIP_SIZE
-  })))), tabOptions.length > 1 && /*#__PURE__*/_react.default.createElement(_UTButtonGroup.default, {
-    actions: tabOptions,
-    selected: selectedTab.code
-  })), /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.planeWrapper,
-    ref: planeWrapperRef
-  }, meta.chart_layout === 'cartesian' ? /*#__PURE__*/_react.default.createElement(_CartesianPlane.default, {
-    crossAxisLeftDomain: crossAxisLeftDomain,
-    crossAxisRightDomain: crossAxisRightDomain,
-    crossAxisLeftTickFormat: rangeLeftTickFormat || _constants.DEFAULT_RANGE_TICK_FORMAT,
-    crossAxisLeftTicks: rangeLeftTicks || _constants.DEFAULT_RANGE_TICKS,
-    crossAxisRightTickFormat: rangeRightTickFormat || _constants.DEFAULT_RANGE_TICK_FORMAT,
-    crossAxisRightTicks: rangeRightTicks || _constants.DEFAULT_RANGE_TICKS,
-    height: containerSize.height,
-    mainAxisDomain: mainAxisDomain,
-    mainAxisTickFormat: domainTickFormat || _constants.DEFAULT_DOMAIN_TICK_FORMAT,
-    mainAxisTicks: domainTicks || _constants.DEFAULT_DOMAIN_TICKS,
-    margin: cartesianPlaneMargin || _constants.DEFAULT_CARTESIAN_PLANE_MARGINS,
-    width: containerSize.width,
-    hasLeft: hasLeft,
-    hasRight: hasRight,
-    tab: selectedTab
-  }, _ref2 => {
-    let {
-      mainAxis,
-      crossAxisLeft,
-      crossAxisRight
-    } = _ref2;
-    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Bars.default, {
-      crossAxisLeft: crossAxisLeft,
-      crossAxisRight: crossAxisRight,
-      dataset: dataset,
-      mainAxis: mainAxis,
-      mainAxisDomain: mainAxisDomain,
-      tab: selectedTab,
-      color: color
-    }), /*#__PURE__*/_react.default.createElement(_Lines.default, {
-      crossAxisLeft: crossAxisLeft,
-      crossAxisRight: crossAxisRight,
-      dataset: dataset,
-      mainAxis: mainAxis,
-      mainAxisDomain: mainAxisDomain,
-      tab: selectedTab,
-      color: color
-    }), /*#__PURE__*/_react.default.createElement(_Points.default, {
-      crossAxisLeft: crossAxisLeft,
-      crossAxisRight: crossAxisRight,
-      dataset: dataset,
-      mainAxis: mainAxis,
-      mainAxisDomain: mainAxisDomain,
-      tab: selectedTab,
-      color: color
-    }));
-  }) : meta.chart_layout === 'radial' ? /*#__PURE__*/_react.default.createElement(_RadialChart.default, {
-    tab: selectedTab,
-    width: containerSize.width,
-    height: containerSize.height,
-    dataset: dataset,
-    color: color,
-    configuration: meta === null || meta === void 0 || (_meta$configuration2 = meta.configuration) === null || _meta$configuration2 === void 0 ? void 0 : _meta$configuration2.radialChart
-  }) : null), /*#__PURE__*/_react.default.createElement("div", {
-    className: styles.legends
-  }, legendItems.map(item => /*#__PURE__*/_react.default.createElement("div", {
-    key: item.code,
-    className: styles.legendItem,
-    title: item.name
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    style: {
-      backgroundColor: color(item.code)
-    },
-    className: _constants.LEGEND_TYPE_STYLES[item.type]
-  }), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    variant: "xsmall",
-    className: styles.legendLabel
-  }, item.name)))));
-};
-UTGraph.propTypes = {
-  classes: (0, _propTypes.objectOf)(_propTypes.string),
-  classNames: (0, _propTypes.objectOf)(_propTypes.string),
-  meta: _propTypes.object,
-  datasets: _propTypes.array
-};
-var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTGraph);
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),d3=_interopRequireWildcard(require("d3")),_propTypes=require("prop-types"),_classesUtils=require("../../utils/classesUtils"),_WithTheme=_interopRequireDefault(require("../WithTheme")),_UTLabel=_interopRequireDefault(require("../UTLabel")),_UTButtonGroup=_interopRequireDefault(require("../UTButtonGroup")),_UTIcon=_interopRequireDefault(require("../UTIcon")),_UTTooltip=_interopRequireDefault(require("../UTTooltip")),_Bars=_interopRequireDefault(require("./components/Bars")),_Lines=_interopRequireDefault(require("./components/Lines")),_CartesianPlane=_interopRequireDefault(require("./components/CartesianPlane")),_RadialChart=_interopRequireDefault(require("./components/RadialChart")),_utils=require("./utils"),_constants=require("./constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_theme=require("./theme"),_Points=_interopRequireDefault(require("./components/Points"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}const UTGraph=_ref=>{var _meta$configuration,_meta$configuration2;let{meta:meta,datasets:datasets,classNames:classNames,classes:theme}=_ref;const{margin:cartesianPlaneMargin,rangeLeftTickFormat:rangeLeftTickFormat,rangeLeftTicks:rangeLeftTicks,rangeRightTickFormat:rangeRightTickFormat,rangeRightTicks:rangeRightTicks,domainTickFormat:domainTickFormat,domainTicks:domainTicks}=(null===(_meta$configuration=meta.configuration)||void 0===_meta$configuration?void 0:_meta$configuration.cartesianPlane)||{},styles=(0,_react.useMemo)(()=>(0,_classesUtils.mergeMultipleClassNames)(_stylesModule.default,theme,classNames),[_stylesModule.default,theme,classNames]),[selectedTab,setSelectedTab]=(0,_react.useState)(meta.chart_tabs[0]),tabOptions=(0,_react.useMemo)(()=>{var _meta$chart_tabs;return meta.chart_tabs?null===(_meta$chart_tabs=meta.chart_tabs)||void 0===_meta$chart_tabs?void 0:_meta$chart_tabs.map(tab=>({Icon:tab.icon,id:tab.code,onClick:()=>setSelectedTab(tab),value:tab.code})):[]},[meta.chart_tabs]),dataset=(0,_react.useMemo)(()=>datasets.find(ds=>ds.code===selectedTab.code),[datasets,selectedTab]),mainAxisDomain=(0,_react.useMemo)(()=>{var _selectedTab$domain;return dataset?(null===(_selectedTab$domain=selectedTab.domain)||void 0===_selectedTab$domain?void 0:_selectedTab$domain.binding)===_constants.DOMAIN_NUMERICAL?(0,_utils.applyHeadroom)((0,_utils.computeMainAxisExtentNumerical)(selectedTab,dataset),{padBottom:.08}):dataset.domain.map(item=>item.domain_value):[]},[dataset,selectedTab]),crossAxisLeftDomain=(0,_react.useMemo)(()=>(0,_utils.applyHeadroom)((0,_utils.computeCrossAxisDomainForSide)(selectedTab,dataset,_constants.LEFT_SIDE)),[selectedTab,dataset]),crossAxisRightDomain=(0,_react.useMemo)(()=>(0,_utils.applyHeadroom)((0,_utils.computeCrossAxisDomainForSide)(selectedTab,dataset,_constants.RIGHT_SIDE)),[selectedTab,dataset]),{hasLeft:hasLeft,hasRight:hasRight}=(0,_utils.detectAxisSides)(selectedTab),colorDomain=(0,_react.useMemo)(()=>{const seriesCodes=selectedTab.subitems.flatMap(cluster=>cluster.map(series=>series.bindings.range).filter(Boolean)),colorCodesUsed=new Set(selectedTab.subitems.flatMap(cluster=>cluster.map(s=>{var _s$bindings;return null===(_s$bindings=s.bindings)||void 0===_s$bindings?void 0:_s$bindings.color}).filter(Boolean))),colorValues=[];if(dataset&&colorCodesUsed.size>0){const codes=Array.from(colorCodesUsed);dataset.domain.forEach(record=>{const dict=Object.fromEntries(record.concepts.map(d=>[d.code,d.value]));codes.forEach(cc=>{const v=dict[cc];null==v||colorValues.includes(v)||colorValues.push(v)})})}return Array.from(new Set([...seriesCodes,...colorValues]))},[selectedTab,dataset]),color=(0,_react.useMemo)(()=>d3.scaleOrdinal(colorDomain,d3.schemeTableau10),[colorDomain]),legendItems=(0,_react.useMemo)(()=>{const seen=new Set;return selectedTab.subitems.flat().filter(series=>{const code=series.bindings.range;return!(!code||seen.has(code))&&(seen.add(code),!0)}).map(series=>({code:series.bindings.range,name:series.name,type:series.type}))},[selectedTab]),containerRef=(0,_react.useRef)(null),planeWrapperRef=(0,_react.useRef)(null),[containerSize,setContainerSize]=(0,_react.useState)({width:0,height:0});return(0,_react.useEffect)(()=>{if(!containerRef.current||!planeWrapperRef.current)return;const resizeObserver=new ResizeObserver(entries=>{if(!entries[0])return;const{width:width,height:height}=entries[0].contentRect;setContainerSize(prev=>{const next={width:width,height:Math.max(height,0)};return Math.abs(prev.width-next.width)<1&&Math.abs(prev.height-next.height)<1?prev:next})});return resizeObserver.observe(planeWrapperRef.current),()=>{resizeObserver.disconnect()}},[]),_react.default.createElement("div",{className:styles.container,ref:containerRef},_react.default.createElement("div",{className:styles.header},_react.default.createElement("div",{className:styles.title},_react.default.createElement(_UTLabel.default,{variant:"subtitle1",weight:"medium",title:selectedTab.name},selectedTab.name),(null==selectedTab?void 0:selectedTab.tooltip)&&_react.default.createElement(_UTTooltip.default,{content:selectedTab.tooltip},_react.default.createElement("div",{className:styles.tooltipIcon},_react.default.createElement(_UTIcon.default,{name:"IconInfoCircle",size:_constants.TOOLTIP_SIZE})))),tabOptions.length>1&&_react.default.createElement(_UTButtonGroup.default,{actions:tabOptions,selected:selectedTab.code})),_react.default.createElement("div",{className:styles.planeWrapper,ref:planeWrapperRef},"cartesian"===meta.chart_layout?_react.default.createElement(_CartesianPlane.default,{crossAxisLeftDomain:crossAxisLeftDomain,crossAxisRightDomain:crossAxisRightDomain,crossAxisLeftTickFormat:rangeLeftTickFormat||_constants.DEFAULT_RANGE_TICK_FORMAT,crossAxisLeftTicks:rangeLeftTicks||_constants.DEFAULT_RANGE_TICKS,crossAxisRightTickFormat:rangeRightTickFormat||_constants.DEFAULT_RANGE_TICK_FORMAT,crossAxisRightTicks:rangeRightTicks||_constants.DEFAULT_RANGE_TICKS,height:containerSize.height,mainAxisDomain:mainAxisDomain,mainAxisTickFormat:domainTickFormat||_constants.DEFAULT_DOMAIN_TICK_FORMAT,mainAxisTicks:domainTicks||_constants.DEFAULT_DOMAIN_TICKS,margin:cartesianPlaneMargin||_constants.DEFAULT_CARTESIAN_PLANE_MARGINS,width:containerSize.width,hasLeft:hasLeft,hasRight:hasRight,tab:selectedTab},_ref2=>{let{mainAxis:mainAxis,crossAxisLeft:crossAxisLeft,crossAxisRight:crossAxisRight}=_ref2;return _react.default.createElement(_react.default.Fragment,null,_react.default.createElement(_Bars.default,{crossAxisLeft:crossAxisLeft,crossAxisRight:crossAxisRight,dataset:dataset,mainAxis:mainAxis,mainAxisDomain:mainAxisDomain,tab:selectedTab,color:color}),_react.default.createElement(_Lines.default,{crossAxisLeft:crossAxisLeft,crossAxisRight:crossAxisRight,dataset:dataset,mainAxis:mainAxis,mainAxisDomain:mainAxisDomain,tab:selectedTab,color:color}),_react.default.createElement(_Points.default,{crossAxisLeft:crossAxisLeft,crossAxisRight:crossAxisRight,dataset:dataset,mainAxis:mainAxis,mainAxisDomain:mainAxisDomain,tab:selectedTab,color:color}))}):"radial"===meta.chart_layout?_react.default.createElement(_RadialChart.default,{tab:selectedTab,width:containerSize.width,height:containerSize.height,dataset:dataset,color:color,configuration:null==meta||null===(_meta$configuration2=meta.configuration)||void 0===_meta$configuration2?void 0:_meta$configuration2.radialChart}):null),_react.default.createElement("div",{className:styles.legends},legendItems.map(item=>_react.default.createElement("div",{key:item.code,className:styles.legendItem,title:item.name},_react.default.createElement("div",{style:{backgroundColor:color(item.code)},className:_constants.LEGEND_TYPE_STYLES[item.type]}),_react.default.createElement(_UTLabel.default,{variant:"xsmall",className:styles.legendLabel},item.name)))))};UTGraph.propTypes={classes:(0,_propTypes.objectOf)(_propTypes.string),classNames:(0,_propTypes.objectOf)(_propTypes.string),meta:_propTypes.object,datasets:_propTypes.array};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(UTGraph);

package/dist/components/UTGraph/theme.js

@@ -1,24 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.retrieveStyle = void 0;
-var _shadowUtils = require("../../utils/shadowUtils");
-var _Palette = require("../../constants/Palette");
-const retrieveStyle = _ref => {
-  var _theme$Palette$shadow;
-  let {
-    theme
-  } = _ref;
-  return {
-    container: {
-      backgroundColor: theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade01],
-      boxShadow: (0, _shadowUtils.getShadow)({
-        color: (_theme$Palette$shadow = theme.Palette.shadows) === null || _theme$Palette$shadow === void 0 ? void 0 : _theme$Palette$shadow.grayscale,
-        level: 1
-      })
-    }
-  };
-};
-exports.retrieveStyle = retrieveStyle;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;var _shadowUtils=require("../../utils/shadowUtils"),_Palette=require("../../constants/Palette");const retrieveStyle=_ref=>{var _theme$Palette$shadow;let{theme:theme}=_ref;return{container:{backgroundColor:theme.Palette[_Palette.COLOR_THEMES.light][_Palette.COLOR_SHADES.shade01],boxShadow:(0,_shadowUtils.getShadow)({color:null===(_theme$Palette$shadow=theme.Palette.shadows)||void 0===_theme$Palette$shadow?void 0:_theme$Palette$shadow.grayscale,level:1})}}};exports.retrieveStyle=retrieveStyle;