@widergy/energy-ui 3.173.2 → 3.173.4

package/dist/esm/components/UTRating/versions/V0/index.js

@@ -1,96 +1 @@
-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, { Fragment, useState } from 'react';
-import { func, arrayOf, shape, number, string, oneOfType, bool, object, objectOf } from 'prop-types';
-import { isEmpty, autocompleteWithNumbers } from '@widergy/web-utils/lib/array';
-import Colors from '../../../../scss/variables/colors.module.scss';
-import { fieldType } from '../../../../types/formTypes';
-import WithTheme from '../../../WithTheme';
-import UTLabel from '../../../UTLabel';
-import { mergeClasses } from '../../../../utils/classesUtils';
-import { retrieveStyle } from './theme';
-import styles from './styles.module.scss';
-import Circle from './components/Circle';
-import Faces from './components/Faces';
-import Star from './components/Star';
-import { RATING_VARIANTS } from './constants';
-const UTRatingContainer = _ref => {
-  let {
-    classes: theme,
-    classNames,
-    field = {},
-    onChange,
-    options,
-    titleProps,
-    withUpperTitle
-  } = _ref;
-  const [selectedOptions, setSelectedOptions] = useState([]);
-  const [hoveredOptions, setHoveredOptions] = useState([]);
-  const [temporalSelected, setTemporalSelected] = useState([]);
-  const classes = mergeClasses(theme, classNames);
-  const {
-    ignore_title: ignoreTitle,
-    variant,
-    star_color: starColor,
-    text_variant: textVariant
-  } = field.configuration || {};
-  const shouldShowUpperTitle = ignoreTitle && withUpperTitle;
-  const handleClick = (order, value) => {
-    setSelectedOptions(autocompleteWithNumbers(1, order));
-    if (isEmpty(selectedOptions)) setTemporalSelected(autocompleteWithNumbers(1, order));
-    onChange(value.toString());
-  };
-  const handleHover = value => {
-    setHoveredOptions(autocompleteWithNumbers(1, value));
-    setSelectedOptions([]);
-  };
-  const handleMouseLeave = () => {
-    setHoveredOptions([]);
-    setSelectedOptions(temporalSelected);
-  };
-  const handleMapOptions = option => {
-    const defaultProps = {
-      onClick: handleClick,
-      value: option.value,
-      order: option.order,
-      isFirst: options[0].order === option.order,
-      isLast: options[options.length - 1].order === option.order,
-      textVariant,
-      name: option.name,
-      classes,
-      color: starColor || Colors.ratingStarSelected
-    };
-    return variant === RATING_VARIANTS.CIRCULAR ? /*#__PURE__*/React.createElement(Circle, _extends({
-      key: option.value,
-      selected: selectedOptions[selectedOptions.length - 1] === option.order
-    }, defaultProps)) : variant === RATING_VARIANTS.FACES ? /*#__PURE__*/React.createElement(Faces, _extends({
-      key: option.value,
-      selected: selectedOptions[selectedOptions.length - 1] === option.order
-    }, defaultProps)) : /*#__PURE__*/React.createElement(Star, _extends({
-      key: option.value,
-      hovered: hoveredOptions.includes(option.order),
-      selected: selectedOptions.includes(option.order),
-      onMouseLeave: handleMouseLeave,
-      onHover: handleHover
-    }, defaultProps));
-  };
-  return /*#__PURE__*/React.createElement(Fragment, null, shouldShowUpperTitle && /*#__PURE__*/React.createElement(UTLabel, _extends({
-    className: "".concat(classes.title)
-  }, titleProps, {
-    withMarkdown: true
-  }), field.title), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles.container, " ").concat(classes.container)
-  }, options.map(handleMapOptions)));
-};
-UTRatingContainer.propTypes = {
-  classes: objectOf(string),
-  classNames: objectOf(string),
-  field: fieldType,
-  onChange: func,
-  options: arrayOf(shape({
-    order: number,
-    value: oneOfType([number, string])
-  })),
-  titleProps: object,
-  withUpperTitle: bool
-};
-export default WithTheme(retrieveStyle)(UTRatingContainer);
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var o in r)({}).hasOwnProperty.call(r,o)&&(e[o]=r[o])}return e},_extends.apply(null,arguments)}import React,{Fragment,useState}from"react";import{func,arrayOf,shape,number,string,oneOfType,bool,object,objectOf}from"prop-types";import{isEmpty,autocompleteWithNumbers}from"@widergy/web-utils/lib/array";import Colors from"../../../../scss/variables/colors.module.scss";import{fieldType}from"../../../../types/formTypes";import WithTheme from"../../../WithTheme";import UTLabel from"../../../UTLabel";import{mergeClasses}from"../../../../utils/classesUtils";import{retrieveStyle}from"./theme";import styles from"./styles.module.scss";import Circle from"./components/Circle";import Faces from"./components/Faces";import Star from"./components/Star";import{RATING_VARIANTS}from"./constants";const UTRatingContainer=e=>{let{classes:t,classNames:r,field:o={},onChange:s,options:a,titleProps:n,withUpperTitle:i}=e;const[l,c]=useState([]),[m,p]=useState([]),[u,d]=useState([]),f=mergeClasses(t,r),{ignore_title:g,variant:h,star_color:y,text_variant:b}=o.configuration||{},T=g&&i,v=(e,t)=>{c(autocompleteWithNumbers(1,e)),isEmpty(l)&&d(autocompleteWithNumbers(1,e)),s(t.toString())},R=e=>{p(autocompleteWithNumbers(1,e)),c([])},C=()=>{p([]),c(u)};return React.createElement(Fragment,null,T&&React.createElement(UTLabel,_extends({className:"".concat(f.title)},n,{withMarkdown:!0}),o.title),React.createElement("div",{className:"".concat(styles.container," ").concat(f.container)},a.map(e=>{const t={onClick:v,value:e.value,order:e.order,isFirst:a[0].order===e.order,isLast:a[a.length-1].order===e.order,textVariant:b,name:e.name,classes:f,color:y||Colors.ratingStarSelected};return h===RATING_VARIANTS.CIRCULAR?React.createElement(Circle,_extends({key:e.value,selected:l[l.length-1]===e.order},t)):h===RATING_VARIANTS.FACES?React.createElement(Faces,_extends({key:e.value,selected:l[l.length-1]===e.order},t)):React.createElement(Star,_extends({key:e.value,hovered:m.includes(e.order),selected:l.includes(e.order),onMouseLeave:C,onHover:R},t))})))};UTRatingContainer.propTypes={classes:objectOf(string),classNames:objectOf(string),field:fieldType,onChange:func,options:arrayOf(shape({order:number,value:oneOfType([number,string])})),titleProps:object,withUpperTitle:bool};export default WithTheme(retrieveStyle)(UTRatingContainer);

