@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/deprecated/UTPieChart/index.js

@@ -1 +1,180 @@
-"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"),_energyHooks=require("@widergy/energy-hooks"),_commonTypes=require("../../types/commonTypes"),_WithTheme=_interopRequireDefault(require("../../components/WithTheme")),_theme=require("./theme"),_Legend=_interopRequireDefault(require("./components/Legend")),_ArrowLabel=_interopRequireDefault(require("./components/ArrowLabel")),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_utils=require("./utils"),_constants=require("./constants"),_contants=require("./components/Legend/contants");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)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}const UTPieChart=_ref=>{let{animationLength:animationLength,classes:classes,className:className,classNames:classNames={},data:data,gradientGenerator:gradientGenerator,height:height,initialAngle:initialAngle,innerRadius:innerRadius,legend:legend,minAngle:minAngle,onClickItem:onClickItem,outerRadius:outerRadius,outlined:outlined,paddingAngle:paddingAngle,showPercentageInLegend:showPercentageInLegend,showValueInLegend:showValueInLegend,transition:transition,width:width,withLabels:withLabels,withLegend:withLegend}=_ref;const totalSum=data.reduce((acc,_ref2)=>{let{value:value}=_ref2;return acc+value},0),{animatedValue:pieGrowth,animate:animate}=(0,_energyHooks.useAnimatedValue)({transition:transition}),{width:containerWidth,height:containerHeight,ref:ref}=(0,_energyHooks.useComponentDimensions)();(0,_react.useEffect)(()=>{animate(100*totalSum,0,animationLength)},[]);const newPieData=[...data,{value:pieGrowth,color:_constants.TRANSPARENT,id:_constants.ANIMATION_ID}],outlineGenerator=d3.arc().innerRadius(outerRadius+_constants.OUTLINE_SEPARATION).outerRadius(outerRadius+_constants.OUTLINE_SEPARATION+_constants.OUTLINE_WIDTH).padAngle(paddingAngle),arcGenerator=d3.arc().innerRadius(innerRadius).outerRadius(outerRadius).padAngle(paddingAngle),pie=d3.pie().startAngle(Math.PI/2+initialAngle).endAngle(2*Math.PI+(Math.PI/2+initialAngle)).sort((a,b)=>a.value>b.value?1:-1).sort(_utils.animationSort).value(_ref3=>{let{value:value,id:id}=_ref3;return id?value:value/totalSum<minAngle?totalSum*minAngle:value})(newPieData),{position:position=_contants.DEFAULT_POSITION}=legend;return _react.default.createElement("div",{style:{width:width,height:height},className:"".concat(_stylesModule.default.container," ").concat(className," ").concat(_stylesModule.default["".concat(position.split("-")[0],"Container")])},_react.default.createElement("div",{className:"".concat(_stylesModule.default["".concat(position.split("-")[0],"LegendWrapper")]," ").concat(_stylesModule.default[position])},withLegend&&_react.default.createElement(_Legend.default,{classes:classes,data:data,legend:legend,showPercentage:showPercentageInLegend,showValue:showValueInLegend,totalConsumption:totalSum})),_react.default.createElement("div",{className:"".concat(_stylesModule.default["".concat(position.split("-")[0],"PieWrapper")]," ").concat(classNames.chartContainer),ref:ref},_react.default.createElement("svg",{viewBox:"".concat(-containerWidth/2," ").concat(-containerHeight/2," ").concat(containerWidth," ").concat(containerHeight),width:containerWidth,height:containerHeight},null==gradientGenerator?void 0:gradientGenerator(),pie.map(slice=>_react.default.createElement("path",_extends({d:arcGenerator(slice),fill:slice.data.color},onClickItem&&{className:_stylesModule.default.clickableItem,onClick:onClickItem(slice)}))),outlined&&pie.map(slice=>_react.default.createElement("path",{d:outlineGenerator(slice),fill:slice.data.color})),withLabels&&_react.default.createElement("g",null,pie.map(slice=>{const{endAngle:endAngle,startAngle:startAngle}=slice,{label:label,color:color,value:value,id:id}=slice.data;return!id&&(label||value)&&_react.default.createElement(_ArrowLabel.default,{color:color,label:label,midAngle:(endAngle-startAngle)/2+startAngle,outerRadius:outerRadius+(outlined?_constants.OUTLINE_SEPARATION+_constants.OUTLINE_WIDTH:0),value:value/totalSum})})))))};UTPieChart.propTypes={animationLength:_propTypes.number,classes:_commonTypes.classesType,className:_propTypes.string,classNames:(0,_propTypes.shape)({chartContainer:_propTypes.string}),data:(0,_propTypes.arrayOf)((0,_propTypes.shape)({color:_propTypes.string,label:_propTypes.string,value:_propTypes.number})),gradientGenerator:_propTypes.func,height:_propTypes.number,initialAngle:_propTypes.number,innerRadius:_propTypes.number,legend:(0,_propTypes.shape)({position:_propTypes.string,type:_propTypes.string}),minAngle:_propTypes.number,onClickItem:_propTypes.func,outerRadius:_propTypes.number,outlined:_propTypes.bool,paddingAngle:_propTypes.number,showPercentageInLegend:_propTypes.bool,showValueInLegend:_propTypes.bool,transition:_propTypes.string,width:_propTypes.number,withLabels:_propTypes.bool,withLegend:_propTypes.bool},UTPieChart.defaultProps={animationLength:_constants.DEFAULT_ANIMATION_LENGTH,classes:{},data:_constants.DEFAULT_DATA,initialAngle:_constants.DEFAULT_INITIAL_ANGLE,innerRadius:_constants.DEFAULT_INNER_RADIUS,legend:_constants.DEFAULT_LEGEND,minAngle:_constants.DEFAULT_MIN_ANGLE,outerRadius:_constants.DEFAULT_OUTER_RADIUS,paddingAngle:_constants.DEFAULT_PADDING_ANGLE,transition:_constants.DEFAULT_TRANSITION};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(UTPieChart);
+"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 _energyHooks = require("@widergy/energy-hooks");
+var _commonTypes = require("../../types/commonTypes");
+var _WithTheme = _interopRequireDefault(require("../../components/WithTheme"));
+var _theme = require("./theme");
+var _Legend = _interopRequireDefault(require("./components/Legend"));
+var _ArrowLabel = _interopRequireDefault(require("./components/ArrowLabel"));
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+var _utils = require("./utils");
+var _constants = require("./constants");
+var _contants = require("./components/Legend/contants");
+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); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const UTPieChart = _ref => {
+  let {
+    animationLength,
+    classes,
+    className,
+    classNames = {},
+    data,
+    gradientGenerator,
+    height,
+    initialAngle,
+    innerRadius,
+    legend,
+    minAngle,
+    onClickItem,
+    outerRadius,
+    outlined,
+    paddingAngle,
+    showPercentageInLegend,
+    showValueInLegend,
+    transition,
+    width,
+    withLabels,
+    withLegend
+  } = _ref;
+  const totalSum = data.reduce((acc, _ref2) => {
+    let {
+      value
+    } = _ref2;
+    return acc + value;
+  }, 0);
+  const {
+    animatedValue: pieGrowth,
+    animate
+  } = (0, _energyHooks.useAnimatedValue)({
+    transition
+  });
+  const {
+    width: containerWidth,
+    height: containerHeight,
+    ref
+  } = (0, _energyHooks.useComponentDimensions)();
+  (0, _react.useEffect)(() => {
+    animate(totalSum * 100, 0, animationLength);
+  }, []);
+  const newPieData = [...data, {
+    value: pieGrowth,
+    color: _constants.TRANSPARENT,
+    id: _constants.ANIMATION_ID
+  }];
+  const outlineGenerator = d3.arc().innerRadius(outerRadius + _constants.OUTLINE_SEPARATION).outerRadius(outerRadius + _constants.OUTLINE_SEPARATION + _constants.OUTLINE_WIDTH).padAngle(paddingAngle);
+  const arcGenerator = d3.arc().innerRadius(innerRadius).outerRadius(outerRadius).padAngle(paddingAngle);
+  const pieGenerator = d3.pie().startAngle(Math.PI / 2 + initialAngle).endAngle(2 * Math.PI + (Math.PI / 2 + initialAngle)).sort((a, b) => a.value > b.value ? 1 : -1).sort(_utils.animationSort).value(_ref3 => {
+    let {
+      value,
+      id
+    } = _ref3;
+    return id ? value : value / totalSum < minAngle ? totalSum * minAngle : value;
+  });
+  const pie = pieGenerator(newPieData);
+  const {
+    position = _contants.DEFAULT_POSITION
+  } = legend;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width,
+      height
+    },
+    className: "".concat(_stylesModule.default.container, " ").concat(className, " ").concat(_stylesModule.default["".concat(position.split('-')[0], "Container")])
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default["".concat(position.split('-')[0], "LegendWrapper")], " ").concat(_stylesModule.default[position])
+  }, withLegend && /*#__PURE__*/_react.default.createElement(_Legend.default, {
+    classes: classes,
+    data: data,
+    legend: legend,
+    showPercentage: showPercentageInLegend,
+    showValue: showValueInLegend,
+    totalConsumption: totalSum
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default["".concat(position.split('-')[0], "PieWrapper")], " ").concat(classNames.chartContainer),
+    ref: ref
+  }, /*#__PURE__*/_react.default.createElement("svg", {
+    viewBox: "".concat(-containerWidth / 2, " ").concat(-containerHeight / 2, " ").concat(containerWidth, " ").concat(containerHeight),
+    width: containerWidth,
+    height: containerHeight
+  }, gradientGenerator === null || gradientGenerator === void 0 ? void 0 : gradientGenerator(), pie.map(slice => /*#__PURE__*/_react.default.createElement("path", _extends({
+    d: arcGenerator(slice),
+    fill: slice.data.color
+  }, onClickItem && {
+    className: _stylesModule.default.clickableItem,
+    onClick: onClickItem(slice)
+  }))), outlined && pie.map(slice => /*#__PURE__*/_react.default.createElement("path", {
+    d: outlineGenerator(slice),
+    fill: slice.data.color
+  })), withLabels && /*#__PURE__*/_react.default.createElement("g", null, pie.map(slice => {
+    const {
+      endAngle,
+      startAngle
+    } = slice;
+    const {
+      label,
+      color,
+      value,
+      id
+    } = slice.data;
+    return !id && (label || value) && /*#__PURE__*/_react.default.createElement(_ArrowLabel.default, {
+      color: color,
+      label: label,
+      midAngle: (endAngle - startAngle) / 2 + startAngle,
+      outerRadius: outerRadius + (outlined ? _constants.OUTLINE_SEPARATION + _constants.OUTLINE_WIDTH : 0),
+      value: value / totalSum
+    });
+  })))));
+};
+UTPieChart.propTypes = {
+  animationLength: _propTypes.number,
+  classes: _commonTypes.classesType,
+  className: _propTypes.string,
+  classNames: (0, _propTypes.shape)({
+    chartContainer: _propTypes.string
+  }),
+  data: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    color: _propTypes.string,
+    label: _propTypes.string,
+    value: _propTypes.number
+  })),
+  gradientGenerator: _propTypes.func,
+  height: _propTypes.number,
+  initialAngle: _propTypes.number,
+  innerRadius: _propTypes.number,
+  legend: (0, _propTypes.shape)({
+    position: _propTypes.string,
+    type: _propTypes.string
+  }),
+  minAngle: _propTypes.number,
+  onClickItem: _propTypes.func,
+  outerRadius: _propTypes.number,
+  outlined: _propTypes.bool,
+  paddingAngle: _propTypes.number,
+  showPercentageInLegend: _propTypes.bool,
+  showValueInLegend: _propTypes.bool,
+  transition: _propTypes.string,
+  width: _propTypes.number,
+  withLabels: _propTypes.bool,
+  withLegend: _propTypes.bool
+};
+UTPieChart.defaultProps = {
+  animationLength: _constants.DEFAULT_ANIMATION_LENGTH,
+  classes: {},
+  data: _constants.DEFAULT_DATA,
+  initialAngle: _constants.DEFAULT_INITIAL_ANGLE,
+  innerRadius: _constants.DEFAULT_INNER_RADIUS,
+  legend: _constants.DEFAULT_LEGEND,
+  minAngle: _constants.DEFAULT_MIN_ANGLE,
+  outerRadius: _constants.DEFAULT_OUTER_RADIUS,
+  paddingAngle: _constants.DEFAULT_PADDING_ANGLE,
+  transition: _constants.DEFAULT_TRANSITION
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTPieChart);

