3 files changed, 71 insertions, 0 deletions
diff --git a/src/angular/accordion/accordion.component.html.ts b/src/angular/accordion/accordion.component.html.ts
new file mode 100644
index 0000000..ac5f81f
--- /dev/null
+++ b/src/angular/accordion/accordion.component.html.ts
@@ -0,0 +1,21 @@
+export default `
+<div class="sdc-accordion" [ngClass]="customCSSClass">
+    <div class="sdc-accordion-header" (click)="toggleAccordion()" [ngClass]="{'arrow-right': arrowDirection === accordionArrowDirection.right}">
+        <div class="svg-icon-wrapper bottom" [ngClass]="{'down': open}">
+            <svg class="svg-icon __chevronUp" version="1.1" id="chevron-up_icon" x="0px" y="0px" viewBox="0 0 10 6.3" style="enable-background:new 0 0 10 6.3;"
+                xml:space="preserve">
+                <g transform="translate(0,-952.36218)">
+                    <path d="M10,958.2c0-0.1,0-0.2-0.1-0.2l-4.6-5.5c-0.1-0.2-0.4-0.2-0.5,0l0,0L0.1,958c-0.1,0.2-0.1,0.4,0,0.5s0.4,0.1,0.5,0l0,0
+          l4.3-5.2l4.3,5.2c0.1,0.2,0.4,0.2,0.5,0.1C10,958.5,10,958.3,10,958.2z">
+                    </path>
+                </g>
+            </svg>
+        </div>
+        <div class="title">
+            {{title}}
+        </div>
+    </div>
+    <div class="sdc-accordion-body" [ngClass]="{open: open}">
+        <ng-content></ng-content>
+    </div>
+</div>`;
diff --git a/src/angular/accordion/accordion.component.ts b/src/angular/accordion/accordion.component.ts
new file mode 100644
index 0000000..b16df89
--- /dev/null
+++ b/src/angular/accordion/accordion.component.ts
@@ -0,0 +1,27 @@
+/**
+ * Created by M.S.BIT on 26/04/2018.
+ */
+
+import {Component, Input, Output, EventEmitter} from "@angular/core";
+import {Placement} from "../common/enums";
+import template from './accordion.component.html';
+
+@Component({
+    selector: 'sdc-accordion',
+    template: template,
+})
+export class AccordionComponent {
+
+    @Input('arrow-direction') arrowDirection: Placement;
+    @Input('css-class') customCSSClass: string;
+    @Input('title') title: string;
+    @Input('open') open: boolean;
+    @Output('accordionChanged') changed = new EventEmitter<boolean>();
+
+    public accordionArrowDirection = Placement;
+
+    public toggleAccordion(){
+        this.open = !this.open;
+        this.changed.emit(this.open);
+    }
+}
diff --git a/src/angular/accordion/accordion.module.ts b/src/angular/accordion/accordion.module.ts
new file mode 100644
index 0000000..6cda646
--- /dev/null
+++ b/src/angular/accordion/accordion.module.ts
@@ -0,0 +1,23 @@
+/**
+ * Created by M.S.BIT on 26/04/2018.
+ */
+import { NgModule } from "@angular/core";
+import { CommonModule } from "@angular/common";
+import {AccordionComponent} from "./accordion.component";
+import {SvgIconModule} from "../svg-icon/svg-icon.module";
+
+@NgModule({
+    declarations: [
+        AccordionComponent
+    ],
+    imports: [
+        CommonModule,
+        SvgIconModule
+    ],
+    exports: [
+        AccordionComponent
+    ],
+})
+export class AccordionModule {
+
+}