package/dist/esm/components/UTRating/versions/V0/theme.js

@@ -1,85 +1 @@
-import { getIn } from 'seamless-immutable';
-import Colors from '../../../../scss/variables/colors.module.scss';
-export const retrieveStyle = _ref => {
-  let {
-    theme
-  } = _ref;
-  return {
-    faceButtonConfuzed: {
-      '&:hover path, &$faceButtonSelected path': {
-        fill: theme.Palette.error['05']
-      },
-      '&:hover + $label, &$faceButtonSelected + $label': {
-        color: theme.Palette.error['05']
-      }
-    },
-    faceButtonSad: {
-      '&:hover path, &$faceButtonSelected path': {
-        fill: theme.Palette.error['03']
-      },
-      '&:hover + $label, &$faceButtonSelected + $label': {
-        color: theme.Palette.error['03']
-      }
-    },
-    faceButtonEmpty: {
-      '&:hover path, &$faceButtonSelected path': {
-        fill: theme.Palette.warning['04']
-      },
-      '&:hover + $label, &$faceButtonSelected + $label': {
-        color: theme.Palette.warning['04']
-      }
-    },
-    faceButtonSmile: {
-      '&:hover path, &$faceButtonSelected path': {
-        fill: theme.Palette.success['03']
-      },
-      '&:hover + $label, &$faceButtonSelected + $label': {
-        color: theme.Palette.success['03']
-      }
-    },
-    faceButtonHappy: {
-      '&:hover path, &$faceButtonSelected path': {
-        fill: theme.Palette.success['05']
-      },
-      '&:hover + $label, &$faceButtonSelected + $label': {
-        color: theme.Palette.success['05']
-      }
-    },
-    faceButtonSelected: {},
-    label: {
-      color: "".concat(getIn(theme, ['UTRating', 'label', 'color'])),
-      fontSize: "".concat(getIn(theme, ['UTRating', 'label', 'fontSize'])),
-      right: "".concat(getIn(theme, ['UTRating', 'label', 'right']))
-    },
-    labelBottomFirst: {
-      alignSelf: "".concat(getIn(theme, ['UTRating', 'labelBottomFirst', 'alignSelf'])),
-      position: "".concat(getIn(theme, ['UTRating', 'labelBottomFirst', 'position'])),
-      right: "".concat(getIn(theme, ['UTRating', 'labelBottomFirst', 'right'])),
-      top: "".concat(getIn(theme, ['UTRating', 'labelBottomFirst', 'top'])),
-      width: "".concat(getIn(theme, ['UTRating', 'labelBottomFirst', 'width']))
-    },
-    labelBottomLast: {
-      alignSelf: "".concat(getIn(theme, ['UTRating', 'labelBottomLast', 'alignSelf'])),
-      position: "".concat(getIn(theme, ['UTRating', 'labelBottomLast', 'position'])),
-      right: "".concat(getIn(theme, ['UTRating', 'labelBottomLast', 'right'])),
-      top: "".concat(getIn(theme, ['UTRating', 'labelBottomLast', 'top'])),
-      width: "".concat(getIn(theme, ['UTRating', 'labelBottomLast', 'width']))
-    },
-    avatar: {
-      color: "".concat(getIn(theme, ['UTRating', 'avatar', 'color'], Colors.gray3), " !important")
-    },
-    container: {
-      justifyContent: "".concat(getIn(theme, ['UTRating', 'container', 'justifyContent'])),
-      pointerEvents: "".concat(getIn(theme, ['UTRating', 'container', 'pointerEvents']))
-    },
-    circleWithTextBottom: {
-      margin: "".concat(getIn(theme, ['UTRating', 'circleWithTextBottom', 'margin'])),
-      width: "".concat(getIn(theme, ['UTRating', 'circleWithTextBottom', 'width']))
-    },
-    title: {
-      fontWeight: "".concat(getIn(theme, ['UTRating', 'title', 'fontWeight'])),
-      marginBottom: "".concat(getIn(theme, ['UTRating', 'title', 'marginBottom'])),
-      textAlign: "".concat(getIn(theme, ['UTRating', 'title', 'textAlign']))
-    }
-  };
-};
+import{getIn}from"seamless-immutable";import Colors from"../../../../scss/variables/colors.module.scss";export const retrieveStyle=t=>{let{theme:e}=t;return{faceButtonConfuzed:{"&:hover path, &$faceButtonSelected path":{fill:e.Palette.error["05"]},"&:hover + $label, &$faceButtonSelected + $label":{color:e.Palette.error["05"]}},faceButtonSad:{"&:hover path, &$faceButtonSelected path":{fill:e.Palette.error["03"]},"&:hover + $label, &$faceButtonSelected + $label":{color:e.Palette.error["03"]}},faceButtonEmpty:{"&:hover path, &$faceButtonSelected path":{fill:e.Palette.warning["04"]},"&:hover + $label, &$faceButtonSelected + $label":{color:e.Palette.warning["04"]}},faceButtonSmile:{"&:hover path, &$faceButtonSelected path":{fill:e.Palette.success["03"]},"&:hover + $label, &$faceButtonSelected + $label":{color:e.Palette.success["03"]}},faceButtonHappy:{"&:hover path, &$faceButtonSelected path":{fill:e.Palette.success["05"]},"&:hover + $label, &$faceButtonSelected + $label":{color:e.Palette.success["05"]}},faceButtonSelected:{},label:{color:"".concat(getIn(e,["UTRating","label","color"])),fontSize:"".concat(getIn(e,["UTRating","label","fontSize"])),right:"".concat(getIn(e,["UTRating","label","right"]))},labelBottomFirst:{alignSelf:"".concat(getIn(e,["UTRating","labelBottomFirst","alignSelf"])),position:"".concat(getIn(e,["UTRating","labelBottomFirst","position"])),right:"".concat(getIn(e,["UTRating","labelBottomFirst","right"])),top:"".concat(getIn(e,["UTRating","labelBottomFirst","top"])),width:"".concat(getIn(e,["UTRating","labelBottomFirst","width"]))},labelBottomLast:{alignSelf:"".concat(getIn(e,["UTRating","labelBottomLast","alignSelf"])),position:"".concat(getIn(e,["UTRating","labelBottomLast","position"])),right:"".concat(getIn(e,["UTRating","labelBottomLast","right"])),top:"".concat(getIn(e,["UTRating","labelBottomLast","top"])),width:"".concat(getIn(e,["UTRating","labelBottomLast","width"]))},avatar:{color:"".concat(getIn(e,["UTRating","avatar","color"],Colors.gray3)," !important")},container:{justifyContent:"".concat(getIn(e,["UTRating","container","justifyContent"])),pointerEvents:"".concat(getIn(e,["UTRating","container","pointerEvents"]))},circleWithTextBottom:{margin:"".concat(getIn(e,["UTRating","circleWithTextBottom","margin"])),width:"".concat(getIn(e,["UTRating","circleWithTextBottom","width"]))},title:{fontWeight:"".concat(getIn(e,["UTRating","title","fontWeight"])),marginBottom:"".concat(getIn(e,["UTRating","title","marginBottom"])),textAlign:"".concat(getIn(e,["UTRating","title","textAlign"]))}}};

