@widergy/energy-ui 3.172.3 → 3.173.0

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

@@ -1 +1,86 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_StarRate=_interopRequireDefault(require("@material-ui/icons/StarRate")),_IconButton=_interopRequireDefault(require("@material-ui/core/IconButton")),_UTLabel=_interopRequireDefault(require("../../../../../UTLabel")),_constants=require("../../constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const Star=_ref=>{let{name:name,onMouseLeave:onMouseLeave,hovered:hovered,selected:selected,isFirst:isFirst,isLast:isLast,color:color,order:order,value:value,onClick:onClick,onHover:onHover,classes:classes,textVariant:textVariant}=_ref;const showPropColor=color&&(hovered||selected),textVariants={[_constants.SIDE_TEXT]:{containerClass:isFirst?_stylesModule.default.first:isLast&&_stylesModule.default.last,showLabel:isFirst||isLast},[_constants.BOTTOM_TEXT]:{containerClass:_stylesModule.default.withTextBottom,showLabel:!0},[_constants.NO_TEXT]:{containerClass:"",showLabel:!1}},textVariantToUse=textVariants[textVariant]||textVariants[_constants.SIDE_TEXT];return _react.default.createElement("div",{className:"".concat(_stylesModule.default.container," ").concat(textVariantToUse.containerClass)},_react.default.createElement(_IconButton.default,{onFocus:()=>{},onMouseOver:()=>onHover(order),onMouseLeave:onMouseLeave,onClick:()=>onClick(order,value),style:showPropColor?{color:color}:{},className:"".concat(_stylesModule.default.starButton," ").concat(hovered&&_stylesModule.default.starHovered," ").concat(selected&&_stylesModule.default.starsPainted)},_react.default.createElement(_StarRate.default,{className:_stylesModule.default.starSize})),textVariantToUse.showLabel&&_react.default.createElement(_UTLabel.default,{className:"".concat(_stylesModule.default.text," ").concat(classes.label),colorTheme:"gray"},name))};Star.propTypes={onClick:_propTypes.func,onHover:_propTypes.func,onMouseLeave:_propTypes.func,order:_propTypes.number,value:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string]),hovered:_propTypes.bool,selected:_propTypes.bool,name:_propTypes.string,isFirst:_propTypes.bool,isLast:_propTypes.bool,color:_propTypes.string,classes:(0,_propTypes.shape)({label:_propTypes.string,avatar:_propTypes.string}),textVariant:_propTypes.string};var _default=exports.default=Star;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = require("prop-types");
+var _StarRate = _interopRequireDefault(require("@material-ui/icons/StarRate"));
+var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
+var _UTLabel = _interopRequireDefault(require("../../../../../UTLabel"));
+var _constants = require("../../constants");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Star = _ref => {
+  let {
+    name,
+    onMouseLeave,
+    hovered,
+    selected,
+    isFirst,
+    isLast,
+    color,
+    order,
+    value,
+    onClick,
+    onHover,
+    classes,
+    textVariant
+  } = _ref;
+  const handleClick = () => onClick(order, value);
+  const handleHover = () => onHover(order);
+  const onFocus = () => {};
+  const showPropColor = color && (hovered || selected);
+  const textVariants = {
+    [_constants.SIDE_TEXT]: {
+      containerClass: isFirst ? _stylesModule.default.first : isLast && _stylesModule.default.last,
+      showLabel: isFirst || isLast
+    },
+    [_constants.BOTTOM_TEXT]: {
+      containerClass: _stylesModule.default.withTextBottom,
+      showLabel: true
+    },
+    [_constants.NO_TEXT]: {
+      containerClass: '',
+      showLabel: false
+    }
+  };
+  const textVariantToUse = textVariants[textVariant] || textVariants[_constants.SIDE_TEXT];
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.container, " ").concat(textVariantToUse.containerClass)
+  }, /*#__PURE__*/_react.default.createElement(_IconButton.default, {
+    onFocus: onFocus,
+    onMouseOver: handleHover,
+    onMouseLeave: onMouseLeave,
+    onClick: handleClick,
+    style: showPropColor ? {
+      color
+    } : {},
+    className: "".concat(_stylesModule.default.starButton, " ").concat(hovered && _stylesModule.default.starHovered, " ").concat(selected && _stylesModule.default.starsPainted)
+  }, /*#__PURE__*/_react.default.createElement(_StarRate.default, {
+    className: _stylesModule.default.starSize
+  })), textVariantToUse.showLabel && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    className: "".concat(_stylesModule.default.text, " ").concat(classes.label),
+    colorTheme: "gray"
+  }, name));
+};
+Star.propTypes = {
+  onClick: _propTypes.func,
+  onHover: _propTypes.func,
+  onMouseLeave: _propTypes.func,
+  order: _propTypes.number,
+  value: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string]),
+  hovered: _propTypes.bool,
+  selected: _propTypes.bool,
+  name: _propTypes.string,
+  isFirst: _propTypes.bool,
+  isLast: _propTypes.bool,
+  color: _propTypes.string,
+  classes: (0, _propTypes.shape)({
+    label: _propTypes.string,
+    avatar: _propTypes.string
+  }),
+  textVariant: _propTypes.string
+};
+var _default = exports.default = Star;

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

