@arquimedes.co/eureka-forms 3.0.35-test → 3.0.35

package/dist/Shared/InputIcon/InputIcon.js

@@ -1,5 +1,26 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
-import { ErkIconTypes } from '../../constants/ErkIconTypes';
 import CalendarIcon from '../../Icons/CalendarIcon';
 import LeakIcon from '../../Icons/Construction/LeakIcon';
 import ProjectIcon from '../../Icons/Construction/ProjectIcon';
@@ -9,39 +30,101 @@ import DocumentIcon from '../../Icons/DocumentIcon';
 import CheckListIcon from '../../Icons/Entities/CheckListIcon';
 import GenericEntityIcon from '../../Icons/Entities/GenericEntityIcon';
 import HandShakeIcon from '../../Icons/Entities/HandshakeIcon';
+import SchoolIcon from '../../Icons/Entities/SchoolIcon';
 import SupplierIcon from '../../Icons/Entities/SupplierIcon';
-import WorkIcon from '../../Icons/Entities/WorkIcon';
+import GroupIcon from '../../Icons/GroupIcon';
 import LocationIcon from '../../Icons/LocationIcon';
 import PersonIcon from '../../Icons/PersonIcon';
-function InputIcon({ icon, ...others }) {
+import IconTypes from '../../constants/IconTypes';
+function InputIcon(_a) {
+    var icon = _a.icon, _b = _a.fill, fill = _b === void 0 ? '#757575' : _b, others = __rest(_a, ["icon", "fill"]);
     switch (icon) {
-        case ErkIconTypes.PROJECT:
-            return _jsx(ProjectIcon, { size: 24, ...others });
-        case ErkIconTypes.PROPERTY:
-            return _jsx(PropertyIcon, { size: 23, ...others });
-        case ErkIconTypes.SPACE:
-            return _jsx(SpaceIcon, { size: 23, ...others });
-        case ErkIconTypes.PERSON:
-            return _jsx(PersonIcon, { size: 23, ...others });
-        case ErkIconTypes.LEAK:
-            return _jsx(LeakIcon, { size: 23, style: { marginTop: 2 }, ...others });
-        case ErkIconTypes.DOCUMENT:
-            return _jsx(DocumentIcon, { size: 23, ...others });
-        case ErkIconTypes.HANDSHAKE:
-            return _jsx(HandShakeIcon, { size: 23, ...others });
-        case ErkIconTypes.CHECKLIST:
-            return _jsx(CheckListIcon, { size: 23, ...others });
-        case ErkIconTypes.SUPPLIER:
-            return _jsx(SupplierIcon, { size: 24, ...others });
-        case ErkIconTypes.CALENDAR:
-            return _jsx(CalendarIcon, { size: 23, ...others });
-        case ErkIconTypes.WORK:
-            return _jsx(WorkIcon, { size: 23, ...others });
-        case ErkIconTypes.LOCATION:
-            return _jsx(LocationIcon, { size: 23, ...others });
-        case ErkIconTypes.GENERIC:
+        case IconTypes.PROJECT:
+            return (_jsx(ProjectIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 24,
+                    width: 24,
+                }, fill: fill }, others)));
+        case IconTypes.PROPERTY:
+            return (_jsx(PropertyIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.SPACE:
+            return (_jsx(SpaceIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.PERSON:
+            return (_jsx(PersonIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.LEAK:
+            return (_jsx(LeakIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                    marginTop: 2,
+                }, fill: fill }, others)));
+        case IconTypes.DOCUMENT:
+            return (_jsx(DocumentIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.HANDSHAKE:
+            return (_jsx(HandShakeIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.CHECKLIST:
+            return (_jsx(CheckListIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.SUPPLIER:
+            return (_jsx(SupplierIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 24,
+                    width: 24,
+                }, fill: fill }, others)));
+        case IconTypes.CALENDAR:
+            return (_jsx(CalendarIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.LOCATION:
+            return (_jsx(LocationIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.SCHOOL:
+            return (_jsx(SchoolIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.GROUP:
+            return (_jsx(GroupIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
+        case IconTypes.GENERIC:
         default:
-            return _jsx(GenericEntityIcon, { size: 23, ...others });
+            return (_jsx(GenericEntityIcon, __assign({ style: {
+                    display: 'flex',
+                    height: 23,
+                    width: 23,
+                }, fill: fill }, others)));
     }
 }
 export default InputIcon;

package/dist/Shared/Loader/Loader.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface LoaderProps {
     /** The color of the loader */
     color?: string;

package/dist/Shared/Loader/Loader.js

@@ -1,14 +1,26 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import { jsx as _jsx } from "react/jsx-runtime";
-import { CircularProgress } from '@mui/material';
+import CircularProgress from '@material-ui/core/CircularProgress';
 import styles from './Loader.module.css';
 /**
  * Generic Loader Component with optional curtain.
  */
-function Loader({ color = '#3d5a7f', curtain = false, zIndex = 20, size = 40, position = 'absolute', }) {
-    return (_jsx("div", { className: styles.loaderContainer + ' flexbox', style: {
+function Loader(_a) {
+    var _b = _a.color, color = _b === void 0 ? '#3d5a7f' : _b, _c = _a.curtain, curtain = _c === void 0 ? false : _c, _d = _a.zIndex, zIndex = _d === void 0 ? 20 : _d, _e = _a.size, size = _e === void 0 ? 40 : _e, _f = _a.position, position = _f === void 0 ? 'absolute' : _f;
+    return (_jsx("div", __assign({ className: styles.loaderContainer + ' flexbox', style: {
             backgroundColor: curtain ? 'rgb(0, 0, 0, 0.4)' : '',
-            zIndex,
-            position,
-        }, children: _jsx("div", { className: styles.loader, children: _jsx(CircularProgress, { size: size, style: { color } }) }) }));
+            zIndex: zIndex,
+            position: position,
+        } }, { children: _jsx("div", __assign({ className: styles.loader }, { children: _jsx(CircularProgress, { size: size, style: { color: color } }) })) })));
 }
 export default Loader;

package/dist/Shared/Navbar/Navbar.d.ts

@@ -1,8 +1,10 @@
+/// <reference types="react" />
 interface NavBarProps {
+    apiKey?: string;
     /** Url of the current logo of the current organization */
     logo?: string;
     /** The color of the navbar */
     color?: string;
 }
-declare function Navbar({ logo, color }: NavBarProps): JSX.Element;
+declare function Navbar({ logo, color, apiKey }: NavBarProps): JSX.Element;
 export default Navbar;

package/dist/Shared/Navbar/Navbar.js

@@ -1,6 +1,99 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useRef, useState } from 'react';
 import styles from './Navbar.module.css';
-function Navbar({ logo, color }) {
-    return (_jsx("div", { className: styles.navContainer, style: { backgroundColor: color }, children: _jsx("img", { src: logo, alt: "Organization Logo", className: styles.navImage }) }));
+import { IconButton, Avatar, Menu, MenuItem } from '@material-ui/core';
+import { logout } from '../../Services/UserService';
+import { useAppSelector } from '../../hooks';
+function Navbar(_a) {
+    var _this = this;
+    var _b;
+    var logo = _a.logo, color = _a.color, apiKey = _a.apiKey;
+    var ref = useRef(null);
+    var _c = useState(false), open = _c[0], setOpen = _c[1];
+    var user = useAppSelector(function (state) { return state.global.user; });
+    return (_jsxs("div", __assign({ className: styles.navContainer, style: { backgroundColor: color } }, { children: [_jsx("img", { src: logo, alt: "Organization Logo", className: styles.navImage }), user && apiKey && (_jsxs(_Fragment, { children: [_jsx("div", __assign({ className: styles.navBarAvatar, ref: ref }, { children: _jsx(IconButton, __assign({ style: {
+                                width: 42,
+                                height: 42,
+                                padding: 0,
+                                margin: 'auto',
+                            }, "aria-label": "Mi Perfil", "aria-haspopup": "true", onClick: function () {
+                                setOpen(true);
+                            } }, { children: _jsx(Avatar, { style: { fontSize: '40px' }, alt: (_b = user === null || user === void 0 ? void 0 : user.name) !== null && _b !== void 0 ? _b : user === null || user === void 0 ? void 0 : user.email }) })) })), _jsx(Menu, __assign({ id: "simple-menu", anchorEl: ref.current, getContentAnchorEl: null, anchorOrigin: {
+                            vertical: 'bottom',
+                            horizontal: 'right',
+                        }, transformOrigin: {
+                            vertical: 'top',
+                            horizontal: 'right',
+                        }, open: open, onClose: function () { return setOpen(false); } }, { children: _jsx(MenuItem, __assign({ onClick: function () { return __awaiter(_this, void 0, void 0, function () {
+                                var err_1;
+                                return __generator(this, function (_a) {
+                                    switch (_a.label) {
+                                        case 0:
+                                            setOpen(false);
+                                            _a.label = 1;
+                                        case 1:
+                                            _a.trys.push([1, 3, , 4]);
+                                            return [4 /*yield*/, logout(apiKey)];
+                                        case 2:
+                                            _a.sent();
+                                            return [3 /*break*/, 4];
+                                        case 3:
+                                            err_1 = _a.sent();
+                                            console.error(err_1);
+                                            return [3 /*break*/, 4];
+                                        case 4:
+                                            localStorage.removeItem('token');
+                                            window.location.reload();
+                                            return [2 /*return*/];
+                                    }
+                                });
+                            }); } }, { children: "Cerrar sesi\u00F3n" })) }))] }))] })));
 }
 export default Navbar;

package/dist/Shared/Navbar/Navbar.module.css

@@ -6,3 +6,18 @@
     height: 40px;
     margin: auto 0 auto 15px;
 }
+
+.navBarAvatar {
+    height: 60px;
+    margin-left: 5px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-left: auto;
+    margin-right: 15px;
+}
+
+.navBarAvatarIcon {
+    width: 100px;
+    height: 100px;
+}

package/dist/Shared/Navbar/Navbar.stories.d.ts

@@ -1,4 +1,4 @@
-import type { StoryObj } from '@storybook/react-vite';
+import type { StoryObj } from '@storybook/react';
 import Navbar from './Navbar';
 declare const meta: {
     component: typeof Navbar;

package/dist/Shared/Navbar/Navbar.stories.js

@@ -1,5 +1,5 @@
 import Navbar from './Navbar';
-const meta = {
+var meta = {
     component: Navbar,
     tags: ['autodocs'],
     args: {
@@ -8,6 +8,6 @@ const meta = {
     },
 };
 export default meta;
-export const Default = {
+export var Default = {
     args: {},
 };

package/dist/Shared/Rating/Rating.d.ts

@@ -1,11 +1,13 @@
-import { RefCallBack } from 'react-hook-form';
+/// <reference types="react" />
 import { RatingTypes } from '../../constants/FormStepTypes';
 export interface RatingProps {
     disabled?: boolean;
     isMobile?: boolean;
-    value?: number | null;
+    value: any;
     onChange: (value: number | null) => void;
-    inputRef?: React.RefObject<HTMLInputElement> | RefCallBack;
+    inputRef: any;
+    focusColor: string;
+    unSelectedColor: string;
 }
 declare function Rating({ type, ...others }: RatingProps & {
     type: RatingTypes;

package/dist/Shared/Rating/Rating.js

@@ -1,16 +1,39 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 import { RatingTypes } from '../../constants/FormStepTypes';
 import LikeRating from './Ratings/LikeRating';
 import SatisfactionRating from './Ratings/SatisfactionRating';
 import ScaleRating from './Ratings/ScaleRating';
-function Rating({ type, ...others }) {
+function Rating(_a) {
+    var type = _a.type, others = __rest(_a, ["type"]);
     switch (type) {
         case RatingTypes.LIKE:
-            return _jsx(LikeRating, { ...others });
+            return _jsx(LikeRating, __assign({}, others));
         case RatingTypes.SATISFACTION:
-            return _jsx(SatisfactionRating, { ...others });
+            return _jsx(SatisfactionRating, __assign({}, others));
         case RatingTypes.SCALE:
-            return _jsx(ScaleRating, { ...others });
+            return _jsx(ScaleRating, __assign({}, others));
         default:
             return _jsx("div", {});
     }

package/dist/Shared/Rating/Rating.stories.d.ts

@@ -1,4 +1,4 @@
-import type { StoryObj } from '@storybook/react-vite';
+import type { StoryObj } from '@storybook/react';
 import Rating from './Rating';
 declare const meta: {
     component: typeof Rating;

package/dist/Shared/Rating/Rating.stories.js

@@ -1,47 +1,53 @@
 import Rating from './Rating';
 import { RatingTypes } from '../../constants/FormStepTypes';
-const meta = {
+var meta = {
     component: Rating,
     tags: ['autodocs'],
     args: {},
 };
 export default meta;
-export const ScaleRating = {
+export var ScaleRating = {
     args: {
         type: RatingTypes.SCALE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const ScaleRatingWidthValue = {
+export var ScaleRatingWidthValue = {
     args: {
         type: RatingTypes.SCALE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 4,
     },
 };
-export const LikeRating = {
+export var LikeRating = {
     args: {
         type: RatingTypes.LIKE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const LikeRatingWithValue = {
+export var LikeRatingWithValue = {
     args: {
         type: RatingTypes.LIKE,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 1,
     },
 };
-export const SatisfactionRating = {
+export var SatisfactionRating = {
     args: {
         type: RatingTypes.SATISFACTION,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
     },
 };
-export const SatisfactionRatingWidthValue = {
+export var SatisfactionRatingWidthValue = {
     args: {
         type: RatingTypes.SATISFACTION,
-        onChange: () => { },
+        focusColor: '#3d5a7f',
+        unSelectedColor: '#d8d8d8',
         value: 3,
     },
 };

package/dist/Shared/Rating/Ratings/LikeRating.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { RatingProps } from '../Rating';
-declare function LikeRating({ disabled, inputRef, value, onChange }: RatingProps): JSX.Element;
+declare function LikeRating({ disabled, inputRef, value, onChange, focusColor, unSelectedColor, }: RatingProps): JSX.Element;
 export default LikeRating;

package/dist/Shared/Rating/Ratings/LikeRating.js

@@ -1,29 +1,43 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useTheme } from '@mui/material';
-import DislikeIcon from '../../../Icons/Ratings/DislikeIcon';
-import LikeIcon from '../../../Icons/Ratings/LikeIcon';
+import ThumbDownRoundedIcon from '@material-ui/icons/ThumbDownRounded';
+import ThumbUpRoundedIcon from '@material-ui/icons/ThumbUpRounded';
 import styles from '../Rating.module.css';
-function LikeRating({ disabled, inputRef, value, onChange }) {
-    const { palette } = useTheme();
-    const focusColor = palette.primary.main;
-    const unSelectedColor = palette.outline.main;
-    return (_jsxs("div", { className: styles.ratingContainer, style: {
+function LikeRating(_a) {
+    var disabled = _a.disabled, inputRef = _a.inputRef, value = _a.value, onChange = _a.onChange, focusColor = _a.focusColor, unSelectedColor = _a.unSelectedColor;
+    return (_jsxs("div", __assign({ className: styles.ratingContainer, style: {
             '--eureka-primary': focusColor,
             '--eureka-outline': unSelectedColor,
-        }, children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, style: { height: 70 }, onClick: () => {
+        } }, { children: [_jsx("input", { ref: inputRef, className: 'hidden-input' }), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, style: { height: 70 }, onClick: function () {
                     if (!disabled)
                         onChange(value === 1 ? null : 1);
-                }, children: _jsx(LikeIcon, { style: {
-                        fontSize: 'inherit',
-                        color: value === 1 ? focusColor : undefined,
-                    } }) }), _jsx("div", { className: disabled ? styles.disabledIconContainer : styles.iconContainer, style: { height: 70 }, onClick: () => {
+                } }, { children: _jsx(ThumbUpRoundedIcon, { fontSize: "inherit", style: value === 1
+                        ? {
+                            color: focusColor,
+                        }
+                        : {} }) })), _jsx("div", __assign({ className: disabled
+                    ? styles.disabledIconContainer
+                    : styles.iconContainer, style: { height: 70 }, onClick: function () {
                     if (!disabled)
                         onChange(value === 0 ? null : 0);
-                }, children: _jsx(DislikeIcon, { style: {
-                        color: value === 0 ? focusColor : undefined,
-                        fontSize: 'inherit',
-                        marginTop: 14,
-                        marginLeft: 15,
-                    } }) })] }));
+                } }, { children: _jsx(ThumbDownRoundedIcon, { fontSize: "inherit", style: value === 0
+                        ? {
+                            color: focusColor,
+                            marginTop: 14,
+                            marginLeft: 15,
+                        }
+                        : { marginTop: 14, marginLeft: 15 } }) }))] })));
 }
 export default LikeRating;

package/dist/Shared/Rating/Ratings/SatisfactionRating.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { RatingProps } from '../Rating';
-declare function SatisfactionRating({ value, inputRef, disabled, onChange }: RatingProps): JSX.Element;
+declare function SatisfactionRating({ value, inputRef, disabled, onChange, focusColor, unSelectedColor, }: RatingProps): JSX.Element;
 export default SatisfactionRating;