package/dist/esm/components/UTRating/versions/V1/components/Option/index.js

@@ -1,46 +1 @@
-import { bool, func, object, string } from 'prop-types';
-import React from 'react';
-import { RATING_VARIANTS } from '../../constants';
-import UTButton from '../../../../../UTButton';
-import WithTheme from '../../../../../WithTheme';
-import { getIcon, getVariant } from './utils';
-import { retrieveStyle } from './theme';
-import styles from './styles.module.scss';
-const Option = _ref => {
-  let {
-    classes,
-    disabled,
-    error,
-    isSelected,
-    name,
-    onChange,
-    value,
-    variant,
-    wrapperStyle
-  } = _ref;
-  return /*#__PURE__*/React.createElement("div", {
-    style: wrapperStyle
-  }, /*#__PURE__*/React.createElement(UTButton, {
-    classNames: {
-      root: "".concat(styles.option, " ").concat(error ? classes.error : ''),
-      text: styles.text
-    },
-    colorTheme: isSelected ? 'primary' : 'secondary',
-    disabled: disabled,
-    Icon: getIcon(variant, value, isSelected),
-    onClick: () => onChange(value),
-    variant: getVariant(variant, isSelected)
-  }, RATING_VARIANTS.TEXT === variant ? name : null));
-};
-Option.propTypes = {
-  classes: object,
-  disabled: bool,
-  error: string,
-  isSelected: bool,
-  name: string,
-  onChange: func,
-  value: string,
-  variant: string,
-  wrapperStyle: object
-};
-export default WithTheme(retrieveStyle)(Option);
+import{bool,func,object,string}from"prop-types";import React from"react";import{RATING_VARIANTS}from"../../constants";import UTButton from"../../../../../UTButton";import WithTheme from"../../../../../WithTheme";import{getIcon,getVariant}from"./utils";import{retrieveStyle}from"./theme";import styles from"./styles.module.scss";const Option=e=>{let{classes:t,disabled:r,error:o,isSelected:n,name:s,onChange:a,value:i,variant:l,wrapperStyle:c}=e;return React.createElement("div",{style:c},React.createElement(UTButton,{classNames:{root:"".concat(styles.option," ").concat(o?t.error:""),text:styles.text},colorTheme:n?"primary":"secondary",disabled:r,Icon:getIcon(l,i,n),onClick:()=>a(i),variant:getVariant(l,n)},RATING_VARIANTS.TEXT===l?s:null))};Option.propTypes={classes:object,disabled:bool,error:string,isSelected:bool,name:string,onChange:func,value:string,variant:string,wrapperStyle:object};export default WithTheme(retrieveStyle)(Option);

