chore(release): release 13.0.0 (#176)

* chore(release): release 13.0.0

.browserslistrc

@@ -5,6 +5,6 @@
 
 > 0.5%
 last 2 versions
+last 2 Edge major versions
 Firefox ESR
 not dead
-not IE 9-10

.eslintignore

@@ -0,0 +1,14 @@
+karma.conf.js
+e2e/*
+playbook/*
+scripts/*
+server/*
+style-guide/*
+preview/*
+tools/*
+devui-commons/*
+assistant/*
+commitlint.config.js
+node_modules/*
+dist/*
+publish/*

.eslintrc.js

@@ -2,6 +2,7 @@ module.exports = {
   rules: {
     "no-useless-constructor": "off",
     "no-useless-concat":"off",
+    'no-unused-expressions': 'off',
     "max-params": "off",
     "@typescript-eslint/no-useless-constructor": "off",
     "@typescript-eslint/no-parameter-properties": "off",

.gitignore

@@ -26,6 +26,7 @@
 !.vscode/extensions.json
 
 # misc
+/.angular/cache
 /.sass-cache
 /connect.lock
 /coverage

README.md

@@ -23,7 +23,7 @@ To see more in [devui.design](https://devui.design/home).
 
 ## Angular Support
 
-Now supports Angular <font color=red>`^12.0.0`</font>
+Now supports Angular <font color=red>`^13.0.0`</font>
 
 ## Getting Started
 
@@ -97,7 +97,7 @@ Modern browsers and Internet Explorer 11+.
 
 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- |
-| IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+| Edge | last 2 versions| last 2 versions| last 2 versions| last 2 versions
 
 ## Who use it
 

README_zh_CN.md

@@ -23,7 +23,7 @@ DevUI Design设计系统包含了DevUI规则、设计语言和最佳实践的资
 
 ## Angular版本
 
-当前支持的angular版本<font color=red>`^11.0.0`</font>
+当前支持的angular版本<font color=red>`^13.0.0`</font>
 
 ## 快速开始
 
@@ -99,7 +99,7 @@ ng serve --open
 
 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- |
-| IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+| Edge | last 2 versions| last 2 versions| last 2 versions| last 2 versions
 
 ## 谁在使用
 

angular.json

@@ -52,7 +52,6 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
@@ -157,12 +156,14 @@
         "build": {
           "builder": "@angular-devkit/build-angular:ng-packagr",
           "options": {
-            "tsConfig": "devui/tsconfig.lib.json",
             "project": "devui/ng-package.json"
           },
           "configurations": {
             "production": {
               "tsConfig": "devui/tsconfig.lib.prod.json"
+            },
+            "development": {
+              "tsConfig": "devui/tsconfig.lib.json"
             }
           }
         },
@@ -195,4 +196,4 @@
     }
   },
   "defaultProject": "devui"
-}
+}

devui/accordion/accordion-item-hreflink.component.ts

@@ -1,6 +1,6 @@
-import { Component, HostListener, ViewEncapsulation } from '@angular/core';
+import { Component, HostListener, Inject, ViewEncapsulation } from '@angular/core';
 import { AccordionBaseLinkComponent } from './accordion-base-link-component.class';
-import { AccordionComponent } from './accordion.component';
+import { ACCORDION } from './accordion-token';
 
 @Component({
   selector: 'd-accordion-item-hreflink',
@@ -9,7 +9,7 @@ import { AccordionComponent } from './accordion.component';
   preserveWhitespaces: false,
 })
 export class AccordionItemHreflinkComponent extends AccordionBaseLinkComponent {
-  constructor(protected accordion: AccordionComponent) {
+  constructor(@Inject(ACCORDION) protected accordion: any) {
     super(accordion);
   }
   @HostListener('click', ['$event'])

devui/accordion/accordion-item-routerlink.component.ts

@@ -1,7 +1,7 @@
-import { Component, HostBinding, HostListener, OnChanges, SimpleChanges, ViewChild, ViewEncapsulation} from '@angular/core';
+import { Component, HostBinding, HostListener, Inject, OnChanges, SimpleChanges, ViewChild, ViewEncapsulation } from '@angular/core';
 import { Params, Router, RouterLinkActive, UrlTree } from '@angular/router';
 import { AccordionBaseLinkComponent } from './accordion-base-link-component.class';
-import { AccordionComponent } from './accordion.component';
+import { ACCORDION } from './accordion-token';
 
 @Component({
   selector: 'd-accordion-item-routerlink',
@@ -29,7 +29,7 @@ export class AccordionItemRouterlinkComponent extends AccordionBaseLinkComponent
   public queryParams: Params;
   public fragment: string;
 
-  constructor(protected accordion: AccordionComponent, private router: Router) {
+  constructor(@Inject(ACCORDION) protected accordion: any, private router: Router) {
     super(accordion);
   }
 

devui/accordion/accordion-item.component.ts

@@ -1,6 +1,6 @@
-import { Component, HostListener, ViewEncapsulation } from '@angular/core';
+import { Component, HostListener, Inject, ViewEncapsulation } from '@angular/core';
 import { AccordionBaseItemComponent } from './accordion-base-item-component.class';
-import { AccordionComponent } from './accordion.component';
+import { ACCORDION } from './accordion-token';
 import { AccordionBaseItem } from './accordion.type';
 
 @Component({
@@ -10,7 +10,7 @@ import { AccordionBaseItem } from './accordion.type';
   preserveWhitespaces: false,
 })
 export class AccordionItemComponent extends AccordionBaseItemComponent<AccordionBaseItem> {
-  constructor(protected accordion: AccordionComponent) {
+  constructor(@Inject(ACCORDION) protected accordion: any) {
     super(accordion);
   }
   @HostListener('click', ['$event'])

devui/accordion/accordion-list-token.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+
+export const ACCORDION_LIST = new InjectionToken('AccordionListComponent');

devui/accordion/accordion-list.component.html

@@ -3,6 +3,16 @@
     <!--菜单类型-->
     <d-accordion-menu *ngIf="item[childrenKey] !== undefined" [item]="item" [deepth]="deepth" [parent]="parent"></d-accordion-menu>
     <!--非菜单类型-->
+    <d-accordion-list
+      *ngIf="item[childrenKey] !== undefined"
+      class="devui-accordion-submenu"
+      [deepth]="deepth + 1"
+      [data]="item[childrenKey]"
+      [parent]="item"
+      [@collapse]="item.open ? 'expanded' : 'collapsed'"
+      [@.disabled]="!animateState"
+    >
+    </d-accordion-list>
     <ng-container *ngIf="item[childrenKey] === undefined">
       <!--路由链接-->
       <d-accordion-item-routerlink

devui/accordion/accordion-list.component.ts

@@ -1,37 +1,49 @@
 import {
-  Component, Host, HostBinding, Input, OnDestroy, OnInit,
+  Component, Host, HostBinding, Inject, Input, OnDestroy, OnInit,
   Optional, QueryList, SkipSelf, ViewChildren, ViewEncapsulation
 } from '@angular/core';
+import { expandCollapse, expandCollapseForDomDestroy } from 'ng-devui/utils';
 import { AccordionItemRouterlinkComponent } from './accordion-item-routerlink.component';
-import { AccordionMenuComponent } from './accordion-menu.component';
-import { AccordionComponent } from './accordion.component';
+import { ACCORDION_LIST } from './accordion-list-token';
+import { ACCORDION_MENU } from './accordion-menu-token';
+import { ACCORDION } from './accordion-token';
 import { AccordionMenuItem } from './accordion.type';
 
 @Component({
   selector: 'd-accordion-list',
   templateUrl: './accordion-list.component.html',
   encapsulation: ViewEncapsulation.None,
+  animations: [expandCollapse, expandCollapseForDomDestroy],
   preserveWhitespaces: false,
+  providers: [{
+    provide: ACCORDION_LIST,
+    useExisting: AccordionListComponent
+  }]
 })
 export class AccordionListComponent implements OnInit, OnDestroy {
-  @Input() data: Array<AccordionMenuItem>;
-  @Input() deepth = 0;
-  @Input() parent: AccordionMenuItem;
-  @ViewChildren(AccordionMenuComponent) accordionMenuQueryList: QueryList<AccordionMenuComponent>;
-  @ViewChildren(AccordionItemRouterlinkComponent) accordionItemRouterlinkQueryList: QueryList<AccordionItemRouterlinkComponent>;
-  constructor(@Optional() @Host() @SkipSelf() private parentComponent: AccordionMenuComponent,
-              private accordion: AccordionComponent) {}
-  ngOnInit(): void {
-    if (this.parentComponent) {
-      setTimeout(() => {this.parentComponent.accordionListFromView = this; });
-    }
-  }
-  ngOnDestroy(): void {
-    if (this.parentComponent) {
-      this.parentComponent.accordionListFromView = undefined;
-    }
-  }
 
+  // @HostBinding('class.open')
+  // get open() {
+  //   return (this.keyOpen === undefined && this.accordion.autoOpenActiveMenu)
+  //     ? this.childActived
+  //     : this.keyOpen;
+  // }
+  // get keyOpen() {
+  //   return this.data && this.data[this.accordion.openKey];
+  // }
+
+  // get children() {
+  //   return this.data && this.data[this.accordion.childrenKey];
+  // }
+  // get childActived() {
+  //   return this.routerLinkActived || this.hasActiveChildren;
+  // }
+
+  // get showAnimate() {
+  //   return this.accordion.showAnimation;
+  // }
+  constructor(@Optional() @Host() @SkipSelf() @Inject(ACCORDION_MENU) private parentComponent: any,
+              @Inject(ACCORDION) private accordion: any) {}
   @HostBinding('class.devui-accordion-show-animate') get animateState() {
     return this.accordion.showAnimation;
   }
@@ -81,21 +93,6 @@ export class AccordionListComponent implements OnInit, OnDestroy {
   get linkDefaultTarget() {
     return this.accordion.linkDefaultTarget;
   }
-  private isLinkRouterActive(airlc: AccordionItemRouterlinkComponent): boolean {
-    return airlc.routerLinkActived;
-  }
-  private isMenuRouterActive(amc: AccordionMenuComponent): boolean {
-    return amc.routerLinkActived;
-  }
-  private isMenuDataActive(amc: AccordionMenuComponent): boolean {
-    return amc.hasActiveChildren;
-  }
-  private isItemDataActive(item: AccordionMenuItem): boolean {
-    return !!item[this.activeKey];
-  }
-  private isItemData(item: AccordionMenuItem): boolean {
-    return item[this.childrenKey] === undefined;
-  }
   get routerLinkActived(): boolean {
     return (!!this.accordionItemRouterlinkQueryList
         && this.accordionItemRouterlinkQueryList.some(airlc => this.isLinkRouterActive(airlc))
@@ -111,6 +108,37 @@ export class AccordionListComponent implements OnInit, OnDestroy {
         && this.data.some(item => this.isItemData(item) && this.isItemDataActive(item))
       );
   }
+  @Input() data: Array<AccordionMenuItem>;
+  @Input() deepth = 0;
+  @Input() parent: AccordionMenuItem;
+  @ViewChildren(ACCORDION_MENU) accordionMenuQueryList: QueryList<any>;
+  @ViewChildren(AccordionItemRouterlinkComponent) accordionItemRouterlinkQueryList: QueryList<AccordionItemRouterlinkComponent>;
+6;
+  ngOnInit(): void {
+    if (this.parentComponent) {
+      setTimeout(() => {this.parentComponent.accordionListFromView = this; });
+    }
+  }
+  ngOnDestroy(): void {
+    if (this.parentComponent) {
+      this.parentComponent.accordionListFromView = undefined;
+    }
+  }
+  private isLinkRouterActive(airlc: AccordionItemRouterlinkComponent): boolean {
+    return airlc.routerLinkActived;
+  }
+  private isMenuRouterActive(amc: any): boolean {
+    return amc.routerLinkActived;
+  }
+  private isMenuDataActive(amc: any): boolean {
+    return amc.hasActiveChildren;
+  }
+  private isItemDataActive(item: AccordionMenuItem): boolean {
+    return !!item[this.activeKey];
+  }
+  private isItemData(item: AccordionMenuItem): boolean {
+    return item[this.childrenKey] === undefined;
+  }
   menuToggleItemFn = (item: any , event?: any) => {
     this.accordion.menuToggleFn({
       item: item,

devui/accordion/accordion-menu-token.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+
+export const ACCORDION_MENU = new InjectionToken('AccordionMenuComponent');

devui/accordion/accordion-menu.component.html

@@ -45,13 +45,3 @@
     </svg>
   </span>
 </div>
-<d-accordion-list
-  class="devui-accordion-submenu"
-  [@collapse]="open ? 'expanded' : 'collapsed'"
-  [@.disabled]="!showAnimate"
-  [ngClass]="{ 'devui-accordion-menu-hidden': !open && !showAnimate }"
-  [deepth]="deepth + 1"
-  [data]="children"
-  [parent]="item"
->
-</d-accordion-list>

devui/accordion/accordion-menu.component.ts

@@ -1,30 +1,28 @@
-import { Component, HostBinding, ViewEncapsulation } from '@angular/core';
-import { expandCollapse, expandCollapseForDomDestroy } from 'ng-devui/utils';
+import { Component, HostBinding, Inject, ViewEncapsulation } from '@angular/core';
 import { AccordionBaseComponent } from './accordion-base-component.class';
-import { AccordionListComponent } from './accordion-list.component';
-import { AccordionComponent } from './accordion.component';
+import { ACCORDION_MENU } from './accordion-menu-token';
+import { ACCORDION } from './accordion-token';
 import { AccordionBaseMenu, AccordionMenuItem } from './accordion.type';
 @Component({
   selector: 'd-accordion-menu',
   templateUrl: './accordion-menu.component.html',
   encapsulation: ViewEncapsulation.None,
   preserveWhitespaces: false,
-  animations: [expandCollapse, expandCollapseForDomDestroy]
+  providers: [{
+    provide: ACCORDION_MENU,
+    useExisting: AccordionMenuComponent
+  }]
 })
 export class AccordionMenuComponent extends AccordionBaseComponent<AccordionBaseMenu<AccordionMenuItem>> {
   @HostBinding('class.devui-accordion-menu-item')
   defaultClasses = true;
 
-  public accordionListFromView: AccordionListComponent;
+  public accordionListFromView: any; // AccordionListComponent
 
   get menuItemTemplate() {
     return this.accordion.menuItemTemplate;
   }
 
-  get showAnimate() {
-    return this.accordion.showAnimation;
-  }
-
   @HostBinding('class.open')
   get open() {
     return (this.keyOpen === undefined && this.accordion.autoOpenActiveMenu)
@@ -52,7 +50,7 @@ export class AccordionMenuComponent extends AccordionBaseComponent<AccordionBase
     return this.accordionListFromView && this.accordionListFromView.hasActiveChildren;
   }
 
-  constructor(public accordion: AccordionComponent) {
+  constructor(@Inject(ACCORDION) public accordion: any) {
     super(accordion);
   }
 

devui/accordion/accordion-token.ts

@@ -0,0 +1,3 @@
+import { InjectionToken } from '@angular/core';
+
+export const ACCORDION = new InjectionToken('AccordionComponent');

devui/accordion/accordion.component.scss

@@ -170,10 +170,6 @@
   }
 }
 
-:host ::ng-deep d-accordion-list.devui-accordion-menu-hidden {
-  display: none;
-}
-
 /* 视觉融合灰线 */
 :host ::ng-deep .devui-accordion-item-title {
   position: relative;