@widergy/energy-ui 3.172.1 → 3.172.3

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(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:classNames,field:field={},onChange:onChange,options:options,titleProps:titleProps,withUpperTitle:withUpperTitle}=_ref;const[selectedOptions,setSelectedOptions]=useState([]),[hoveredOptions,setHoveredOptions]=useState([]),[temporalSelected,setTemporalSelected]=useState([]),classes=mergeClasses(theme,classNames),{ignore_title:ignoreTitle,variant:variant,star_color:starColor,text_variant:textVariant}=field.configuration||{},shouldShowUpperTitle=ignoreTitle&&withUpperTitle,handleClick=(order,value)=>{setSelectedOptions(autocompleteWithNumbers(1,order)),isEmpty(selectedOptions)&&setTemporalSelected(autocompleteWithNumbers(1,order)),onChange(value.toString())},handleHover=value=>{setHoveredOptions(autocompleteWithNumbers(1,value)),setSelectedOptions([])},handleMouseLeave=()=>{setHoveredOptions([]),setSelectedOptions(temporalSelected)};return React.createElement(Fragment,null,shouldShowUpperTitle&&React.createElement(UTLabel,_extends({className:"".concat(classes.title)},titleProps,{withMarkdown:!0}),field.title),React.createElement("div",{className:"".concat(styles.container," ").concat(classes.container)},options.map(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:textVariant,name:option.name,classes:classes,color:starColor||Colors.ratingStarSelected};return variant===RATING_VARIANTS.CIRCULAR?React.createElement(Circle,_extends({key:option.value,selected:selectedOptions[selectedOptions.length-1]===option.order},defaultProps)):variant===RATING_VARIANTS.FACES?React.createElement(Faces,_extends({key:option.value,selected:selectedOptions[selectedOptions.length-1]===option.order},defaultProps)):React.createElement(Star,_extends({key:option.value,hovered:hoveredOptions.includes(option.order),selected:selectedOptions.includes(option.order),onMouseLeave:handleMouseLeave,onHover:handleHover},defaultProps))})))};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=_ref=>{let{theme: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"]))}}};

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=_ref=>{let{classes:classes,disabled:disabled,error:error,isSelected:isSelected,name:name,onChange:onChange,value:value,variant:variant,wrapperStyle:wrapperStyle}=_ref;return React.createElement("div",{style:wrapperStyle},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);

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=_ref=>{let{theme:theme}=_ref;return{error:{borderColor:"".concat(theme.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=(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?"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(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:classNames={},dataTestId:dataTestId,disabled:disabled,error:error,forceMultiRow:forceMultiRow,helpTextEnd:helpTextEnd,helpTextStart:helpTextStart,onChange:onChange,options:options=[],required:required,title:title,validations:validations,value:value,variant:variant=RATING_VARIANTS.STAR}=_ref;const{isMobileOrTablet:isMobileOrTablet}=useScreenSize(),validationData=useMemo(()=>validations||error&&formatErrorToValidation(error),[error,validations]),valueIndex=options.map(_ref2=>{let{value:optionValue}=_ref2;return optionValue}).indexOf(value),isSelected=index=>-1!==valueIndex&&variant===RATING_VARIANTS.STAR?index<=valueIndex:index===valueIndex,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 React.createElement("div",{className:"".concat(styles.container," ").concat(classNames.container),"data-testid":dataTestId},title&&React.createElement(UTFieldLabel,{required:required},title),React.createElement("div",{className:"".concat(styles.optionsContainer," ").concat(classNames.optionsContainer," ").concat(isMobileOrTablet?styles.responsive:""," ").concat(forceMultiRow?styles.forceMultiRow:"")},options.map((option,index)=>React.createElement(Option,_extends({},option,{disabled:disabled,error:error,isSelected:isSelected(index),key:option.value,onChange:onChange,variant:variant,wrapperStyle:wrapperStyle})))),helpTextStart&&React.createElement("div",{className:"".concat(styles.helpTextContainer," ").concat(classNames.helpTextContainer)},React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},helpTextStart),helpTextEnd&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},helpTextEnd)),validationData&&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;

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(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:elem,event:event,...other}=_ref;const[enter,setEnter]=useState(!1),[leaving,setLeaving]=useState(!1),rect=elem?elem.getBoundingClientRect():{width:0,height:0,left:0,top:0};let rippleX,rippleY;if(0===event.clientX&&0===event.clientY||!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,clientY=event.clientY?event.clientY:event.touches[0].clientY;rippleX=Math.round(clientX-rect.left),rippleY=Math.round(clientY-rect.top)}const sizeX=2*Math.max(Math.abs((elem?elem.clientWidth:0)-rippleX),rippleX)+2,sizeY=2*Math.max(Math.abs((elem?elem.clientHeight:0)-rippleY),rippleY)+2,rippleSize=Math.sqrt(sizeX**2+sizeY**2),rippleStyles={width:rippleSize,height:rippleSize,top:-rippleSize/2+rippleY,left:-rippleSize/2+rippleX};return React.createElement(Transition,_extends({timeout:500,onEnter:()=>setEnter(!0),unmountOnExit:!0,onExit:()=>{setLeaving(!0)}},other),React.createElement("span",{className:"".concat(styles.ripple," ").concat(enter&&styles.rippleEnter),style:rippleStyles},React.createElement("span",{className:"".concat(styles.child," ").concat(leaving&&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=_ref=>{let{elem:elem,withRipple:withRipple}=_ref;const[ripples,setRipples]=useState([]),setNewRipples=useCallback(event=>{setRipples(prevRipples=>[...prevRipples,React.createElement(Ripple,{event:event,elem:elem,key:Math.random()})])},[elem]),removeRipple=useCallback(()=>setRipples(prevRipples=>prevRipples.slice(1)),[]);return useEffect(()=>(withRipple&&elem&&(elem.addEventListener("mousedown",setNewRipples),elem.addEventListener("mouseup",removeRipple),elem.addEventListener("mouseleave",removeRipple)),()=>{withRipple&&elem&&(elem.removeEventListener("mousedown",setNewRipples),elem.removeEventListener("mouseup",removeRipple),elem.removeEventListener("mouseleave",removeRipple))}),[elem,setNewRipples,removeRipple,withRipple]),React.createElement(TransitionGroup,{component:"span",className:styles.root},ripples)};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=_ref=>{let{classes:classes,className:className,customAction:customAction,dataKeyboard:dataKeyboard,dataTestId:dataTestId,disabled:disabled,id:id,onBlur:onBlur,onChange:onChange=()=>{},onFocus:onFocus,placeholder:placeholder,size:size,type:type,value:value=null,variant:variant="gray"}=_ref;const action={Icon:"IconX",onClick:()=>{onChange("")},size:"small"},leftAdornments=[{name:COMPONENT_KEYS.ICON,props:{Icon:"IconSearch",changeOnFocus:!0,shade:"02"}}],rightAdornments=value||customAction?[{name:COMPONENT_KEYS.ACTION,props:{action:customAction||action}}]:[];return React.createElement(UTBaseInputField,{alwaysShowPlaceholder:!0,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);

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=_ref=>{let{theme:theme}=_ref;return{input:{"&::placeholder":{color:"".concat(theme.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=_ref=>{let{version:version="V0",...props}=_ref;const Component={V0:V0,V1:V1}[version];return React.createElement(Component,props)};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=_ref=>{let{classes:classes,isMultiple:isMultiple,labelKey:labelKey,optionProps:optionProps,value:value,valueKey:valueKey}=_ref;const OptionIcon=optionProps.icon;return React.createElement(Fragment,null,isMultiple&&React.createElement(Checkbox,{color:"primary",checked:(null==value?void 0:value.indexOf(optionProps[valueKey]))>-1}),OptionIcon?React.createElement("div",{className:classes.labelContainer},React.createElement(OptionIcon,{className:classes.optionIcon}),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 memo(Option);