package/dist/esm/components/UTRating/versions/V1/components/Option/theme.js

@@ -1,10 +1 @@
-export const retrieveStyle = _ref => {
-  let {
-    theme
-  } = _ref;
-  return {
-    error: {
-      borderColor: "".concat(theme.Palette.error['05'], " !important")
-    }
-  };
-};
+export const retrieveStyle=r=>{let{theme:e}=r;return{error:{borderColor:"".concat(e.Palette.error["05"]," !important")}}};

package/dist/esm/components/UTRating/versions/V1/components/Option/utils.js

@@ -1,13 +1 @@
-import { RATING_VARIANTS } from '../../constants';
-export const getIcon = (variant, value, isSelected) => ({
-  [RATING_VARIANTS.TEXT]: null,
-  [RATING_VARIANTS.FACES]: {
-    1: 'IconMoodSad',
-    2: 'IconMoodConfuzed',
-    3: 'IconMoodEmpty',
-    4: 'IconMoodSmile',
-    5: 'IconMoodHappy'
-  }[value],
-  [RATING_VARIANTS.STAR]: isSelected ? 'IconStarFilled' : 'IconStar'
-})[variant];
-export const getVariant = (variant, isSelected) => !isSelected || variant === RATING_VARIANTS.STAR ? 'shadow' : 'outlined';
+import{RATING_VARIANTS}from"../../constants";export const getIcon=(o,A,I)=>({[RATING_VARIANTS.TEXT]:null,[RATING_VARIANTS.FACES]:{1:"IconMoodSad",2:"IconMoodConfuzed",3:"IconMoodEmpty",4:"IconMoodSmile",5:"IconMoodHappy"}[A],[RATING_VARIANTS.STAR]:I?"IconStarFilled":"IconStar"}[o]);export const getVariant=(o,A)=>A&&o!==RATING_VARIANTS.STAR?"outlined":"shadow";

package/dist/esm/components/UTRating/versions/V1/constants.js

@@ -1,5 +1 @@
-export const RATING_VARIANTS = {
-  FACES: 'faces',
-  STAR: 'star',
-  TEXT: 'text'
-};
+export const RATING_VARIANTS={FACES:"faces",STAR:"star",TEXT:"text"};

package/dist/esm/components/UTRating/versions/V1/index.js

