fix(stackblitz): add carousel correct links, datepicker locales, remo…

…ve link from accessibility (#5176)
valor-software · Apr 23, 2019 · caff954 · caff954
1 parent c9f4ec9
commit caff954
Show file tree

Hide file tree

Showing 7 changed files with 34 additions and 19 deletions.
diff --git a/cypress/full/datepicker/min_max_spec.ts b/cypress/full/datepicker/min_max_spec.ts
@@ -19,10 +19,12 @@ describe('Datepicker demo test suite: Min-max', () => {
     const maxDate = new Date();
     minDate.setDate(minDate.getDate() - 1);
     maxDate.setDate(maxDate.getDate() + 7);
+    const minDateMonth = minDate.getMonth();
+    const maxDateMonth = maxDate.getMonth();
     datepicker.clickOnDatepickerInput(minMax);
     datepicker.isDatepickerOpened(true);
     datepicker.isDayIntervalDisabledInCurrentMonth(minDate, maxDate, false);
-    if (minDate.getMonth() !== maxDate.getMonth()) {
+    if (minDateMonth !== maxDateMonth) {
       datepicker.clickOnNavigation('body', '>');
       datepicker.isDayIntervalDisabledInNextMonth(minDate, maxDate, false);
     }

diff --git a/demo/src/app/components/+accordion/accordion-section.list.ts b/demo/src/app/components/+accordion/accordion-section.list.ts
@@ -114,7 +114,6 @@ export const demoComponentContent: ContentSection[] = [
         anchor: 'styling',
         component: require('!!raw-loader?lang=typescript!./demos/styling/styling'),
         html: require('!!raw-loader?lang=markup!./demos/styling/styling.html'),
-        css: require('!!raw-loader?lang=markup!./demos/styling/styling.css'),
         outlet: DemoAccordionStylingComponent
       },
       {

diff --git a/demo/src/app/components/+accordion/demos/styling/styling.css b/demo/src/app/components/+accordion/demos/styling/styling.css
diff --git a/demo/src/app/components/+accordion/demos/styling/styling.ts b/demo/src/app/components/+accordion/demos/styling/styling.ts
@@ -2,10 +2,9 @@ import { Component } from '@angular/core';
 
 @Component({
   selector: 'demo-accordion-styling',
-  templateUrl: './styling.html',
-  styleUrls: ['./styling.css']
+  templateUrl: './styling.html'
 })
 export class DemoAccordionStylingComponent {
-  customClass: string = 'customClass';
-  isFirstOpen: boolean = true;
+  customClass = 'customClass';
+  isFirstOpen = true;
 }
diff --git a/demo/src/app/docs/demo-section-components/demo-examples-section/examples.component.html b/demo/src/app/docs/demo-section-components/demo-examples-section/examples.component.html
@@ -8,7 +8,8 @@ <h2 [attr.id]="section.anchor">
   <div *ngFor="let item of examples">
     <h3 *ngIf="item.title" [attr.id]="item.anchor">
       {{ item.title }}
-      <a title="Open this demo in StackBlitz"
+      <a *ngIf="item.title !== 'Accessibility'"
+        title="Open this demo in StackBlitz"
          href="#"
          class="stackblitz-link"
          (click)="openStackBlitzDemo(item.component, item.html)">

diff --git a/demo/src/app/docs/demo-section-components/demo-examples-section/examples.component.ts b/demo/src/app/docs/demo-section-components/demo-examples-section/examples.component.ts
@@ -76,12 +76,22 @@ export class ExamplesComponent {
 
     .sortable-wrapper {
       min-height: 150px;
-    }` : ''}`,
+    }` : ''}
+    ${this.moduleData.moduleRoute === '/accordion' ?
+          `.card.customClass,
+.card.customClass .card-header,
+.panel.customClass {
+  background-color: #5bc0de;
+  color: #fff;
+}
+.panel.customClass .panel-body {
+  background-color: #337aa7;
+}` : ''}`,
         '.angular-cli.json': `{"apps": [{"styles": ["styles.css"]}]}`,
         'main.ts': main,
         'polyfills.ts': polyfills,
         'app/app.module.ts': getAppModuleCode(className, this.moduleData),
-        'app/ngx-bootstrap-demo.component.ts': ts
+        'app/ngx-bootstrap-demo.component.ts': this.getTs(ts)
       },
       dependencies: {
         'ngx-bootstrap': 'latest'
@@ -90,7 +100,6 @@ export class ExamplesComponent {
       description: 'stackblitz demo',
       template: 'angular-cli'
     };
-
     project.files[`app/${templateName}`] = this.getHtml(html);
 
     sdk.openProject(project);
@@ -100,5 +109,10 @@ export class ExamplesComponent {
     return this.moduleData.moduleRoute === '/carousel' ?
       html.replace(/src="/g, 'src="https://valor-software.com/ngx-bootstrap/') : html;
   }
+
+  private getTs(ts: string): string {
+    return this.moduleData.moduleRoute === '/carousel' ?
+      ts.replace(/assets/g, 'https://valor-software.com/ngx-bootstrap/assets') : ts;
+  }
 }
 
diff --git a/demo/src/app/docs/demo-section-components/demo-examples-section/stackblitz/app.module.ts b/demo/src/app/docs/demo-section-components/demo-examples-section/stackblitz/app.module.ts
@@ -11,12 +11,21 @@ import { BrowserModule } from '@angular/platform-browser';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { CommonModule } from '@angular/common';
 import { ${moduleData.moduleName} } from 'ngx-bootstrap/${moduleData.moduleFolder}';
+${className === 'DemoModalWithPopupsComponent' ? `import { TooltipModule } from 'ngx-bootstrap/tooltip';
+import { PopoverModule } from 'ngx-bootstrap/popover';` : ''}
+${className === 'DemoDatepickerChangeLocaleComponent' ? `import { defineLocale } from 'ngx-bootstrap/chronos';
+import { deLocale, frLocale, plLocale } from 'ngx-bootstrap/locale';
+ defineLocale('de', deLocale);
+ defineLocale('fr', frLocale);
+ defineLocale('pl', plLocale);` : ''}
 
 import { ${className === 'DemoModalServiceFromComponent' ? `${className}, ModalContentComponent` : className} } from './ngx-bootstrap-demo.component'
 @NgModule({
   declarations: [${className === 'DemoModalServiceFromComponent' ? `${className}, ModalContentComponent` : className}],
   imports: [
     ${moduleData.moduleName}.forRoot(),
+    ${className === 'DemoModalWithPopupsComponent' ? `TooltipModule.forRoot(),
+    PopoverModule.forRoot(),` : ''}
     CommonModule,
     FormsModule,
     ReactiveFormsModule,