@@ -1 +1,14 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SIDE_TEXT=exports.RATING_VARIANTS=exports.NO_TEXT=exports.BOTTOM_TEXT=void 0;const RATING_VARIANTS=exports.RATING_VARIANTS={CIRCULAR:"circular",FACES:"faces",STAR:"star"},SIDE_TEXT=exports.SIDE_TEXT="side_text",BOTTOM_TEXT=exports.BOTTOM_TEXT="bottom_text",NO_TEXT=exports.NO_TEXT="no_text";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SIDE_TEXT = exports.RATING_VARIANTS = exports.NO_TEXT = exports.BOTTOM_TEXT = void 0;
+const RATING_VARIANTS = exports.RATING_VARIANTS = {
+  CIRCULAR: 'circular',
+  FACES: 'faces',
+  STAR: 'star'
+};
+const SIDE_TEXT = exports.SIDE_TEXT = 'side_text';
+const BOTTOM_TEXT = exports.BOTTOM_TEXT = 'bottom_text';
+const NO_TEXT = exports.NO_TEXT = 'no_text';

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

@@ -1 +1,104 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_array=require("@widergy/web-utils/lib/array"),_colorsModule=_interopRequireDefault(require("../../../../scss/variables/colors.module.scss")),_formTypes=require("../../../../types/formTypes"),_WithTheme=_interopRequireDefault(require("../../../WithTheme")),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_classesUtils=require("../../../../utils/classesUtils"),_theme=require("./theme"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_Circle=_interopRequireDefault(require("./components/Circle")),_Faces=_interopRequireDefault(require("./components/Faces")),_Star=_interopRequireDefault(require("./components/Star")),_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 _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}const UTRatingContainer=_ref=>{let{classes:theme,classNames:classNames,field:field={},onChange:onChange,options:options,titleProps:titleProps,withUpperTitle:withUpperTitle}=_ref;const[selectedOptions,setSelectedOptions]=(0,_react.useState)([]),[hoveredOptions,setHoveredOptions]=(0,_react.useState)([]),[temporalSelected,setTemporalSelected]=(0,_react.useState)([]),classes=(0,_classesUtils.mergeClasses)(theme,classNames),{ignore_title:ignoreTitle,variant:variant,star_color:starColor,text_variant:textVariant}=field.configuration||{},shouldShowUpperTitle=ignoreTitle&&withUpperTitle,handleClick=(order,value)=>{setSelectedOptions((0,_array.autocompleteWithNumbers)(1,order)),(0,_array.isEmpty)(selectedOptions)&&setTemporalSelected((0,_array.autocompleteWithNumbers)(1,order)),onChange(value.toString())},handleHover=value=>{setHoveredOptions((0,_array.autocompleteWithNumbers)(1,value)),setSelectedOptions([])},handleMouseLeave=()=>{setHoveredOptions([]),setSelectedOptions(temporalSelected)};return _react.default.createElement(_react.Fragment,null,shouldShowUpperTitle&&_react.default.createElement(_UTLabel.default,_extends({className:"".concat(classes.title)},titleProps,{withMarkdown:!0}),field.title),_react.default.createElement("div",{className:"".concat(_stylesModule.default.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||_colorsModule.default.ratingStarSelected};return variant===_constants.RATING_VARIANTS.CIRCULAR?_react.default.createElement(_Circle.default,_extends({key:option.value,selected:selectedOptions[selectedOptions.length-1]===option.order},defaultProps)):variant===_constants.RATING_VARIANTS.FACES?_react.default.createElement(_Faces.default,_extends({key:option.value,selected:selectedOptions[selectedOptions.length-1]===option.order},defaultProps)):_react.default.createElement(_Star.default,_extends({key:option.value,hovered:hoveredOptions.includes(option.order),selected:selectedOptions.includes(option.order),onMouseLeave:handleMouseLeave,onHover:handleHover},defaultProps))})))};UTRatingContainer.propTypes={classes:(0,_propTypes.objectOf)(_propTypes.string),classNames:(0,_propTypes.objectOf)(_propTypes.string),field:_formTypes.fieldType,onChange:_propTypes.func,options:(0,_propTypes.arrayOf)((0,_propTypes.shape)({order:_propTypes.number,value:(0,_propTypes.oneOfType)([_propTypes.number,_propTypes.string])})),titleProps:_propTypes.object,withUpperTitle:_propTypes.bool};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(UTRatingContainer);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _array = require("@widergy/web-utils/lib/array");
+var _colorsModule = _interopRequireDefault(require("../../../../scss/variables/colors.module.scss"));
+var _formTypes = require("../../../../types/formTypes");
+var _WithTheme = _interopRequireDefault(require("../../../WithTheme"));
+var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
+var _classesUtils = require("../../../../utils/classesUtils");
+var _theme = require("./theme");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+var _Circle = _interopRequireDefault(require("./components/Circle"));
+var _Faces = _interopRequireDefault(require("./components/Faces"));
+var _Star = _interopRequireDefault(require("./components/Star"));
+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 _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const UTRatingContainer = _ref => {
+  let {
+    classes: theme,
+    classNames,
+    field = {},
+    onChange,
+    options,
+    titleProps,
+    withUpperTitle
+  } = _ref;
+  const [selectedOptions, setSelectedOptions] = (0, _react.useState)([]);
+  const [hoveredOptions, setHoveredOptions] = (0, _react.useState)([]);
+  const [temporalSelected, setTemporalSelected] = (0, _react.useState)([]);
+  const classes = (0, _classesUtils.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((0, _array.autocompleteWithNumbers)(1, order));
+    if ((0, _array.isEmpty)(selectedOptions)) setTemporalSelected((0, _array.autocompleteWithNumbers)(1, order));
+    onChange(value.toString());
+  };
+  const handleHover = value => {
+    setHoveredOptions((0, _array.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 || _colorsModule.default.ratingStarSelected
+    };
+    return variant === _constants.RATING_VARIANTS.CIRCULAR ? /*#__PURE__*/_react.default.createElement(_Circle.default, _extends({
+      key: option.value,
+      selected: selectedOptions[selectedOptions.length - 1] === option.order
+    }, defaultProps)) : variant === _constants.RATING_VARIANTS.FACES ? /*#__PURE__*/_react.default.createElement(_Faces.default, _extends({
+      key: option.value,
+      selected: selectedOptions[selectedOptions.length - 1] === option.order
+    }, defaultProps)) : /*#__PURE__*/_react.default.createElement(_Star.default, _extends({
+      key: option.value,
+      hovered: hoveredOptions.includes(option.order),
+      selected: selectedOptions.includes(option.order),
+      onMouseLeave: handleMouseLeave,
+      onHover: handleHover
+    }, defaultProps));
+  };
+  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, shouldShowUpperTitle && /*#__PURE__*/_react.default.createElement(_UTLabel.default, _extends({
+    className: "".concat(classes.title)
+  }, titleProps, {
+    withMarkdown: true
+  }), field.title), /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.container, " ").concat(classes.container)
+  }, options.map(handleMapOptions)));
+};
+UTRatingContainer.propTypes = {
+  classes: (0, _propTypes.objectOf)(_propTypes.string),
+  classNames: (0, _propTypes.objectOf)(_propTypes.string),
+  field: _formTypes.fieldType,
+  onChange: _propTypes.func,
+  options: (0, _propTypes.arrayOf)((0, _propTypes.shape)({
+    order: _propTypes.number,
+    value: (0, _propTypes.oneOfType)([_propTypes.number, _propTypes.string])
+  })),
+  titleProps: _propTypes.object,
+  withUpperTitle: _propTypes.bool
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(UTRatingContainer);

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

@@ -1 +1,93 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;var _seamlessImmutable=require("seamless-immutable"),_colorsModule=_interopRequireDefault(require("../../../../scss/variables/colors.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{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((0,_seamlessImmutable.getIn)(theme,["UTRating","label","color"])),fontSize:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","label","fontSize"])),right:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","label","right"]))},labelBottomFirst:{alignSelf:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomFirst","alignSelf"])),position:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomFirst","position"])),right:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomFirst","right"])),top:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomFirst","top"])),width:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomFirst","width"]))},labelBottomLast:{alignSelf:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomLast","alignSelf"])),position:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomLast","position"])),right:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomLast","right"])),top:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomLast","top"])),width:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","labelBottomLast","width"]))},avatar:{color:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","avatar","color"],_colorsModule.default.gray3)," !important")},container:{justifyContent:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","container","justifyContent"])),pointerEvents:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","container","pointerEvents"]))},circleWithTextBottom:{margin:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","circleWithTextBottom","margin"])),width:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","circleWithTextBottom","width"]))},title:{fontWeight:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","title","fontWeight"])),marginBottom:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","title","marginBottom"])),textAlign:"".concat((0,_seamlessImmutable.getIn)(theme,["UTRating","title","textAlign"]))}}};exports.retrieveStyle=retrieveStyle;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+var _seamlessImmutable = require("seamless-immutable");
+var _colorsModule = _interopRequireDefault(require("../../../../scss/variables/colors.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    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((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'label', 'color'])),
+      fontSize: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'label', 'fontSize'])),
+      right: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'label', 'right']))
+    },
+    labelBottomFirst: {
+      alignSelf: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomFirst', 'alignSelf'])),
+      position: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomFirst', 'position'])),
+      right: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomFirst', 'right'])),
+      top: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomFirst', 'top'])),
+      width: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomFirst', 'width']))
+    },
+    labelBottomLast: {
+      alignSelf: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomLast', 'alignSelf'])),
+      position: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomLast', 'position'])),
+      right: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomLast', 'right'])),
+      top: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomLast', 'top'])),
+      width: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'labelBottomLast', 'width']))
+    },
+    avatar: {
+      color: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'avatar', 'color'], _colorsModule.default.gray3), " !important")
+    },
+    container: {
+      justifyContent: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'container', 'justifyContent'])),
+      pointerEvents: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'container', 'pointerEvents']))
+    },
+    circleWithTextBottom: {
+      margin: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'circleWithTextBottom', 'margin'])),
+      width: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'circleWithTextBottom', 'width']))
+    },
+    title: {
+      fontWeight: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'title', 'fontWeight'])),
+      marginBottom: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'title', 'marginBottom'])),
+      textAlign: "".concat((0, _seamlessImmutable.getIn)(theme, ['UTRating', 'title', 'textAlign']))
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