@@ -1,88 +1 @@
-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, { useMemo } from 'react';
-import { func, string, bool, object, array } from 'prop-types';
-import UTLabel from '../../../UTLabel';
-import UTFieldLabel from '../../../UTFieldLabel';
-import { formatErrorToValidation } from '../../../UTValidation/utils';
-import UTValidation from '../../../UTValidation';
-import { useScreenSize } from '../../../../utils/useScreenSize';
-import styles from './styles.module.scss';
-import Option from './components/Option';
-import { RATING_VARIANTS } from './constants';
-const UTRating = _ref => {
-  let {
-    classNames = {},
-    dataTestId,
-    disabled,
-    error,
-    forceMultiRow,
-    helpTextEnd,
-    helpTextStart,
-    onChange,
-    options = [],
-    required,
-    title,
-    validations,
-    value,
-    variant = RATING_VARIANTS.STAR
-  } = _ref;
-  const {
-    isMobileOrTablet
-  } = useScreenSize();
-  const validationData = useMemo(() => validations || error && formatErrorToValidation(error), [error, validations]);
-  const valueIndex = options.map(_ref2 => {
-    let {
-      value: optionValue
-    } = _ref2;
-    return optionValue;
-  }).indexOf(value);
-  const isSelected = index => valueIndex !== -1 && variant === RATING_VARIANTS.STAR ? index <= valueIndex : index === valueIndex;
-  const wrapperStyle = {
-    boxSizing: 'border-box',
-    display: 'flex',
-    flex: (isMobileOrTablet || forceMultiRow) && options.length > 5 ? "0 0 calc(".concat(100 / Math.ceil(options.length / 2), "% - 4px)") : '1 '
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles.container, " ").concat(classNames.container),
-    "data-testid": dataTestId
-  }, title && /*#__PURE__*/React.createElement(UTFieldLabel, {
-    required: required
-  }, title), /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles.optionsContainer, " ").concat(classNames.optionsContainer, " ").concat(isMobileOrTablet ? styles.responsive : '', " ").concat(forceMultiRow ? styles.forceMultiRow : '')
-  }, options.map((option, index) => /*#__PURE__*/React.createElement(Option, _extends({}, option, {
-    disabled: disabled,
-    error: error,
-    isSelected: isSelected(index),
-    key: option.value,
-    onChange: onChange,
-    variant: variant,
-    wrapperStyle: wrapperStyle
-  })))), helpTextStart && /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles.helpTextContainer, " ").concat(classNames.helpTextContainer)
-  }, /*#__PURE__*/React.createElement(UTLabel, {
-    colorTheme: "gray",
-    variant: "small"
-  }, helpTextStart), helpTextEnd && /*#__PURE__*/React.createElement(UTLabel, {
-    colorTheme: "gray",
-    variant: "small"
-  }, helpTextEnd)), validationData && /*#__PURE__*/React.createElement(UTValidation, {
-    validationData: validationData
-  }));
-};
-UTRating.propTypes = {
-  classNames: object,
-  dataTestId: string,
-  disabled: bool,
-  error: string,
-  forceMultiRow: bool,
-  helpTextEnd: string,
-  helpTextStart: string,
-  onChange: func,
-  options: array,
-  required: bool,
-  title: string,
-  validations: array,
-  value: string,
-  variant: string
-};
-export default UTRating;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},_extends.apply(null,arguments)}import React,{useMemo}from"react";import{func,string,bool,object,array}from"prop-types";import UTLabel from"../../../UTLabel";import UTFieldLabel from"../../../UTFieldLabel";import{formatErrorToValidation}from"../../../UTValidation/utils";import UTValidation from"../../../UTValidation";import{useScreenSize}from"../../../../utils/useScreenSize";import styles from"./styles.module.scss";import Option from"./components/Option";import{RATING_VARIANTS}from"./constants";const UTRating=e=>{let{classNames:t={},dataTestId:a,disabled:r,error:o,forceMultiRow:n,helpTextEnd:i,helpTextStart:l,onChange:s,options:c=[],required:m,title:d,validations:p,value:T,variant:u=RATING_VARIANTS.STAR}=e;const{isMobileOrTablet:f}=useScreenSize(),b=useMemo(()=>p||o&&formatErrorToValidation(o),[o,p]),R=c.map(e=>{let{value:t}=e;return t}).indexOf(T),g=e=>-1!==R&&u===RATING_VARIANTS.STAR?e<=R:e===R,v={boxSizing:"border-box",display:"flex",flex:(f||n)&&c.length>5?"0 0 calc(".concat(100/Math.ceil(c.length/2),"% - 4px)"):"1 "};return React.createElement("div",{className:"".concat(styles.container," ").concat(t.container),"data-testid":a},d&&React.createElement(UTFieldLabel,{required:m},d),React.createElement("div",{className:"".concat(styles.optionsContainer," ").concat(t.optionsContainer," ").concat(f?styles.responsive:""," ").concat(n?styles.forceMultiRow:"")},c.map((e,t)=>React.createElement(Option,_extends({},e,{disabled:r,error:o,isSelected:g(t),key:e.value,onChange:s,variant:u,wrapperStyle:v})))),l&&React.createElement("div",{className:"".concat(styles.helpTextContainer," ").concat(t.helpTextContainer)},React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},l),i&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},i)),b&&React.createElement(UTValidation,{validationData:b}))};UTRating.propTypes={classNames:object,dataTestId:string,disabled:bool,error:string,forceMultiRow:bool,helpTextEnd:string,helpTextStart:string,onChange:func,options:array,required:bool,title:string,validations:array,value:string,variant:string};export default UTRating;