package/dist/deprecated/UTPieChart/theme.js

@@ -1 +1,36 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;var _seamlessImmutable=require("seamless-immutable");const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{legendLabel:{fontWeight:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendLabel","fontWeight"]),textTransform:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendLabel","textTransform"]),fontSize:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendLabel","fontSize"]),color:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendLabel","color"])},legendValueLabel:{fontWeight:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendValueLabel","fontWeight"]),textTransform:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendValueLabel","textTransform"]),fontSize:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendValueLabel","fontSize"]),color:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendValueLabel","color"])},legendsContainer:{display:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendsContainer","display"]),flexWrap:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendsContainer","flexWrap"]),justifyContent:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendsContainer","justifyContent"])},legendItem:{margin:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendItem","margin"]),width:(0,_seamlessImmutable.getIn)(theme,["UTPieChart","legendItem","width"])}}};exports.retrieveStyle=retrieveStyle;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+var _seamlessImmutable = require("seamless-immutable");
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    legendLabel: {
+      fontWeight: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendLabel', 'fontWeight']),
+      textTransform: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendLabel', 'textTransform']),
+      fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendLabel', 'fontSize']),
+      color: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendLabel', 'color'])
+    },
+    legendValueLabel: {
+      fontWeight: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendValueLabel', 'fontWeight']),
+      textTransform: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendValueLabel', 'textTransform']),
+      fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendValueLabel', 'fontSize']),
+      color: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendValueLabel', 'color'])
+    },
+    legendsContainer: {
+      display: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendsContainer', 'display']),
+      flexWrap: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendsContainer', 'flexWrap']),
+      justifyContent: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendsContainer', 'justifyContent'])
+    },
+    legendItem: {
+      margin: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendItem', 'margin']),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTPieChart', 'legendItem', 'width'])
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/deprecated/UTPieChart/utils.js