package/dist/components/UTRating/versions/V1/README.md

@@ -0,0 +1,44 @@
+# UTRating
+
+## Description
+
+`UTRating` is a configurable rating input component that enables users to easily provide feedback through visual indicators.
+
+## Props
+
+| Name                | Type      | Default | Description                                                                                               |
+| ------------------- | --------- | ------- | --------------------------------------------------------------------------------------------------------  |
+| classNames          | object    |         | Custom CSS class names for styling the component.                                                         |
+| dataTestId          | string    |         | Unique identifier for testing purposes.                                                                   |
+| disabled            | bool      | false   | Indicates whether the input is disabled and cannot be interacted with.                                    |
+| error               | string    |         | Error message to display when validation fails or an issue occurs.                                        |
+| helpTextEnd         | string    |         | Additional help text displayed at the end of the input for user guidance.                                 |
+| helpTextStart       | string    |         | Additional help text displayed at the beginning of the input for user guidance.                           |
+| onChange            | func      |         | Callback function invoked when the input value changes.                                                   |
+| options             | array     |         | Array of options available for selection.                                                                 |
+| required            | bool      | false   | Indicates whether the input is mandatory for form submission.                                             |
+| title               | string    |         | Title for the input, providing context to the user.                                                       |
+| validations         | array     |         | Array of validation rules to be applied to the input value.                                               |
+| value               | string    |         | The current value of the input.                                                                           |
+| variant             | string    | `star`  | Defines the visual style component.                                                                       |
+
+
+### options
+
+`options` is an array of objects with a `value` and a `name` key. The values should be in the range of 0-10, except for the `faces` variant. In desktop view, all options are displayed in one row; in responsive view, they are broken into 2 rows if there are more than 5 options.
+
+### variant
+
+The value of `variant` must be one of the following:
+
+- `faces`: the options are represented as face icons. Option values should exclusively be between 1 and 5, values outside this range are not supported.
+- `star`: the options are represented as star icons.
+- `text`: the options are represented as the option's `text`.
+
+### Structure of Validations
+
+For detailed information about the structure of validations, please refer to the UTValidation component documentation.
+
+### Handling Errors
+
+Errors can be displayed below the text input using either the `error` prop or the `validations` prop.

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