package/dist/esm/components/UTRipple/Ripple.js

@@ -1,60 +1 @@
-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, { useState } from 'react';
-import { Transition } from 'react-transition-group';
-import { element, any } from 'prop-types';
-import styles from './styles.module.scss';
-const Ripple = _ref => {
-  let {
-    elem,
-    event,
-    ...other
-  } = _ref;
-  const [enter, setEnter] = useState(false);
-  const [leaving, setLeaving] = useState(false);
-  const handleEnter = () => setEnter(true);
-  const handleExit = () => {
-    setLeaving(true);
-  };
-  const rect = elem ? elem.getBoundingClientRect() : {
-    width: 0,
-    height: 0,
-    left: 0,
-    top: 0
-  };
-  let rippleX;
-  let rippleY;
-  if (event.clientX === 0 && event.clientY === 0 || !event.clientX && !event.touches) {
-    rippleX = Math.round(rect.width / 2);
-    rippleY = Math.round(rect.height / 2);
-  } else {
-    const clientX = event.clientX ? event.clientX : event.touches[0].clientX;
-    const clientY = event.clientY ? event.clientY : event.touches[0].clientY;
-    rippleX = Math.round(clientX - rect.left);
-    rippleY = Math.round(clientY - rect.top);
-  }
-  const sizeX = Math.max(Math.abs((elem ? elem.clientWidth : 0) - rippleX), rippleX) * 2 + 2;
-  const sizeY = Math.max(Math.abs((elem ? elem.clientHeight : 0) - rippleY), rippleY) * 2 + 2;
-  const rippleSize = Math.sqrt(sizeX ** 2 + sizeY ** 2);
-  const rippleStyles = {
-    width: rippleSize,
-    height: rippleSize,
-    top: -(rippleSize / 2) + rippleY,
-    left: -(rippleSize / 2) + rippleX
-  };
-  return /*#__PURE__*/React.createElement(Transition, _extends({
-    timeout: 500,
-    onEnter: handleEnter,
-    unmountOnExit: true,
-    onExit: handleExit
-  }, other), /*#__PURE__*/React.createElement("span", {
-    className: "".concat(styles.ripple, " ").concat(enter && styles.rippleEnter),
-    style: rippleStyles
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "".concat(styles.child, " ").concat(leaving && styles.rippleExit)
-  })));
-};
-Ripple.propTypes = {
-  elem: element,
-  event: any
-};
-export default Ripple;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var s in n)({}).hasOwnProperty.call(n,s)&&(t[s]=n[s])}return t},_extends.apply(null,arguments)}import React,{useState}from"react";import{Transition}from"react-transition-group";import{element,any}from"prop-types";import styles from"./styles.module.scss";const Ripple=t=>{let{elem:e,event:n,...s}=t;const[a,i]=useState(!1),[l,c]=useState(!1),o=e?e.getBoundingClientRect():{width:0,height:0,left:0,top:0};let r,p;if(0===n.clientX&&0===n.clientY||!n.clientX&&!n.touches)r=Math.round(o.width/2),p=Math.round(o.height/2);else{const t=n.clientX?n.clientX:n.touches[0].clientX,e=n.clientY?n.clientY:n.touches[0].clientY;r=Math.round(t-o.left),p=Math.round(e-o.top)}const h=2*Math.max(Math.abs((e?e.clientWidth:0)-r),r)+2,u=2*Math.max(Math.abs((e?e.clientHeight:0)-p),p)+2,m=Math.sqrt(h**2+u**2),d={width:m,height:m,top:-m/2+p,left:-m/2+r};return React.createElement(Transition,_extends({timeout:500,onEnter:()=>i(!0),unmountOnExit:!0,onExit:()=>{c(!0)}},s),React.createElement("span",{className:"".concat(styles.ripple," ").concat(a&&styles.rippleEnter),style:d},React.createElement("span",{className:"".concat(styles.child," ").concat(l&&styles.rippleExit)})))};Ripple.propTypes={elem:element,event:any};export default Ripple;

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

