@widergy/energy-ui 3.172.3 → 3.173.0

package/dist/components/UTCarousel/components/Slider/index.js

@@ -1 +1,302 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_Button=_interopRequireDefault(require("../Button")),_Legend=_interopRequireDefault(require("../Legend")),_helperFunctions=require("../../../../utils/helperFunctions"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_layout=_interopRequireDefault(require("./layout")),_constants=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)}function _defineProperty(e,r,t){return(r=_toPropertyKey(r))in e?Object.defineProperty(e,r,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[r]=t,e}function _toPropertyKey(t){var i=_toPrimitive(t,"string");return"symbol"==typeof i?i:i+""}function _toPrimitive(t,r){if("object"!=typeof t||!t)return t;var e=t[Symbol.toPrimitive];if(void 0!==e){var i=e.call(t,r||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===r?String:Number)(t)}class SliderContainer extends _react.PureComponent{constructor(props){super(props),_defineProperty(this,"handleNextSlide",()=>{this.imagesLength===this.state.index?this.setState(prevState=>({index:prevState.index+1,shouldAnimate:!0,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!0}),()=>setTimeout(()=>this.setState(prevState=>({index:1,shouldAnimate:!1,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!1})),this.state.timeAnimation)):this.setState(prevState=>({index:prevState.index+1,shouldAnimate:!0,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!0}),()=>setTimeout(()=>this.setState({disable:!1}),this.state.timeAnimation))}),_defineProperty(this,"handlePrevSlide",()=>{1===this.state.index?this.setState(prevState=>({index:0,shouldAnimate:!0,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!0}),()=>setTimeout(()=>this.setState(prevState=>({index:prevState.slideArray.length-2,shouldAnimate:!1,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!1})),this.state.timeAnimation)):this.setState(prevState=>({index:prevState.index-1,shouldAnimate:!0,timeAnimation:0===prevState.finishPosition?_constants.SLOW_ANIMATION:prevState.timeAnimation,disable:!0}),()=>setTimeout(()=>this.setState({disable:!1}),this.state.timeAnimation))}),_defineProperty(this,"handleMouseMove",event=>this.setState(prevState=>({finishPosition:prevState.initialPosition-event.clientX}))),_defineProperty(this,"handleTouchMove",event=>this.setState(prevState=>({finishPosition:prevState.initialPosition-event.changedTouches[event.changedTouches.length-1].clientX}))),_defineProperty(this,"handleEventUp",()=>{this.containerRef.current.removeEventListener("mousemove",this.handleMouseMove),this.containerRef.current.removeEventListener("touchmove",this.handleTouchMove);const{containerWidth:containerWidth}=this.state,transitionTime=(new Date).getTime()-this.state.timeMove,fastAnimationRight=this.state.finishPosition>60,fastAnimationLeft=this.state.finishPosition<-60,fastAnimation=transitionTime>0&&transitionTime<_constants.MIN_TIME_MOVE&&(fastAnimationRight||fastAnimationLeft);return fastAnimation&&(this.setState({timeAnimation:_constants.FAST_ANIMATION}),fastAnimationLeft?this.handlePrevSlide():fastAnimationRight&&this.handleNextSlide()),0!==transitionTime&&-containerWidth/3>=this.state.finishPosition&&!fastAnimation?(this.setState({timeAnimation:_constants.SLOW_ANIMATION}),this.handlePrevSlide()):0!==transitionTime&&containerWidth/3<=this.state.finishPosition&&!fastAnimation&&(this.setState({timeAnimation:_constants.SLOW_ANIMATION}),this.handleNextSlide()),this.setState({initialPosition:0,finishPosition:0,shouldAnimate:!0})}),_defineProperty(this,"handleLegend",item=>{this.setState({timeAnimation:400,index:item})}),_defineProperty(this,"updateImgArray",()=>{const firstSlide=this.props.slides[0],lastSlide=this.props.slides[this.props.slides.length-1],arr=[{...lastSlide,id:"lastSlide-".concat(lastSlide.id||lastSlide.imgSrc)},...this.props.slides,{...firstSlide,id:"firstSlide-".concat(firstSlide.id||firstSlide.imgSrc)}];this.setState({slideArray:arr})}),_defineProperty(this,"updateContainerWidth",()=>this.setState({containerWidth:this.containerRef.current&&this.containerRef.current.clientWidth})),this.containerRef=_react.default.createRef(),this.imagesLength=props.slides.length,this.state={index:1,slideArray:[],shouldAnimate:!0,timeMove:0,initialPosition:0,finishPosition:0,timeAnimation:_constants.FAST_ANIMATION}}componentDidMount(){const firstSlide=this.props.slides[0],lastSlide=this.props.slides[this.props.slides.length-1],arr=[{...lastSlide,id:"lastSlide-".concat(lastSlide.id||lastSlide.imgSrc)},...this.props.slides,{...firstSlide,id:"firstSlide-".concat(firstSlide.id||firstSlide.imgSrc)}];this.setState({slideArray:arr}),this.containerRef.current.addEventListener("touchstart",this.handleTouchDown.bind(this)),this.containerRef.current.addEventListener("mousedown",this.handleMouseDown.bind(this)),this.updateContainerWidth(),window.addEventListener("resize",this.updateContainerWidth),this.props.autoPlay&&setInterval(()=>this.handleNextSlide(),this.props.autoPlayDelay)}componentDidUpdate(prevProps){this.props.slides!==prevProps.slides&&this.updateImgArray()}componentWillUnmount(){var _this$containerRef;null!==(_this$containerRef=this.containerRef)&&void 0!==_this$containerRef&&_this$containerRef.current&&(this.containerRef.current.removeEventListener("touchstart",this.handleTouchDown),this.containerRef.current.removeEventListener("mousedown",this.handleMouseDown),this.containerRef.current.removeEventListener("mousemove",this.handleMouseMove),this.containerRef.current.removeEventListener("touchmove",this.handleTouchMove)),window.removeEventListener("mouseup",this.handleEventUp),window.removeEventListener("resize",this.updateContainerWidth),window.removeEventListener("touchend",this.handleEventUp)}handleMouseDown(){return(0,_helperFunctions.throttle)(event=>(this.containerRef.current.addEventListener("mousemove",this.handleMouseMove),window.addEventListener("mouseup",this.handleEventUp),this.setState({initialPosition:event.clientX,shouldAnimate:!1,timeMove:(new Date).getTime()})),this.state.timeAnimation)}handleTouchDown(){(0,_helperFunctions.throttle)(event=>(this.containerRef.current.addEventListener("touchmove",this.handleTouchMove),window.addEventListener("touchend",this.handleEventUp),this.setState({initialPosition:event.changedTouches[event.changedTouches.length-1].clientX,shouldAnimate:!1,timeMove:(new Date).getTime()})),this.state.timeAnimation)}render(){const{shouldAnimate:shouldAnimate,slideArray:slideArray,index:index,timeAnimation:timeAnimation,containerWidth:containerWidth}=this.state,{withBorder:withBorder,arrow:arrow,legend:legend,classes:classes,slides:slides,height:height,activeEvents:activeEvents,className:className}=this.props,baseSlidePosition=(index-1)*-containerWidth,transitionSlide=this.props.enableMove?baseSlidePosition:baseSlidePosition-this.state.finishPosition;return _react.default.createElement("div",{className:"".concat(_stylesModule.default.generalContainer," ").concat(className),style:{pointerEvents:"".concat(this.state.disable||!activeEvents?"none":"all"),height:height},draggable:"false"},arrow&&arrow.position===_constants.OUTSIDE&&_react.default.createElement("div",{className:_stylesModule.default.arrowContainer},_react.default.createElement(_Button.default,{ArrowCustom:arrow.arrowCustomLeft,callback:arrow.callbackLeft,onPress:this.handlePrevSlide,classes:classes,left:!0})),_react.default.createElement("div",{ref:this.containerRef,className:_stylesModule.default.sliderContainer,draggable:"false"},_react.default.createElement(_layout.default,{transitionSlide:transitionSlide,containerWidth:containerWidth,slideArray:slideArray,shouldAnimate:shouldAnimate,slides:slides,withBorder:withBorder,index:index,handleLegend:this.handleLegend,handlePrevSlide:this.handlePrevSlide,handleNextSlide:this.handleNextSlide,timeAnimation:timeAnimation,arrow:arrow,legend:legend,classes:classes})),legend&&legend.position===_constants.OUTSIDE&&_react.default.createElement("div",{className:_stylesModule.default.legendContainerOut},_react.default.createElement("div",{className:_stylesModule.default.legend},slides.map((slide,slideIndex)=>_react.default.createElement(_Legend.default,{LegendCustom:legend.legendCustom,index:slideIndex,currentSlide:index===slideArray.length-1?0:0===index?1:index-1,onClick:this.handleLegend,classes:classes,key:"legend-out-".concat(slide.id||slide.imgSrc)})))),arrow&&arrow.position===_constants.OUTSIDE&&_react.default.createElement("div",{className:_stylesModule.default.arrowContainer},_react.default.createElement(_Button.default,{ArrowCustom:arrow.arrowCustomRight,callback:arrow.callbackRight,onPress:this.handleNextSlide,classes:classes})))}}SliderContainer.propTypes={activeEvents:_propTypes.bool,arrow:(0,_propTypes.shape)({arrowCustomLeft:_propTypes.node,arrowCustomRight:_propTypes.node,callbackLeft:_propTypes.func,callbackRight:_propTypes.func,position:_propTypes.string}),autoPlay:_propTypes.bool,autoPlayDelay:_propTypes.number,className:_propTypes.string,classes:(0,_propTypes.objectOf)(_propTypes.string),legend:(0,_propTypes.shape)({legendCustom:_propTypes.node,position:_propTypes.string}),enableMove:_propTypes.bool,height:_propTypes.string,slides:(0,_propTypes.arrayOf)((0,_propTypes.shape)({imgSrc:_propTypes.string,id:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string])})),withBorder:_propTypes.number};var _default=exports.default=SliderContainer;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _Button = _interopRequireDefault(require("../Button"));
+var _Legend = _interopRequireDefault(require("../Legend"));
+var _helperFunctions = require("../../../../utils/helperFunctions");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+var _layout = _interopRequireDefault(require("./layout"));
+var _constants = 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); }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+class SliderContainer extends _react.PureComponent {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "handleNextSlide", () => {
+      if (this.imagesLength === this.state.index) {
+        this.setState(prevState => ({
+          index: prevState.index + 1,
+          shouldAnimate: true,
+          timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+          disable: true
+        }), () => setTimeout(() => this.setState(prevState => ({
+          index: 1,
+          shouldAnimate: false,
+          timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+          disable: false
+        })), this.state.timeAnimation));
+      } else this.setState(prevState => ({
+        index: prevState.index + 1,
+        shouldAnimate: true,
+        timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+        disable: true
+      }), () => setTimeout(() => this.setState({
+        disable: false
+      }), this.state.timeAnimation));
+    });
+    _defineProperty(this, "handlePrevSlide", () => {
+      if (this.state.index === 1) {
+        this.setState(prevState => ({
+          index: 0,
+          shouldAnimate: true,
+          timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+          disable: true
+        }), () => setTimeout(() => this.setState(prevState => ({
+          index: prevState.slideArray.length - 2,
+          shouldAnimate: false,
+          timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+          disable: false
+        })), this.state.timeAnimation));
+      } else this.setState(prevState => ({
+        index: prevState.index - 1,
+        shouldAnimate: true,
+        timeAnimation: prevState.finishPosition === 0 ? _constants.SLOW_ANIMATION : prevState.timeAnimation,
+        disable: true
+      }), () => setTimeout(() => this.setState({
+        disable: false
+      }), this.state.timeAnimation));
+    });
+    _defineProperty(this, "handleMouseMove", event => this.setState(prevState => ({
+      finishPosition: prevState.initialPosition - event.clientX
+    })));
+    _defineProperty(this, "handleTouchMove", event => this.setState(prevState => ({
+      finishPosition: prevState.initialPosition - event.changedTouches[event.changedTouches.length - 1].clientX
+    })));
+    _defineProperty(this, "handleEventUp", () => {
+      this.containerRef.current.removeEventListener('mousemove', this.handleMouseMove);
+      this.containerRef.current.removeEventListener('touchmove', this.handleTouchMove);
+      const {
+        containerWidth
+      } = this.state;
+      const time = new Date().getTime();
+      const transitionTime = time - this.state.timeMove;
+      const fastAnimationRight = this.state.finishPosition > 60;
+      const fastAnimationLeft = this.state.finishPosition < -60;
+      const fastAnimation = transitionTime > 0 && transitionTime < _constants.MIN_TIME_MOVE && (fastAnimationRight || fastAnimationLeft);
+      if (fastAnimation) {
+        this.setState({
+          timeAnimation: _constants.FAST_ANIMATION
+        });
+        if (fastAnimationLeft) {
+          this.handlePrevSlide();
+        } else if (fastAnimationRight) this.handleNextSlide();
+      }
+      if (transitionTime !== 0 && -containerWidth / 3 >= this.state.finishPosition && !fastAnimation) {
+        this.setState({
+          timeAnimation: _constants.SLOW_ANIMATION
+        });
+        this.handlePrevSlide();
+      } else if (transitionTime !== 0 && containerWidth / 3 <= this.state.finishPosition && !fastAnimation) {
+        this.setState({
+          timeAnimation: _constants.SLOW_ANIMATION
+        });
+        this.handleNextSlide();
+      }
+      return this.setState({
+        initialPosition: 0,
+        finishPosition: 0,
+        shouldAnimate: true
+      });
+    });
+    _defineProperty(this, "handleLegend", item => {
+      this.setState({
+        timeAnimation: 400,
+        index: item
+      });
+    });
+    _defineProperty(this, "updateImgArray", () => {
+      const firstSlide = this.props.slides[0];
+      const lastSlide = this.props.slides[this.props.slides.length - 1];
+      const arr = [{
+        ...lastSlide,
+        id: "lastSlide-".concat(lastSlide.id || lastSlide.imgSrc)
+      }, ...this.props.slides, {
+        ...firstSlide,
+        id: "firstSlide-".concat(firstSlide.id || firstSlide.imgSrc)
+      }];
+      this.setState({
+        slideArray: arr
+      });
+    });
+    _defineProperty(this, "updateContainerWidth", () => this.setState({
+      containerWidth: this.containerRef.current && this.containerRef.current.clientWidth
+    }));
+    this.containerRef = /*#__PURE__*/_react.default.createRef();
+    this.imagesLength = props.slides.length;
+    this.state = {
+      index: 1,
+      slideArray: [],
+      shouldAnimate: true,
+      timeMove: 0,
+      initialPosition: 0,
+      finishPosition: 0,
+      timeAnimation: _constants.FAST_ANIMATION
+    };
+  }
+  componentDidMount() {
+    const firstSlide = this.props.slides[0];
+    const lastSlide = this.props.slides[this.props.slides.length - 1];
+    const arr = [{
+      ...lastSlide,
+      id: "lastSlide-".concat(lastSlide.id || lastSlide.imgSrc)
+    }, ...this.props.slides, {
+      ...firstSlide,
+      id: "firstSlide-".concat(firstSlide.id || firstSlide.imgSrc)
+    }];
+    this.setState({
+      slideArray: arr
+    });
+    this.containerRef.current.addEventListener('touchstart', this.handleTouchDown.bind(this));
+    this.containerRef.current.addEventListener('mousedown', this.handleMouseDown.bind(this));
+    this.updateContainerWidth();
+    window.addEventListener('resize', this.updateContainerWidth);
+    if (this.props.autoPlay) setInterval(() => this.handleNextSlide(), this.props.autoPlayDelay);
+  }
+  componentDidUpdate(prevProps) {
+    if (this.props.slides !== prevProps.slides) {
+      this.updateImgArray();
+    }
+  }
+  componentWillUnmount() {
+    var _this$containerRef;
+    if ((_this$containerRef = this.containerRef) !== null && _this$containerRef !== void 0 && _this$containerRef.current) {
+      this.containerRef.current.removeEventListener('touchstart', this.handleTouchDown);
+      this.containerRef.current.removeEventListener('mousedown', this.handleMouseDown);
+      this.containerRef.current.removeEventListener('mousemove', this.handleMouseMove);
+      this.containerRef.current.removeEventListener('touchmove', this.handleTouchMove);
+    }
+    window.removeEventListener('mouseup', this.handleEventUp);
+    window.removeEventListener('resize', this.updateContainerWidth);
+    window.removeEventListener('touchend', this.handleEventUp);
+  }
+  handleMouseDown() {
+    return (0, _helperFunctions.throttle)(event => {
+      this.containerRef.current.addEventListener('mousemove', this.handleMouseMove);
+      window.addEventListener('mouseup', this.handleEventUp);
+      return this.setState({
+        initialPosition: event.clientX,
+        shouldAnimate: false,
+        timeMove: new Date().getTime()
+      });
+    }, this.state.timeAnimation);
+  }
+  handleTouchDown() {
+    (0, _helperFunctions.throttle)(event => {
+      this.containerRef.current.addEventListener('touchmove', this.handleTouchMove);
+      window.addEventListener('touchend', this.handleEventUp);
+      return this.setState({
+        initialPosition: event.changedTouches[event.changedTouches.length - 1].clientX,
+        shouldAnimate: false,
+        timeMove: new Date().getTime()
+      });
+    }, this.state.timeAnimation);
+  }
+  render() {
+    const {
+      shouldAnimate,
+      slideArray,
+      index,
+      timeAnimation,
+      containerWidth
+    } = this.state;
+    const {
+      withBorder,
+      arrow,
+      legend,
+      classes,
+      slides,
+      height,
+      activeEvents,
+      className
+    } = this.props;
+    const baseSlidePosition = (index - 1) * -containerWidth;
+    const transitionSlide = !this.props.enableMove ? baseSlidePosition - this.state.finishPosition : baseSlidePosition;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "".concat(_stylesModule.default.generalContainer, " ").concat(className),
+      style: {
+        pointerEvents: "".concat(this.state.disable || !activeEvents ? 'none' : 'all'),
+        height
+      },
+      draggable: "false"
+    }, arrow && arrow.position === _constants.OUTSIDE && /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.arrowContainer
+    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+      ArrowCustom: arrow.arrowCustomLeft,
+      callback: arrow.callbackLeft,
+      onPress: this.handlePrevSlide,
+      classes: classes,
+      left: true
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      ref: this.containerRef,
+      className: _stylesModule.default.sliderContainer,
+      draggable: "false"
+    }, /*#__PURE__*/_react.default.createElement(_layout.default, {
+      transitionSlide: transitionSlide,
+      containerWidth: containerWidth,
+      slideArray: slideArray,
+      shouldAnimate: shouldAnimate,
+      slides: slides,
+      withBorder: withBorder,
+      index: index,
+      handleLegend: this.handleLegend,
+      handlePrevSlide: this.handlePrevSlide,
+      handleNextSlide: this.handleNextSlide,
+      timeAnimation: timeAnimation,
+      arrow: arrow,
+      legend: legend,
+      classes: classes
+    })), legend && legend.position === _constants.OUTSIDE && /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.legendContainerOut
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.legend
+    }, slides.map((slide, slideIndex) => /*#__PURE__*/_react.default.createElement(_Legend.default, {
+      LegendCustom: legend.legendCustom,
+      index: slideIndex,
+      currentSlide: index === slideArray.length - 1 ? 0 : index === 0 ? 1 : index - 1,
+      onClick: this.handleLegend,
+      classes: classes,
+      key: "legend-out-".concat(slide.id || slide.imgSrc)
+    })))), arrow && arrow.position === _constants.OUTSIDE && /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.arrowContainer
+    }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+      ArrowCustom: arrow.arrowCustomRight,
+      callback: arrow.callbackRight,
+      onPress: this.handleNextSlide,
+      classes: classes
+    })));
+  }
+}
+SliderContainer.propTypes = {
+  activeEvents: _propTypes.bool,
+  arrow: (0, _propTypes.shape)({
+    arrowCustomLeft: _propTypes.node,
+    arrowCustomRight: _propTypes.node,
+    callbackLeft: _propTypes.func,
+    callbackRight: _propTypes.func,
+    position: _propTypes.string
+  }),
+  autoPlay: _propTypes.bool,
+  autoPlayDelay: _propTypes.number,
+  className: _propTypes.string,
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  legend: (0, _propTypes.shape)({
+    legendCustom: _propTypes.node,
+    position: _propTypes.string
+  }),
+  enableMove: _propTypes.bool,
+  height: _propTypes.string,
+  slides: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    imgSrc: _propTypes.string,
+    id: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string])
+  })),
+  withBorder: _propTypes.number
+};
+var _default = exports.default = SliderContainer;