@@ -1 +1,53 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _propTypes=require("prop-types"),_react=_interopRequireDefault(require("react")),_constants=require("../../constants"),_UTButton=_interopRequireDefault(require("../../../../../UTButton")),_WithTheme=_interopRequireDefault(require("../../../../../WithTheme")),_utils=require("./utils"),_theme=require("./theme"),_stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}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.default.createElement("div",{style:wrapperStyle},_react.default.createElement(_UTButton.default,{classNames:{root:"".concat(_stylesModule.default.option," ").concat(error?classes.error:""),text:_stylesModule.default.text},colorTheme:isSelected?"primary":"secondary",disabled:disabled,Icon:(0,_utils.getIcon)(variant,value,isSelected),onClick:()=>onChange(value),variant:(0,_utils.getVariant)(variant,isSelected)},_constants.RATING_VARIANTS.TEXT===variant?name:null))};Option.propTypes={classes:_propTypes.object,disabled:_propTypes.bool,error:_propTypes.string,isSelected:_propTypes.bool,name:_propTypes.string,onChange:_propTypes.func,value:_propTypes.string,variant:_propTypes.string,wrapperStyle:_propTypes.object};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(Option);
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _propTypes = require("prop-types");
+var _react = _interopRequireDefault(require("react"));
+var _constants = require("../../constants");
+var _UTButton = _interopRequireDefault(require("../../../../../UTButton"));
+var _WithTheme = _interopRequireDefault(require("../../../../../WithTheme"));
+var _utils = require("./utils");
+var _theme = require("./theme");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const Option = _ref => {
+  let {
+    classes,
+    disabled,
+    error,
+    isSelected,
+    name,
+    onChange,
+    value,
+    variant,
+    wrapperStyle
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    style: wrapperStyle
+  }, /*#__PURE__*/_react.default.createElement(_UTButton.default, {
+    classNames: {
+      root: "".concat(_stylesModule.default.option, " ").concat(error ? classes.error : ''),
+      text: _stylesModule.default.text
+    },
+    colorTheme: isSelected ? 'primary' : 'secondary',
+    disabled: disabled,
+    Icon: (0, _utils.getIcon)(variant, value, isSelected),
+    onClick: () => onChange(value),
+    variant: (0, _utils.getVariant)(variant, isSelected)
+  }, _constants.RATING_VARIANTS.TEXT === variant ? name : null));
+};
+Option.propTypes = {
+  classes: _propTypes.object,
+  disabled: _propTypes.bool,
+  error: _propTypes.string,
+  isSelected: _propTypes.bool,
+  name: _propTypes.string,
+  onChange: _propTypes.func,
+  value: _propTypes.string,
+  variant: _propTypes.string,
+  wrapperStyle: _propTypes.object
+};
+var _default = exports.default = (0, _WithTheme.default)(_theme.retrieveStyle)(Option);

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