@@ -1 +1,14 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.animationSort=void 0;var _constants=require("./constants");const animationSort=_ref=>{let{id:id}=_ref;return id===_constants.ANIMATION_ID?0:-1};exports.animationSort=animationSort;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.animationSort = void 0;
+var _constants = require("./constants");
+const animationSort = _ref => {
+  let {
+    id
+  } = _ref;
+  return id === _constants.ANIMATION_ID ? 0 : -1;
+};
+exports.animationSort = animationSort;

package/dist/deprecated/UTToggle/components/ToggleOption/index.js

@@ -1 +1,55 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_UTTouchableWithoutFeedback=_interopRequireDefault(require("../../../../components/UTTouchableWithoutFeedback")),_UTLabel=_interopRequireDefault(require("../../../../components/UTLabel"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const ToggleOption=_ref=>{let{className:className,classes:classes,dataTestId:dataTestId,Icon:Icon,iconClassName:iconClassName,isSelected:isSelected,keyName:keyName,label:label,onChange:onChange,SelectedIcon:SelectedIcon,value:value}=_ref;const IconComponent=Icon&&(SelectedIcon&&isSelected?_react.default.createElement(SelectedIcon,{className:"".concat(classes.icon," ").concat(iconClassName)}):_react.default.createElement(Icon,{className:"".concat(classes.icon," ").concat(isSelected?classes.selectedIcon:classes.unselectedIcon," ").concat(iconClassName)}));return _react.default.createElement(_UTTouchableWithoutFeedback.default,{className:"".concat(classes.option," ").concat(isSelected&&classes.selectedOption," ").concat(className),dataTestId:dataTestId,keyName:keyName,onClick:()=>onChange(value)},Icon?IconComponent:_react.default.createElement(_UTLabel.default,{variant:"small",className:isSelected?classes.selectedLabel:classes.unSelectedLabel},label))};ToggleOption.propTypes={className:_propTypes.string,classes:(0,_propTypes.objectOf)(_propTypes.string),dataTestId:_propTypes.string,Icon:_propTypes.elementType,iconClassName:_propTypes.string,isSelected:_propTypes.bool,keyName:_propTypes.string,label:_propTypes.string,onChange:_propTypes.func,SelectedIcon:_propTypes.elementType,value:_propTypes.string};var _default=exports.default=ToggleOption;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = require("prop-types");
+var _UTTouchableWithoutFeedback = _interopRequireDefault(require("../../../../components/UTTouchableWithoutFeedback"));
+var _UTLabel = _interopRequireDefault(require("../../../../components/UTLabel"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const ToggleOption = _ref => {
+  let {
+    className,
+    classes,
+    dataTestId,
+    Icon,
+    iconClassName,
+    isSelected,
+    keyName,
+    label,
+    onChange,
+    SelectedIcon,
+    value
+  } = _ref;
+  const onHandleClick = () => onChange(value);
+  const IconComponent = Icon && (SelectedIcon && isSelected ? /*#__PURE__*/_react.default.createElement(SelectedIcon, {
+    className: "".concat(classes.icon, " ").concat(iconClassName)
+  }) : /*#__PURE__*/_react.default.createElement(Icon, {
+    className: "".concat(classes.icon, " ").concat(isSelected ? classes.selectedIcon : classes.unselectedIcon, " ").concat(iconClassName)
+  }));
+  return /*#__PURE__*/_react.default.createElement(_UTTouchableWithoutFeedback.default, {
+    className: "".concat(classes.option, " ").concat(isSelected && classes.selectedOption, " ").concat(className),
+    dataTestId: dataTestId,
+    keyName: keyName,
+    onClick: onHandleClick
+  }, Icon ? IconComponent : /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    variant: "small",
+    className: isSelected ? classes.selectedLabel : classes.unSelectedLabel
+  }, label));
+};
+ToggleOption.propTypes = {
+  className: _propTypes.string,
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  dataTestId: _propTypes.string,
+  Icon: _propTypes.elementType,
+  iconClassName: _propTypes.string,
+  isSelected: _propTypes.bool,
+  keyName: _propTypes.string,
+  label: _propTypes.string,
+  onChange: _propTypes.func,
+  SelectedIcon: _propTypes.elementType,
+  value: _propTypes.string
+};
+var _default = exports.default = ToggleOption;

package/dist/deprecated/UTToggle/index.js

@@ -1 +1,59 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_WithTheme=_interopRequireDefault(require("../../components/WithTheme")),_ToggleOption=_interopRequireDefault(require("./components/ToggleOption")),_theme=require("./theme");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const UTToggle=_ref=>{let{className:className,classes:classes,dataTestId:dataTestId,onChangeOption:onChangeOption,optionClassName:optionClassName,options:options,orientation:orientation,selectedOption:selectedOption}=_ref;const containerStyle="".concat(classes.container," ").concat("horizontal"===orientation?classes.horizontalContainer:classes.verticalContainer," ").concat(className," ");return _react.default.createElement("div",{className:containerStyle},options.map((option,index)=>_react.default.createElement(_ToggleOption.default,{className:optionClassName,classes:classes,dataTestId:"".concat(dataTestId).concat(index),Icon:option.Icon,iconClassName:option.iconClassName,isSelected:option.value===selectedOption,key:option.key,keyName:"toggle-option-".concat(option.value),label:option.label,SelectedIcon:option.SelectedIcon,onChange:onChangeOption,value:option.value})))};UTToggle.propTypes={className:_propTypes.string,classes:(0,_propTypes.objectOf)(_propTypes.string),dataTestId:_propTypes.string,onChangeOption:_propTypes.func,optionClassName:_propTypes.string,options:(0,_propTypes.arrayOf)((0,_propTypes.shape)({className:_propTypes.string,Icon:_propTypes.elementType,key:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]),label:_propTypes.string,SelectedIcon:_propTypes.elementType,value:_propTypes.string})),orientation:_propTypes.string,selectedOption:_propTypes.string};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(UTToggle);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = require("prop-types");
+var _WithTheme = _interopRequireDefault(require("../../components/WithTheme"));
+var _ToggleOption = _interopRequireDefault(require("./components/ToggleOption"));
+var _theme = require("./theme");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const UTToggle = _ref => {
+  let {
+    className,
+    classes,
+    dataTestId,
+    onChangeOption,
+    optionClassName,
+    options,
+    orientation,
+    selectedOption
+  } = _ref;
+  const containerStyle = "".concat(classes.container, " ").concat(orientation === 'horizontal' ? classes.horizontalContainer : classes.verticalContainer, " ").concat(className, " ");
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: containerStyle
+  }, options.map((option, index) => /*#__PURE__*/_react.default.createElement(_ToggleOption.default, {
+    className: optionClassName,
+    classes: classes,
+    dataTestId: "".concat(dataTestId).concat(index),
+    Icon: option.Icon,
+    iconClassName: option.iconClassName,
+    isSelected: option.value === selectedOption,
+    key: option.key,
+    keyName: "toggle-option-".concat(option.value),
+    label: option.label,
+    SelectedIcon: option.SelectedIcon,
+    onChange: onChangeOption,
+    value: option.value
+  })));
+};
+UTToggle.propTypes = {
+  className: _propTypes.string,
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  dataTestId: _propTypes.string,
+  onChangeOption: _propTypes.func,
+  optionClassName: _propTypes.string,
+  options: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    className: _propTypes.string,
+    Icon: _propTypes.elementType,
+    key: (0, _propTypes.oneOfType)([_propTypes.string, _propTypes.number]),
+    label: _propTypes.string,
+    SelectedIcon: _propTypes.elementType,
+    value: _propTypes.string
+  })),
+  orientation: _propTypes.string,
+  selectedOption: _propTypes.string
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTToggle);

