Skip to content

Commit 5277ad7

Browse files
AnthonyNahasAnthonyNahas
committed
feat(ngx-material-faq): added the library source code
1 parent 770682a commit 5277ad7

18 files changed

+15910
-0
lines changed

‎package-lock.json‎

Lines changed: 15427 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
{
2+
"name": "ngx-material-faq",
3+
"description": "Angular Library built with material design in order to provide a reusable faq (frequently asked questions) component for every project. Ask, Answer and List",
4+
"version": "0.0.1",
5+
"homepage": "https://github.com/anthonynahas/ngx-material-faq",
6+
"author": {
7+
"name": "anthonynahas",
8+
"url": "https://github.com/anthonynahas"
9+
},
10+
"repository": {
11+
"type": "git",
12+
"url": "git://github.com/anthonynahas/ngx-material-faq.git"
13+
},
14+
"license": "MIT",
15+
"keywords": [
16+
"ngx",
17+
" angular",
18+
" library",
19+
" faq",
20+
" material",
21+
" asking",
22+
" questions",
23+
" answers"
24+
],
25+
"bugs": {
26+
"url": "https://github.com/anthonynahas/ngx-material-faq/issues"
27+
},
28+
"private": true,
29+
"scripts": {
30+
"start": "gulp build",
31+
"test": " gulp test",
32+
"demo": " gulp build:demo",
33+
"check-travis": " travis-status --repo=anthonynahas/ngx-material-faq --branch=master --fail-pending || echo 'Not yet passing'"
34+
},
35+
"dependencies": {
36+
"@angular/animations": "^5.2.10",
37+
"@angular/cdk": "^5.2.5",
38+
"@angular/common": "^5.2.10",
39+
"@angular/core": "^5.2.10",
40+
"@angular/flex-layout": "^5.0.0-beta.14",
41+
"@angular/forms": "^5.2.10",
42+
"@angular/material": "^5.2.5"
43+
},
44+
"devDependencies": {
45+
"@angular/compiler": "5.2.10",
46+
"@angular/platform-server": "5.2.10",
47+
"@angular/platform-browser": "5.2.10",
48+
"@angular/platform-browser-dynamic": "5.2.10",
49+
"@angular/compiler-cli": "5.2.10",
50+
"jest-cli": "^22.4.3",
51+
"zone.js": "0.8.14",
52+
"rxjs": "5.5.2",
53+
"tslint": "5.7.0",
54+
"gulp-tslint": "8.1.1",
55+
"typescript": "2.4.2",
56+
"awesome-typescript-loader": "3.3.0",
57+
"codelyzer": "4.0.0",
58+
"@angular/animations": "5.2.10",
59+
"@types/jest": "21.1.9",
60+
"jest": "22.0.4",
61+
"jest-preset-angular": "5.0.0",
62+
"@types/node": "8.0.44",
63+
"@types/lodash": "4.14.92",
64+
"angular-cli-ghpages": "0.5.1",
65+
"angular2-template-loader": "0.6.2",
66+
"@compodoc/gulp-compodoc": "0.0.8",
67+
"commitplease": "3.1.0",
68+
"conventional-github-releaser": "1.1.13",
69+
"core-js": "2.5.1",
70+
"del": "3.0.0",
71+
"gulp": "3.9.1",
72+
"gulp-bump": "2.8.0",
73+
"gulp-conventional-changelog": "1.1.6",
74+
"gulp-coveralls": "0.1.4",
75+
"gulp-file": "0.3.0",
76+
"gulp-git": "2.4.2",
77+
"gulp-inline-ng2-template": "4.0.0",
78+
"gulp-hub": "0.8.0",
79+
"gulp-util": "3.0.8",
80+
"html-loader": "0.5.1",
81+
"is-docker": "1.1.0",
82+
"pump": "1.0.2",
83+
"rollup": "0.57.0",
84+
"rollup-plugin-uglify": "3.0.0",
85+
"rollup-plugin-sourcemaps": "0.4.2",
86+
"rollup-plugin-commonjs": "9.1.0",
87+
"rollup-plugin-node-resolve": "3.2.0",
88+
"run-sequence": "2.2.0",
89+
"autoprefixer": "7.1.5",
90+
"cssnano": "3.10.0",
91+
"sass-loader": "6.0.6",
92+
"css-loader": "0.28.7",
93+
"to-string-loader": "1.1.5",
94+
"node-sass": "4.5.3",
95+
"postcss": "6.0.13",
96+
"postcss-strip-inline-comments": "0.1.5",
97+
"raw-loader": "0.5.1",
98+
"source-map-loader": "0.2.2",
99+
"travis-status": "2.0.0",
100+
"lodash": "4.17.4",
101+
"yargs": "10.0.3"
102+
},
103+
"engines": {
104+
"node": ">=6.0.0"
105+
},
106+
"jest": {
107+
"preset": "jest-preset-angular",
108+
"roots": [
109+
"<rootDir>/src/"
110+
],
111+
"coverageReporters": [
112+
"lcov",
113+
"text"
114+
],
115+
"coveragePathIgnorePatterns": [
116+
"/node_modules/",
117+
"/config",
118+
"/dist/"
119+
],
120+
"setupTestFrameworkScriptFile": "<rootDir>/config/setupJest.ts"
121+
},
122+
"greenkeeper": {
123+
"ignore": [
124+
"@angular/core",
125+
"@angular/common",
126+
"@angular/compiler",
127+
"@angular/platform-server",
128+
"@angular/platform-browser",
129+
"@angular/platform-browser-dynamic",
130+
"@angular/compiler-cli",
131+
"zone.js",
132+
"rxjs",
133+
"tslint",
134+
"gulp-tslint",
135+
"typescript",
136+
"awesome-typescript-loader",
137+
"codelyzer",
138+
"@angular/animations",
139+
"@types/jasmine"
140+
]
141+
},
142+
"commitplease": {
143+
"style": "angular",
144+
"types": [
145+
"feat",
146+
"fix",
147+
"docs",
148+
"style",
149+
"refactor",
150+
"perf",
151+
"test",
152+
"chore",
153+
"revert",
154+
"demo"
155+
],
156+
"scope": "\\S+.*"
157+
}
158+
}