@@ -1,44 +1 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import { TransitionGroup } from 'react-transition-group';
-import { bool } from 'prop-types';
-import { refType } from '../../types/commonTypes';
-import Ripple from './Ripple';
-import styles from './styles.module.scss';
-const UTRipple = _ref => {
-  let {
-    elem,
-    withRipple
-  } = _ref;
-  const [ripples, setRipples] = useState([]);
-  const setNewRipples = useCallback(event => {
-    setRipples(prevRipples => [...prevRipples, /*#__PURE__*/React.createElement(Ripple, {
-      event: event,
-      elem: elem,
-      key: Math.random()
-    })]);
-  }, [elem]);
-  const removeRipple = useCallback(() => setRipples(prevRipples => prevRipples.slice(1)), []);
-  useEffect(() => {
-    if (withRipple && elem) {
-      elem.addEventListener('mousedown', setNewRipples);
-      elem.addEventListener('mouseup', removeRipple);
-      elem.addEventListener('mouseleave', removeRipple);
-    }
-    return () => {
-      if (withRipple && elem) {
-        elem.removeEventListener('mousedown', setNewRipples);
-        elem.removeEventListener('mouseup', removeRipple);
-        elem.removeEventListener('mouseleave', removeRipple);
-      }
-    };
-  }, [elem, setNewRipples, removeRipple, withRipple]);
-  return /*#__PURE__*/React.createElement(TransitionGroup, {
-    component: "span",
-    className: styles.root
-  }, ripples);
-};
-UTRipple.propTypes = {
-  elem: refType,
-  withRipple: bool
-};
-export default UTRipple;
+import React,{useState,useEffect,useCallback}from"react";import{TransitionGroup}from"react-transition-group";import{bool}from"prop-types";import{refType}from"../../types/commonTypes";import Ripple from"./Ripple";import styles from"./styles.module.scss";const UTRipple=e=>{let{elem:t,withRipple:o}=e;const[s,p]=useState([]),r=useCallback(e=>{p(o=>[...o,React.createElement(Ripple,{event:e,elem:t,key:Math.random()})])},[t]),m=useCallback(()=>p(e=>e.slice(1)),[]);return useEffect(()=>(o&&t&&(t.addEventListener("mousedown",r),t.addEventListener("mouseup",m),t.addEventListener("mouseleave",m)),()=>{o&&t&&(t.removeEventListener("mousedown",r),t.removeEventListener("mouseup",m),t.removeEventListener("mouseleave",m))}),[t,r,m,o]),React.createElement(TransitionGroup,{component:"span",className:styles.root},s)};UTRipple.propTypes={elem:refType,withRipple:bool};export default UTRipple;

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

@@ -1,92 +1 @@
-import { string, bool, func, objectOf, shape } from 'prop-types';
-import React from 'react';
-import { COMPONENT_KEYS } from '../UTBaseInputField/constants';
-import UTBaseInputField from '../UTBaseInputField';
-import WithTheme from '../WithTheme';
-import { retrieveStyle } from './theme';
-import styles from './styles.module.scss';
-const UTSearchField = _ref => {
-  let {
-    classes,
-    className,
-    customAction,
-    dataKeyboard,
-    dataTestId,
-    disabled,
-    id,
-    onBlur,
-    onChange = () => {},
-    onFocus,
-    placeholder,
-    size,
-    type,
-    value = null,
-    variant = 'gray'
-  } = _ref;
-  const clearText = () => {
-    onChange('');
-  };
-  const action = {
-    Icon: 'IconX',
-    onClick: clearText,
-    size: 'small'
-  };
-  const leftAdornments = [{
-    name: COMPONENT_KEYS.ICON,
-    props: {
-      Icon: 'IconSearch',
-      changeOnFocus: true,
-      shade: '02'
-    }
-  }];
-  const rightAdornments = value || customAction ? [{
-    name: COMPONENT_KEYS.ACTION,
-    props: {
-      action: customAction || action
-    }
-  }] : [];
-  return /*#__PURE__*/React.createElement(UTBaseInputField, {
-    alwaysShowPlaceholder: true,
-    classNames: {
-      container: "".concat(styles.container, " ").concat(className),
-      input: classes.input
-    },
-    dataKeyboard: dataKeyboard || 'search',
-    dataTestId: dataTestId,
-    disabled: disabled,
-    id: id,
-    inputSize: size,
-    leftAdornments: leftAdornments,
-    onBlur: onBlur,
-    onChange: onChange,
-    onFocus: onFocus,
-    placeholder: placeholder,
-    rightAdornments: rightAdornments,
-    type: type,
-    value: value,
-    variant: variant
-  });
-};
-export const propTypes = {
-  className: string,
-  classes: objectOf(string),
-  customAction: shape({
-    Icon: string,
-    onClick: func,
-    size: string
-  }),
-  dataKeyboard: string,
-  dataTestId: string,
-  disabled: bool,
-  id: string,
-  onBlur: func,
-  onChange: func,
-  onFocus: func,
-  placeholder: string,
-  size: string,
-  type: string,
-  value: string,
-  variant: string
-};
-UTSearchField.propTypes = propTypes;
-export default WithTheme(retrieveStyle)(UTSearchField);
+import{string,bool,func,objectOf,shape}from"prop-types";import React from"react";import{COMPONENT_KEYS}from"../UTBaseInputField/constants";import UTBaseInputField from"../UTBaseInputField";import WithTheme from"../WithTheme";import{retrieveStyle}from"./theme";import styles from"./styles.module.scss";const UTSearchField=e=>{let{classes:t,className:s,customAction:a,dataKeyboard:n,dataTestId:o,disabled:r,id:i,onBlur:c,onChange:l=()=>{},onFocus:p,placeholder:d,size:m,type:u,value:h=null,variant:T="gray"}=e;const g={Icon:"IconX",onClick:()=>{l("")},size:"small"},y=[{name:COMPONENT_KEYS.ICON,props:{Icon:"IconSearch",changeOnFocus:!0,shade:"02"}}],f=h||a?[{name:COMPONENT_KEYS.ACTION,props:{action:a||g}}]:[];return React.createElement(UTBaseInputField,{alwaysShowPlaceholder:!0,classNames:{container:"".concat(styles.container," ").concat(s),input:t.input},dataKeyboard:n||"search",dataTestId:o,disabled:r,id:i,inputSize:m,leftAdornments:y,onBlur:c,onChange:l,onFocus:p,placeholder:d,rightAdornments:f,type:u,value:h,variant:T})};export const propTypes={className:string,classes:objectOf(string),customAction:shape({Icon:string,onClick:func,size:string}),dataKeyboard:string,dataTestId:string,disabled:bool,id:string,onBlur:func,onChange:func,onFocus:func,placeholder:string,size:string,type:string,value:string,variant:string};UTSearchField.propTypes=propTypes;export default WithTheme(retrieveStyle)(UTSearchField);

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