package/dist/deprecated/UTToggle/theme.js

@@ -1 +1,62 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;var _seamlessImmutable=require("seamless-immutable"),_colorsModule=_interopRequireDefault(require("../../scss/variables/colors.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{container:{alignItems:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","alignItems"],"center"),backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","backgroundColor"]),borderRadius:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","borderRadius"],"30px"),display:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","display"],"flex"),height:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","height"],"fit-content"),maxHeight:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","maxHeight"],"fit-content"),maxWidth:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","maxWidth"],"fit-content"),width:(0,_seamlessImmutable.getIn)(theme,["UTToggle","container","width"],"fit-content")},horizontalContainer:{flexDirection:(0,_seamlessImmutable.getIn)(theme,["UTToggle","horizontalContainer","flexDirection"],"row")},verticalContainer:{flexDirection:(0,_seamlessImmutable.getIn)(theme,["UTToggle","verticalContainer","flexDirection"],"column")},option:{alignItems:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","alignItems"],"center"),borderRadius:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","borderRadius"],"30px"),display:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","display"],"flex"),height:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","height"],"40px"),justifyContent:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","justifyContent"],"center"),transition:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","transition"],"background-color 0.4s ease"),width:(0,_seamlessImmutable.getIn)(theme,["UTToggle","option","width"],"40px")},selectedOption:{backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTToggle","selectedOption","backgroundColor"]),pointerEvents:(0,_seamlessImmutable.getIn)(theme,["UTToggle","selectedOption","pointerEvents"],"none")},selectedLabel:{color:(0,_seamlessImmutable.getIn)(theme,["UTToggle","selectedLabel","color"],"".concat(_colorsModule.default.white))},unSelectedLabel:{color:(0,_seamlessImmutable.getIn)(theme,["UTToggle","unSelectedLabel","color"])},icon:{height:(0,_seamlessImmutable.getIn)(theme,["UTToggle","icon","height"],"24px"),width:(0,_seamlessImmutable.getIn)(theme,["UTToggle","icon","width"],"24px")},unselectedIcon:{fill:(0,_seamlessImmutable.getIn)(theme,["UTToggle","unselectedIcon","fill"])},selectedIcon:{fill:(0,_seamlessImmutable.getIn)(theme,["UTToggle","selectedIcon","fill"],"".concat(_colorsModule.default.white))}}};exports.retrieveStyle=retrieveStyle;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+var _seamlessImmutable = require("seamless-immutable");
+var _colorsModule = _interopRequireDefault(require("../../scss/variables/colors.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    container: {
+      alignItems: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'alignItems'], 'center'),
+      backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'backgroundColor']),
+      borderRadius: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'borderRadius'], '30px'),
+      display: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'display'], 'flex'),
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'height'], 'fit-content'),
+      maxHeight: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'maxHeight'], 'fit-content'),
+      maxWidth: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'maxWidth'], 'fit-content'),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'container', 'width'], 'fit-content')
+    },
+    horizontalContainer: {
+      flexDirection: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'horizontalContainer', 'flexDirection'], 'row')
+    },
+    verticalContainer: {
+      flexDirection: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'verticalContainer', 'flexDirection'], 'column')
+    },
+    option: {
+      alignItems: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'alignItems'], 'center'),
+      borderRadius: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'borderRadius'], '30px'),
+      display: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'display'], 'flex'),
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'height'], '40px'),
+      justifyContent: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'justifyContent'], 'center'),
+      transition: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'transition'], 'background-color 0.4s ease'),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'option', 'width'], '40px')
+    },
+    selectedOption: {
+      backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'selectedOption', 'backgroundColor']),
+      pointerEvents: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'selectedOption', 'pointerEvents'], 'none')
+    },
+    selectedLabel: {
+      color: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'selectedLabel', 'color'], "".concat(_colorsModule.default.white))
+    },
+    unSelectedLabel: {
+      color: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'unSelectedLabel', 'color'])
+    },
+    icon: {
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'icon', 'height'], '24px'),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'icon', 'width'], '24px')
+    },
+    unselectedIcon: {
+      fill: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'unselectedIcon', 'fill'])
+    },
+    selectedIcon: {
+      fill: (0, _seamlessImmutable.getIn)(theme, ['UTToggle', 'selectedIcon', 'fill'], "".concat(_colorsModule.default.white))
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/esm/components/EnergyThemeProvider/index.js

@@ -1 +1,18 @@
-import React,{PureComponent}from"react";import{object}from"prop-types";import{EnergyThemeProvider}from"../../theme";class ThemeProvider extends PureComponent{render(){const{children:children,theme:theme}=this.props;return React.createElement(EnergyThemeProvider,{value:theme},children)}}ThemeProvider.propTypes={theme:object};export default ThemeProvider;
+import React, { PureComponent } from 'react';
+import { object } from 'prop-types';
+import { EnergyThemeProvider } from '../../theme';
+class ThemeProvider extends PureComponent {
+  render() {
+    const {
+      children,
+      theme
+    } = this.props;
+    return /*#__PURE__*/React.createElement(EnergyThemeProvider, {
+      value: theme
+    }, children);
+  }
+}
+ThemeProvider.propTypes = {
+  theme: object
+};
+export default ThemeProvider;

package/dist/esm/components/Loading/constants.js

@@ -1 +1 @@
-export const DEFAULT_LOADING_TEXT="Cargando";
+export const DEFAULT_LOADING_TEXT = 'Cargando';

package/dist/esm/components/Loading/index.js

@@ -1 +1,41 @@
-import React from"react";import{string,number,object,objectOf}from"prop-types";import CircularProgress from"@material-ui/core/CircularProgress";import{getIn}from"seamless-immutable";import UTLabel from"../UTLabel";import WithTheme from"../WithTheme";import{retrieveStyle}from"./theme";import styles from"./styles.module.scss";import{DEFAULT_LOADING_TEXT}from"./constants";const Loading=_ref=>{let{classes:classes,className:className,size:size,text:text=DEFAULT_LOADING_TEXT,textClassName:textClassName,theme:theme,thickness:thickness}=_ref;const defaultSize=getIn(theme,["Loading","base","size"],85),defaultThickness=getIn(theme,["Loading","base","thickness"],1.5);return React.createElement("div",{className:"".concat(styles.container," ").concat(className)},React.createElement(CircularProgress,{className:classes.base,size:size||defaultSize,thickness:thickness||defaultThickness}),React.createElement(UTLabel,{className:"".concat(styles.text," ").concat(classes.text," ").concat(textClassName)},text))};Loading.propTypes={classes:objectOf(string),className:string,size:number,text:string,textClassName:string,theme:object,thickness:number};export default WithTheme(retrieveStyle)(Loading);
+import React from 'react';
+import { string, number, object, objectOf } from 'prop-types';
+import CircularProgress from '@material-ui/core/CircularProgress';
+import { getIn } from 'seamless-immutable';
+import UTLabel from '../UTLabel';
+import WithTheme from '../WithTheme';
+import { retrieveStyle } from './theme';
+import styles from './styles.module.scss';
+import { DEFAULT_LOADING_TEXT } from './constants';
+const Loading = _ref => {
+  let {
+    classes,
+    className,
+    size,
+    text = DEFAULT_LOADING_TEXT,
+    textClassName,
+    theme,
+    thickness
+  } = _ref;
+  const defaultSize = getIn(theme, ['Loading', 'base', 'size'], 85);
+  const defaultThickness = getIn(theme, ['Loading', 'base', 'thickness'], 1.5);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.container, " ").concat(className)
+  }, /*#__PURE__*/React.createElement(CircularProgress, {
+    className: classes.base,
+    size: size || defaultSize,
+    thickness: thickness || defaultThickness
+  }), /*#__PURE__*/React.createElement(UTLabel, {
+    className: "".concat(styles.text, " ").concat(classes.text, " ").concat(textClassName)
+  }, text));
+};
+Loading.propTypes = {
+  classes: objectOf(string),
+  className: string,
+  size: number,
+  text: string,
+  textClassName: string,
+  theme: object,
+  thickness: number
+};
+export default WithTheme(retrieveStyle)(Loading);