@@ -1 +1,17 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.retrieveStyle=void 0;const retrieveStyle=_ref=>{let{theme:theme}=_ref;return{error:{borderColor:"".concat(theme.Palette.error["05"]," !important")}}};exports.retrieveStyle=retrieveStyle;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.retrieveStyle = void 0;
+const retrieveStyle = _ref => {
+  let {
+    theme
+  } = _ref;
+  return {
+    error: {
+      borderColor: "".concat(theme.Palette.error['05'], " !important")
+    }
+  };
+};
+exports.retrieveStyle = retrieveStyle;

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

@@ -1 +1,21 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getVariant=exports.getIcon=void 0;var _constants=require("../../constants");const getIcon=(variant,value,isSelected)=>({[_constants.RATING_VARIANTS.TEXT]:null,[_constants.RATING_VARIANTS.FACES]:{1:"IconMoodSad",2:"IconMoodConfuzed",3:"IconMoodEmpty",4:"IconMoodSmile",5:"IconMoodHappy"}[value],[_constants.RATING_VARIANTS.STAR]:isSelected?"IconStarFilled":"IconStar"}[variant]);exports.getIcon=getIcon;const getVariant=(variant,isSelected)=>isSelected&&variant!==_constants.RATING_VARIANTS.STAR?"outlined":"shadow";exports.getVariant=getVariant;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getVariant = exports.getIcon = void 0;
+var _constants = require("../../constants");
+const getIcon = (variant, value, isSelected) => ({
+  [_constants.RATING_VARIANTS.TEXT]: null,
+  [_constants.RATING_VARIANTS.FACES]: {
+    1: 'IconMoodSad',
+    2: 'IconMoodConfuzed',
+    3: 'IconMoodEmpty',
+    4: 'IconMoodSmile',
+    5: 'IconMoodHappy'
+  }[value],
+  [_constants.RATING_VARIANTS.STAR]: isSelected ? 'IconStarFilled' : 'IconStar'
+})[variant];
+exports.getIcon = getIcon;
+const getVariant = (variant, isSelected) => !isSelected || variant === _constants.RATING_VARIANTS.STAR ? 'shadow' : 'outlined';
+exports.getVariant = getVariant;

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