@@ -1,12 +1 @@
-export const retrieveStyle = _ref => {
-  let {
-    theme
-  } = _ref;
-  return {
-    input: {
-      '&::placeholder': {
-        color: "".concat(theme.Palette.gray['04'], " !important")
-      }
-    }
-  };
-};
+export const retrieveStyle=e=>{let{theme:t}=e;return{input:{"&::placeholder":{color:"".concat(t.Palette.gray["04"]," !important")}}}};

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

@@ -1,19 +1 @@
-import React from 'react';
-import { string } from 'prop-types';
-import V0 from './versions/V0';
-import V1 from './versions/V1';
-const UTSelect = _ref => {
-  let {
-    version = 'V0',
-    ...props
-  } = _ref;
-  const Component = {
-    V0,
-    V1
-  }[version];
-  return /*#__PURE__*/React.createElement(Component, props);
-};
-UTSelect.propTypes = {
-  version: string
-};
-export default UTSelect;
+import React from"react";import{string}from"prop-types";import V0 from"./versions/V0";import V1 from"./versions/V1";const UTSelect=e=>{let{version:r="V0",...t}=e;const o={V0:V0,V1:V1}[r];return React.createElement(o,t)};UTSelect.propTypes={version:string};export default UTSelect;

package/dist/esm/components/UTSelect/versions/V0/components/Option/index.js

@@ -1,31 +1 @@
-import React, { memo, Fragment } from 'react';
-import { any, bool, objectOf, object, string } from 'prop-types';
-import Checkbox from '@material-ui/core/Checkbox';
-const Option = _ref => {
-  let {
-    classes,
-    isMultiple,
-    labelKey,
-    optionProps,
-    value,
-    valueKey
-  } = _ref;
-  const OptionIcon = optionProps.icon;
-  return /*#__PURE__*/React.createElement(Fragment, null, isMultiple && /*#__PURE__*/React.createElement(Checkbox, {
-    color: "primary",
-    checked: (value === null || value === void 0 ? void 0 : value.indexOf(optionProps[valueKey])) > -1
-  }), OptionIcon ? /*#__PURE__*/React.createElement("div", {
-    className: classes.labelContainer
-  }, /*#__PURE__*/React.createElement(OptionIcon, {
-    className: classes.optionIcon
-  }), /*#__PURE__*/React.createElement("div", null, optionProps[labelKey])) : optionProps[labelKey]);
-};
-Option.propTypes = {
-  classes: objectOf(string),
-  isMultiple: bool,
-  labelKey: string,
-  optionProps: object,
-  value: any,
-  valueKey: string
-};
-export default /*#__PURE__*/memo(Option);
+import React,{memo,Fragment}from"react";import{any,bool,objectOf,object,string}from"prop-types";import Checkbox from"@material-ui/core/Checkbox";const Option=e=>{let{classes:t,isMultiple:o,labelKey:l,optionProps:a,value:c,valueKey:r}=e;const n=a.icon;return React.createElement(Fragment,null,o&&React.createElement(Checkbox,{color:"primary",checked:(null==c?void 0:c.indexOf(a[r]))>-1}),n?React.createElement("div",{className:t.labelContainer},React.createElement(n,{className:t.optionIcon}),React.createElement("div",null,a[l])):a[l])};Option.propTypes={classes:objectOf(string),isMultiple:bool,labelKey:string,optionProps:object,value:any,valueKey:string};export default memo(Option);