feat: update drawer docs

src/docs/components/Drawer.mdx

@@ -85,9 +85,10 @@ import {
 
 #### Variants
 
-| Prop       | Type                                     | Default  | Description                |
+| Prop       | Type                                     | Default  | Description                                 |
-|:-----------|:-----------------------------------------|:---------|:---------------------------|
+|:-----------|:-----------------------------------------|:---------|:--------------------------------------------|
-| `position` | `"top" \| "bottom" \| "left" \| "right"` | `"left"` | The position of the drawer |
+| `position` | `"top" \| "bottom" \| "left" \| "right"` | `"left"` | The position of the drawer                  |
+| `maxSize`  | `"sm" \| "md" \| "lg" \| "xl"`           | `"sm"`   | max width ignored on top or bottom position |
 
 #### Special
 

src/docs/components/DrawerBlocks/Playground.tsx

@@ -19,6 +19,11 @@ export default function DrawerPlayground() {
         options: ["top", "bottom", "left", "right"],
         value: "left",
       },
+      maxSize: {
+        type: "select",
+        options: ["sm", "md", "lg", "xl"],
+        value: "sm",
+      },
     },
   });
 

src/docs/components/DrawerBlocks/Preview.tsx

@@ -16,6 +16,7 @@ export interface DrawerDemoPlaygroundProps {
   };
   DrawerContentProps: {
     position: "top" | "bottom" | "left" | "right";
+    maxSize: "sm" | "md" | "lg" | "xl";
   };
 }
 /* end */
@@ -34,8 +35,8 @@ export function DrawerDemo() {
       </DrawerTrigger>
       <DrawerOverlay className="z-[99]">
         <DrawerContent
-          className="max-w-[320px]"
           position={DrawerContentProps.position}
+          maxSize={DrawerContentProps.maxSize}
         >
           <DrawerHeader>
             <h1 className="text-2xl font-bold">Drawer</h1>