package/dist/components/UTCarousel/components/Slider/layout.js

@@ -1 +1,118 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_Legend=_interopRequireDefault(require("../Legend")),_Button=_interopRequireDefault(require("../Button")),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_Slide=_interopRequireDefault(require("./component/Slide")),_constants=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)}class Slider extends _react.PureComponent{render(){const{transitionSlide:transitionSlide,slides:slides,containerWidth:containerWidth,slideArray:slideArray,shouldAnimate:shouldAnimate,index:index,withBorder:withBorder,handleLegend:handleLegend,handlePrevSlide:handlePrevSlide,handleNextSlide:handleNextSlide,timeAnimation:timeAnimation,arrow:arrow,legend:legend,classes:classes}=this.props,animationTime=35===timeAnimation?.035:.4;return _react.default.createElement(_react.Fragment,null,arrow&&arrow.position===_constants.INSIDE&&_react.default.createElement(_Button.default,{ArrowCustom:arrow.arrowCustomLeft,callback:arrow.callbackLeft,left:!0,onPress:handlePrevSlide,className:_stylesModule.default.arrowLeft,classes:classes}),_react.default.createElement("div",{style:{transform:"translate3d(".concat(transitionSlide,"px, 0px, 0px)"),width:"".concat(containerWidth*slideArray.length,"px"),transition:"".concat(shouldAnimate?"transform ".concat(animationTime,"s linear 0s"):"none")},className:"".concat(_stylesModule.default.slideContainer),draggable:"false"},slideArray.map((slide,_index)=>_react.default.createElement(_Slide.default,{animationTime:animationTime,border:withBorder,classes:classes,currentSlide:index-1,imgSrc:slide.imgSrc,key:"slide-".concat(slide.id||slide.imgSrc),onClick:slide.onClick,position:_index-1,renderContent:slide.renderContent,shouldAnimate:shouldAnimate,widthContainer:containerWidth}))),legend&&legend.position===_constants.INSIDE&&_react.default.createElement("div",{className:_stylesModule.default.legendContainer,style:{justifyContent:legend.align||"center",paddingBottom:legend.paddingBottom,paddingLeft:legend.paddingLeft}},_react.default.createElement("div",{className:_stylesModule.default.legend},slides.map((slide,itemIndex)=>_react.default.createElement(_Legend.default,{key:"legend-in-".concat(slide.id||slide.imgSrc),classes:classes,currentSlide:index===slideArray.length-1?0:0===index?1:index-1,index:itemIndex,LegendCustom:legend.legendCustom,onClick:handleLegend})))),arrow&&arrow.position===_constants.INSIDE&&_react.default.createElement(_Button.default,{ArrowCustom:arrow.arrowCustomRight,callback:arrow.callbackRight,onPress:handleNextSlide,className:_stylesModule.default.arrowRight,classes:classes}))}}Slider.propTypes={slideArray:(0,_propTypes.arrayOf)((0,_propTypes.shape)({imgSrc:_propTypes.string,id:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string])})),slides:(0,_propTypes.arrayOf)((0,_propTypes.shape)({imgSrc:_propTypes.string,id:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string])})),arrow:(0,_propTypes.shape)({position:_propTypes.string,arrowCustomLeft:_propTypes.node,arrowCustomRight:_propTypes.node,callbackLeft:_propTypes.func,callbackRight:_propTypes.func}),legend:(0,_propTypes.shape)({position:_propTypes.string,legendCustom:_propTypes.node}),transitionSlide:_propTypes.number,containerWidth:_propTypes.number,shouldAnimate:_propTypes.bool,index:_propTypes.number,withBorder:_propTypes.number,handleLegend:_propTypes.func,handlePrevSlide:_propTypes.func,handleNextSlide:_propTypes.func,timeAnimation:_propTypes.number,classes:(0,_propTypes.objectOf)(_propTypes.string)};var _default=exports.default=Slider;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _Legend = _interopRequireDefault(require("../Legend"));
+var _Button = _interopRequireDefault(require("../Button"));
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+var _Slide = _interopRequireDefault(require("./component/Slide"));
+var _constants = 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); }
+class Slider extends _react.PureComponent {
+  render() {
+    const {
+      transitionSlide,
+      slides,
+      containerWidth,
+      slideArray,
+      shouldAnimate,
+      index,
+      withBorder,
+      handleLegend,
+      handlePrevSlide,
+      handleNextSlide,
+      timeAnimation,
+      arrow,
+      legend,
+      classes
+    } = this.props;
+    const animationTime = timeAnimation === 35 ? 0.035 : 0.4;
+    return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, arrow && arrow.position === _constants.INSIDE && /*#__PURE__*/_react.default.createElement(_Button.default, {
+      ArrowCustom: arrow.arrowCustomLeft,
+      callback: arrow.callbackLeft,
+      left: true,
+      onPress: handlePrevSlide,
+      className: _stylesModule.default.arrowLeft,
+      classes: classes
+    }), /*#__PURE__*/_react.default.createElement("div", {
+      style: {
+        transform: "translate3d(".concat(transitionSlide, "px, 0px, 0px)"),
+        width: "".concat(containerWidth * slideArray.length, "px"),
+        transition: "".concat(shouldAnimate ? "transform ".concat(animationTime, "s linear 0s") : 'none')
+      },
+      className: "".concat(_stylesModule.default.slideContainer),
+      draggable: "false"
+    }, slideArray.map((slide, _index) => /*#__PURE__*/_react.default.createElement(_Slide.default, {
+      animationTime: animationTime,
+      border: withBorder,
+      classes: classes,
+      currentSlide: index - 1,
+      imgSrc: slide.imgSrc,
+      key: "slide-".concat(slide.id || slide.imgSrc),
+      onClick: slide.onClick,
+      position: _index - 1,
+      renderContent: slide.renderContent,
+      shouldAnimate: shouldAnimate,
+      widthContainer: containerWidth
+    }))), legend && legend.position === _constants.INSIDE && /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.legendContainer,
+      style: {
+        justifyContent: legend.align || 'center',
+        paddingBottom: legend.paddingBottom,
+        paddingLeft: legend.paddingLeft
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: _stylesModule.default.legend
+    }, slides.map((slide, itemIndex) => /*#__PURE__*/_react.default.createElement(_Legend.default, {
+      key: "legend-in-".concat(slide.id || slide.imgSrc),
+      classes: classes,
+      currentSlide: index === slideArray.length - 1 ? 0 : index === 0 ? 1 : index - 1,
+      index: itemIndex,
+      LegendCustom: legend.legendCustom,
+      onClick: handleLegend
+    })))), arrow && arrow.position === _constants.INSIDE && /*#__PURE__*/_react.default.createElement(_Button.default, {
+      ArrowCustom: arrow.arrowCustomRight,
+      callback: arrow.callbackRight,
+      onPress: handleNextSlide,
+      className: _stylesModule.default.arrowRight,
+      classes: classes
+    }));
+  }
+}
+Slider.propTypes = {
+  slideArray: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    imgSrc: _propTypes.string,
+    id: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string])
+  })),
+  slides: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    imgSrc: _propTypes.string,
+    id: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string])
+  })),
+  arrow: (0, _propTypes.shape)({
+    position: _propTypes.string,
+    arrowCustomLeft: _propTypes.node,
+    arrowCustomRight: _propTypes.node,
+    callbackLeft: _propTypes.func,
+    callbackRight: _propTypes.func
+  }),
+  legend: (0, _propTypes.shape)({
+    position: _propTypes.string,
+    legendCustom: _propTypes.node
+  }),
+  transitionSlide: _propTypes.number,
+  containerWidth: _propTypes.number,
+  shouldAnimate: _propTypes.bool,
+  index: _propTypes.number,
+  withBorder: _propTypes.number,
+  handleLegend: _propTypes.func,
+  handlePrevSlide: _propTypes.func,
+  handleNextSlide: _propTypes.func,
+  timeAnimation: _propTypes.number,
+  classes: (0, _propTypes.objectOf)(_propTypes.string)
+};
+var _default = exports.default = Slider;

