@sinco/react 1.0.11-rc.5 → 1.0.11-rc.6

package/index.js

@@ -17437,24 +17437,29 @@ var _default = (0, _createSvgIcon.default)( /*#__PURE__*/(0, _jsxRuntime.jsx)("p
 }), 'Close');
 default_1 = Close.default = _default;
 
-const stylesDrawer = {
+const DrawerContainer = styled$1(Box$2)(({
+  theme
+}) => ({
   display: 'flex',
   flexDirection: 'column',
   alignContent: 'flex-start',
   justifyContent: 'space-between',
-  width: '530px',
   height: '100%',
   overflow: 'hidden'
-};
-const stylesDrawerHeader = {
+}));
+const DrawerHeader = styled$1(Box$2)(({
+  theme
+}) => ({
   display: 'flex',
   alignContent: 'center',
   justifyContent: 'space-between',
   backgroundColor: 'secondary.main',
   py: '12px',
   px: '8px'
-};
-const stylesDrawerContent = {
+}));
+const DrawerContent = styled$1(Box$2)(({
+  theme
+}) => ({
   display: 'flex',
   overflow: 'auto',
   alignItems: 'flex-start',
@@ -17462,27 +17467,31 @@ const stylesDrawerContent = {
   height: '-webkit-fill-available',
   py: '12px',
   px: '8px'
-};
-const stylesDrawerActions = {
+}));
+const DrawerActions = styled$1(Box$2)(({
+  theme
+}) => ({
   display: 'flex',
   alignContent: 'center',
   justifyContent: 'flex-end',
   borderTop: '1px solid rgba(16, 24, 64, 0.23)',
   backgroundColor: '#F1F0EE',
-  mt: '4px',
   gap: '8px',
+  mt: '4px',
   py: '12px',
   px: '8px'
-};
+}));
 const DrawerComponent = ({
   title,
   children,
-  actions,
+  renderActions,
+  showActions,
   position,
+  width,
   open,
   onClose
 }) => {
-  const [stateActions, setActionsState] = useState(false);
+  const [stateActions, setActionsState] = useState(showActions);
   const handleDrawerActions = () => {
     setActionsState(true);
   };
@@ -17492,23 +17501,18 @@ const DrawerComponent = ({
     anchor: position,
     open: open,
     onClose: onClose
-  }, /*#__PURE__*/React__default.createElement(Box$2, {
-    sx: stylesDrawer
-  }, /*#__PURE__*/React__default.createElement(Box$2, {
-    sx: stylesDrawerHeader
-  }, /*#__PURE__*/React__default.createElement(Typography$1, {
+  }, /*#__PURE__*/React__default.createElement(DrawerContainer, {
+    width: width
+  }, /*#__PURE__*/React__default.createElement(DrawerHeader, null, /*#__PURE__*/React__default.createElement(Typography$1, {
     variant: "h6"
   }, title), /*#__PURE__*/React__default.createElement(Box$2, null, /*#__PURE__*/React__default.createElement(IconButton$1, {
     onClick: onClose,
     size: "small"
   }, /*#__PURE__*/React__default.createElement(default_1, {
     fontSize: "small"
-  })))), /*#__PURE__*/React__default.createElement(Box$2, {
-    onClick: handleDrawerActions,
-    sx: stylesDrawerContent
-  }, children), stateActions && /*#__PURE__*/React__default.createElement(Box$2, {
-    sx: stylesDrawerActions
-  }, actions))));
+  })))), /*#__PURE__*/React__default.createElement(DrawerContent, {
+    onClick: handleDrawerActions
+  }, children), stateActions && /*#__PURE__*/React__default.createElement(DrawerActions, null, renderActions))));
 };
 
 const ToastContainer = styled$1(Stack$1)(() => ({

package/package.json

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

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

@@ -3,9 +3,11 @@ export type handleDrawerPosition = 'left' | 'right';
 export interface DrawerComponentProperties {
     title: string;
     children: ReactNode;
-    actions: ReactNode;
+    renderActions: ReactNode;
+    showActions?: boolean;
     position?: handleDrawerPosition;
+    width: string;
     open: boolean;
     onClose: () => void;
 }
-export declare const DrawerComponent: ({ title, children, actions, position, open, onClose, }: DrawerComponentProperties) => JSX.Element;
+export declare const DrawerComponent: ({ title, children, renderActions, showActions, position, width, open, onClose, }: DrawerComponentProperties) => JSX.Element;