@@ -1 +1,11 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.RATING_VARIANTS=void 0;const RATING_VARIANTS=exports.RATING_VARIANTS={FACES:"faces",STAR:"star",TEXT:"text"};
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RATING_VARIANTS = void 0;
+const RATING_VARIANTS = exports.RATING_VARIANTS = {
+  FACES: 'faces',
+  STAR: 'star',
+  TEXT: 'text'
+};

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

@@ -1 +1,96 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_UTFieldLabel=_interopRequireDefault(require("../../../UTFieldLabel")),_utils=require("../../../UTValidation/utils"),_UTValidation=_interopRequireDefault(require("../../../UTValidation")),_useScreenSize=require("../../../../utils/useScreenSize"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_Option=_interopRequireDefault(require("./components/Option")),_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 _extends(){return _extends=Object.assign?Object.assign.bind():function(n){for(var e=1;e<arguments.length;e++){var t=arguments[e];for(var r in t)({}).hasOwnProperty.call(t,r)&&(n[r]=t[r])}return n},_extends.apply(null,arguments)}const 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=_constants.RATING_VARIANTS.STAR}=_ref;const{isMobileOrTablet:isMobileOrTablet}=(0,_useScreenSize.useScreenSize)(),validationData=(0,_react.useMemo)(()=>validations||error&&(0,_utils.formatErrorToValidation)(error),[error,validations]),valueIndex=options.map(_ref2=>{let{value:optionValue}=_ref2;return optionValue}).indexOf(value),isSelected=index=>-1!==valueIndex&&variant===_constants.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.default.createElement("div",{className:"".concat(_stylesModule.default.container," ").concat(classNames.container),"data-testid":dataTestId},title&&_react.default.createElement(_UTFieldLabel.default,{required:required},title),_react.default.createElement("div",{className:"".concat(_stylesModule.default.optionsContainer," ").concat(classNames.optionsContainer," ").concat(isMobileOrTablet?_stylesModule.default.responsive:""," ").concat(forceMultiRow?_stylesModule.default.forceMultiRow:"")},options.map((option,index)=>_react.default.createElement(_Option.default,_extends({},option,{disabled:disabled,error:error,isSelected:isSelected(index),key:option.value,onChange:onChange,variant:variant,wrapperStyle:wrapperStyle})))),helpTextStart&&_react.default.createElement("div",{className:"".concat(_stylesModule.default.helpTextContainer," ").concat(classNames.helpTextContainer)},_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"small"},helpTextStart),helpTextEnd&&_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"small"},helpTextEnd)),validationData&&_react.default.createElement(_UTValidation.default,{validationData:validationData}))};UTRating.propTypes={classNames:_propTypes.object,dataTestId:_propTypes.string,disabled:_propTypes.bool,error:_propTypes.string,forceMultiRow:_propTypes.bool,helpTextEnd:_propTypes.string,helpTextStart:_propTypes.string,onChange:_propTypes.func,options:_propTypes.array,required:_propTypes.bool,title:_propTypes.string,validations:_propTypes.array,value:_propTypes.string,variant:_propTypes.string};var _default=exports.default=UTRating;
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
+var _UTFieldLabel = _interopRequireDefault(require("../../../UTFieldLabel"));
+var _utils = require("../../../UTValidation/utils");
+var _UTValidation = _interopRequireDefault(require("../../../UTValidation"));
+var _useScreenSize = require("../../../../utils/useScreenSize");
+var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
+var _Option = _interopRequireDefault(require("./components/Option"));
+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 _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+const UTRating = _ref => {
+  let {
+    classNames = {},
+    dataTestId,
+    disabled,
+    error,
+    forceMultiRow,
+    helpTextEnd,
+    helpTextStart,
+    onChange,
+    options = [],
+    required,
+    title,
+    validations,
+    value,
+    variant = _constants.RATING_VARIANTS.STAR
+  } = _ref;
+  const {
+    isMobileOrTablet
+  } = (0, _useScreenSize.useScreenSize)();
+  const validationData = (0, _react.useMemo)(() => validations || error && (0, _utils.formatErrorToValidation)(error), [error, validations]);
+  const valueIndex = options.map(_ref2 => {
+    let {
+      value: optionValue
+    } = _ref2;
+    return optionValue;
+  }).indexOf(value);
+  const isSelected = index => valueIndex !== -1 && variant === _constants.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.default.createElement("div", {
+    className: "".concat(_stylesModule.default.container, " ").concat(classNames.container),
+    "data-testid": dataTestId
+  }, title && /*#__PURE__*/_react.default.createElement(_UTFieldLabel.default, {
+    required: required
+  }, title), /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.optionsContainer, " ").concat(classNames.optionsContainer, " ").concat(isMobileOrTablet ? _stylesModule.default.responsive : '', " ").concat(forceMultiRow ? _stylesModule.default.forceMultiRow : '')
+  }, options.map((option, index) => /*#__PURE__*/_react.default.createElement(_Option.default, _extends({}, option, {
+    disabled: disabled,
+    error: error,
+    isSelected: isSelected(index),
+    key: option.value,
+    onChange: onChange,
+    variant: variant,
+    wrapperStyle: wrapperStyle
+  })))), helpTextStart && /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(_stylesModule.default.helpTextContainer, " ").concat(classNames.helpTextContainer)
+  }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    colorTheme: "gray",
+    variant: "small"
+  }, helpTextStart), helpTextEnd && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
+    colorTheme: "gray",
+    variant: "small"
+  }, helpTextEnd)), validationData && /*#__PURE__*/_react.default.createElement(_UTValidation.default, {
+    validationData: validationData
+  }));
+};
+UTRating.propTypes = {
+  classNames: _propTypes.object,
+  dataTestId: _propTypes.string,
+  disabled: _propTypes.bool,
+  error: _propTypes.string,
+  forceMultiRow: _propTypes.bool,
+  helpTextEnd: _propTypes.string,
+  helpTextStart: _propTypes.string,
+  onChange: _propTypes.func,
+  options: _propTypes.array,
+  required: _propTypes.bool,
+  title: _propTypes.string,
+  validations: _propTypes.array,
+  value: _propTypes.string,
+  variant: _propTypes.string
+};
+var _default = exports.default = UTRating;