‎src/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './module/ngx-material-faq.module';

‎src/module/components/ngx-material-faq-admin/ngx-material-faq-admin.component.html‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<mat-toolbar color="primary">{{title}}</mat-toolbar>
2+
<mat-card>
3+
<mat-card-content fxLayout="column">
4+
<mat-form-field class="full-width" appearance="outline">
5+
<mat-label>The question</mat-label>
6+
<input matInput [(ngModel)]="question">
7+
<mat-hint>Add here the question of your clients</mat-hint>
8+
</mat-form-field>
9+
10+
<mat-form-field class="full-width" appearance="outline">
11+
<mat-label>The answer</mat-label>
12+
<textarea matInput [(ngModel)]="answer"></textarea>
13+
<mat-hint>Please type an appropriate answer here to the above question</mat-hint>
14+
</mat-form-field>
15+
</mat-card-content>
16+
17+
<mat-card-actions fxLayoutAlign="end">
18+
<button mat-fab color="primary" (click)="add()">
19+
<mat-icon>add</mat-icon>
20+
</button>
21+
</mat-card-actions>
22+
</mat-card>

‎src/module/components/ngx-material-faq-admin/ngx-material-faq-admin.component.scss‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.full-width {
2+
width: 100%
3+
}
4+
5+
.mat-form-field {
6+
margin: 0.8rem 0 0.8rem 0;
7+
}

‎src/module/components/ngx-material-faq-admin/ngx-material-faq-admin.component.spec.ts‎

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
2+
import {By} from '@angular/platform-browser';
3+
import {DebugElement} from '@angular/core';
4+
5+
import {NgxMaterialFaqAdminComponent} from './ngx-material-faq-admin.component';
6+
import {MatButtonModule, MatCardModule, MatExpansionModule, MatIconModule, MatInputModule, MatToolbarModule} from '@angular/material';
7+
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
8+
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
9+
10+
describe('NgxMaterialFaqComponent', function () {
11+
let de: DebugElement;
12+
let comp: NgxMaterialFaqAdminComponent;
13+
let fixture: ComponentFixture<NgxMaterialFaqAdminComponent>;
14+
15+
beforeEach(async(() => {
16+
TestBed.configureTestingModule({
17+
imports: [
18+
NoopAnimationsModule,
19+
FormsModule,
20+
ReactiveFormsModule,
21+
MatCardModule,
22+
MatToolbarModule,
23+
MatButtonModule,
24+
MatInputModule,
25+
MatIconModule,
26+
MatExpansionModule,
27+
],
28+
declarations: [NgxMaterialFaqAdminComponent]
29+
})
30+
.compileComponents();
31+
}));
32+
33+
beforeEach(() => {
34+
fixture = TestBed.createComponent(NgxMaterialFaqAdminComponent);
35+
comp = fixture.componentInstance;
36+
de = fixture.debugElement.query(By.css('p.description'));
37+
});
38+
39+
it('should create component', () => expect(comp).toBeDefined());
40+
41+
it('should have expected <p> text', () => {
42+
fixture.detectChanges();
43+
// const p = de.nativeElement;
44+
// expect(p.textContent).toEqual('Angular Library built with material design in order to provide a reusable faq (frequently asked questions) component for every project. Ask, Answer and List');
45+
});
46+
});

