@sinco/react 1.0.14-rc.64 → 1.0.14-rc.65

package/index.js

@@ -10589,11 +10589,15 @@ const components = {
     }
   },
   MuiChip: {
-    defaultProps: {
-      size: "small"
-    },
     styleOverrides: {
       sizeSmall: {
+        fontFamily: "Roboto",
+        fontSize: "10px",
+        fontStyle: "normal",
+        fontWeight: 400,
+        lineHeight: "10px",
+        letterSpacing: " 0.15px",
+        color: "text.primary",
         height: 16
       },
       sizeMedium: {
@@ -10602,12 +10606,6 @@ const components = {
       root: {
         height: "inherit",
         borderRadius: 4,
-        fontFamily: "Roboto",
-        fontSize: "10px",
-        fontStyle: "normal",
-        fontWeight: 400,
-        lineHeight: "10px",
-        letterSpacing: "0.15px",
         ".MuiChip-deleteIconSmall": {
           height: 12,
           width: 12
@@ -10939,7 +10937,7 @@ const palette = {
     100: "#BCD0E3",
     200: "#8FB1D0",
     300: "#6392BD",
-    light: "417AAE",
+    light: "#417AAE",
     main: "#2063A0",
     600: "#1C5B98",
     700: "#18518E",
@@ -11037,20 +11035,161 @@ const palette = {
     contrastText: "#ffffff"
   },
   grey: {
-    50: "#f7f7f8",
-    100: "#eaebec",
-    200: "#dcdee0",
-    300: "#ced1d4",
-    400: "#c4c7ca",
-    500: "#b9bdc1",
-    600: "#b2b7bb",
-    700: "#aaaeb3",
-    800: "#a2a6ab",
-    900: "#93989e",
-    A100: "#ffffff",
-    A200: "#ffffff",
-    A400: "#d4eaff",
-    A700: "#bbddff"
+    50: "#F7F7F8",
+    100: "#EAEBEC",
+    200: "#DCDEE0",
+    300: "#CED1D4",
+    400: "#C4C7CA",
+    500: "#B9BDC1",
+    600: "#B2B7BB",
+    700: "#AAAEB3",
+    800: "#A2A6AB",
+    900: "#93989E",
+    A100: "#FFFFFF",
+    A200: "#FFFFFF",
+    A400: "#D4EAFF",
+    A700: "#BBDDFF"
+  },
+  text: {
+    primary: "#101840de",
+    secondary: "#10184099",
+    disabled: "#10184061"
+  },
+  action: {
+    active: "rgba(16, 24, 64, 0.54)",
+    hover: "rgba(16, 24, 64, 0.04)",
+    selected: "rgba(16, 24, 64, 0.08)",
+    disabled: "rgba(16, 24, 64, 0.26)",
+    disabledBackground: "rgba(16, 24, 64, 0.12)",
+    focus: "rgba(16, 24, 64, 0.12)"
+  },
+  background: {
+    default: '#f5f5f5',
+    paper: "#fff"
+  },
+  common: {
+    black: '#000',
+    white: '#fff'
+  },
+  divider: "rgba(16,24,64,0.12)"
+};
+const paletteADPRO = {
+  primary: {
+    50: "#F8FAFB",
+    100: "#E6EFF0",
+    200: "#D2E3E4",
+    300: "#82C6CB",
+    400: "#2B9DA7",
+    500: "#058C97",
+    600: "#04848F",
+    700: "#047984",
+    800: "#036F7A",
+    900: "#015C69",
+    A100: "#98F0FF",
+    A200: "#65E9FF",
+    A400: "#32E1FF",
+    A700: "#32E1FF"
+  },
+  secondary: {
+    50: "#E0F7FA",
+    100: "#B3EBF2",
+    200: "#80DEEA",
+    300: "#4DD0E1",
+    light: "#26C6DA",
+    main: "#00BCD4",
+    600: "#00B6CF",
+    700: "#00ADC9",
+    800: "#00A5C3",
+    dark: "#0097B9",
+    A100: "#E2F9FF",
+    A200: "#AFEEFF",
+    A400: "#7CE3FF",
+    A700: "#63DDFF",
+    contrastText: "#ffffff"
+  },
+  error: {
+    50: "#F9E8E8",
+    100: "#F1C7C7",
+    200: "#E8A1A1",
+    300: "#DF7B7B",
+    light: "#D85F5F",
+    main: "#D14343",
+    600: "#CC3D3D",
+    700: "#C63434",
+    800: "#C02C2C",
+    dark: "#B51E1E",
+    A100: "#FFECEC",
+    A200: "#FFB9B9",
+    A400: "#FF8686",
+    A700: "#FF6D6D",
+    contrastText: "#ffffff"
+  },
+  warning: {
+    50: "#FFF0E0",
+    100: "#FEDAB3",
+    200: "#FDC280",
+    300: "#FCAA4D",
+    light: "#FC9726",
+    main: "#FB8500",
+    600: "#FA7D00",
+    700: "#FA7200",
+    800: "#F96800",
+    dark: "#F85500",
+    A100: "#FFFFFF",
+    A200: "#FFF1EB",
+    A400: "#FFCCB8",
+    A700: "#FFBA9F",
+    contrastText: "#ffffff"
+  },
+  info: {
+    50: "#E6F3F8",
+    100: "#C0E2EE",
+    200: "#96CFE2",
+    300: "#6CBCD6",
+    light: "#4DADCE",
+    main: "#2D9FC5",
+    600: "#2897BF",
+    700: "#228DB8",
+    800: "#1C83B0",
+    dark: "#1172A3",
+    A100: "#D4EFFF",
+    A200: "#A1DCFF",
+    A400: "#6ECAFF",
+    A700: "#54C1FF",
+    contrastText: "#ffffff"
+  },
+  success: {
+    50: "#F2F9E7",
+    100: "#DDEFC4",
+    200: "#C7E49D",
+    300: "#B1D975",
+    light: "#A0D158",
+    main: "#8FC93A",
+    600: "#87C334",
+    700: "#7CBC2C",
+    800: "#72B525",
+    dark: "#60A918",
+    A100: "#EDFFDE",
+    A200: "#D2FFAB",
+    A400: "#B6FF78",
+    A700: "#A9FF5E",
+    contrastText: "#ffffff"
+  },
+  grey: {
+    50: "#FAFBFF",
+    100: "#F4F6FA",
+    200: "#EDEFF5",
+    300: "#E6E8F0",
+    400: "#D8DAE5",
+    500: "#C1C4D6",
+    600: "#8F95B2",
+    700: "#696F8C",
+    800: "#474D66",
+    900: "#101840",
+    A100: "#D8DAE5",
+    A200: "#C1C4D6",
+    A400: "#696F8C",
+    A700: "#101840"
   },
   text: {
     primary: "#101840de",
@@ -11229,8 +11368,17 @@ const themeOptions = {
   mixins,
   breakpoints
 };
+const themeAdproOptions = {
+  components,
+  typography,
+  spacing: 8,
+  mixins,
+  breakpoints,
+  palette: paletteADPRO
+};
 
 const SincoTheme = createTheme(Object.assign({}, themeOptions));
+const AdproSincoTheme = createTheme(Object.assign({}, themeAdproOptions));
 
 var wellKnownSymbol$d = wellKnownSymbol$f;
 
@@ -16472,7 +16620,7 @@ const DrawerHeader = {
   display: 'flex',
   alignContent: 'center',
   justifyContent: 'space-between',
-  backgroundColor: SincoTheme.palette.secondary.main,
+  backgroundColor: 'secondary.main',
   py: '12px',
   px: '8px'
 };
@@ -16504,33 +16652,24 @@ const DrawerComponent = ({
   position,
   width,
   open,
-  onClose,
-  sx
+  onClose
 }) => {
   const [stateActions, setActionsState] = useState(showActions);
   const handleDrawerActions = () => {
     setActionsState(true);
   };
-  return /*#__PURE__*/React__default.createElement(Drawer$1, {
+  return /*#__PURE__*/React__default.createElement(ThemeProvider, {
+    theme: SincoTheme
+  }, /*#__PURE__*/React__default.createElement(Drawer$1, {
     anchor: position,
     open: open,
-    onClose: onClose,
-    sx: {
-      '-webkit-backdrop-filter': 'f0f0f099 !important',
-      backdropFilter: 'blur(4px) !important',
-      '.MuiBackdrop-root': {
-        backgroundColor: '#F0f0f099 !important'
-      }
-    }
+    onClose: onClose
   }, /*#__PURE__*/React__default.createElement(Box$2, {
     sx: DrawerContainer,
     width: width
   }, /*#__PURE__*/React__default.createElement(Box$2, {
     sx: DrawerHeader
   }, /*#__PURE__*/React__default.createElement(Typography$1, {
-    sx: Object.assign({}, SincoTheme.typography.h6, {
-      color: sx
-    }),
     variant: "h6"
   }, title), /*#__PURE__*/React__default.createElement(Box$2, null, /*#__PURE__*/React__default.createElement(IconButton$1, {
     onClick: onClose,
@@ -16542,7 +16681,7 @@ const DrawerComponent = ({
     onClick: handleDrawerActions
   }, children), stateActions && /*#__PURE__*/React__default.createElement(Box$2, {
     sx: DrawerActions
-  }, renderActions)));
+  }, renderActions))));
 };
 
 const FooterActionComponent = ({
@@ -22021,4 +22160,4 @@ const useDynamicColor = url => {
   };
 };
 
-export { DrawerComponent, DynamicColor, EmptyStateComponent, EmptyStateImageUrls, FooterActionComponent, SincoTheme, useDynamicColor };
+export { AdproSincoTheme, DrawerComponent, DynamicColor, EmptyStateComponent, EmptyStateImageUrls, FooterActionComponent, SincoTheme, useDynamicColor };

package/package.json

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

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

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import { ReactNode } from 'react';
 export type handleDrawerPosition = 'left' | 'right';
 export interface DrawerComponentProperties {
     title: string;
@@ -9,6 +9,5 @@ export interface DrawerComponentProperties {
     width: string;
     open: boolean;
     onClose: () => void;
-    sx?: React.CSSProperties;
 }
-export declare const DrawerComponent: ({ title, children, renderActions, showActions, position, width, open, onClose, sx, }: DrawerComponentProperties) => JSX.Element;
+export declare const DrawerComponent: ({ title, children, renderActions, showActions, position, width, open, onClose, }: DrawerComponentProperties) => JSX.Element;

package/src/lib/Theme/index.d.ts

@@ -1 +1,2 @@
 export declare const SincoTheme: import("@mui/material/styles").Theme;
+export declare const AdproSincoTheme: import("@mui/material/styles").Theme;

package/src/lib/Theme/palette.d.ts

@@ -1,2 +1,3 @@
 import { PaletteOptions } from '@mui/material';
 export declare const palette: PaletteOptions;
+export declare const paletteADPRO: PaletteOptions;

package/src/lib/Theme/theme.d.ts

@@ -1,2 +1,3 @@
 import { ThemeOptions } from "@mui/material/styles";
 export declare const themeOptions: ThemeOptions;
+export declare const themeAdproOptions: ThemeOptions;