package/dist/esm/components/Loading/theme.js

@@ -1 +1,16 @@
-import{getIn}from"seamless-immutable";import Colors from"../../scss/variables/colors.module.scss";export const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{base:{color:getIn(theme,["Loading","base","color"],Colors.loadingBase)},text:{color:getIn(theme,["Loading","text","color"],Colors.black),fontSize:getIn(theme,["Loading","text","fontSize"],getIn(theme,["Fonts","medium"]))}}};
+import { getIn } from 'seamless-immutable';
+import Colors from '../../scss/variables/colors.module.scss';
+export const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    base: {
+      color: getIn(theme, ['Loading', 'base', 'color'], Colors.loadingBase)
+    },
+    text: {
+      color: getIn(theme, ['Loading', 'text', 'color'], Colors.black),
+      fontSize: getIn(theme, ['Loading', 'text', 'fontSize'], getIn(theme, ['Fonts', 'medium']))
+    }
+  };
+};

package/dist/esm/components/UTActionCard/README.md

@@ -0,0 +1,26 @@
+# UTButton
+
+## Props
+
+
+| Name                   | Type                                                                                                                                                                                                     | Default    | Description                                                            |
+| :----------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | ------------------------------------------------------------------------ |
+| `additionalMessage`    | `shape({ Icon: elementType, iconProps: shape({ colorTheme: string, size: string }), labelProps: shape({ colorTheme: string, variant: string }), message: string })`                                      |            | Additional message information, including icons and labels.            |
+| `adornment`            | `shape({ alignment: oneOf(['center', 'end', 'start']), position: string, props: object, type: string })`                                                                                                 |            | Adornment object to customize alignment, position, and type.           |
+| `BackgroundImage`      | `elementType`                                                                                                                                                                                            |            | A React component for the background image.                            |
+| `bottomActions`        | `arrayOf(shape({ colorTheme: string, disabled: bool, Icon: elementType, label: string, loading: bool, onClick: func }))`                                                                                 |            | Defines the list of actions to be displayed at the bottom of the card. |
+| `bottomActionsVariant` | `oneOf(['default', 'redirection'])`                                                                                                                                                                      |            | Sets the style variant for bottom actions.                             |
+| `classNames`           | `objectOf(string)`                                                                                                                                                                                       |            | Css classes                                                            |
+| `description`          | `string`                                                                                                                                                                                                 |            | Description text to be displayed.                                      |
+| `descriptionProps`     | `shape({ colorTheme: string, variant: string })`                                                                                                                                                         |            | Props to customize the description's style.                            |
+| `headerActions`        | `arrayOf(shape({ Icon: oneOfType([elementType, string]), iconProps: string, id: oneOfType([number, string]), label: string, loading: bool, onClick: func }))`                                            |            | List of actions available in the header section.                       |
+| `headerActionsProps`   | `shape({ alignment: oneOf(['center', 'end', 'start']), buttonGroupProps: shape({ colorTheme: string, shape: string }), variant: oneOf(['default', 'buttonGroup']) })` |            | Props to configure header actions alignment, button group, etc.        |
+| `hideHeader`           | `bool`                                                                                                                                                                                                   | `false`    | Hides the header section of the card.                                  |
+| `mainAction`           | `func`                                                                                                                                                                                                   |            | Main action function for the card.                                     |
+| `size`                 | `oneOf(['medium', 'small'])`                                                                                                                                                                             | `'medium'` | Size of the card, either small or medium.                              |
+| `status`               | `string`                                                                                                                                                                                                 |            | Status text to be displayed.                                           |
+| `statusLabel`          | `string`                                                                                                                                                                                                 |            | Status label for additional status info.                               |
+| `statusAlignment`      | `oneOf(['center', 'end', 'start'])`                                                                                                                                                                      |            | Alignment of the status element.                                       |
+| `title`                | `string`                                                                                                                                                                                      |            | The title of the card.                                       |
+| `titleProps`           | `shape({ variant: string, weight: string })`                                                                                                                                                             |            | Props to configure the title style.                                    |
+| `withBodyPadding`      | `bool`                                                                                                                                                                                                   | `false`    | Adds padding to the card body if`true`.                                |