‎src/module/components/ngx-material-faq-admin/ngx-material-faq-admin.component.ts‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import {Component, EventEmitter, Input, Output} from '@angular/core';
2+
import {FaqItem} from '../../faq.item';
3+
4+
@Component({
5+
selector: 'ngx-material-faq-admin',
6+
templateUrl: './ngx-material-faq-admin.component.html',
7+
styleUrls: ['./ngx-material-faq-admin.component.scss']
8+
})
9+
export class NgxMaterialFaqAdminComponent {
10+
11+
@Input()
12+
title = 'Admin';
13+
14+
@Output()
15+
onFAQItemAdded: EventEmitter<FaqItem> = new EventEmitter<FaqItem>();
16+
17+
question: string;
18+
answer: string;
19+
20+
reset() {
21+
this.question = this.answer = undefined;
22+
}
23+
24+
add(): void {
25+
const faqItem: FaqItem = {
26+
question: this.question,
27+
answer: this.answer
28+
}
29+
this.onFAQItemAdded.emit(faqItem);
30+
this.reset();
31+
}
32+
33+
}

‎src/module/components/ngx-material-faq/ngx-material-faq.component.html‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<mat-toolbar color="primary">{{title}}</mat-toolbar>
2+
<mat-accordion [displayMode]="displayMode" [multi]="multi"
3+
class="faq-container">
4+
<mat-expansion-panel *ngFor="let faqItem of faqList">
5+
<mat-expansion-panel-header>{{faqItem.question}}</mat-expansion-panel-header>
6+
<p>{{faqItem.answer}}</p>
7+
</mat-expansion-panel>
8+
</mat-accordion>

‎src/module/components/ngx-material-faq/ngx-material-faq.component.scss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.faq-container {
2+
//width: 500px;
3+
}

‎src/module/components/ngx-material-faq/ngx-material-faq.component.spec.ts‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
import {async, ComponentFixture, TestBed} from '@angular/core/testing';
2+
import {By} from '@angular/platform-browser';
3+
import {DebugElement} from '@angular/core';
4+
5+
import {NgxMaterialFaqComponent} from './ngx-material-faq.component';
6+
import {MatExpansionModule, MatToolbarModule} from '@angular/material';
7+
8+
describe('NgxMaterialFaqComponent', function () {
9+
let de: DebugElement;
10+
let comp: NgxMaterialFaqComponent;
11+
let fixture: ComponentFixture<NgxMaterialFaqComponent>;
12+
13+
beforeEach(async(() => {
14+
TestBed.configureTestingModule({
15+
imports: [
16+
MatToolbarModule,
17+
MatExpansionModule
18+
],
19+
declarations: [NgxMaterialFaqComponent]
20+
})
21+
.compileComponents();
22+
}));
23+
24+
beforeEach(() => {
25+
fixture = TestBed.createComponent(NgxMaterialFaqComponent);
26+
comp = fixture.componentInstance;
27+
de = fixture.debugElement.query(By.css('p.description'));
28+
});
29+
30+
it('should create component', () => expect(comp).toBeDefined());
31+
32+
it('should have expected <p> text', () => {
33+
fixture.detectChanges();
34+
// const p = de.nativeElement;
35+
// expect(p.textContent).toEqual('Angular Library built with material design in order to provide a reusable faq (frequently asked questions) component for every project. Ask, Answer and List');
36+
});
37+
});

0 commit comments

Comments
 (0)