codexly-ui 0.10.43 → 0.10.44

package/fesm2022/codexly-ui.mjs

@@ -16092,7 +16092,7 @@ class ClxDrawerService {
     open(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     component, config = {}) {
-        const { hasBackdrop = false, disableClose = false, size = 'md', data, } = config;
+        const { hasBackdrop = false, disableClose = false, size = 'md', position = 'right', data, } = config;
         let _resolve;
         const _afterClosed = new Promise(res => (_resolve = res));
         let _closing = false;
@@ -16114,16 +16114,18 @@ class ClxDrawerService {
             backdropClass: 'clx-modal-backdrop',
             containerStyle: {
                 alignItems: 'flex-start',
-                justifyContent: 'flex-end',
+                justifyContent: position === 'left' ? 'flex-start' : 'flex-end',
                 padding: '0',
             },
         });
         const panelEl = compRef.location.nativeElement;
         panelEl.style.height = '100vh';
         panelEl.style.pointerEvents = 'auto';
-        // Slide in from right
+        const inAnim = position === 'left' ? 'fadeInLeft' : 'fadeInRight';
+        const outAnim = position === 'left' ? 'fadeOutLeft' : 'fadeOutRight';
+        // Slide in from the configured edge
         this._animate.animate(panelEl, {
-            animation: 'fadeInRight',
+            animation: inAnim,
             duration: 300,
             trigger: 'manual',
         });
@@ -16132,7 +16134,7 @@ class ClxDrawerService {
                 return;
             _closing = true;
             this._animate.animate(panelEl, {
-                animation: 'fadeOutRight',
+                animation: outAnim,
                 duration: 300,
                 trigger: 'manual',
                 fillMode: 'forwards',