package/dist/components/UTCarousel/index.js

@@ -1 +1,68 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_sizesModule=_interopRequireDefault(require("../../scss/variables/sizes.module.scss")),_WithTheme=_interopRequireDefault(require("../WithTheme")),_theme=require("./theme"),_Slider=_interopRequireDefault(require("./components/Slider"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const UTCarousel=_ref=>{let{arrow:arrow,legend:legend,imgArray:imgArray,borderSize:borderSize,autoPlay:autoPlay,autoPlayDelay:autoPlayDelay=2e3,classes:classes,height:height=_sizesModule.default.defaultCarrouselHeight,activeEvents:activeEvents,className:className}=_ref;return _react.default.createElement(_Slider.default,{arrow:arrow,legend:legend,slides:imgArray,withBorder:borderSize,autoPlay:autoPlay,autoPlayDelay:autoPlayDelay,classes:classes,height:height,activeEvents:activeEvents,className:className})};UTCarousel.propTypes={arrow:(0,_propTypes.shape)({position:_propTypes.string,arrowCustomLeft:_propTypes.node,arrowCustomRight:_propTypes.node,callbackLeft:_propTypes.func,callbackRight:_propTypes.func}),legend:(0,_propTypes.shape)({align:_propTypes.string,legendCustom:_propTypes.func,paddingBottom:_propTypes.string,paddingLeft:_propTypes.string,position:_propTypes.string}),imgArray:(0,_propTypes.arrayOf)((0,_propTypes.shape)({id:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string]),imgSrc:_propTypes.string,renderContent:_propTypes.node})),borderSize:_propTypes.number,autoPlay:_propTypes.bool,autoPlayDelay:_propTypes.number,height:_propTypes.string,activeEvents:_propTypes.bool,className:_propTypes.string,classes:(0,_propTypes.objectOf)(_propTypes.string)};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(UTCarousel);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = require("prop-types");
+var _sizesModule = _interopRequireDefault(require("../../scss/variables/sizes.module.scss"));
+var _WithTheme = _interopRequireDefault(require("../WithTheme"));
+var _theme = require("./theme");
+var _Slider = _interopRequireDefault(require("./components/Slider"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const UTCarousel = _ref => {
+  let {
+    arrow,
+    legend,
+    imgArray,
+    borderSize,
+    autoPlay,
+    autoPlayDelay = 2000,
+    classes,
+    height = _sizesModule.default.defaultCarrouselHeight,
+    activeEvents,
+    className
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_Slider.default, {
+    arrow: arrow,
+    legend: legend,
+    slides: imgArray,
+    withBorder: borderSize,
+    autoPlay: autoPlay,
+    autoPlayDelay: autoPlayDelay,
+    classes: classes,
+    height: height,
+    activeEvents: activeEvents,
+    className: className
+  });
+};
+UTCarousel.propTypes = {
+  arrow: (0, _propTypes.shape)({
+    position: _propTypes.string,
+    arrowCustomLeft: _propTypes.node,
+    arrowCustomRight: _propTypes.node,
+    callbackLeft: _propTypes.func,
+    callbackRight: _propTypes.func
+  }),
+  legend: (0, _propTypes.shape)({
+    align: _propTypes.string,
+    legendCustom: _propTypes.func,
+    paddingBottom: _propTypes.string,
+    paddingLeft: _propTypes.string,
+    position: _propTypes.string
+  }),
+  imgArray: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    id: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string]),
+    imgSrc: _propTypes.string,
+    renderContent: _propTypes.node
+  })),
+  borderSize: _propTypes.number,
+  autoPlay: _propTypes.bool,
+  autoPlayDelay: _propTypes.number,
+  height: _propTypes.string,
+  activeEvents: _propTypes.bool,
+  className: _propTypes.string,
+  classes: (0, _propTypes.objectOf)(_propTypes.string)
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTCarousel);

