@sinco/react 1.2.0 → 1.2.2-rc.0

package/index.esm.js

@@ -6242,6 +6242,9 @@ var components = {
     }
   },
   MuiChip: {
+    defaultProps: {
+      color: "primary"
+    },
     styleOverrides: {
       sizeSmall: {
         height: 16
@@ -6268,6 +6271,69 @@ var components = {
         ".MuiChip-deleteIconMedium": {
           height: 20,
           width: 20
+        },
+        color: "#101840de",
+        ".MuiChip-deleteIcon": {
+          color: "#1018408a",
+          "&:hover": {
+            color: "#1018408a"
+          }
+        }
+      },
+      filled: {
+        "&.MuiChip-filledPrimary": {
+          backgroundColor: "#BCD0E3",
+          "&:hover": {
+            backgroundColor: "#BCD0E3 !important",
+            "&.MuiChip-clickableColorPrimary": {
+              backgroundColor: "#8FB1D0 !important"
+            }
+          }
+        },
+        "&.MuiChip-filledSecondary": {
+          backgroundColor: "#B3EBF2",
+          "&:hover": {
+            backgroundColor: "#B3EBF2 !important",
+            "&.MuiChip-clickableColorSecondary": {
+              backgroundColor: "#80DEEA !important"
+            }
+          }
+        },
+        "&.MuiChip-filledError": {
+          backgroundColor: "#F1C7C7",
+          "&:hover": {
+            backgroundColor: "#F1C7C7 !important",
+            "&.MuiChip-clickableColorError": {
+              backgroundColor: "#E8A1A1 !important"
+            }
+          }
+        },
+        "&.MuiChip-filledSuccess": {
+          backgroundColor: "#DDEFC4",
+          "&:hover": {
+            backgroundColor: "#DDEFC4 !important",
+            "&.MuiChip-clickableColorSuccess": {
+              backgroundColor: "#C7E49D !important"
+            }
+          }
+        },
+        "&.MuiChip-filledInfo": {
+          backgroundColor: "#C0E2EE",
+          "&:hover": {
+            backgroundColor: "#C0E2EE !important",
+            "&.MuiChip-clickableColorInfo": {
+              backgroundColor: "#96CFE2 !important"
+            }
+          }
+        },
+        "&.MuiChip-filledWarning": {
+          backgroundColor: "#FEDAB3",
+          "&:hover": {
+            backgroundColor: "#FEDAB3 !important",
+            "&.MuiChip-clickableColorWarning": {
+              backgroundColor: "#FDC280 !important"
+            }
+          }
         }
       }
     }
@@ -6674,7 +6740,7 @@ var components = {
       },
       dense: {
         ".MuiListItem-dense": {
-          padding: "0.25px 12px 0.25px 16px"
+          // padding: "0.25px 12px 0.25px 16px",
         }
       }
     }
@@ -14181,7 +14247,7 @@ var DrawerComponent = function DrawerComponent(_ref) {
 var FooterAction = function FooterAction(_ref) {
   var leftContent = _ref.leftContent,
     rightContent = _ref.rightContent,
-    labelChangeCounter = _ref.labelChangeCounter;
+    children = _ref.children;
   return React__default.createElement(AppBar$1, {
     position: "fixed",
     color: "inherit",
@@ -14196,7 +14262,7 @@ var FooterAction = function FooterAction(_ref) {
     }
   }, leftContent, React__default.createElement(Box$2, {
     flexGrow: 1
-  }), React__default.createElement(Box$2, null, labelChangeCounter), rightContent));
+  }), React__default.createElement(Box$2, null, children), rightContent));
 };
 
 var useProgress = function useProgress(timeProgress, lote) {
@@ -14504,9 +14570,11 @@ var ProgressSinco = function ProgressSinco(_ref) {
 };
 
 var CardRadio = function CardRadio(_ref) {
+  var _ref2;
   var _ref$RadioPosition = _ref.RadioPosition,
     RadioPosition = _ref$RadioPosition === void 0 ? 'right' : _ref$RadioPosition,
-    states = _ref.states,
+    _ref$state = _ref.state,
+    state = _ref$state === void 0 ? 'default' : _ref$state,
     media = _ref.media,
     header = _ref.header,
     content = _ref.content,
@@ -14517,24 +14585,24 @@ var CardRadio = function CardRadio(_ref) {
     value = _ref.value,
     onChange = _ref.onChange,
     checked = _ref.checked;
-  var _useState = useState(checked !== null && checked !== void 0 ? checked : false),
+  var _useState = useState((_ref2 = checked || state === 'active') !== null && _ref2 !== void 0 ? _ref2 : false),
     _useState2 = _slicedToArray(_useState, 2),
     isChecked = _useState2[0],
     setIsChecked = _useState2[1];
-  var _useState3 = useState(states === 'active'),
+  var _useState3 = useState(state === 'active'),
     _useState4 = _slicedToArray(_useState3, 1),
     isActive = _useState4[0];
   var handleClick = function handleClick() {
-    if (states === 'disabled') return;
+    if (state === 'disabled') return;
     setIsChecked(!isChecked);
     onChange(value);
   };
   var getBackgroundColor = function getBackgroundColor() {
-    if (states === 'disabled') return '';
-    return isChecked ? color === 'primary' ? '#E4ECF4' : color === 'secondary' ? '#00BCD414' : '#FBFBFB' : 'transparent';
+    if (state === 'disabled') return '';
+    return isChecked || isActive ? color === 'primary' ? '#E4ECF4' : color === 'secondary' ? '#00BCD414' : '#FBFBFB' : 'transparent';
   };
   var getBorderColor = function getBorderColor() {
-    return isChecked ? color === 'primary' ? '#2063A080' : color === 'secondary' ? '#00BCD480' : '#00BCD4' : '#0000001F';
+    return isChecked || isActive ? color === 'primary' ? '#2063A080' : color === 'secondary' ? '#00BCD480' : '#00BCD4' : '#0000001F';
   };
   var getHoverColor = function getHoverColor() {
     return color === 'primary' ? '#2063A00A' : color === 'secondary' ? '#00BCD40A' : 'FBFBFB';
@@ -14549,7 +14617,7 @@ var CardRadio = function CardRadio(_ref) {
     border: "solid 1px ".concat(getBorderColor()),
     sx: {
       '&:hover': {
-        backgroundColor: checked ? 'none' : states === 'disabled' ? 'inherit' : getHoverColor()
+        backgroundColor: checked ? 'none' : state === 'disabled' ? 'inherit' : getHoverColor()
       },
       cursor: 'pointer'
     },
@@ -14565,16 +14633,16 @@ var CardRadio = function CardRadio(_ref) {
     gap: 1
   }, media && React__default.createElement(Stack$1, null, media), React__default.createElement(Stack$1, null, header && React__default.createElement(Typography$1, {
     variant: "subtitle2",
-    color: states === 'disabled' ? 'text.disabled' : isActive ? 'text.primary' : 'text.primary'
-  }, content), content && React__default.createElement(Typography$1, {
+    color: state === 'disabled' ? 'text.disabled' : isActive ? 'text.primary' : 'text.primary'
+  }, header), content && React__default.createElement(Typography$1, {
     variant: "caption",
-    color: states === 'disabled' ? 'text.disabled' : isActive ? 'text.secondary' : 'text.secondary'
+    color: state === 'disabled' ? 'text.disabled' : isActive ? 'text.secondary' : 'text.secondary'
   }, content))), React__default.createElement(Stack$1, {
     justifyContent: topRadioPosition === true ? 'flex-start' : 'center'
   }, React__default.createElement(Radio$1, {
-    checked: isChecked,
+    checked: isChecked || isChecked,
     color: color,
-    disabled: states === 'disabled'
+    disabled: state === 'disabled'
   }))));
 };
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sinco/react",
-  "version": "1.2.0",
+  "version": "1.2.2-rc.0",
   "description": "package for the configuration of mui react sinco",
   "private": false,
   "license": "MIT",

package/src/lib/Components/CardRadio.d.ts

@@ -1,11 +1,11 @@
 import React, { FC } from 'react';
 type RadioPosition = 'left' | 'right';
-type RadioStates = 'active' | 'disabled';
+type Radiostate = 'active' | 'disabled' | 'default';
 type CardRadioColors = 'primary' | 'secondary';
 export interface CardRadioProps {
     RadioPosition?: RadioPosition;
     topRadioPosition?: boolean;
-    states?: RadioStates;
+    state?: Radiostate;
     media?: React.ReactNode;
     header?: React.ReactNode | string;
     content?: React.ReactNode | string;

package/src/lib/Components/FooterAction.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 interface FooterActionsProperties {
-    labelChangeCounter: React.ReactNode | string;
+    children?: React.ReactNode | string;
     leftContent?: React.ReactNode;
     rightContent?: React.ReactNode;
 }
-export declare const FooterAction: ({ leftContent, rightContent, labelChangeCounter, }: FooterActionsProperties) => React.JSX.Element;
+export declare const FooterAction: ({ leftContent, rightContent, children, }: FooterActionsProperties) => React.JSX.Element;
 export {};