1 files changed, 27 insertions, 0 deletions
diff --git a/public/src/app/rule-engine/slide-panel/slide-panel.component.ts b/public/src/app/rule-engine/slide-panel/slide-panel.component.ts
new file mode 100644
index 0000000..d7aa652
--- /dev/null
+++ b/public/src/app/rule-engine/slide-panel/slide-panel.component.ts
@@ -0,0 +1,27 @@
+import { Component, ChangeDetectionStrategy, Input } from '@angular/core';
+import {
+  animate,
+  state,
+  style,
+  transition,
+  trigger
+} from '@angular/animations';
+
+type PaneType = 'left' | 'right';
+
+@Component({
+  selector: 'app-slide-panel',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  templateUrl: './slide-panel.component.html',
+  styleUrls: ['./slide-panel.component.scss'],
+  animations: [
+    trigger('slide', [
+      state('left', style({ transform: 'translateX(0)' })),
+      state('right', style({ transform: 'translateX(-50%)' })),
+      transition('* => *', animate(300))
+    ])
+  ]
+})
+export class SlidePanelComponent {
+  @Input() activePane: PaneType = 'left';
+}