package/dist/components/UTCarousel/theme.js

@@ -1 +1,52 @@
-"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")),_sizesModule=_interopRequireDefault(require("../../scss/variables/sizes.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{arrowStyle:{fontSize:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","fontSize"],_sizesModule.default.defaultCarrouselArrowSize),height:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","height"],_sizesModule.default.defaultCarrouselArrowSize),width:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","width"],_sizesModule.default.defaultCarrouselArrowSize),color:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","color"],_colorsModule.default.white),backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","backgroundColor"],_colorsModule.default.lightBlue),transition:"opacity 0.5s ease-out","&:hover":{backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","arrowStyle","hover","backgroundColor"],_colorsModule.default.lightBlue)}},legendStyleContainer:{backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleContainer","backgroundColor"],_colorsModule.default.gray2),height:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleContainer","height"],_sizesModule.default.defaultCarrouselLegendSize),width:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleContainer","width"],_sizesModule.default.defaultCarrouselLegendSize),borderRadius:"100% ",userSelect:"none",boxShadow:"0px 1px 2px 0px rgba(0,0,0,0.75)",transition:"transform 0.3s ease-in, background-color 0.3s ease-in",transform:"scale(0.8)"},legendStyleIsActive:{backgroundColor:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleIsActive","backgroundColor"],_colorsModule.default.white),userSelect:"none",transform:"scale(1)"},legendStyleTouchable:{alignItems:"center",height:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleTouchable","height"],_sizesModule.default.defaultCarrouselLegendTouchable),width:(0,_seamlessImmutable.getIn)(theme,["UTCarousel","legendStyleTouchable","width"],_sizesModule.default.defaultCarrouselLegendTouchable),justifyContent:"center",display:"flex",userSelect:"none"}}};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"));
+var _sizesModule = _interopRequireDefault(require("../../scss/variables/sizes.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    arrowStyle: {
+      fontSize: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'fontSize'], _sizesModule.default.defaultCarrouselArrowSize),
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'height'], _sizesModule.default.defaultCarrouselArrowSize),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'width'], _sizesModule.default.defaultCarrouselArrowSize),
+      color: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'color'], _colorsModule.default.white),
+      backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'backgroundColor'], _colorsModule.default.lightBlue),
+      transition: 'opacity 0.5s ease-out',
+      '&:hover': {
+        backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'arrowStyle', 'hover', 'backgroundColor'], _colorsModule.default.lightBlue)
+      }
+    },
+    legendStyleContainer: {
+      backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleContainer', 'backgroundColor'], _colorsModule.default.gray2),
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleContainer', 'height'], _sizesModule.default.defaultCarrouselLegendSize),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleContainer', 'width'], _sizesModule.default.defaultCarrouselLegendSize),
+      borderRadius: '100% ',
+      userSelect: 'none',
+      boxShadow: '0px 1px 2px 0px rgba(0,0,0,0.75)',
+      transition: 'transform 0.3s ease-in, background-color 0.3s ease-in',
+      transform: 'scale(0.8)'
+    },
+    legendStyleIsActive: {
+      backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleIsActive', 'backgroundColor'], _colorsModule.default.white),
+      userSelect: 'none',
+      transform: 'scale(1)'
+    },
+    legendStyleTouchable: {
+      alignItems: 'center',
+      height: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleTouchable', 'height'], _sizesModule.default.defaultCarrouselLegendTouchable),
+      width: (0, _seamlessImmutable.getIn)(theme, ['UTCarousel', 'legendStyleTouchable', 'width'], _sizesModule.default.defaultCarrouselLegendTouchable),
+      justifyContent: 'center',
+      display: 'flex',
+      userSelect: 'none'
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/components/UTCheckList/index.js

@@ -1 +1,26 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_V=_interopRequireDefault(require("./versions/V0")),_V2=_interopRequireDefault(require("./versions/V1"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const UTCheckList=_ref=>{let{version:version="V0",...props}=_ref;const Component={V0:_V.default,V1:_V2.default}[version];return _react.default.createElement(Component,props)};UTCheckList.propTypes={version:_propTypes.string};var _default=exports.default=UTCheckList;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = require("prop-types");
+var _V = _interopRequireDefault(require("./versions/V0"));
+var _V2 = _interopRequireDefault(require("./versions/V1"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const UTCheckList = _ref => {
+  let {
+    version = 'V0',
+    ...props
+  } = _ref;
+  const Component = {
+    V0: _V.default,
+    V1: _V2.default
+  }[version];
+  return /*#__PURE__*/_react.default.createElement(Component, props);
+};
+UTCheckList.propTypes = {
+  version: _propTypes.string
+};
+var _default = exports.default = UTCheckList;

package/dist/components/UTCheckList/versions/V0/constants.js

@@ -1 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.defaultAdditionalInfoHeader=void 0;const defaultAdditionalInfoHeader=exports.defaultAdditionalInfoHeader="Seleccionar Todo";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.defaultAdditionalInfoHeader = void 0;
+const defaultAdditionalInfoHeader = exports.defaultAdditionalInfoHeader = 'Seleccionar Todo';