package/dist/esm/components/UTActionCard/components/AdditionalMessage/index.js

@@ -1 +1,47 @@
-function _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}import React,{memo}from"react";import{oneOf,shape,string}from"prop-types";import UTIcon from"../../../UTIcon";import UTLabel from"../../../UTLabel";import{SIZES}from"../../constants";import styles from"./styles.module.scss";const AdditionalMessage=_ref=>{let{dataTestId:dataTestId,icon:icon,iconProps:iconProps={},labelProps:labelProps={},message:message,size:size}=_ref;return React.createElement("div",{className:"".concat(styles.additionalMessageContainer," ").concat(styles[size]),"data-testid":dataTestId},icon&&React.createElement(UTIcon,_extends({area:!0,colorTheme:"gray",dataTestId:dataTestId?"".concat(dataTestId,".icon"):void 0,name:icon,size:16},iconProps)),React.createElement(UTLabel,_extends({colorTheme:"gray",dataTestId:dataTestId?"".concat(dataTestId,".message"):void 0,variant:"small",withMarkdown:!0},labelProps),message))};AdditionalMessage.propTypes={dataTestId:string,icon:string,iconProps:shape({colorTheme:string,size:string}),labelProps:shape({colorTheme:string,variant:string}),message:string,size:oneOf([SIZES.MEDIUM,SIZES.SMALL])};export default memo(AdditionalMessage);
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { memo } from 'react';
+import { oneOf, shape, string } from 'prop-types';
+import UTIcon from '../../../UTIcon';
+import UTLabel from '../../../UTLabel';
+import { SIZES } from '../../constants';
+import styles from './styles.module.scss';
+const AdditionalMessage = _ref => {
+  let {
+    dataTestId,
+    icon,
+    iconProps = {},
+    labelProps = {},
+    message,
+    size
+  } = _ref;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(styles.additionalMessageContainer, " ").concat(styles[size]),
+    "data-testid": dataTestId
+  }, icon && /*#__PURE__*/React.createElement(UTIcon, _extends({
+    area: true,
+    colorTheme: "gray",
+    dataTestId: dataTestId ? "".concat(dataTestId, ".icon") : undefined,
+    name: icon,
+    size: 16
+  }, iconProps)), /*#__PURE__*/React.createElement(UTLabel, _extends({
+    colorTheme: "gray",
+    dataTestId: dataTestId ? "".concat(dataTestId, ".message") : undefined,
+    variant: "small",
+    withMarkdown: true
+  }, labelProps), message));
+};
+AdditionalMessage.propTypes = {
+  dataTestId: string,
+  icon: string,
+  iconProps: shape({
+    colorTheme: string,
+    size: string
+  }),
+  labelProps: shape({
+    colorTheme: string,
+    variant: string
+  }),
+  message: string,
+  size: oneOf([SIZES.MEDIUM, SIZES.SMALL])
+};
+export default /*#__PURE__*/memo(AdditionalMessage);

package/dist/esm/components/UTActionCard/components/BottomActions/constants.js

@@ -1 +1 @@
-export const DEFAULT_REDIRECTION_ICON="IconChevronRight";
+export const DEFAULT_REDIRECTION_ICON = 'IconChevronRight';