diff --git a/.gitignore b/.gitignore index 62354b74..3eddd3ea 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ node_modules dist lerna-debug.log -yarn-debug.log \ No newline at end of file +yarn-debug.log +yarn-error.log \ No newline at end of file diff --git a/.prettierignore b/.prettierignore new file mode 100644 index 00000000..009af543 --- /dev/null +++ b/.prettierignore @@ -0,0 +1,2 @@ +dist +coverage diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 00000000..a20502b7 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,4 @@ +{ + "singleQuote": true, + "trailingComma": "all" +} diff --git a/.yarnrc b/.yarnrc index f445bb50..01fd7100 100644 --- a/.yarnrc +++ b/.yarnrc @@ -1 +1 @@ ---install.exact true \ No newline at end of file +--add.exact true \ No newline at end of file diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index cbe901c2..483d590d 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -6,4 +6,4 @@ This repo utilizes [Yarn Workspaces](https://yarnpkg.com/lang/en/docs/workspaces ## Commit Message Guidelines -We follow the [Conventional Commits](https://conventionalcommits.org/) guidelines. These are enforced through the use of [commitlint](http://marionebl.github.io/commitlint). If you would like a more interactive way of formatting your commit messages, run `yarn commit` once your changes are staged. \ No newline at end of file +We follow the [Conventional Commits](https://conventionalcommits.org/) guidelines. These are enforced through the use of [commitlint](http://marionebl.github.io/commitlint). If you would like a more interactive way of formatting your commit messages, run `yarn commit` once your changes are staged. diff --git a/README.md b/README.md index f7fb0508..735cc03c 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,5 @@ # @angular-redux + [![CircleCI](https://circleci.com/gh/angular-redux/platform/tree/master.svg?style=svg)](https://circleci.com/gh/angular-redux/platform/tree/master) [Redux](https://redux.js.org/) bindings for [Angular](https://angular.io/) applications. diff --git a/package.json b/package.json index 2232a47d..8e4d18fa 100644 --- a/package.json +++ b/package.json @@ -7,13 +7,23 @@ "build": "lerna run build", "lint": "lerna run lint", "commit": "commit", - "commitmsg": "commitlint -E GIT_PARAMS" + "prettier": "prettier --write \"**/*.*(ts|js|css|scss|json|md)\"", + "pre-commit": "lint-staged", + "commit-msg": "commitlint -E GIT_PARAMS" + }, + "lint-staged": { + "*.{ts,js,css,scss,json,md}": [ + "prettier --write", + "git add" + ] }, "devDependencies": { - "@commitlint/cli": "^7.0.0", - "@commitlint/config-conventional": "^7.0.1", - "@commitlint/prompt-cli": "^7.0.0", - "husky": "^0.14.3", - "lerna": "2.11.0" + "@commitlint/cli": "7.0.0", + "@commitlint/config-conventional": "7.0.1", + "@commitlint/prompt-cli": "7.0.0", + "husky": "0.14.3", + "lerna": "2.11.0", + "lint-staged": "7.2.0", + "prettier": "1.13.7" } } diff --git a/packages/example-app/.angular-cli.json b/packages/example-app/.angular-cli.json index be86b97d..a9402113 100644 --- a/packages/example-app/.angular-cli.json +++ b/packages/example-app/.angular-cli.json @@ -7,10 +7,7 @@ { "root": "src", "outDir": "dist", - "assets": [ - "assets", - "favicon.ico" - ], + "assets": ["assets", "favicon.ico"], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", @@ -18,9 +15,7 @@ "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "zoo", - "styles": [ - "styles.css" - ], + "styles": ["styles.css"], "scripts": [], "environmentSource": "environments/environment.ts", "environments": { diff --git a/packages/example-app/README.md b/packages/example-app/README.md index 374248e0..95400a68 100644 --- a/packages/example-app/README.md +++ b/packages/example-app/README.md @@ -5,16 +5,17 @@ This is a sample project showing how the following packages work together to make a simple application. -* [redux](https://github.com/reactjs/redux) Predictable state container for Javascript. -* [redux-observable](https://github.com/redux-observable/redux-observable) Side-effect handling with Observables -* [@angular-redux/store](https://github.com/angular-redux/store) Redux + Angular bindings -* [@angular-redux/router](https://github.com/angular-redux/router) Time travel with the Angular router -* [@angular-redux/form](https://github.com/angular-redux/form) Time travel with Angular forms -* [Redux DevTools Chrome Extension](https://github.com/zalmoxisus/redux-devtools-extension) +- [redux](https://github.com/reactjs/redux) Predictable state container for Javascript. +- [redux-observable](https://github.com/redux-observable/redux-observable) Side-effect handling with Observables +- [@angular-redux/store](https://github.com/angular-redux/store) Redux + Angular bindings +- [@angular-redux/router](https://github.com/angular-redux/router) Time travel with the Angular router +- [@angular-redux/form](https://github.com/angular-redux/form) Time travel with Angular forms +- [Redux DevTools Chrome Extension](https://github.com/zalmoxisus/redux-devtools-extension) This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.0.0-rc.0. ## Development server + Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files. ## Code scaffolding diff --git a/packages/example-app/karma.conf.js b/packages/example-app/karma.conf.js index 84b4cd5a..6af35692 100644 --- a/packages/example-app/karma.conf.js +++ b/packages/example-app/karma.conf.js @@ -1,7 +1,7 @@ // Karma configuration file, see link for more information // https://karma-runner.github.io/0.13/config/configuration-file.html -module.exports = function (config) { +module.exports = function(config) { config.set({ basePath: '', frameworks: ['jasmine', '@angular/cli'], @@ -10,35 +10,34 @@ module.exports = function (config) { require('karma-chrome-launcher'), require('karma-jasmine-html-reporter'), require('karma-coverage-istanbul-reporter'), - require('@angular/cli/plugins/karma') + require('@angular/cli/plugins/karma'), ], - client:{ - clearContext: false // leave Jasmine Spec Runner output visible in browser + client: { + clearContext: false, // leave Jasmine Spec Runner output visible in browser }, - files: [ - { pattern: './src/test.ts', watched: false } - ], + files: [{ pattern: './src/test.ts', watched: false }], preprocessors: { - './src/test.ts': ['@angular/cli'] + './src/test.ts': ['@angular/cli'], }, mime: { - 'text/x-typescript': ['ts','tsx'] + 'text/x-typescript': ['ts', 'tsx'], }, coverageIstanbulReporter: { - reports: [ 'html', 'lcovonly' ], - fixWebpackSourcePaths: true + reports: ['html', 'lcovonly'], + fixWebpackSourcePaths: true, }, angularCli: { - environment: 'dev' + environment: 'dev', }, - reporters: config.angularCli && config.angularCli.codeCoverage - ? ['progress', 'coverage-istanbul'] - : ['progress', 'kjhtml'], + reporters: + config.angularCli && config.angularCli.codeCoverage + ? ['progress', 'coverage-istanbul'] + : ['progress', 'kjhtml'], port: 9876, colors: true, logLevel: config.LOG_INFO, autoWatch: true, browsers: ['Chrome'], - singleRun: false + singleRun: false, }); }; diff --git a/packages/example-app/protractor.conf.js b/packages/example-app/protractor.conf.js index 1c5e1e5a..29086c81 100644 --- a/packages/example-app/protractor.conf.js +++ b/packages/example-app/protractor.conf.js @@ -5,11 +5,9 @@ const { SpecReporter } = require('jasmine-spec-reporter'); exports.config = { allScriptsTimeout: 11000, - specs: [ - './e2e/**/*.e2e-spec.ts' - ], + specs: ['./e2e/**/*.e2e-spec.ts'], capabilities: { - 'browserName': 'chrome' + browserName: 'chrome', }, directConnect: true, baseUrl: 'http://localhost:4200/', @@ -17,14 +15,16 @@ exports.config = { jasmineNodeOpts: { showColors: true, defaultTimeoutInterval: 30000, - print: function() {} + print: function() {}, }, beforeLaunch: function() { require('ts-node').register({ - project: 'e2e/tsconfig.e2e.json' + project: 'e2e/tsconfig.e2e.json', }); }, onPrepare() { - jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); - } + jasmine + .getEnv() + .addReporter(new SpecReporter({ spec: { displayStacktrace: true } })); + }, }; diff --git a/packages/example-app/src/app/animals/animal-list/component.css b/packages/example-app/src/app/animals/animal-list/component.css index a2f6a256..ad91a94e 100644 --- a/packages/example-app/src/app/animals/animal-list/component.css +++ b/packages/example-app/src/app/animals/animal-list/component.css @@ -1,2 +1,7 @@ -.header { display: flex; } -.header-cell { flex-basis: 25%; font-weight: bold; } \ No newline at end of file +.header { + display: flex; +} +.header-cell { + flex-basis: 25%; + font-weight: bold; +} diff --git a/packages/example-app/src/app/animals/animal-list/component.spec.ts b/packages/example-app/src/app/animals/animal-list/component.spec.ts index 9fb95444..87f1fbfd 100644 --- a/packages/example-app/src/app/animals/animal-list/component.spec.ts +++ b/packages/example-app/src/app/animals/animal-list/component.spec.ts @@ -8,8 +8,8 @@ import { AnimalType } from '../model'; @Component({ selector: 'zoo-animal', template: '' }) class MockAnimalComponent { - @Input() key: string - @Input() animalType: AnimalType + @Input() key: string; + @Input() animalType: AnimalType; } describe('AnimalListComponent', () => { @@ -29,6 +29,8 @@ describe('AnimalListComponent', () => { fixture.detectChanges(); const titleElement = fixture.debugElement.query(By.css('h2')); - expect(titleElement.nativeElement.textContent).toContain('We have Wallabies'); + expect(titleElement.nativeElement.textContent).toContain( + 'We have Wallabies', + ); })); }); diff --git a/packages/example-app/src/app/animals/animal/component.css b/packages/example-app/src/app/animals/animal/component.css index 68832004..ddf2e92f 100644 --- a/packages/example-app/src/app/animals/animal/component.css +++ b/packages/example-app/src/app/animals/animal/component.css @@ -1,2 +1,6 @@ -:host { display: flex; } -div { flex-basis: 25%; } +:host { + display: flex; +} +div { + flex-basis: 25%; +} diff --git a/packages/example-app/src/app/animals/animal/component.spec.ts b/packages/example-app/src/app/animals/animal/component.spec.ts index 02a2ea10..37469fa5 100644 --- a/packages/example-app/src/app/animals/animal/component.spec.ts +++ b/packages/example-app/src/app/animals/animal/component.spec.ts @@ -1,5 +1,8 @@ import { async, TestBed } from '@angular/core/testing'; -import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; +import { + NgReduxTestingModule, + MockNgRedux, +} from '@angular-redux/store/testing'; import { AnimalComponent } from './component'; import { CoreModule } from '../../core/module'; import 'rxjs/add/operator/toArray'; @@ -10,8 +13,10 @@ describe('AnimalComponent', () => { let spyConfigureSubStore; beforeEach(async(() => { - spyConfigureSubStore = spyOn(MockNgRedux.mockInstance, 'configureSubStore') - .and.callThrough(); + spyConfigureSubStore = spyOn( + MockNgRedux.mockInstance, + 'configureSubStore', + ).and.callThrough(); MockNgRedux.reset(); TestBed.configureTestingModule({ @@ -31,62 +36,57 @@ describe('AnimalComponent', () => { it('should use the key to create a subStore', () => expect(spyConfigureSubStore).toHaveBeenCalledWith( ['WALLABIES', 'items', 'id1'], - jasmine.any(Function))); + jasmine.any(Function), + )); it('select name data from the substore', async(() => { - const mockSubStore = MockNgRedux.getSubStore( - ['WALLABIES', 'items', 'id1']); + const mockSubStore = MockNgRedux.getSubStore(['WALLABIES', 'items', 'id1']); const selectorStub = mockSubStore.getSelectorStub('name'); selectorStub.next('Wilbert'); selectorStub.complete(); - animalComponent.name$ - .subscribe( - name => expect(name).toEqual('Wilbert')); + animalComponent.name$.subscribe(name => expect(name).toEqual('Wilbert')); })); it('select ticket price data from the substore', async(() => { - const mockSubStore = MockNgRedux.getSubStore( - ['WALLABIES', 'items', 'id1']); + const mockSubStore = MockNgRedux.getSubStore(['WALLABIES', 'items', 'id1']); const selectorStub = mockSubStore.getSelectorStub('ticketPrice'); selectorStub.next(2); selectorStub.complete(); - animalComponent.ticketPrice$ - .subscribe( - ticketPrice => expect(ticketPrice).toEqual(2)); + animalComponent.ticketPrice$.subscribe(ticketPrice => + expect(ticketPrice).toEqual(2), + ); })); it('select ticket quantity data from the substore', async(() => { - const mockSubStore = MockNgRedux.getSubStore( - ['WALLABIES', 'items', 'id1']); + const mockSubStore = MockNgRedux.getSubStore(['WALLABIES', 'items', 'id1']); const selectorStub = mockSubStore.getSelectorStub('tickets'); selectorStub.next(4); selectorStub.complete(); - animalComponent.numTickets$ - .subscribe( - numTickets => expect(numTickets).toEqual(4)); + animalComponent.numTickets$.subscribe(numTickets => + expect(numTickets).toEqual(4), + ); })); it('should use reasonable defaults if ticket price is missing', async(() => { - animalComponent.ticketPrice$ - .subscribe( - ticketPrice => expect(ticketPrice).toEqual(0)); + animalComponent.ticketPrice$.subscribe(ticketPrice => + expect(ticketPrice).toEqual(0), + ); })); it('should use reasonable defaults if ticket quantity is missing', async(() => { - animalComponent.numTickets$ - .subscribe( - numTickets => expect(numTickets).toEqual(0)); + animalComponent.numTickets$.subscribe(numTickets => + expect(numTickets).toEqual(0), + ); })); it('should compute the subtotal as the ticket quantity changes', async(() => { - const mockSubStore = MockNgRedux.getSubStore( - ['WALLABIES', 'items', 'id1']); + const mockSubStore = MockNgRedux.getSubStore(['WALLABIES', 'items', 'id1']); const priceStub = mockSubStore.getSelectorStub('ticketPrice'); priceStub.next(1); @@ -100,7 +100,6 @@ describe('AnimalComponent', () => { animalComponent.subTotal$ .toArray() - .subscribe( - subTotals => expect(subTotals).toEqual([5, 10, 15])); + .subscribe(subTotals => expect(subTotals).toEqual([5, 10, 15])); })); }); diff --git a/packages/example-app/src/app/animals/animal/component.ts b/packages/example-app/src/app/animals/animal/component.ts index 420f2e07..f2e89bb2 100644 --- a/packages/example-app/src/app/animals/animal/component.ts +++ b/packages/example-app/src/app/animals/animal/component.ts @@ -28,14 +28,13 @@ export class AnimalComponent { @Input() key: string; @Input() animalType: string; - @select() readonly name$: Observable; - @select('tickets') readonly numTickets$: Observable; - @select('ticketPrice') readonly ticketPrice$: Observable; - @select$(null, toSubTotal) readonly subTotal$: Observable; + @select() readonly name$: Observable; + @select('tickets') readonly numTickets$: Observable; + @select('ticketPrice') readonly ticketPrice$: Observable; + @select$(null, toSubTotal) + readonly subTotal$: Observable; - getBasePath = () => this.key ? - [ this.animalType, 'items', this.key ] : - null; + getBasePath = () => (this.key ? [this.animalType, 'items', this.key] : null); @dispatch() addTicket = () => ({ type: 'ADD_TICKET' }); @dispatch() removeTicket = () => ({ type: 'REMOVE_TICKET' }); diff --git a/packages/example-app/src/app/animals/animal/reducers.ts b/packages/example-app/src/app/animals/animal/reducers.ts index fa8676c5..770d288e 100644 --- a/packages/example-app/src/app/animals/animal/reducers.ts +++ b/packages/example-app/src/app/animals/animal/reducers.ts @@ -1,16 +1,24 @@ import { Reducer, Action } from 'redux'; import { AnimalComponent } from './component'; -export const ticketsReducer: Reducer = (state = 0, action: Action): number => { +export const ticketsReducer: Reducer = ( + state = 0, + action: Action, +): number => { switch (action.type) { - case AnimalComponent.ADD_TICKET: return state + 1; - case AnimalComponent.REMOVE_TICKET: return Math.max(0, state - 1); + case AnimalComponent.ADD_TICKET: + return state + 1; + case AnimalComponent.REMOVE_TICKET: + return Math.max(0, state - 1); } return state; -} +}; // Basic reducer logic. -export const animalComponentReducer: Reducer = (state: any = {}, action: Action): {} => ({ +export const animalComponentReducer: Reducer = ( + state: any = {}, + action: Action, +): {} => ({ ...state, tickets: ticketsReducer(state.tickets, action), }); diff --git a/packages/example-app/src/app/animals/api/actions.ts b/packages/example-app/src/app/animals/api/actions.ts index 8eea9766..5d98d50e 100644 --- a/packages/example-app/src/app/animals/api/actions.ts +++ b/packages/example-app/src/app/animals/api/actions.ts @@ -5,7 +5,9 @@ import { IAnimal, AnimalType } from '../model'; // Flux-standard-action gives us stronger typing of our actions. type Payload = IAnimal[]; -interface MetaData { animalType: AnimalType; }; +interface MetaData { + animalType: AnimalType; +} export type AnimalAPIAction = FluxStandardAction; @Injectable() @@ -26,18 +28,21 @@ export class AnimalAPIActions { type: AnimalAPIActions.LOAD_STARTED, meta: { animalType }, payload: null, - }) + }); - loadSucceeded = (animalType: AnimalType, payload: Payload): AnimalAPIAction => ({ + loadSucceeded = ( + animalType: AnimalType, + payload: Payload, + ): AnimalAPIAction => ({ type: AnimalAPIActions.LOAD_SUCCEEDED, meta: { animalType }, payload, - }) + }); loadFailed = (animalType: AnimalType, error): AnimalAPIAction => ({ type: AnimalAPIActions.LOAD_FAILED, meta: { animalType }, payload: null, error, - }) + }); } diff --git a/packages/example-app/src/app/animals/api/epics.ts b/packages/example-app/src/app/animals/api/epics.ts index aa5ed1a3..837582a0 100644 --- a/packages/example-app/src/app/animals/api/epics.ts +++ b/packages/example-app/src/app/animals/api/epics.ts @@ -13,14 +13,17 @@ import { AnimalAPIService } from './service'; const animalsNotAlreadyFetched = ( animalType: AnimalType, - state: IAppState): boolean => !( + state: IAppState, +): boolean => + !( state[animalType] && state[animalType].items && - Object.keys(state[animalType].items).length); + Object.keys(state[animalType].items).length + ); -const actionIsForCorrectAnimalType = (animalType: AnimalType) => - (action: AnimalAPIAction): boolean => - action.meta.animalType === animalType; +const actionIsForCorrectAnimalType = (animalType: AnimalType) => ( + action: AnimalAPIAction, +): boolean => action.meta.animalType === animalType; @Injectable() export class AnimalAPIEpics { @@ -33,16 +36,26 @@ export class AnimalAPIEpics { return createEpicMiddleware(this.createLoadAnimalEpic(animalType)); } - private createLoadAnimalEpic(animalType: AnimalType): Epic { - return (action$, store) => action$ - .ofType(AnimalAPIActions.LOAD_ANIMALS) - .filter(action => actionIsForCorrectAnimalType(animalType)(action)) - .filter(() => animalsNotAlreadyFetched(animalType, store.getState())) - .switchMap(() => this.service.getAll(animalType) - .map(data => this.actions.loadSucceeded(animalType, data)) - .catch(response => of(this.actions.loadFailed(animalType, { - status: '' + response.status, - }))) - .startWith(this.actions.loadStarted(animalType))); + private createLoadAnimalEpic( + animalType: AnimalType, + ): Epic { + return (action$, store) => + action$ + .ofType(AnimalAPIActions.LOAD_ANIMALS) + .filter(action => actionIsForCorrectAnimalType(animalType)(action)) + .filter(() => animalsNotAlreadyFetched(animalType, store.getState())) + .switchMap(() => + this.service + .getAll(animalType) + .map(data => this.actions.loadSucceeded(animalType, data)) + .catch(response => + of( + this.actions.loadFailed(animalType, { + status: '' + response.status, + }), + ), + ) + .startWith(this.actions.loadStarted(animalType)), + ); } } diff --git a/packages/example-app/src/app/animals/api/reducer.ts b/packages/example-app/src/app/animals/api/reducer.ts index c6453337..c6a08237 100644 --- a/packages/example-app/src/app/animals/api/reducer.ts +++ b/packages/example-app/src/app/animals/api/reducer.ts @@ -12,9 +12,10 @@ const INITIAL_STATE: IAnimalList = { // A higher-order reducer: accepts an animal type and returns a reducer // that only responds to actions for that particular animal type. export function createAnimalAPIReducer(animalType: AnimalType) { - return function animalReducer(state: IAnimalList = INITIAL_STATE, - a: Action): IAnimalList { - + return function animalReducer( + state: IAnimalList = INITIAL_STATE, + a: Action, + ): IAnimalList { const action = a as AnimalAPIAction; if (!action.meta || action.meta.animalType !== animalType) { return state; diff --git a/packages/example-app/src/app/animals/api/service.ts b/packages/example-app/src/app/animals/api/service.ts index 5e1471cc..8c66fe95 100644 --- a/packages/example-app/src/app/animals/api/service.ts +++ b/packages/example-app/src/app/animals/api/service.ts @@ -17,7 +17,8 @@ export class AnimalAPIService { constructor(private http: Http) {} getAll = (animalType: AnimalType): Observable => - this.http.get(URLS[animalType]) + this.http + .get(URLS[animalType]) .map(resp => resp.json()) .map(records => records.map(fromServer)); } diff --git a/packages/example-app/src/app/component.css b/packages/example-app/src/app/component.css index 9a8e725e..28c8e4f4 100644 --- a/packages/example-app/src/app/component.css +++ b/packages/example-app/src/app/component.css @@ -1,5 +1,5 @@ .active { - background: #EEE; + background: #eee; border-radius: 3px; padding: 5px; } @@ -10,4 +10,4 @@ content { border: solid gray 1px; border-radius: 5px; margin-top: 1rem; -} \ No newline at end of file +} diff --git a/packages/example-app/src/app/component.spec.ts b/packages/example-app/src/app/component.spec.ts index 148b0bff..82672069 100644 --- a/packages/example-app/src/app/component.spec.ts +++ b/packages/example-app/src/app/component.spec.ts @@ -7,7 +7,7 @@ describe('AppComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [AppComponent], - imports: [ RouterTestingModule ], + imports: [RouterTestingModule], }).compileComponents(); })); diff --git a/packages/example-app/src/app/core/error-well/component.css b/packages/example-app/src/app/core/error-well/component.css index dd8af982..d97e1238 100644 --- a/packages/example-app/src/app/core/error-well/component.css +++ b/packages/example-app/src/app/core/error-well/component.css @@ -1,9 +1,9 @@ :host { - background: #FDD; + background: #fdd; border: solid maroon 1px; border-radius: 3px; color: maroon; display: block; padding: 3px; width: 100%; -} \ No newline at end of file +} diff --git a/packages/example-app/src/app/core/error-well/component.ts b/packages/example-app/src/app/core/error-well/component.ts index aa7528ba..13b5827e 100644 --- a/packages/example-app/src/app/core/error-well/component.ts +++ b/packages/example-app/src/app/core/error-well/component.ts @@ -4,7 +4,7 @@ import { Observable } from 'rxjs/Observable'; @Component({ selector: 'zoo-error-well', templateUrl: './component.html', - styleUrls: [ './component.css' ], + styleUrls: ['./component.css'], changeDetection: ChangeDetectionStrategy.OnPush, }) export class ErrorWellComponent { diff --git a/packages/example-app/src/app/core/module.ts b/packages/example-app/src/app/core/module.ts index e119461a..c7f597ab 100644 --- a/packages/example-app/src/app/core/module.ts +++ b/packages/example-app/src/app/core/module.ts @@ -6,16 +6,8 @@ import { ErrorWellComponent } from './error-well/component'; import { CounterComponent } from './counter/component'; @NgModule({ - declarations: [ - SpinnerComponent, - ErrorWellComponent, - CounterComponent, - ], - imports: [ CommonModule ], - exports: [ - SpinnerComponent, - ErrorWellComponent, - CounterComponent, - ], + declarations: [SpinnerComponent, ErrorWellComponent, CounterComponent], + imports: [CommonModule], + exports: [SpinnerComponent, ErrorWellComponent, CounterComponent], }) export class CoreModule {} diff --git a/packages/example-app/src/app/core/spinner/component.ts b/packages/example-app/src/app/core/spinner/component.ts index d2a3087b..626a3d50 100644 --- a/packages/example-app/src/app/core/spinner/component.ts +++ b/packages/example-app/src/app/core/spinner/component.ts @@ -3,6 +3,6 @@ import { Component } from '@angular/core'; @Component({ selector: 'zoo-spinner', templateUrl: './component.html', - styleUrls: [ './component.css' ], + styleUrls: ['./component.css'], }) export class SpinnerComponent {} diff --git a/packages/example-app/src/app/elephants/page.spec.ts b/packages/example-app/src/app/elephants/page.spec.ts index 515f1e73..03ecbda4 100644 --- a/packages/example-app/src/app/elephants/page.spec.ts +++ b/packages/example-app/src/app/elephants/page.spec.ts @@ -1,5 +1,8 @@ import { TestBed, async } from '@angular/core/testing'; -import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; +import { + NgReduxTestingModule, + MockNgRedux, +} from '@angular-redux/store/testing'; import { Component, Input } from '@angular/core'; import { NgRedux } from '@angular-redux/store'; @@ -22,7 +25,7 @@ class MockAnimalListComponent { @Input() animals: Observable; @Input() loading: Observable; @Input() error: Observable; -}; +} describe('Elephant Page Container', () => { beforeEach(() => { @@ -43,15 +46,16 @@ describe('Elephant Page Container', () => { { elephant1: { name: 'I am an Elephant!', id: 'elephant1' }, elephant2: { name: 'I am a second Elephant!', id: 'elephant2' }, - }]; + }, + ]; const expectedSequence = [ - [ { name: 'I am an Elephant!', id: 'elephant1' } ], + [{ name: 'I am an Elephant!', id: 'elephant1' }], [ // Alphanumeric sort by name. { name: 'I am a second Elephant!', id: 'elephant2' }, { name: 'I am an Elephant!', id: 'elephant1' }, - ] + ], ]; const elephantItemStub = MockNgRedux.getSelectorStub(['elephant', 'items']); @@ -63,7 +67,8 @@ describe('Elephant Page Container', () => { .subscribe( actualSequence => expect(actualSequence).toEqual(expectedSequence), null, - done); + done, + ); }); it('should know when the animals are loading', done => { @@ -78,12 +83,13 @@ describe('Elephant Page Container', () => { elephantPage.loading$ .toArray() .subscribe( - actualSequence => expect(actualSequence).toEqual([ false, true ]), + actualSequence => expect(actualSequence).toEqual([false, true]), null, - done); + done, + ); }); - it('should know when there\'s an error', done => { + it("should know when there's an error", done => { const fixture = TestBed.createComponent(ElephantPageComponent); const elephantPage = fixture.debugElement.componentInstance; @@ -95,9 +101,10 @@ describe('Elephant Page Container', () => { elephantPage.error$ .toArray() .subscribe( - actualSequence => expect(actualSequence).toEqual([ false, true ]), + actualSequence => expect(actualSequence).toEqual([false, true]), null, - done); + done, + ); }); it('should load elephants on creation', () => { diff --git a/packages/example-app/src/app/elephants/page.ts b/packages/example-app/src/app/elephants/page.ts index a90fbf9c..86912434 100644 --- a/packages/example-app/src/app/elephants/page.ts +++ b/packages/example-app/src/app/elephants/page.ts @@ -10,7 +10,9 @@ export const sortAnimals = (animalDictionary$: Observable<{}>) => animalDictionary$.map( pipe( values, - sortBy(prop('name')))); + sortBy(prop('name')), + ), + ); @Component({ templateUrl: './page.html', diff --git a/packages/example-app/src/app/feedback/module.ts b/packages/example-app/src/app/feedback/module.ts index a3b5a49c..ae6c1096 100644 --- a/packages/example-app/src/app/feedback/module.ts +++ b/packages/example-app/src/app/feedback/module.ts @@ -6,8 +6,8 @@ import { FeedbackFormComponent } from './page'; import { StoreModule } from '../store/module'; @NgModule({ - declarations: [ FeedbackFormComponent ], - providers: [ ], + declarations: [FeedbackFormComponent], + providers: [], imports: [ CommonModule, FormsModule, @@ -15,6 +15,6 @@ import { StoreModule } from '../store/module'; NgReduxFormModule, StoreModule, ], - exports: [ FeedbackFormComponent ], + exports: [FeedbackFormComponent], }) export class FeedbackModule {} diff --git a/packages/example-app/src/app/feedback/page.css b/packages/example-app/src/app/feedback/page.css index 3eefc5a7..63582b25 100644 --- a/packages/example-app/src/app/feedback/page.css +++ b/packages/example-app/src/app/feedback/page.css @@ -4,7 +4,8 @@ label { margin-bottom: 1rem; } -input, textarea { +input, +textarea { display: block; width: 95%; padding: 5px; diff --git a/packages/example-app/src/app/feedback/page.spec.ts b/packages/example-app/src/app/feedback/page.spec.ts index c768ace9..f2b546ea 100644 --- a/packages/example-app/src/app/feedback/page.spec.ts +++ b/packages/example-app/src/app/feedback/page.spec.ts @@ -1,5 +1,8 @@ import { TestBed, async } from '@angular/core/testing'; -import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; +import { + NgReduxTestingModule, + MockNgRedux, +} from '@angular-redux/store/testing'; import { NgRedux } from '@angular-redux/store'; import { Observable } from 'rxjs/Observable'; @@ -19,7 +22,7 @@ describe('Feedback Form Component', () => { MockNgRedux.reset(); }); - it('should keep track of the number of remaining characters left', (done) => { + it('should keep track of the number of remaining characters left', done => { const fixture = TestBed.createComponent(FeedbackFormComponent); const form = fixture.debugElement.componentInstance; @@ -31,7 +34,10 @@ describe('Feedback Form Component', () => { form.getMaxCommentChars() - 5, ]; - const feedbackCommentsStub = MockNgRedux.getSelectorStub(['feedback', 'comments']); + const feedbackCommentsStub = MockNgRedux.getSelectorStub([ + 'feedback', + 'comments', + ]); feedbackCommentsStub.next('h'); feedbackCommentsStub.next('he'); feedbackCommentsStub.next('hel'); @@ -42,8 +48,10 @@ describe('Feedback Form Component', () => { form.charsLeft$ .toArray() .subscribe( - actualSequence => expect(actualSequence).toEqual(expectedCharsLeftSequence), + actualSequence => + expect(actualSequence).toEqual(expectedCharsLeftSequence), null, - done); + done, + ); }); }); diff --git a/packages/example-app/src/app/feedback/page.ts b/packages/example-app/src/app/feedback/page.ts index c4a672f8..6c182c0f 100644 --- a/packages/example-app/src/app/feedback/page.ts +++ b/packages/example-app/src/app/feedback/page.ts @@ -5,17 +5,19 @@ import { Observable } from 'rxjs/Observable'; const MAX_COMMENT_CHARS = 300; export const charsLeft = (obs$: Observable): Observable => - obs$.map(comments => comments || '') + obs$ + .map(comments => comments || '') .map(comments => MAX_COMMENT_CHARS - comments.length); @Component({ selector: 'zoo-feedback-form', templateUrl: './page.html', - styleUrls: [ './page.css' ], + styleUrls: ['./page.css'], changeDetection: ChangeDetectionStrategy.OnPush, }) export class FeedbackFormComponent { - @select$(['feedback', 'comments'], charsLeft) readonly charsLeft$: Observable; + @select$(['feedback', 'comments'], charsLeft) + readonly charsLeft$: Observable; getMaxCommentChars = () => MAX_COMMENT_CHARS; } diff --git a/packages/example-app/src/app/lions/page.spec.ts b/packages/example-app/src/app/lions/page.spec.ts index e27141e7..52cf9615 100644 --- a/packages/example-app/src/app/lions/page.spec.ts +++ b/packages/example-app/src/app/lions/page.spec.ts @@ -1,5 +1,8 @@ import { TestBed, async } from '@angular/core/testing'; -import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; +import { + NgReduxTestingModule, + MockNgRedux, +} from '@angular-redux/store/testing'; import { Component, Input } from '@angular/core'; import { NgRedux } from '@angular-redux/store'; @@ -22,7 +25,7 @@ class MockAnimalListComponent { @Input() animals: Observable; @Input() loading: Observable; @Input() error: Observable; -}; +} describe('Lion Page Container', () => { beforeEach(() => { @@ -43,15 +46,16 @@ describe('Lion Page Container', () => { { lion1: { name: 'I am a Lion!', id: 'lion1' }, lion2: { name: 'I am a second Lion!', id: 'lion2' }, - }]; + }, + ]; const expectedSequence = [ - [ { name: 'I am a Lion!', id: 'lion1' } ], + [{ name: 'I am a Lion!', id: 'lion1' }], [ // Alphanumeric sort by name. { name: 'I am a Lion!', id: 'lion1' }, { name: 'I am a second Lion!', id: 'lion2' }, - ] + ], ]; const itemStub = MockNgRedux.getSelectorStub(['lion', 'items']); @@ -63,7 +67,8 @@ describe('Lion Page Container', () => { .subscribe( actualSequence => expect(actualSequence).toEqual(expectedSequence), null, - done); + done, + ); }); it('should know when the animals are loading', done => { @@ -78,15 +83,16 @@ describe('Lion Page Container', () => { lionPage.loading$ .toArray() .subscribe( - actualSequence => expect(actualSequence).toEqual([ false, true ]), + actualSequence => expect(actualSequence).toEqual([false, true]), null, - done); + done, + ); }); - it('should know when there\'s an error', done => { + it("should know when there's an error", done => { const fixture = TestBed.createComponent(LionPageComponent); const lionPage = fixture.debugElement.componentInstance; - const expectedSequence = [ true ]; + const expectedSequence = [true]; const lionsErrorStub = MockNgRedux.getSelectorStub(['lion', 'error']); lionsErrorStub.next(false); @@ -96,9 +102,10 @@ describe('Lion Page Container', () => { lionPage.error$ .toArray() .subscribe( - actualSequence => expect(actualSequence).toEqual([ false, true ]), + actualSequence => expect(actualSequence).toEqual([false, true]), null, - done); + done, + ); }); it('should load lions on creation', () => { diff --git a/packages/example-app/src/app/lions/page.ts b/packages/example-app/src/app/lions/page.ts index fc39aa29..599f6042 100644 --- a/packages/example-app/src/app/lions/page.ts +++ b/packages/example-app/src/app/lions/page.ts @@ -10,7 +10,9 @@ export const sortAnimals = (animalDictionary$: Observable<{}>) => animalDictionary$.map( pipe( values, - sortBy(prop('name')))); + sortBy(prop('name')), + ), + ); @Component({ templateUrl: './page.html', diff --git a/packages/example-app/src/app/module.ts b/packages/example-app/src/app/module.ts index da510d64..ee96cc5f 100644 --- a/packages/example-app/src/app/module.ts +++ b/packages/example-app/src/app/module.ts @@ -32,6 +32,6 @@ import { AppComponent } from './component'; FeedbackModule, StoreModule, ], - bootstrap: [AppComponent] + bootstrap: [AppComponent], }) export class AppModule {} diff --git a/packages/example-app/src/app/store/module.spec.ts b/packages/example-app/src/app/store/module.spec.ts index d3d328cd..223dd42b 100644 --- a/packages/example-app/src/app/store/module.spec.ts +++ b/packages/example-app/src/app/store/module.spec.ts @@ -1,5 +1,8 @@ import { NgRedux, DevToolsExtension } from '@angular-redux/store'; -import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; +import { + NgReduxTestingModule, + MockNgRedux, +} from '@angular-redux/store/testing'; import { TestBed, async, getTestBed } from '@angular/core/testing'; import { StoreModule } from './module'; import { IAppState } from './model'; @@ -12,17 +15,21 @@ describe('Store Module', () => { beforeEach(async(() => { TestBed.configureTestingModule({ - imports: [ NgReduxTestingModule ], - }).compileComponents().then(() => { - const testbed = getTestBed(); + imports: [NgReduxTestingModule], + }) + .compileComponents() + .then(() => { + const testbed = getTestBed(); - mockEpics = { - createEpics() { return [] } - } as RootEpics; + mockEpics = { + createEpics() { + return []; + }, + } as RootEpics; - devTools = testbed.get(DevToolsExtension); - mockNgRedux = MockNgRedux.getInstance(); - }); + devTools = testbed.get(DevToolsExtension); + mockNgRedux = MockNgRedux.getInstance(); + }); })); it('should configure the store when the module is loaded', async(() => { diff --git a/packages/example-app/src/app/store/module.ts b/packages/example-app/src/app/store/module.ts index fe99962d..16ac23d8 100644 --- a/packages/example-app/src/app/store/module.ts +++ b/packages/example-app/src/app/store/module.ts @@ -4,7 +4,11 @@ import { NgModule } from '@angular/core'; // @angular-redux/form and @angular-redux/router are optional // extensions that sync form and route location state between // our store and Angular. -import { NgReduxModule, NgRedux, DevToolsExtension } from '@angular-redux/store'; +import { + NgReduxModule, + NgRedux, + DevToolsExtension, +} from '@angular-redux/store'; import { NgReduxRouterModule, NgReduxRouter } from '@angular-redux/router'; import { provideReduxForms } from '@angular-redux/form'; @@ -33,8 +37,9 @@ export class StoreModule { store.configureStore( rootReducer, {}, - [ createLogger(), ...rootEpics.createEpics() ], - devTools.isEnabled() ? [ devTools.enhancer() ] : []); + [createLogger(), ...rootEpics.createEpics()], + devTools.isEnabled() ? [devTools.enhancer()] : [], + ); // Enable syncing of Angular router state with our Redux store. if (ngReduxRouter) { diff --git a/packages/example-app/src/app/store/reducers.ts b/packages/example-app/src/app/store/reducers.ts index a8f8e7a5..14aae186 100644 --- a/packages/example-app/src/app/store/reducers.ts +++ b/packages/example-app/src/app/store/reducers.ts @@ -13,4 +13,5 @@ export const rootReducer = composeReducers( elephant: createAnimalAPIReducer(ANIMAL_TYPES.ELEPHANT), lion: createAnimalAPIReducer(ANIMAL_TYPES.LION), router: routerReducer, - })); + }), +); diff --git a/packages/example-app/src/environments/environment.prod.ts b/packages/example-app/src/environments/environment.prod.ts index 3612073b..c9669790 100644 --- a/packages/example-app/src/environments/environment.prod.ts +++ b/packages/example-app/src/environments/environment.prod.ts @@ -1,3 +1,3 @@ export const environment = { - production: true + production: true, }; diff --git a/packages/example-app/src/environments/environment.ts b/packages/example-app/src/environments/environment.ts index b7f639ae..cf6bba0d 100644 --- a/packages/example-app/src/environments/environment.ts +++ b/packages/example-app/src/environments/environment.ts @@ -4,5 +4,5 @@ // The list of which env maps to which file can be found in `.angular-cli.json`. export const environment = { - production: false + production: false, }; diff --git a/packages/example-app/src/polyfills.ts b/packages/example-app/src/polyfills.ts index 53bdaf1b..0257e963 100644 --- a/packages/example-app/src/polyfills.ts +++ b/packages/example-app/src/polyfills.ts @@ -39,23 +39,17 @@ /** IE10 and IE11 requires the following to support `@angular/animation`. */ // import 'web-animations-js'; // Run `npm install --save web-animations-js`. - /** Evergreen browsers require these. **/ import 'core-js/es6/reflect'; import 'core-js/es7/reflect'; - /** ALL Firefox browsers require the following to support `@angular/animation`. **/ // import 'web-animations-js'; // Run `npm install --save web-animations-js`. - - /*************************************************************************************************** * Zone JS is required by Angular itself. */ -import 'zone.js/dist/zone'; // Included with Angular CLI. - - +import 'zone.js/dist/zone'; // Included with Angular CLI. /*************************************************************************************************** * APPLICATION IMPORTS diff --git a/packages/example-app/src/test.ts b/packages/example-app/src/test.ts index 570d4e9b..0c45c2ef 100644 --- a/packages/example-app/src/test.ts +++ b/packages/example-app/src/test.ts @@ -9,7 +9,7 @@ import 'zone.js/dist/fake-async-test'; import { getTestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, - platformBrowserDynamicTesting + platformBrowserDynamicTesting, } from '@angular/platform-browser-dynamic/testing'; // Unfortunately there's no typing for the `__karma__` variable. Just declare it as any. @@ -17,7 +17,7 @@ declare const __karma__: any; declare const require: any; // Prevent Karma from running prematurely. -__karma__.loaded = function () {}; +__karma__.loaded = function() {}; // First, initialize the Angular testing environment. getTestBed().initTestEnvironment( diff --git a/packages/example-app/src/tsconfig.json b/packages/example-app/src/tsconfig.json index 201018af..14f5afcf 100644 --- a/packages/example-app/src/tsconfig.json +++ b/packages/example-app/src/tsconfig.json @@ -11,9 +11,7 @@ "outDir": "../dist/out-tsc", "sourceMap": true, "target": "es5", - "typeRoots": [ - "../node_modules/@types" - ], + "typeRoots": ["../node_modules/@types"], "strict": true, // Causes problems for @Outputs with AoT. diff --git a/packages/example-app/src/tsconfig.spec.json b/packages/example-app/src/tsconfig.spec.json index 10fc05b3..e9754b28 100644 --- a/packages/example-app/src/tsconfig.spec.json +++ b/packages/example-app/src/tsconfig.spec.json @@ -5,19 +5,14 @@ "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, - "lib": [ - "es2016" - ], + "lib": ["es2016"], "outDir": "../out-tsc/spec", "module": "commonjs", "target": "es6", "baseUrl": "", - "types": [ - "jasmine", - "node" - ], + "types": ["jasmine", "node"], "strict": true, - + // Causes problems for @Outputs with AoT. // See https://github.com/angular/angular/issues/17131. // "noUnusedParameters": true, @@ -26,10 +21,6 @@ "forceConsistentCasingInFileNames": true, "pretty": true }, - "files": [ - "test.ts" - ], - "include": [ - "**/*.spec.ts" - ] + "files": ["test.ts"], + "include": ["**/*.spec.ts"] } diff --git a/packages/example-app/tslint.json b/packages/example-app/tslint.json index 8c0b5619..0bd85cab 100644 --- a/packages/example-app/tslint.json +++ b/packages/example-app/tslint.json @@ -1,29 +1,18 @@ { - "rulesDirectory": [ - "node_modules/codelyzer" - ], + "rulesDirectory": ["node_modules/codelyzer"], "rules": { "callable-types": true, "class-name": true, - "comment-format": [ - true, - "check-space" - ], + "comment-format": [true, "check-space"], "curly": true, "eofline": true, "forin": true, "import-blacklist": [true, "rxjs"], "import-spacing": true, - "indent": [ - true, - "spaces" - ], + "indent": [true, "spaces"], "interface-over-type-literal": true, "label-position": true, - "max-line-length": [ - true, - 140 - ], + "max-line-length": [true, 140], "member-access": false, "member-ordering": [ true, @@ -32,14 +21,7 @@ ], "no-arg": true, "no-bitwise": true, - "no-console": [ - true, - "debug", - "info", - "time", - "timeEnd", - "trace" - ], + "no-console": [true, "debug", "info", "time", "timeEnd", "trace"], "no-construct": true, "no-debugger": true, "no-duplicate-variable": true, @@ -64,18 +46,10 @@ "check-whitespace" ], "prefer-const": true, - "quotemark": [ - true, - "single" - ], + "quotemark": [true, "single"], "radix": true, - "semicolon": [ - "always" - ], - "triple-equals": [ - true, - "allow-null-check" - ], + "semicolon": ["always"], + "triple-equals": [true, "allow-null-check"], "typedef-whitespace": [ true, { diff --git a/packages/form/CHANGELOG.md b/packages/form/CHANGELOG.md index 4c7f50df..2da14ef2 100644 --- a/packages/form/CHANGELOG.md +++ b/packages/form/CHANGELOG.md @@ -2,8 +2,8 @@ # 6.5.1 - Support typescript unused checks -* https://github.com/angular-redux/form/pull/32 -* Minor README updates. +- https://github.com/angular-redux/form/pull/32 +- Minor README updates. # 6.5.0 - Added support for non-template forms. @@ -29,7 +29,7 @@ have reported. # 6.0.0 - The big-rename. Due to the impending release of Angular4, the name 'ng2-redux' no longer makes -a ton of sense. The Angular folks have moved to a model where all versions are +a ton of sense. The Angular folks have moved to a model where all versions are just called 'Angular', and we should match that. After discussion with the other maintainers, we decided that since we have to @@ -39,17 +39,17 @@ the feature set in a coherent but decoupled way. As of v6, the following packages are deprecated: -* ng2-redux -* ng2-redux-router -* ng2-redux-form +- ng2-redux +- ng2-redux-router +- ng2-redux-form Those packages will still be available on npm for as long as they are being used. However we have published the same code under a new package naming scheme: -* @angular-redux/store (formerly ng2-redux) -* @angular-redux/router (formerly ng2-redux-router) -* @angular-redux/form (formerly ng2-redux-form). +- @angular-redux/store (formerly ng2-redux) +- @angular-redux/router (formerly ng2-redux-router) +- @angular-redux/form (formerly ng2-redux-form). We have also decided that it's easier to reason about things if these packages align at least on major versions. So everything has at this point been bumped @@ -59,6 +59,6 @@ to 6.0.0. Apart from the rename, the following API changes are noted: -* @angular-redux/store: none. -* @angular-redux/router: none. -* @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for consistency. +- @angular-redux/store: none. +- @angular-redux/router: none. +- @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for consistency. diff --git a/packages/form/ISSUE_TEMPLATE.md b/packages/form/ISSUE_TEMPLATE.md index 3378f4a9..09fe27e9 100644 --- a/packages/form/ISSUE_TEMPLATE.md +++ b/packages/form/ISSUE_TEMPLATE.md @@ -1,17 +1,17 @@ ### This is a... -* [ ] feature request -* [ ] bug report -* [ ] usage question +- [ ] feature request +- [ ] bug report +- [ ] usage question ### What toolchain are you using for transpilation/bundling? -* [ ] @angular/cli -* [ ] Custom @ngTools/webpack -* [ ] Raw `ngc` -* [ ] SystemJS -* [ ] Rollup -* [ ] Other +- [ ] @angular/cli +- [ ] Custom @ngTools/webpack +- [ ] Raw `ngc` +- [ ] SystemJS +- [ ] Rollup +- [ ] Other ### Environment @@ -23,19 +23,15 @@ Angular Version: OS: ### Link to repo showing the issus + (optional, but helps _a lot_) ### Expected Behaviour: - - ### Actual Behaviour: - - ### Stack Trace/Error Message: - - ### Additional Notes: + (optional) diff --git a/packages/form/README.md b/packages/form/README.md index 1fec2abb..edf47af7 100644 --- a/packages/form/README.md +++ b/packages/form/README.md @@ -71,7 +71,7 @@ import { NgReduxFormModule } from '@angular-redux/form'; NgReduxFormModule, NgReduxModule, ], - bootstrap: [MyApplicationComponent] + bootstrap: [MyApplicationComponent], }) export class ExampleModule {} ``` @@ -80,22 +80,15 @@ Or if you are using Redux without `@angular-redux/store`, then your bootstrap ca more like this (substitute your own store creation code): ```typescript -import {provideReduxForms} from '@angular-redux/form'; +import { provideReduxForms } from '@angular-redux/form'; const storeCreator = compose(applyMiddleware(logger))(createStore); -const store = create(reducers, {}); +const store = create(reducers, {}); @NgModule({ - imports: [ - BrowserModule, - ReactiveFormsModule, - FormsModule, - NgReduxFormModule, - ], - providers: [ - provideReduxForms(store), - ], - bootstrap: [MyApplicationComponent] + imports: [BrowserModule, ReactiveFormsModule, FormsModule, NgReduxFormModule], + providers: [provideReduxForms(store)], + bootstrap: [MyApplicationComponent], }) export class ExampleModule {} ``` @@ -108,7 +101,7 @@ basic: ```typescript export interface AbstractStore { /// Dispatch an action - dispatch(action: Action & {payload?}): void; + dispatch(action: Action & { payload? }): void; /// Retrieve the current application state getState(): RootState; @@ -210,6 +203,7 @@ From there, `@angular-redux/form` is able to take that path and extract the valu that element from the Redux state. #### Reactive Forms + The value in "connect" attribute is the value that will show up in the Redux store. The formGroup value is the name of the object in your code that represents the form group. ```html @@ -240,14 +234,14 @@ your data when the user updates form inputs, then you should use this default re To use it, you need to combine it with your existing reducers like so: ```typescript -import {composeReducers, defaultFormReducer} from '@angular-redux/form'; +import { composeReducers, defaultFormReducer } from '@angular-redux/form'; const reducer = composeReducers( defaultFormReducer(), combineReducers({ foo: fooReducer, - bar: barReducer - }) + bar: barReducer, + }), ); ``` diff --git a/packages/form/karma.conf.js b/packages/form/karma.conf.js index 2ff9b8e5..d75142ac 100644 --- a/packages/form/karma.conf.js +++ b/packages/form/karma.conf.js @@ -5,15 +5,12 @@ process.env.TEST = true; const loaders = require('./webpack/loaders'); const plugins = require('./webpack/plugins'); -module.exports = (config) => { +module.exports = config => { const coverage = config.singleRun ? ['coverage'] : []; const logLevel = config.singleRun ? config.LOG_INFO : config.LOG_DEBUG; config.set({ - frameworks: [ - 'jasmine', - 'chai', - ], + frameworks: ['jasmine', 'chai'], plugins: [ 'karma-jasmine', @@ -39,14 +36,8 @@ module.exports = (config) => { ], preprocessors: { - '**/*.ts': [ - 'webpack', - 'sourcemap', - 'transformPath', - ], - '**/!(*.test|tests.*).(ts|js)': [ - 'sourcemap', - ], + '**/*.ts': ['webpack', 'sourcemap', 'transformPath'], + '**/!(*.test|tests.*).(ts|js)': ['sourcemap'], }, transformPathPreprocessor: { @@ -61,7 +52,9 @@ module.exports = (config) => { extensions: ['.webpack.js', '.web.js', '.js', '.ts'], }, module: { - rules: combinedLoaders().concat(config.singleRun ? [loaders.istanbulInstrumenter] : []) + rules: combinedLoaders().concat( + config.singleRun ? [loaders.istanbulInstrumenter] : [], + ), }, stats: { colors: true, reasons: true }, }, @@ -80,35 +73,35 @@ module.exports = (config) => { }, coverageReporter: { - reporters: [ - { type: 'json' }, - ], + reporters: [{ type: 'json' }], subdir: b => b.toLowerCase().split(/[ /-]/)[0], }, - logLevel: logLevel, + logLevel: logLevel, autoWatch: config.singleRun === false, - browsers: [ - 'Chrome', - ], + browsers: ['Chrome'], }); }; function combinedLoaders() { return Object.keys(loaders).reduce(function reduce(aggregate, k) { switch (k) { - case 'istanbulInstrumenter': - return aggregate; - case 'ts': - return aggregate.concat([ // force inline source maps - Object.assign(loaders[k], - { query: { babelOptions: { sourceMaps: 'both' }, skipDeclarationFilesCheck: true } })]); - default: - return aggregate.concat([loaders[k]]); + case 'istanbulInstrumenter': + return aggregate; + case 'ts': + return aggregate.concat([ + // force inline source maps + Object.assign(loaders[k], { + query: { + babelOptions: { sourceMaps: 'both' }, + skipDeclarationFilesCheck: true, + }, + }), + ]); + default: + return aggregate.concat([loaders[k]]); } - }, - []); + }, []); } - diff --git a/packages/form/source/compose-reducers.test.ts b/packages/form/source/compose-reducers.test.ts index 81372a19..39933f9a 100644 --- a/packages/form/source/compose-reducers.test.ts +++ b/packages/form/source/compose-reducers.test.ts @@ -1,14 +1,8 @@ -import {expect} from 'chai'; +import { expect } from 'chai'; -import { - fromJS, - List, - Map, - OrderedSet, - Set -} from 'immutable'; +import { fromJS, List, Map, OrderedSet, Set } from 'immutable'; -import {composeReducers} from './compose-reducers'; +import { composeReducers } from './compose-reducers'; describe('composeReducers', () => { const compose = (s1, s2, s3) => { @@ -18,32 +12,48 @@ describe('composeReducers', () => { const reducer = composeReducers(r1, r2, r3); - return reducer(undefined, {type: ''}); + return reducer(undefined, { type: '' }); }; it('can compose plain-object initial states', () => { - const state = compose({a: 1}, {b: 1}, {c: 1}); + const state = compose( + { a: 1 }, + { b: 1 }, + { c: 1 }, + ); expect(state).not.to.be.undefined; - expect(state).to.deep.equal({a: 1, b: 1, c: 1}); + expect(state).to.deep.equal({ a: 1, b: 1, c: 1 }); }); it('can compose array states', () => { - const state = compose([1], [2], [3]); + const state = compose( + [1], + [2], + [3], + ); expect(state).not.to.be.undefined; expect(state).to.deep.equal([1, 2, 3]); }); it('can compose Immutable::Map initial states', () => { - const state = compose(fromJS({a: 1}), fromJS({b: 1}), fromJS({c: 1})); + const state = compose( + fromJS({ a: 1 }), + fromJS({ b: 1 }), + fromJS({ c: 1 }), + ); expect(Map.isMap(state)).to.be.true; const plain = state.toJS(); expect(plain).not.to.be.null; - expect(plain).to.deep.equal({a: 1, b: 1, c: 1}); + expect(plain).to.deep.equal({ a: 1, b: 1, c: 1 }); }); it('can compose Immutable::Set initial states', () => { - const state = compose(Set.of(1, 2, 3), Set.of(4, 5, 6), Set.of()); + const state = compose( + Set.of(1, 2, 3), + Set.of(4, 5, 6), + Set.of(), + ); expect(Set.isSet(state)).to.be.true; const plain = state.toJS(); @@ -52,7 +62,11 @@ describe('composeReducers', () => { }); it('can compose Immutable::OrderedSet initial states', () => { - const state = compose(Set.of(3, 2, 1), Set.of(4, 6, 5), Set.of()); + const state = compose( + Set.of(3, 2, 1), + Set.of(4, 6, 5), + Set.of(), + ); expect(Set.isSet(state)).to.be.true; const plain = state.toJS(); @@ -61,7 +75,11 @@ describe('composeReducers', () => { }); it('can compose Immutable::List initial states', () => { - const state = compose(List.of('a', 'b'), List.of('c', 'd'), List.of()); + const state = compose( + List.of('a', 'b'), + List.of('c', 'd'), + List.of(), + ); expect(List.isList(state)).to.be.true; const plain = state.toJS(); diff --git a/packages/form/source/compose-reducers.ts b/packages/form/source/compose-reducers.ts index baf3a3a6..b24cd522 100644 --- a/packages/form/source/compose-reducers.ts +++ b/packages/form/source/compose-reducers.ts @@ -1,6 +1,6 @@ -import {Reducer, AnyAction} from 'redux'; +import { Reducer, AnyAction } from 'redux'; -export const composeReducers = - (...reducers: Reducer[]): Reducer => - (s: any, action: AnyAction) => - reducers.reduce((st, reducer) => reducer(st, action), s); +export const composeReducers = ( + ...reducers: Reducer[] +): Reducer => (s: any, action: AnyAction) => + reducers.reduce((st, reducer) => reducer(st, action), s); diff --git a/packages/form/source/configure.ts b/packages/form/source/configure.ts index 9cbc9a76..fdbd7cca 100644 --- a/packages/form/source/configure.ts +++ b/packages/form/source/configure.ts @@ -1,12 +1,6 @@ -import { - Action, - Store, -} from 'redux'; +import { Action, Store } from 'redux'; -import { - AbstractStore, - FormStore, -} from './form-store'; +import { AbstractStore, FormStore } from './form-store'; /// Use this function in your providers list if you are not using @angular-redux/core. /// This will allow you to provide a preexisting store that you have already @@ -14,18 +8,16 @@ import { export const provideReduxForms = (store: Store | any) => { const abstractStore = wrap(store); - return [ - {provide: FormStore, useValue: new FormStore( abstractStore)} - ]; + return [{ provide: FormStore, useValue: new FormStore(abstractStore) }]; }; const wrap = (store: Store | any): AbstractStore => { const dispatch = (action: Action) => store.dispatch(action); - const getState = () => store.getState(); + const getState = () => store.getState(); - const subscribe = - (fn: (state: T) => void) => store.subscribe(() => fn(store.getState())); + const subscribe = (fn: (state: T) => void) => + store.subscribe(() => fn(store.getState())); - return {dispatch, getState, subscribe}; + return { dispatch, getState, subscribe }; }; diff --git a/packages/form/source/connect-array/connect-array.ts b/packages/form/source/connect-array/connect-array.ts index 43f0a73d..7c33db9c 100644 --- a/packages/form/source/connect-array/connect-array.ts +++ b/packages/form/source/connect-array/connect-array.ts @@ -22,36 +22,27 @@ import { ControlContainer, } from '@angular/forms'; -import { - AsyncValidatorFn, - ValidatorFn, - Validators, -} from '@angular/forms'; -import { - NG_ASYNC_VALIDATORS, - NG_VALIDATORS -} from '@angular/forms'; -import {Unsubscribe} from 'redux'; +import { AsyncValidatorFn, ValidatorFn, Validators } from '@angular/forms'; +import { NG_ASYNC_VALIDATORS, NG_VALIDATORS } from '@angular/forms'; +import { Unsubscribe } from 'redux'; -import {ConnectBase} from '../connect'; -import {FormStore} from '../form-store'; -import {State} from '../state'; -import {controlPath} from '../shims'; +import { ConnectBase } from '../connect'; +import { FormStore } from '../form-store'; +import { State } from '../state'; +import { controlPath } from '../shims'; export class ConnectArrayTemplate { - constructor( - public $implicit: any, - public index: number, - public item: any - ) {} + constructor(public $implicit: any, public index: number, public item: any) {} } @Directive({ selector: '[connectArray]', - providers: [{ - provide: ControlContainer, - useExisting: forwardRef(() => ConnectArray) - }] + providers: [ + { + provide: ControlContainer, + useExisting: forwardRef(() => ConnectArray), + }, + ], }) export class ConnectArray extends ControlContainer implements OnInit { private stateSubscription: Unsubscribe; @@ -61,9 +52,18 @@ export class ConnectArray extends ControlContainer implements OnInit { private key?: string; constructor( - @Optional() @Host() @SkipSelf() private parent: ControlContainer, - @Optional() @Self() @Inject(NG_VALIDATORS) private rawValidators: any[], - @Optional() @Self() @Inject(NG_ASYNC_VALIDATORS) private rawAsyncValidators: any[], + @Optional() + @Host() + @SkipSelf() + private parent: ControlContainer, + @Optional() + @Self() + @Inject(NG_VALIDATORS) + private rawValidators: any[], + @Optional() + @Self() + @Inject(NG_ASYNC_VALIDATORS) + private rawAsyncValidators: any[], private connection: ConnectBase, private templateRef: TemplateRef, private viewContainerRef: ViewContainerRef, @@ -71,7 +71,9 @@ export class ConnectArray extends ControlContainer implements OnInit { ) { super(); - this.stateSubscription = this.store.subscribe(state => this.resetState(state)); + this.stateSubscription = this.store.subscribe(state => + this.resetState(state), + ); this.registerInternals(this.array); } @@ -84,7 +86,7 @@ export class ConnectArray extends ControlContainer implements OnInit { } ngOnInit() { - this.formDirective.addControl( this); + this.formDirective.addControl(this); } get name(): string { @@ -100,9 +102,7 @@ export class ConnectArray extends ControlContainer implements OnInit { } get path(): Array { - return this.key ? - controlPath(this.key, this.parent) : - []; + return this.key ? controlPath(this.key, this.parent) : []; } get validator(): ValidatorFn | null { @@ -118,11 +118,11 @@ export class ConnectArray extends ControlContainer implements OnInit { ngOnDestroy() { this.viewContainerRef.clear(); - if (this.key){ + if (this.key) { this.formDirective.form.removeControl(this.key); } - this.stateSubscription() + this.stateSubscription(); } private resetState(state: any) { @@ -135,33 +135,37 @@ export class ConnectArray extends ControlContainer implements OnInit { let index = 0; for (const value of iterable) { - var viewRef = this.viewContainerRef.length > index - ? >this.viewContainerRef.get(index) - : null; + var viewRef = + this.viewContainerRef.length > index + ? >( + this.viewContainerRef.get(index) + ) + : null; if (viewRef == null) { - const viewRef = this.viewContainerRef.createEmbeddedView( - this.templateRef, - new ConnectArrayTemplate( - index, - index, - value), - index); + const viewRef = this.viewContainerRef.createEmbeddedView< + ConnectArrayTemplate + >( + this.templateRef, + new ConnectArrayTemplate(index, index, value), + index, + ); this.patchDescendantControls(viewRef); - this.array.insert(index, this.transform(this.array, viewRef.context.item)); - } - else { - Object.assign(viewRef.context, - new ConnectArrayTemplate( - index, - index, - value)); + this.array.insert( + index, + this.transform(this.array, viewRef.context.item), + ); + } else { + Object.assign( + viewRef.context, + new ConnectArrayTemplate(index, index, value), + ); } ++index; - }; + } while (this.viewContainerRef.length > index) { this.viewContainerRef.remove(this.viewContainerRef.length - 1); @@ -199,7 +203,10 @@ export class ConnectArray extends ControlContainer implements OnInit { }); } - private transform(parent: FormGroup | FormArray, reference: any): AbstractControl { + private transform( + parent: FormGroup | FormArray, + reference: any, + ): AbstractControl { const emptyControl = () => { const control = new FormControl(null); control.setParent(parent); @@ -231,14 +238,14 @@ export class ConnectArray extends ControlContainer implements OnInit { } for (const value of iterable) { - const transformed = this.transform(array, value) + const transformed = this.transform(array, value); if (transformed) { array.push(transformed); } } return array; - } + }; const associate = (value: any): FormGroup => { const group = new FormGroup({}); @@ -255,20 +262,17 @@ export class ConnectArray extends ControlContainer implements OnInit { }; if (Array.isArray(reference)) { - return iterate(> reference); - } - else if (reference instanceof Set) { - return iterate(> reference); - } - else if (reference instanceof Map) { - return associate(> reference); - } - else if (reference instanceof Object) { + return iterate(>reference); + } else if (reference instanceof Set) { + return iterate(>reference); + } else if (reference instanceof Map) { + return associate(>reference); + } else if (reference instanceof Object) { return associate(reference); - } - else { + } else { throw new Error( - `Cannot convert object of type ${typeof reference} / ${reference.toString()} to form element`); + `Cannot convert object of type ${typeof reference} / ${reference.toString()} to form element`, + ); } } } diff --git a/packages/form/source/connect/connect-base.ts b/packages/form/source/connect/connect-base.ts index 4552cb3f..153a7d53 100644 --- a/packages/form/source/connect/connect-base.ts +++ b/packages/form/source/connect/connect-base.ts @@ -23,7 +23,6 @@ export interface ControlPair { } export class ConnectBase { - @Input('connect') connect?: () => (string | number) | Array; private stateSubscription?: Unsubscribe; @@ -32,9 +31,8 @@ export class ConnectBase { protected form: any; public get path(): Array { - const path = typeof this.connect === 'function' - ? this.connect() - : this.connect; + const path = + typeof this.connect === 'function' ? this.connect() : this.connect; switch (typeof path) { case 'object': @@ -46,8 +44,11 @@ export class ConnectBase { } case 'string': return (path).split(/\./g); - default: // fallthrough above (no break) - throw new Error(`Cannot determine path to object: ${JSON.stringify(path)}`); + default: + // fallthrough above (no break) + throw new Error( + `Cannot determine path to object: ${JSON.stringify(path)}`, + ); } } @@ -77,7 +78,10 @@ export class ConnectBase { }); } - private descendants(path: Array, formElement: any): Array { + private descendants( + path: Array, + formElement: any, + ): Array { const pairs = new Array(); if (formElement instanceof FormArray) { @@ -85,23 +89,28 @@ export class ConnectBase { for (const d of this.descendants((path).concat([index]), c)) { pairs.push(d); } - }) - } - else if (formElement instanceof FormGroup) { + }); + } else if (formElement instanceof FormGroup) { for (const k of Object.keys(formElement.controls)) { - pairs.push({ path: path.concat([k]), control: formElement.controls[k] }); + pairs.push({ + path: path.concat([k]), + control: formElement.controls[k], + }); } - } - else if (formElement instanceof NgControl || formElement instanceof FormControl) { + } else if ( + formElement instanceof NgControl || + formElement instanceof FormControl + ) { return [{ path: path, control: formElement }]; - } - else { - throw new Error(`Unknown type of form element: ${formElement.constructor.name}`); + } else { + throw new Error( + `Unknown type of form element: ${formElement.constructor.name}`, + ); } return pairs.filter(p => { - const parent = (p.control as any)._parent; - return parent === this.form.control || parent === this.form; + const parent = (p.control as any)._parent; + return parent === this.form.control || parent === this.form; }); } @@ -109,8 +118,7 @@ export class ConnectBase { var formElement; if (this.form.control === undefined) { formElement = this.form; - } - else { + } else { formElement = this.form.control; } diff --git a/packages/form/source/connect/connect-reactive.ts b/packages/form/source/connect/connect-reactive.ts index c7b62ba9..a986b26c 100644 --- a/packages/form/source/connect/connect-reactive.ts +++ b/packages/form/source/connect/connect-reactive.ts @@ -1,20 +1,15 @@ -import { - Directive, - Input, -} from '@angular/core'; +import { Directive, Input } from '@angular/core'; -import {FormStore} from '../form-store'; +import { FormStore } from '../form-store'; -import {ConnectBase} from './connect-base'; +import { ConnectBase } from './connect-base'; // For reactive forms (without implicit NgForm) @Directive({ selector: 'form[connect][formGroup]' }) export class ReactiveConnect extends ConnectBase { @Input('formGroup') form: any; - constructor( - protected store: FormStore - ) { + constructor(protected store: FormStore) { super(); } } diff --git a/packages/form/source/connect/connect.test.ts b/packages/form/source/connect/connect.test.ts index 40f1012c..3e52dd80 100644 --- a/packages/form/source/connect/connect.test.ts +++ b/packages/form/source/connect/connect.test.ts @@ -6,10 +6,7 @@ import { inject, tick, } from '@angular/core/testing'; -import { - Component, - Input, -} from '@angular/core'; +import { Component, Input } from '@angular/core'; import { FormsModule, ReactiveFormsModule, @@ -26,15 +23,12 @@ import { createStore, } from 'redux'; -import {composeReducers} from './compose-reducers'; -import {defaultFormReducer} from './form-reducer'; -import {provideReduxForms} from './configure'; -import {NgReduxFormModule} from './module'; +import { composeReducers } from './compose-reducers'; +import { defaultFormReducer } from './form-reducer'; +import { provideReduxForms } from './configure'; +import { NgReduxFormModule } from './module'; -import { - logger, - simulateUserTyping, -} from './tests.utilities'; +import { logger, simulateUserTyping } from './tests.utilities'; interface AppState { fooState?: FooState; @@ -44,7 +38,7 @@ interface FooState { example: string; deepInside: { foo: string; - } + }; bar: string; checkExample: boolean; } @@ -52,21 +46,22 @@ interface FooState { const initialState: FooState = { example: 'Test!', deepInside: { - foo: 'Bar!' + foo: 'Bar!', }, bar: 'two', checkExample: true, }; -const testReducer = (state = initialState, action = {type: ''}) => { +const testReducer = (state = initialState, action = { type: '' }) => { return state; -} +}; const reducers = composeReducers( combineReducers({ - fooState: testReducer + fooState: testReducer, }), - defaultFormReducer()); + defaultFormReducer(), +); @Component({ selector: 'test-component-1', @@ -118,7 +113,7 @@ export class SelectComponent {}
- ` + `, }) export class UpdateTextComponent {} @@ -128,20 +123,14 @@ describe('connect directive', () => { beforeEach(done => { const create = compose(applyMiddleware(logger))(createStore); - store = create(reducers, {}); + store = create(reducers, {}); TestBed.configureCompiler({ - providers: [ - {provide: ComponentFixtureNoNgZone, useValue: true}, - ] + providers: [{ provide: ComponentFixtureNoNgZone, useValue: true }], }); TestBed.configureTestingModule({ - imports: [ - FormsModule, - ReactiveFormsModule, - NgReduxFormModule, - ], + imports: [FormsModule, ReactiveFormsModule, NgReduxFormModule], declarations: [ BasicUsageComponent, DeepConnectComponent, @@ -149,29 +138,31 @@ describe('connect directive', () => { SelectComponent, UpdateTextComponent, ], - providers: [ - provideReduxForms(store), - ] + providers: [provideReduxForms(store)], }); TestBed.compileComponents().then(() => done()); }); - it('should bind all form controls to application state', - fakeAsync(inject([], () => { - const fixture = TestBed.createComponent(BasicUsageComponent); - fixture.detectChanges(); - - tick(); - flushMicrotasks(); + it( + 'should bind all form controls to application state', + fakeAsync( + inject([], () => { + const fixture = TestBed.createComponent(BasicUsageComponent); + fixture.detectChanges(); - const textbox = fixture.nativeElement.querySelector('input'); - expect(textbox.value).toEqual('Test!'); - }))); + tick(); + flushMicrotasks(); - it('should bind a form control to element deep inside application state', - () => { - return fakeAsync(inject([], () => { + const textbox = fixture.nativeElement.querySelector('input'); + expect(textbox.value).toEqual('Test!'); + }), + ), + ); + + it('should bind a form control to element deep inside application state', () => { + return fakeAsync( + inject([], () => { const fixture = TestBed.createComponent(DeepConnectComponent); fixture.detectChanges(); @@ -180,55 +171,67 @@ describe('connect directive', () => { const textbox = fixture.nativeElement.querySelector('input'); expect(textbox.value).toEqual('Bar!'); - })); - }); - - it('should bind a checkbox to a boolean state', - fakeAsync(inject([], () => { - const fixture = TestBed.createComponent(CheckboxComponent); - fixture.detectChanges(); - - tick(); - flushMicrotasks(); - - const checkbox = fixture.nativeElement.querySelector('input[type="checkbox"]'); - expect(checkbox.checked).toEqual(true); - }))); + }), + ); + }); - it('should bind a select dropdown to application state', - fakeAsync(inject([], () => { - const fixture = TestBed.createComponent(SelectComponent); - fixture.detectChanges(); + it( + 'should bind a checkbox to a boolean state', + fakeAsync( + inject([], () => { + const fixture = TestBed.createComponent(CheckboxComponent); + fixture.detectChanges(); - tick(); - flushMicrotasks(); + tick(); + flushMicrotasks(); - const select = fixture.nativeElement.querySelector('select'); - expect(select.value).toEqual('two'); + const checkbox = fixture.nativeElement.querySelector( + 'input[type="checkbox"]', + ); + expect(checkbox.checked).toEqual(true); + }), + ), + ); + + it( + 'should bind a select dropdown to application state', + fakeAsync( + inject([], () => { + const fixture = TestBed.createComponent(SelectComponent); + fixture.detectChanges(); - // TODO(cbond): How to simulate a click-select sequence on this control? - // Just updating `value' does not appear to invoke all of the Angular - // change routines and therefore does not update Redux. But manually clicking - // and selecting does. Need to find a way to simulate that sequence. - }))); + tick(); + flushMicrotasks(); - it('should update Redux state when the user changes the value of a control', - fakeAsync(inject([], () => { - const fixture = TestBed.createComponent(UpdateTextComponent); - fixture.detectChanges(); + const select = fixture.nativeElement.querySelector('select'); + expect(select.value).toEqual('two'); + + // TODO(cbond): How to simulate a click-select sequence on this control? + // Just updating `value' does not appear to invoke all of the Angular + // change routines and therefore does not update Redux. But manually clicking + // and selecting does. Need to find a way to simulate that sequence. + }), + ), + ); + + it( + 'should update Redux state when the user changes the value of a control', + fakeAsync( + inject([], () => { + const fixture = TestBed.createComponent(UpdateTextComponent); + fixture.detectChanges(); - tick(); - flushMicrotasks(); + tick(); + flushMicrotasks(); - // validate initial data before we do the UI tests - let state = store.getState(); - expect(state.fooState.bar).toEqual('two'); + // validate initial data before we do the UI tests + let state = store.getState(); + expect(state.fooState.bar).toEqual('two'); - const textbox = fixture.nativeElement.querySelector('input'); - expect(textbox.value).toEqual('two'); + const textbox = fixture.nativeElement.querySelector('input'); + expect(textbox.value).toEqual('two'); - return simulateUserTyping(textbox, 'abc') - .then(() => { + return simulateUserTyping(textbox, 'abc').then(() => { tick(); flushMicrotasks(); @@ -237,5 +240,7 @@ describe('connect directive', () => { state = store.getState(); expect(state.fooState.bar).toEqual('twoabc'); }); - }))); + }), + ), + ); }); diff --git a/packages/form/source/connect/connect.ts b/packages/form/source/connect/connect.ts index e8fb5f64..69da4f66 100644 --- a/packages/form/source/connect/connect.ts +++ b/packages/form/source/connect/connect.ts @@ -2,18 +2,13 @@ import { Directive } from '@angular/core'; import { NgForm } from '@angular/forms'; -import {FormStore} from '../form-store'; -import {ConnectBase} from './connect-base'; - +import { FormStore } from '../form-store'; +import { ConnectBase } from './connect-base'; // For template forms (with implicit NgForm) @Directive({ selector: 'form[connect]:not([formGroup])' }) export class Connect extends ConnectBase { - - constructor( - protected store: FormStore, - protected form: NgForm - ) { + constructor(protected store: FormStore, protected form: NgForm) { super(); } } diff --git a/packages/form/source/form-exception.ts b/packages/form/source/form-exception.ts index 1fb4f421..ddbfcc30 100644 --- a/packages/form/source/form-exception.ts +++ b/packages/form/source/form-exception.ts @@ -2,4 +2,4 @@ export class FormException extends Error { constructor(msg: string) { super(msg); } -} \ No newline at end of file +} diff --git a/packages/form/source/form-reducer.ts b/packages/form/source/form-reducer.ts index e6f908b4..aff7bbfd 100644 --- a/packages/form/source/form-reducer.ts +++ b/packages/form/source/form-reducer.ts @@ -1,23 +1,25 @@ -import {Iterable} from 'immutable'; +import { Iterable } from 'immutable'; -import {Action} from 'redux'; +import { Action } from 'redux'; -import {FORM_CHANGED} from './form-store'; +import { FORM_CHANGED } from './form-store'; -import {State} from './state'; +import { State } from './state'; -export const defaultFormReducer = (initialState?: RootState | Iterable.Keyed) => { - const reducer = (state: RootState | Iterable.Keyed | undefined = initialState, action: Action & {payload?: any}) => { +export const defaultFormReducer = ( + initialState?: RootState | Iterable.Keyed, +) => { + const reducer = ( + state: RootState | Iterable.Keyed | undefined = initialState, + action: Action & { payload?: any }, + ) => { switch (action.type) { case FORM_CHANGED: - return State.assign( - state, - action.payload.path, - action.payload.value); + return State.assign(state, action.payload.path, action.payload.value); default: return state; } - } + }; return reducer; }; diff --git a/packages/form/source/form-store.ts b/packages/form/source/form-store.ts index 43af6428..07b0db20 100644 --- a/packages/form/source/form-store.ts +++ b/packages/form/source/form-store.ts @@ -1,14 +1,14 @@ -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; -import {NgForm} from '@angular/forms'; +import { NgForm } from '@angular/forms'; -import {NgRedux} from '@angular-redux/store'; +import { NgRedux } from '@angular-redux/store'; -import {Action, Unsubscribe} from 'redux'; +import { Action, Unsubscribe } from 'redux'; export interface AbstractStore { /// Dispatch an action - dispatch(action: Action & {payload: any}): void; + dispatch(action: Action & { payload: any }): void; /// Retrieve the current application state getState(): RootState; @@ -45,8 +45,8 @@ export class FormStore { path, form, valid: form.valid === true, - value - } + value, + }, }); } } diff --git a/packages/form/source/module.ts b/packages/form/source/module.ts index 2e88e5ed..af687989 100644 --- a/packages/form/source/module.ts +++ b/packages/form/source/module.ts @@ -1,10 +1,10 @@ -import {NgModule} from '@angular/core'; -import {FormsModule, ReactiveFormsModule} from '@angular/forms'; -import {NgRedux} from '@angular-redux/store'; +import { NgModule } from '@angular/core'; +import { FormsModule, ReactiveFormsModule } from '@angular/forms'; +import { NgRedux } from '@angular-redux/store'; -import {NgReduxFormConnectModule} from './connect'; -import {NgReduxFormConnectArrayModule} from './connect-array'; -import {FormStore} from './form-store'; +import { NgReduxFormConnectModule } from './connect'; +import { NgReduxFormConnectArrayModule } from './connect-array'; +import { FormStore } from './form-store'; export function formStoreFactory(ngRedux: NgRedux) { return new FormStore(ngRedux); @@ -17,10 +17,7 @@ export function formStoreFactory(ngRedux: NgRedux) { NgReduxFormConnectModule, NgReduxFormConnectArrayModule, ], - exports: [ - NgReduxFormConnectModule, - NgReduxFormConnectArrayModule - ], + exports: [NgReduxFormConnectModule, NgReduxFormConnectArrayModule], providers: [ { provide: FormStore, diff --git a/packages/form/source/shims.ts b/packages/form/source/shims.ts index 0cf1932b..eac49453 100644 --- a/packages/form/source/shims.ts +++ b/packages/form/source/shims.ts @@ -18,6 +18,8 @@ const BUILTIN_ACCESSORS = [ RadioControlValueAccessor, ]; -export function isBuiltInAccessor(valueAccessor: ControlValueAccessor): boolean { +export function isBuiltInAccessor( + valueAccessor: ControlValueAccessor, +): boolean { return BUILTIN_ACCESSORS.some(a => valueAccessor.constructor === a); } diff --git a/packages/form/source/state.ts b/packages/form/source/state.ts index 671d2883..b431da0c 100644 --- a/packages/form/source/state.ts +++ b/packages/form/source/state.ts @@ -1,6 +1,6 @@ -import {Iterable, Map as ImmutableMap} from 'immutable'; +import { Iterable, Map as ImmutableMap } from 'immutable'; -import {FormException} from './form-exception'; +import { FormException } from './form-exception'; export interface Operations { /// Shallow clone the object @@ -14,7 +14,12 @@ export interface Operations { } export interface TraverseCallback { - (parent: any, key: number | string, remainingPath: string[], value?: any): any; + ( + parent: any, + key: number | string, + remainingPath: string[], + value?: any, + ): any; } export abstract class State { @@ -25,23 +30,27 @@ export abstract class State { const parent = deepValue; if (Iterable.isIterable(deepValue)) { - const m = > deepValue; + const m = >(deepValue); if (typeof m.get === 'function') { - deepValue = m.get(k); + deepValue = m.get(k); + } else { + throw new FormException( + `Cannot retrieve value from immutable nonassociative container: ${k}`, + ); } - else { - throw new FormException(`Cannot retrieve value from immutable nonassociative container: ${k}`); - } - } - else if (deepValue instanceof Map) { - deepValue = (> deepValue).get(k); - } - else { + } else if (deepValue instanceof Map) { + deepValue = (>(deepValue)).get(k); + } else { deepValue = (deepValue as any)[k]; } if (typeof fn === 'function') { - const transformed = fn(parent, k, path.slice(path.indexOf(k) + 1), deepValue); + const transformed = fn( + parent, + k, + path.slice(path.indexOf(k) + 1), + deepValue, + ); deepValue = transformed[k]; @@ -79,19 +88,22 @@ export abstract class State { // to offer the best performance: we can shallow clone everything that has // not been modified, and {deep clone + update} the path down to the value // that we wish to update. - State.traverse(root, path, + State.traverse( + root, + path, (parent, key: number | string, remainingPath: string[], innerValue?) => { const parentOperations = State.inspect(parent); if (innerValue) { const innerOperations = State.inspect(innerValue); - return parentOperations.update(key, + return parentOperations.update( + key, remainingPath.length > 0 ? innerOperations.clone() - : innerOperations.merge(null, value)); - } - else { + : innerOperations.merge(null, value), + ); + } else { const getProbableType = (key: string | number) => { // NOTE(cbond): If your code gets here, you might not be using the library /// correctly. If you are assigning into a path in your state, try to @@ -106,32 +118,41 @@ export abstract class State { : new Object(); }; - return parentOperations.update(key, + return parentOperations.update( + key, remainingPath.length > 0 ? getProbableType(remainingPath[0]) - : value); + : value, + ); } - }); + }, + ); return root; } static inspect(object: K): Operations { - const metaOperations = (update: Function, merge: Function, clone?: Function) => { + const metaOperations = ( + update: Function, + merge: Function, + clone?: Function, + ) => { const operations = { /// Clone the object (shallow) - clone: typeof clone === 'function' - ? () => clone( object) as any - : () => object, + clone: + typeof clone === 'function' + ? () => clone(object) as any + : () => object, /// Update a specific key inside of the container object - update: (key: string, value: K) => update(operations.clone(), key, value), + update: (key: string, value: K) => + update(operations.clone(), key, value), /// Merge existing values with new values merge: (key: string, value: K) => { const cloned = operations.clone(); return merge(cloned, key, value, (v: any) => update(cloned, key, v)); - } + }, }; return operations; @@ -143,8 +164,7 @@ export abstract class State { (parent: any, key: number | string, value: K) => { if (key != null) { return parent.set(key, value); - } - else { + } else { return value; } }, @@ -152,27 +172,26 @@ export abstract class State { (parent: any, key: number | string | string[], value: K) => { if (key) { return parent.mergeDeepIn(Array.isArray(key) ? key : [key], value); - } - else { + } else { if (ImmutableMap.isMap(value)) { return parent.mergeDeep(value); - } - else { + } else { return parent.concat(value); } } - }); - } - else if (Array.isArray(object)) { + }, + ); + } else if (Array.isArray(object)) { return metaOperations( // Replace array contents (parent: any, key: number, value: K) => { if (key != null) { parent[key] = value; - } - else { - parent.splice.apply(parent, [0, parent.length] - .concat(Array.isArray(value) ? value : [value])); + } else { + parent.splice.apply( + parent, + [0, parent.length].concat(Array.isArray(value) ? value : [value]), + ); } }, @@ -183,18 +202,16 @@ export abstract class State { }, // Clone - () => Array.prototype.slice.call(object, 0) + () => Array.prototype.slice.call(object, 0), ); - } - else if (object instanceof Map) { + } else if (object instanceof Map) { return metaOperations( // Update map key (parent: any, key: number | string, value: K) => { if (key != null) { return parent.set(key, value); - } - else { - const m = new Map( value); + } else { + const m = new Map(value); parent.clear(); m.forEach((value, index) => parent.set(index, value)); return parent; @@ -203,26 +220,25 @@ export abstract class State { // Merge (parent: Map, _: any, value: K) => { - const m = new Map( value); + const m = new Map(value); m.forEach((value, key) => parent.set(key, value)); return parent; }, // Clone - () => object instanceof WeakMap - ? new WeakMap( object) - : new Map( object) + () => + object instanceof WeakMap + ? new WeakMap(object) + : new Map(object), ); - } - else if (object instanceof WeakSet || object instanceof Set) { + } else if (object instanceof WeakSet || object instanceof Set) { return metaOperations( // Update element at index in set (parent: any, key: number, value: K) => { if (key != null) { return parent.set(key, value); - } - else { - const s = new Set( value); + } else { + const s = new Set(value); s.forEach((value, index) => parent.set(index, value)); s.clear(); return parent; @@ -238,55 +254,60 @@ export abstract class State { }, // Clone - () => object instanceof WeakSet - ? new WeakSet( object) - : new Set( object) - ); - } - else if (object instanceof Date) { - throw new FormException('Cannot understand why a Date object appears in the mutation path!'); - } - else { - switch (typeof object) { - case 'boolean': - case 'function': - case 'number': - case 'string': - case 'symbol': - case 'undefined': - break; - case 'object': - if (object == null) { - break; - } - return metaOperations( - (parent: any, key: any, value: K) => { - if (key != null) { - return Object.assign(parent, {[key]: value}); - } - return Object.assign(parent, value); - }, - (parent: any, _: any, value: K) => { - for (const k of Object.keys(value)) { - parent[k] = (value as any)[k]; - } - return parent; - }, - () => Object.assign({}, object) - ) - default: + () => + object instanceof WeakSet + ? new WeakSet(object) + : new Set(object), + ); + } else if (object instanceof Date) { + throw new FormException( + 'Cannot understand why a Date object appears in the mutation path!', + ); + } else { + switch (typeof object) { + case 'boolean': + case 'function': + case 'number': + case 'string': + case 'symbol': + case 'undefined': + break; + case 'object': + if (object == null) { break; - } - } + } + return metaOperations( + (parent: any, key: any, value: K) => { + if (key != null) { + return Object.assign(parent, { [key]: value }); + } + return Object.assign(parent, value); + }, + (parent: any, _: any, value: K) => { + for (const k of Object.keys(value)) { + parent[k] = (value as any)[k]; + } + return parent; + }, + () => Object.assign({}, object), + ); + default: + break; + } + } - throw new Error( - `An object of type ${typeof object} has appeared in the mutation path! Every element ` + - 'in the mutation path should be an array, an associative container, or a set'); + throw new Error( + `An object of type ${typeof object} has appeared in the mutation path! Every element ` + + 'in the mutation path should be an array, an associative container, or a set', + ); } static empty(value: any): boolean { - return value == null - || (value.length === 0 - || (typeof value.length === 'undefined' && Object.keys(value).length === 0)); + return ( + value == null || + (value.length === 0 || + (typeof value.length === 'undefined' && + Object.keys(value).length === 0)) + ); } } diff --git a/packages/form/source/tests.entry.ts b/packages/form/source/tests.entry.ts index 54842127..546fab9d 100644 --- a/packages/form/source/tests.entry.ts +++ b/packages/form/source/tests.entry.ts @@ -10,7 +10,7 @@ import 'zone.js/dist/fake-async-test'; import 'zone.js/dist/proxy'; import 'zone.js/dist/jasmine-patch'; -import {TestBed} from '@angular/core/testing'; +import { TestBed } from '@angular/core/testing'; import { BrowserDynamicTestingModule, @@ -19,10 +19,14 @@ import { TestBed.initTestEnvironment( BrowserDynamicTestingModule, - platformBrowserDynamicTesting()); - -const testContext = (<{ context?: Function }>require) - .context('./', true, /^(.(?!tests\.entry))*\.ts$/); + platformBrowserDynamicTesting(), +); + +const testContext = (<{ context?: Function }>require).context( + './', + true, + /^(.(?!tests\.entry))*\.ts$/, +); testContext('./index.ts'); diff --git a/packages/form/source/tests.utilities.ts b/packages/form/source/tests.utilities.ts index 7623c92a..f994943e 100644 --- a/packages/form/source/tests.utilities.ts +++ b/packages/form/source/tests.utilities.ts @@ -1,26 +1,23 @@ -import {flushMicrotasks} from '@angular/core/testing'; +import { flushMicrotasks } from '@angular/core/testing'; -import {Iterable} from 'immutable'; +import { Iterable } from 'immutable'; -import {createLogger} from 'redux-logger'; +import { createLogger } from 'redux-logger'; export const logger = createLogger({ level: 'debug', collapsed: true, predicate: (getState, action) => true, - stateTransformer: - state => { - const newState = new Object(); + stateTransformer: state => { + const newState = new Object(); - for (const i of Object.keys(state)) { - newState[i] = Iterable.isIterable(state[i]) - ? state[i].toJS() - : state[i]; - }; - - return newState; + for (const i of Object.keys(state)) { + newState[i] = Iterable.isIterable(state[i]) ? state[i].toJS() : state[i]; } - }); + + return newState; + }, +}); export const simulateUserTyping = (control, text: string): Promise => { return new Promise((resolve, reject) => { @@ -30,8 +27,7 @@ export const simulateUserTyping = (control, text: string): Promise => { } catch (error) { console.error('Failed to dispatch typing events', error); reject(error); - } - finally { + } finally { flushMicrotasks(); } }); @@ -67,7 +63,7 @@ export const dispatchKeyEvents = (control, text: string) => { bubbles: true, cancelable: false, }); - } + }; control.dispatchEvent(keyboardEventFactory('keydown', c)); control.dispatchEvent(keyboardEventFactory('keypress', c)); diff --git a/packages/form/tsconfig.json b/packages/form/tsconfig.json index 13d274dd..32d005f5 100644 --- a/packages/form/tsconfig.json +++ b/packages/form/tsconfig.json @@ -30,11 +30,5 @@ "strictMetadataEmit": true, "skipTemplateCodegen": true }, - "exclude": [ - "node_modules", - "dist", - "examples", - "index.d.ts", - "**/*test*.ts" - ] + "exclude": ["node_modules", "dist", "examples", "index.d.ts", "**/*test*.ts"] } diff --git a/packages/form/webpack/loaders.js b/packages/form/webpack/loaders.js index 92d7e1f1..42ef0bd6 100644 --- a/packages/form/webpack/loaders.js +++ b/packages/form/webpack/loaders.js @@ -30,4 +30,3 @@ exports.html = { test: /\.html$/, loader: 'raw-loader', }; - diff --git a/packages/form/webpack/plugins.js b/packages/form/webpack/plugins.js index 7e9fc14d..4c4b12b3 100644 --- a/packages/form/webpack/plugins.js +++ b/packages/form/webpack/plugins.js @@ -2,12 +2,10 @@ const webpack = require('webpack'); -const base = [ - new webpack.NoErrorsPlugin(), -]; +const base = [new webpack.NoErrorsPlugin()]; const development = [ - new webpack.SourceMapDevToolPlugin({filename: null, test: /\.ts$/}) + new webpack.SourceMapDevToolPlugin({ filename: null, test: /\.ts$/ }), ]; const production = []; diff --git a/packages/router/CHANGELOG.md b/packages/router/CHANGELOG.md index 7f1e9a11..c3f41a90 100644 --- a/packages/router/CHANGELOG.md +++ b/packages/router/CHANGELOG.md @@ -4,13 +4,13 @@ Adapts to breaking changes in Angular 6 and RxJS 6. Also updates to Typescript 2 # 7.0.0 - Angular 5+ only support -* Update to Angular 5 compiler -* Update RxJS, change to use let-able operators -* Requires @angular-redux/store 7+ +- Update to Angular 5 compiler +- Update RxJS, change to use let-able operators +- Requires @angular-redux/store 7+ ** Breaking Change ** -* NgReduxRouterModule now needs to be imported with `.forRoot` +- NgReduxRouterModule now needs to be imported with `.forRoot` **before** @@ -20,9 +20,9 @@ Adapts to breaking changes in Angular 6 and RxJS 6. Also updates to Typescript 2 imports: [ RouterModule.forRoot(appRoutes), /* .... */ - NgReduxRouterModule + NgReduxRouterModule, ], - bootstrap: [AppComponent] + bootstrap: [AppComponent], }) export class AppModule {} ``` @@ -35,9 +35,9 @@ export class AppModule {} imports: [ RouterModule.forRoot(appRoutes), /* .... */ - NgReduxRouterModule.forRoot() + NgReduxRouterModule.forRoot(), ], - bootstrap: [AppComponent] + bootstrap: [AppComponent], }) export class AppModule {} ``` @@ -48,10 +48,10 @@ Added support for Angular 5. # 6.3.1 - Toolchain Update -* Typescript 2.4.1 -* Compile with `strict: true` in tsconfig.json -* Fix for issue #17. -* Add package-lock.json for contributors using npm 5+. +- Typescript 2.4.1 +- Compile with `strict: true` in tsconfig.json +- Fix for issue #17. +- Add package-lock.json for contributors using npm 5+. # 6.3.0 - Version bump to match Store@6.3.0 @@ -68,7 +68,7 @@ support will be removed in the next major version. # 6.0.1 -* Include the `src`-folder in the release so webpack can build source maps. +- Include the `src`-folder in the release so webpack can build source maps. # 6.0.0 - The big-rename. @@ -83,18 +83,18 @@ feature set in a coherent but decoupled way. As of v6, the following packages are deprecated: -* ng2-redux -* ng2-redux-router -* ng2-redux-form +- ng2-redux +- ng2-redux-router +- ng2-redux-form Those packages will still be available on npm for as long as they are being used. However we have published the same code under a new package naming scheme: -* @angular-redux/store (formerly ng2-redux) -* @angular-redux/router (formerly ng2-redux-router) -* @angular-redux/form (formerly ng2-redux-form). +- @angular-redux/store (formerly ng2-redux) +- @angular-redux/router (formerly ng2-redux-router) +- @angular-redux/form (formerly ng2-redux-form). We have also decided that it's easier to reason about things if these packages align at least on major versions. So everything has at this point been bumped to @@ -104,7 +104,7 @@ align at least on major versions. So everything has at this point been bumped to Apart from the rename, the following API changes are noted: -* @angular-redux/store: none. -* @angular-redux/router: none. -* @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for +- @angular-redux/store: none. +- @angular-redux/router: none. +- @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for consistency. diff --git a/packages/router/ISSUE_TEMPLATE.md b/packages/router/ISSUE_TEMPLATE.md index 3378f4a9..09fe27e9 100644 --- a/packages/router/ISSUE_TEMPLATE.md +++ b/packages/router/ISSUE_TEMPLATE.md @@ -1,17 +1,17 @@ ### This is a... -* [ ] feature request -* [ ] bug report -* [ ] usage question +- [ ] feature request +- [ ] bug report +- [ ] usage question ### What toolchain are you using for transpilation/bundling? -* [ ] @angular/cli -* [ ] Custom @ngTools/webpack -* [ ] Raw `ngc` -* [ ] SystemJS -* [ ] Rollup -* [ ] Other +- [ ] @angular/cli +- [ ] Custom @ngTools/webpack +- [ ] Raw `ngc` +- [ ] SystemJS +- [ ] Rollup +- [ ] Other ### Environment @@ -23,19 +23,15 @@ Angular Version: OS: ### Link to repo showing the issus + (optional, but helps _a lot_) ### Expected Behaviour: - - ### Actual Behaviour: - - ### Stack Trace/Error Message: - - ### Additional Notes: + (optional) diff --git a/packages/router/README.md b/packages/router/README.md index 10bdd3eb..b46aa5c0 100644 --- a/packages/router/README.md +++ b/packages/router/README.md @@ -16,56 +16,59 @@ For use with Angular 2-4: Use v6. ### Setup -1. Use npm to install the bindings: - ``` - npm install @angular-redux/router --save - ``` - -2. Use the `routerReducer` when providing `Store`: - ```ts - import { combineReducers } from 'redux'; - import { routerReducer } from '@angular-redux/router'; - - export default combineReducers({ - // your reducers.. - router: routerReducer - }); - ``` - -3. Add the bindings to your root module. - ```ts - import { NgModule } from '@angular/core'; - import { NgReduxModule, NgRedux } from '@angular-redux/core'; - import { NgReduxRouterModule, NgReduxRouter } from '@angular-redux/router'; - import { RouterModule } from '@angular/router'; - import { routes } from './routes'; - - @NgModule({ - imports: [ - RouterModule.forRoot(routes), - NgReduxModule, - NgReduxRouterModule.forRoot() - // ...your imports - ], - // Other stuff.. - }) - export class AppModule { - constructor( - ngRedux: NgRedux, - ngReduxRouter: NgReduxRouter - ) { - ngRedux.configureStore(/* args */); - ngReduxRouter.initialize(/* args */); - } +1. Use npm to install the bindings: + + +``` +npm install @angular-redux/router --save +``` + +2. Use the `routerReducer` when providing `Store`: + + +```ts +import { combineReducers } from 'redux'; +import { routerReducer } from '@angular-redux/router'; + +export default combineReducers({ + // your reducers.. + router: routerReducer, +}); +``` + +3. Add the bindings to your root module. + + +```ts +import { NgModule } from '@angular/core'; +import { NgReduxModule, NgRedux } from '@angular-redux/core'; +import { NgReduxRouterModule, NgReduxRouter } from '@angular-redux/router'; +import { RouterModule } from '@angular/router'; +import { routes } from './routes'; + +@NgModule({ + imports: [ + RouterModule.forRoot(routes), + NgReduxModule, + NgReduxRouterModule.forRoot(), + // ...your imports + ], + // Other stuff.. +}) +export class AppModule { + constructor(ngRedux: NgRedux, ngReduxRouter: NgReduxRouter) { + ngRedux.configureStore(/* args */); + ngReduxRouter.initialize(/* args */); } +} ``` ### What if I use Immutable.js with my Redux store? When using a wrapper for your store's state, such as Immutable.js, you will need to change two things from the standard setup: -1. Provide your own reducer function that will receive actions of type `UPDATE_LOCATION` and return the payload merged into state. -2. Pass a selector to access the payload state and convert it to a JS object via the `selectLocationFromState` option on `NgReduxRouter`'s `initialize()`. +1. Provide your own reducer function that will receive actions of type `UPDATE_LOCATION` and return the payload merged into state. +2. Pass a selector to access the payload state and convert it to a JS object via the `selectLocationFromState` option on `NgReduxRouter`'s `initialize()`. These two hooks will allow you to store the state that this library uses in whatever format or wrapper you would like. @@ -79,4 +82,4 @@ getting the URL from there. ### Examples -* [Example-app: An example of using @angular-redux/router along with the other companion packages.](https://github.com/angular-redux/example-app) +- [Example-app: An example of using @angular-redux/router along with the other companion packages.](https://github.com/angular-redux/example-app) diff --git a/packages/router/src/actions.ts b/packages/router/src/actions.ts index 0522f2e3..bb621aaa 100644 --- a/packages/router/src/actions.ts +++ b/packages/router/src/actions.ts @@ -1 +1 @@ -export const UPDATE_LOCATION: string = "@angular-redux/router::UPDATE_LOCATION"; +export const UPDATE_LOCATION: string = '@angular-redux/router::UPDATE_LOCATION'; diff --git a/packages/router/src/index.ts b/packages/router/src/index.ts index 564551aa..7e945478 100644 --- a/packages/router/src/index.ts +++ b/packages/router/src/index.ts @@ -9,7 +9,7 @@ export class NgReduxRouterModule { static forRoot(): ModuleWithProviders { return { ngModule: NgReduxRouterModule, - providers: [NgReduxRouter] + providers: [NgReduxRouter], }; } } diff --git a/packages/router/src/reducer.ts b/packages/router/src/reducer.ts index 6ec876dd..f70bac85 100644 --- a/packages/router/src/reducer.ts +++ b/packages/router/src/reducer.ts @@ -5,10 +5,13 @@ import { UPDATE_LOCATION } from './actions'; export const DefaultRouterState: string = ''; export interface RouterAction extends Action { - payload?: string + payload?: string; } -export function routerReducer(state: string = DefaultRouterState, action: RouterAction): string { +export function routerReducer( + state: string = DefaultRouterState, + action: RouterAction, +): string { switch (action.type) { case UPDATE_LOCATION: return action.payload || DefaultRouterState; diff --git a/packages/router/src/router.ts b/packages/router/src/router.ts index 53b2b27b..56bf844a 100644 --- a/packages/router/src/router.ts +++ b/packages/router/src/router.ts @@ -5,7 +5,7 @@ import { Router, NavigationEnd, NavigationCancel, - DefaultUrlSerializer + DefaultUrlSerializer, } from '@angular/router'; import { NgRedux } from '@angular-redux/store'; import { Observable, Subscription } from 'rxjs'; @@ -29,7 +29,7 @@ export class NgReduxRouter { private router: Router, private ngRedux: NgRedux, private applicationRef: ApplicationRef, - private location: Location + private location: Location, ) {} /** @@ -66,11 +66,11 @@ export class NgReduxRouter { */ initialize( selectLocationFromState: (state: any) => string = state => state.router, - urlState$: Observable | undefined = undefined + urlState$: Observable | undefined = undefined, ) { if (this.initialized) { throw new Error( - '@angular-redux/router already initialized! If you meant to re-initialize, call destroy first.' + '@angular-redux/router already initialized! If you meant to re-initialize, call destroy first.', ); } @@ -87,7 +87,7 @@ export class NgReduxRouter { return this.router.events.pipe( filter(event => event instanceof NavigationEnd), map(event => this.location.path()), - distinctUntilChanged() + distinctUntilChanged(), ); } @@ -120,7 +120,7 @@ export class NgReduxRouter { this.ngRedux.dispatch({ type: UPDATE_LOCATION, - payload: location + payload: location, }); }; diff --git a/packages/store/.vscode/launch.json b/packages/store/.vscode/launch.json index 4d68c95c..07c8c155 100644 --- a/packages/store/.vscode/launch.json +++ b/packages/store/.vscode/launch.json @@ -11,4 +11,4 @@ "program": "${workspaceRoot}/tests.js" } ] -} \ No newline at end of file +} diff --git a/packages/store/CHANGELOG.md b/packages/store/CHANGELOG.md index 7727f55c..3d8fa735 100644 --- a/packages/store/CHANGELOG.md +++ b/packages/store/CHANGELOG.md @@ -2,23 +2,22 @@ ## Breaking Changes -* Updates to Redux 4 typedefs. -* Updates to RxJs 6 import paths. -* Updates to Angular 6. +- Updates to Redux 4 typedefs. +- Updates to RxJs 6 import paths. +- Updates to Angular 6. # 7.1.1 ## Bug Fixes -* #508 (thanks to @ratoaq2) -* #463 (thanks to @draccoz) +- #508 (thanks to @ratoaq2) +- #463 (thanks to @draccoz) # 7.1.0 ## Features -* Add a way to return a false value from a method decorated with `@dispatch` to allow conditionally preventing a dispatch. [PR#497](https://github.com/angular-redux/store/pull/497) - +- Add a way to return a false value from a method decorated with `@dispatch` to allow conditionally preventing a dispatch. [PR#497](https://github.com/angular-redux/store/pull/497) ```ts @dispatch() @@ -27,7 +26,7 @@ selectTab(tab) { } ``` -* Add a way to access the decorated instance inside of transformer for `@select$` [PR#500](https://github.com/angular-redux/store/pull/500) +- Add a way to access the decorated instance inside of transformer for `@select$` [PR#500](https://github.com/angular-redux/store/pull/500) ```ts @Input() public anotherInput: string; @@ -38,20 +37,20 @@ public selectedObs: Observable; Shout out to contributors: -* [@rart](https://github.com/rart) -* [@MaKCbIMKo](https://github.com/MaKCbIMKo) +- [@rart](https://github.com/rart) +- [@MaKCbIMKo](https://github.com/MaKCbIMKo) # 7.0.2 - Fixing Publish -* There are no functional changes / fixes in this release. +- There are no functional changes / fixes in this release. There was accidental publish to the `@latest` tag with an experimental fix for the v6 branch that got pushed out with the incorrect tag. For some clarity: -* v7+ - currently only works with Angular 5+ -* v6+ - works with Angular 4 and earlier, and v5. -* v8 - this was an accidental version bump - and that package is now deprecated. +- v7+ - currently only works with Angular 5+ +- v6+ - works with Angular 4 and earlier, and v5. +- v8 - this was an accidental version bump - and that package is now deprecated. # Which Version to use? @@ -73,97 +72,97 @@ I made a few mistakes trying to publish fixes / etc to two major versions, which # 6.6.0 - Angular 5 Support -* Add Angular 5+ as peer dependency +- Add Angular 5+ as peer dependency # 7.0.0 - Angular 5 Upgrade -* Update dependencies to Angular 5 -* Update RxJS to 5.5.2 and use lettable operators -* Update peer dependencies to only Angular 5+ +- Update dependencies to Angular 5 +- Update RxJS to 5.5.2 and use lettable operators +- Update peer dependencies to only Angular 5+ note: This version requires Angular 5, the code generated by the compiler is not compatible with Angular v4. - # 6.6.0-1 -* Update peer dependency to include Angular 5, *note* - this is a beta release, if you run into any issues with Angular 5 please let me know. This release is still using an older version of angular to build / compile, but seems to work with Angular 5. +- Update peer dependency to include Angular 5, _note_ - this is a beta release, if you run into any issues with Angular 5 please let me know. This release is still using an older version of angular to build / compile, but seems to work with Angular 5. Working on a V7 release that upgrades to be built/use Angular 5 core/compiler/etc which produces builds that are not backwards compatable with Angular 4. More details will be available soon. # 6.5.7 -* Fixed issue with AppRef.tick being called recurisvly [#443](https://github.com/angular-redux/store/pull/443) +- Fixed issue with AppRef.tick being called recurisvly [#443](https://github.com/angular-redux/store/pull/443) # 6.5.6 -* Turn tsconfig checks to 11. -* Minor code cleanup - no feature changes. +- Turn tsconfig checks to 11. +- Minor code cleanup - no feature changes. # 6.5.5 -* Update toolchain to typescript 2.4. -* Fix for https://github.com/angular-redux/store/issues/434. +- Update toolchain to typescript 2.4. +- Fix for https://github.com/angular-redux/store/issues/434. # 6.5.4 -* Fix for https://github.com/angular-redux/store/issues/427: memory leaks introduced in 6.3.0. +- Fix for https://github.com/angular-redux/store/issues/427: memory leaks introduced in 6.3.0. ** You'll want to grab this update! ** # 6.5.3 -* Handle `@WithSubStore`, `.configureSubStore` boundary cases for when the base path -doesn't exist in the store yet. +- Handle `@WithSubStore`, `.configureSubStore` boundary cases for when the base path + doesn't exist in the store yet. # 6.5.2 -* Docgen updates. +- Docgen updates. # 6.5.1 -* Allow `@WithSubStore`'s base path to be dynamic. +- Allow `@WithSubStore`'s base path to be dynamic. # 6.5.0 -* Enabled fractal store features for the decorator interface. See -https://github.com/angular-redux/store/blob/master/articles/fractal-store.md for details. +- Enabled fractal store features for the decorator interface. See + https://github.com/angular-redux/store/blob/master/articles/fractal-store.md for details. # 6.4.5 -* Fix a boundary condition where `MockNgRedux` could get instantiated -twice under certain conditions. -* Adjust exposed interfaces of `MockNgRedux` and `NgRedux` to make them -structurally compatible (both assignable to the `NgRedux` type) (issue #419) -* Update to TypeScript 2.3.4 +- Fix a boundary condition where `MockNgRedux` could get instantiated + twice under certain conditions. +- Adjust exposed interfaces of `MockNgRedux` and `NgRedux` to make them + structurally compatible (both assignable to the `NgRedux` type) (issue #419) +- Update to TypeScript 2.3.4 # 6.4.4 -* Improve packaging of `testing` submodule for people working in strict mode (thanks @ialibhay)! +- Improve packaging of `testing` submodule for people working in strict mode (thanks @ialibhay)! # 6.4.3 -* Reset `MockNgRedux.mockInstance` as part of `MockNgRedux.reset()`. +- Reset `MockNgRedux.mockInstance` as part of `MockNgRedux.reset()`. # 6.4.2 -* Fixed some issues with MockNgRedux and the select dectorators. See https://github.com/angular-redux/store/issues/413 for details. +- Fixed some issues with MockNgRedux and the select dectorators. See https://github.com/angular-redux/store/issues/413 for details. # 6.4.1 -* Fixed a memory leak with `@select`, `@select$`. See https://github.com/angular-redux/example-app/issues/34 for details. +- Fixed a memory leak with `@select`, `@select$`. See https://github.com/angular-redux/example-app/issues/34 for details. # 6.4.0 ## Features -* Added 'fractal store' support. +- Added 'fractal store' support. You can now create an encapsulated 'sub-store' that only operates on a section of the global Redux store: ```typescript const subStore = ngRedux.configureSubStore( ['path', 'to', 'somewhere'], - localReducer) + localReducer +); ``` Substore has the same interface as `NgRedux`: `select`, `dispatch` etc; @@ -176,21 +175,19 @@ See [the docs](https://github.com/angular-redux/store/blob/master/articles/fract ## Fixes -* Fixed issues with middlewares that allow dispatching of things other than just raw actions -(e.g. redux-thunk) [#386, #264]. -* Fixed issues with enhancers that change the way `Store.subscribe` and listeners work (e.g. redux-batch) [#372] +- Fixed issues with middlewares that allow dispatching of things other than just raw actions + (e.g. redux-thunk) [#386, #264]. +- Fixed issues with enhancers that change the way `Store.subscribe` and listeners work (e.g. redux-batch) [#372] ## Features -* Added the `@select$` decorator which allows you to attach observable operator chains -directly to `@select`. For example: +- Added the `@select$` decorator which allows you to attach observable operator chains + directly to `@select`. For example: ```typescript import { select$ } from 'angular-redux/store'; -export const debounceAndTriple = obs$ => obs$ - .debounce(300) - .map(x => 3 * x); +export const debounceAndTriple = obs$ => obs$.debounce(300).map(x => 3 * x); class Foo { @select$(['foo', 'bar'], debounceAndTriple) @@ -198,8 +195,8 @@ class Foo { } ``` -* Added the `@dispatch` decorator which allows auto-dispatch for your action creators. -For example: +- Added the `@dispatch` decorator which allows auto-dispatch for your action creators. + For example: ```typescript import { Injectable } from '@angular/core'; @@ -213,8 +210,8 @@ export class AnimalActions { @dispatch() loadAnimals = (animalType: AnimalType): Action => ({ type: AnimalActions.LOAD_ANIMALS, - meta: { animalType }, - }) + meta: { animalType } + }); // ... } @@ -222,7 +219,7 @@ export class AnimalActions { # 6.2.2 -* Reset `MockNgRedux.mockInstance` as part of `MockNgRedux.reset()`. +- Reset `MockNgRedux.mockInstance` as part of `MockNgRedux.reset()`. # 6.2.1 @@ -232,23 +229,23 @@ Issue #370 ## Misc. -* More code cleanup -* Auto-generated API documentation. +- More code cleanup +- Auto-generated API documentation. # 6.2.0 - NgReduxTestingModule ## Features -* Added `NgReduxTestingModule`, `MockNgRedux` to help unit test components and -services that select from the store. See [here](https://github.com/angular-redux/store/blob/master/articles/intro-tutorial.md#unit-testing-selections) -for details. -* Expose `PathSelector`, `FunctionSelector`, and `PropertySelector` types in `index.d.ts`. +- Added `NgReduxTestingModule`, `MockNgRedux` to help unit test components and + services that select from the store. See [here](https://github.com/angular-redux/store/blob/master/articles/intro-tutorial.md#unit-testing-selections) + for details. +- Expose `PathSelector`, `FunctionSelector`, and `PropertySelector` types in `index.d.ts`. ## Misc. -* Simplified build toolchain -* Simplified unit testing toolchain -* Consolidated repo-specific examples in to the [example-app](https://github.com/angular-redux/example-app) repo. +- Simplified build toolchain +- Simplified unit testing toolchain +- Consolidated repo-specific examples in to the [example-app](https://github.com/angular-redux/example-app) repo. # 6.1.0 - Angular 4 Support @@ -262,7 +259,7 @@ Documentation updates; no code change. Added a 'getting started' tutorial. # 6.0.0 - The big-rename. Due to the impending release of Angular4, the name 'ng2-redux' no longer makes -a ton of sense. The Angular folks have moved to a model where all versions are +a ton of sense. The Angular folks have moved to a model where all versions are just called 'Angular', and we should match that. After discussion with the other maintainers, we decided that since we have to @@ -272,17 +269,17 @@ the feature set in a coherent but decoupled way. As of v6, the following packages are deprecated: -* ng2-redux -* ng2-redux-router -* ng2-redux-form +- ng2-redux +- ng2-redux-router +- ng2-redux-form Those packages will still be available on npm for as long as they are being used. However we have published the same code under a new package naming scheme: -* @angular-redux/store (formerly ng2-redux) -* @angular-redux/router (formerly ng2-redux-router) -* @angular-redux/form (formerly ng2-redux-form). +- @angular-redux/store (formerly ng2-redux) +- @angular-redux/router (formerly ng2-redux-router) +- @angular-redux/form (formerly ng2-redux-form). We have also decided that it's easier to reason about things if these packages align at least on major versions. So everything has at this point been bumped @@ -292,12 +289,14 @@ to 6.0.0. Apart from the rename, the following API changes are noted: -* @angular-redux/store: none. -* @angular-redux/router: none. -* @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for consistency. +- @angular-redux/store: none. +- @angular-redux/router: none. +- @angular-redux/form: `NgReduxForms` renamed to `NgReduxFormModule` for consistency. # 5.1.1 + # 4.2.4 + # 3.3.10 ### Fixes @@ -327,24 +326,24 @@ libraries. See #259 for further discussion. ### Misc. -* Refactored the example app a bit to split out the different selector demos instead -of lumping most of them into the counter component. -* Miscellaneous documentation updates. +- Refactored the example app a bit to split out the different selector demos instead + of lumping most of them into the counter component. +- Miscellaneous documentation updates. # 5.0.0 -* Fix for the `ERROR in NgReduxModule is not an NgModule` error thrown by Angular CLI. -* Remove deprecations. -* Breaking changes associated with Angular 2.4+. +- Fix for the `ERROR in NgReduxModule is not an NgModule` error thrown by Angular CLI. +- Remove deprecations. +- Breaking changes associated with Angular 2.4+. ### Breaking Changes -* Minimum Angular peer dependency is now 2.4.0 -* Removed support for the `connect` pattern: it's simply not a good fit for Angular. -You should be using the `select` pattern now. -* Remove deprecated constructor arg for `NgRedux`. -* Minimum Angular peer dependency is now 2.4.0 -* `NgReduxModule.forRoot` is no more. Now just import `NgReduxModule` directly. +- Minimum Angular peer dependency is now 2.4.0 +- Removed support for the `connect` pattern: it's simply not a good fit for Angular. + You should be using the `select` pattern now. +- Remove deprecated constructor arg for `NgRedux`. +- Minimum Angular peer dependency is now 2.4.0 +- `NgReduxModule.forRoot` is no more. Now just import `NgReduxModule` directly. #### Old Way: @@ -354,13 +353,8 @@ import { NgModule } from '@angular/core'; import { NgReduxModule } from 'ng2-redux'; @NgModule({ - declarations: [ - AppComponent - ], - imports: [ - NgReduxModule.forRoot(), - BrowserModule, - ], + declarations: [AppComponent], + imports: [NgReduxModule.forRoot(), BrowserModule], providers: [], bootstrap: [AppComponent] }) @@ -377,13 +371,8 @@ import { NgModule } from '@angular/core'; import { NgReduxModule } from 'ng2-redux'; @NgModule({ - declarations: [ - AppComponent - ], - imports: [ - NgReduxModule, - BrowserModule, - ], + declarations: [AppComponent], + imports: [NgReduxModule, BrowserModule], providers: [], bootstrap: [AppComponent] }) @@ -408,33 +397,33 @@ to prevent this from happening again. ### Fixes: -* #281 (DevToolsExtension missing from providers list) +- #281 (DevToolsExtension missing from providers list) # 4.2.0 ### Fixes: -* #221 (type error with redux-thunk) +- #221 (type error with redux-thunk) # 4.1.0 ### Fixes: -* #228 ('generic' error with AoT) -* #251 (No provider for DevToolsExtension) +- #228 ('generic' error with AoT) +- #251 (No provider for DevToolsExtension) # 4.0.0 ### Features -* Better support for Angular CLI -* NgModule interface changes to better support Angular 2's ahead-of-time compiler (AoT) +- Better support for Angular CLI +- NgModule interface changes to better support Angular 2's ahead-of-time compiler (AoT) ### Fixes -* Update build to use ngc - metadata.json is now produced -* Introduced NgReduxModule -* Fix AoT related bugs #247, #235, #228 +- Update build to use ngc - metadata.json is now produced +- Introduced NgReduxModule +- Fix AoT related bugs #247, #235, #228 ### Breaking Change: Using NgReduxModule @@ -447,23 +436,16 @@ import { IAppState } from './appstate'; import { rootReducer } from './store'; @NgModule({ - declarations: [ - AppComponent - ], - imports: [ - NgReduxModule, - BrowserModule, - ], + declarations: [AppComponent], + imports: [NgReduxModule, BrowserModule], providers: [], bootstrap: [AppComponent] }) export class AppModule { constructor(ngRedux: NgRedux) { - - ngRedux.configureStore(rootReducer,{}); + ngRedux.configureStore(rootReducer, {}); } } - ``` **before** @@ -471,7 +453,7 @@ export class AppModule { ```js import { select } from 'ng2-redux'; export class MyComponent { - @select() thing$:Observable; + @select() thing$: Observable; } ``` @@ -494,90 +476,88 @@ export class MyComponent { ### Fixes -* Temp update to npm build to uninstall typings for chai/sinon-chai so `/// ` doesn't get added to files. +- Temp update to npm build to uninstall typings for chai/sinon-chai so `/// ` doesn't get added to files. # 3.3.8 ### Fixes -* Manual fix of build to remove chai type reference +- Manual fix of build to remove chai type reference # 3.3.7 ### Features -* Improved error if trying to dispatch before store is configured - #118, #198 +- Improved error if trying to dispatch before store is configured - #118, #198 ### Fixes -* Relax Zone JS version - #189, #187 -* Fix DevTools being out of sync for actions dispatched from tool, #192 +- Relax Zone JS version - #189, #187 +- Fix DevTools being out of sync for actions dispatched from tool, #192 ### Chores/Misc -* Upgrade to TypeScript 2 - #189, #190 -* Add Code Coverage - #193, #206, #207 +- Upgrade to TypeScript 2 - #189, #190 +- Add Code Coverage - #193, #206, #207 # 3.3.5 ### Fixes -* Update redux peer dependency to 3.5.0 - * observable shim which we depend on was introduced in 3.5.0, not 3.4.0 +- Update redux peer dependency to 3.5.0 + - observable shim which we depend on was introduced in 3.5.0, not 3.4.0 # 3.3.4 ### Chore -* Update to RC5 (#184, fixes #183) -* Include src in npm package (#182, fixes #180) +- Update to RC5 (#184, fixes #183) +- Include src in npm package (#182, fixes #180) ### Fixes -* Fix window in Universal (#185, fixes #172) - +- Fix window in Universal (#185, fixes #172) # 3.3.3 ### Fixes -* Fix window is undefined in Universal (#178, fixes #172) +- Fix window is undefined in Universal (#178, fixes #172) # 3.3.2 ### Fixes -* Change seamless immutable integration to not need conditional require (#169) +- Change seamless immutable integration to not need conditional require (#169) # 3.3.1 ### Fixes -* Argument to DevTools enhancer is now optional (#164) -* Decorator deletes key on target, not `this`. (#168, fixes #166) +- Argument to DevTools enhancer is now optional (#164) +- Decorator deletes key on target, not `this`. (#168, fixes #166) # 3.3.0 ### Features -* [DevToolsExtension - convience wrapper for dev tools](https://github.com/angular-redux/store/blob/master/articles/redux-dev-tools.md) (#115) -* [Select - seamless support for ImmutableJS](https://github.com/angular-redux/store/blob/master/articles/immutable-js.md) (#160) - +- [DevToolsExtension - convience wrapper for dev tools](https://github.com/angular-redux/store/blob/master/articles/redux-dev-tools.md) (#115) +- [Select - seamless support for ImmutableJS](https://github.com/angular-redux/store/blob/master/articles/immutable-js.md) (#160) ### Fixes -* Able to use `@select` in services -* Behavior of `select` with chained dispatches, (fixes #149, #153) - +- Able to use `@select` in services +- Behavior of `select` with chained dispatches, (fixes #149, #153) # 3.2.0 ### Features -* Added a `provideStore()` function which lets you pass in a already created -store. It can be used as this: +- Added a `provideStore()` function which lets you pass in a already created + store. It can be used as this: Create your store: + ```typescript // store.ts @@ -594,21 +574,17 @@ import reduxLogger from 'redux-logger'; import { myReducer } from './reducers/my-reducer'; const rootReducer = combineReducers({ - myReducer, + myReducer }); export const store = createStore( rootReducer, - compose( - applyMiddleware( - thunk, - reduxLogger - ) - ) -) as Store + compose(applyMiddleware(thunk, reduxLogger)) +) as Store; ``` Create your App and call `provideStore` with your newly created store: + ```typescript // app.ts @@ -617,7 +593,7 @@ import { store } from './store.ts'; interface IAppState { // ... -}; +} @Component({ // ... etc. }) @@ -634,35 +610,37 @@ class App { ### Features -* Added a 'path' option to `ngRedux.select()` and `@select()`. Now you can -do stuff like `@select(['foo', 'bar'])` to select `state.foo.bar` into -an observable. +- Added a 'path' option to `ngRedux.select()` and `@select()`. Now you can + do stuff like `@select(['foo', 'bar'])` to select `state.foo.bar` into + an observable. -* Add ability to provide custom comparer to @select decorator to keep consistent with ngRedux.select +- Add ability to provide custom comparer to @select decorator to keep consistent with ngRedux.select ```js -import { is } from 'immutablejs' +import { is } from 'immutablejs'; export class SomeComponent { - @select(n=n.some.selector, is) someSelector$: Observable + @select((n = n.some.selector), is) + someSelector$: Observable; } - ``` + ### Features # 3.0.8 ### Fix -* AppliicationRef is optional dependency, fixes#127 +- AppliicationRef is optional dependency, fixes#127 # 3.0.0 ### Features #### Select Decorator + This release introduces the new decorator interface. You can now use -`@select` to create an observable from a slice of store state. +`@select` to create an observable from a slice of store state. See 'the select pattern' in [README.md](README.md#the-select-pattern) for a complete description of how to use this new decorator. @@ -688,6 +666,7 @@ Angular 2 services, which previously was unnecessarily difficult. ##### Old way: **bootstrap.ts:** + ```typescript import { bootstrap } from '@angular/platform-browser-dynamic'; import { createStore, applyMiddleware, compose } from 'redux'; @@ -698,17 +677,18 @@ import { rootReducer } from './reducers'; import { App } from './app'; // Confusing and hard to use with dependency injection. -const middleware = [ createLogger() ]; -const enhancers = [ persistState('counter', { key: 'example-app' }) ]; +const middleware = [createLogger()]; +const enhancers = [persistState('counter', { key: 'example-app' })]; const store = compose( applyMiddleware(middleware), - ...enhancers) - (createStore)(rootReducer); + ...enhancers +)(createStore)(rootReducer); -bootstrap(App, [ provide(store) ]) +bootstrap(App, [provide(store)]); ``` **app.ts** + ```typescript import { Component } from '@angular/core'; import { NgRedux } from 'ng2-redux'; @@ -724,15 +704,17 @@ export class App { ##### New way: **bootstrap.ts:** + ```typescript import { bootstrap } from '@angular/platform-browser-dynamic'; import { NgRedux } from 'ng2-redux'; import { App } from './app'; -bootstrap(App, [ Ng2Redux ]); +bootstrap(App, [Ng2Redux]); ``` **app.ts** + ```typescript import { Component } from '@angular/core'; import { NgRedux } from 'ng2-redux'; @@ -744,8 +726,8 @@ import { initialState, rootReducer } from './reducers'; }) export class App { constructor(private ngRedux: NgRedux) { - const middleware = [ reduxLogger ]; - const enhancers = [ persistState('counter', { key: 'example-app' }) ]; + const middleware = [reduxLogger]; + const enhancers = [persistState('counter', { key: 'example-app' })]; // Easier to understand, and can use middleware or enhancers from DI. ngRedux.configureStore(rootReducer, initialState, middleware, enhancers); @@ -764,13 +746,13 @@ community: `redux-logger` and `redux-localstorage`. ### Features -* **Type definitions**: - * Ported to typescript - * Supports typed stores / reducers - * Uses offical Redux type definitions -* **Type Injectable**: - * Able to inject `NgRedux` into your component by type, and not need `@Inject('ngRedux')` - * `@Inject('ngRedux')` still works +- **Type definitions**: + - Ported to typescript + - Supports typed stores / reducers + - Uses offical Redux type definitions +- **Type Injectable**: + - Able to inject `NgRedux` into your component by type, and not need `@Inject('ngRedux')` + - `@Inject('ngRedux')` still works ```typescript import { NgRedux } from 'ng2-redux'; @@ -779,7 +761,8 @@ export class MyComponent { constructor(private ngRedux: NgRedux) {} } ``` -* **State as Observable**: Ability to expose parts of your state as an observable. + +- **State as Observable**: Ability to expose parts of your state as an observable. ```typescript select(selector: string | number | symbol | ((state: RootState) => S), comparer?: (x: any, y: any) => boolean): Observable; @@ -797,7 +780,7 @@ export class MyComponent implements OnInit { constructor(private ngRedux: NgRedux) { this.countByKey$ = this.ngRedux.select('count'); - this.countByFunc$ = this.ngRedux.select(state=>state.count); + this.countByFunc$ = this.ngRedux.select(state => state.count); } } ``` @@ -810,12 +793,12 @@ import { NgRedux } from 'ng2-redux'; // ... export class MyComponent implements OnInit { - person$: Observable>; + person$: Observable>; constructor(private ngRedux: ngRedux) { // even if the reference of the object has changed, // if the data is the same - it wont be treated as a change - this.person$ = this.ngRedux.select(state=>state.people.get(0),is); + this.person$ = this.ngRedux.select(state => state.people.get(0), is); } } ``` diff --git a/packages/store/ISSUE_TEMPLATE.md b/packages/store/ISSUE_TEMPLATE.md index 4eb883d0..09fe27e9 100644 --- a/packages/store/ISSUE_TEMPLATE.md +++ b/packages/store/ISSUE_TEMPLATE.md @@ -1,17 +1,17 @@ ### This is a... -* [ ] feature request -* [ ] bug report -* [ ] usage question +- [ ] feature request +- [ ] bug report +- [ ] usage question ### What toolchain are you using for transpilation/bundling? -* [ ] @angular/cli -* [ ] Custom @ngTools/webpack -* [ ] Raw `ngc` -* [ ] SystemJS -* [ ] Rollup -* [ ] Other +- [ ] @angular/cli +- [ ] Custom @ngTools/webpack +- [ ] Raw `ngc` +- [ ] SystemJS +- [ ] Rollup +- [ ] Other ### Environment @@ -23,20 +23,15 @@ Angular Version: OS: ### Link to repo showing the issus + (optional, but helps _a lot_) ### Expected Behaviour: - - ### Actual Behaviour: - - ### Stack Trace/Error Message: - - ### Additional Notes: -(optional) +(optional) diff --git a/packages/store/README.md b/packages/store/README.md index ffc0d2dc..2c43b4f0 100644 --- a/packages/store/README.md +++ b/packages/store/README.md @@ -1,4 +1,3 @@ - # Which Version to use? ## Angular 6+ @@ -34,9 +33,9 @@ For Angular 1 see [ng-redux](https://github.com/wbuchwalter/ng-redux) Redux is a popular approach to managing state in applications. It emphasises: -* A single, immutable data store. -* One-way data flow. -* An approach to change based on pure functions and a stream of actions. +- A single, immutable data store. +- One-way data flow. +- An approach to change based on pure functions and a stream of actions. You can find lots of excellent documentation here: [Redux](http://redux.js.org/). @@ -46,34 +45,34 @@ We provide a set of npm packages that help you integrate your redux store into your Angular 2+ applications. Our approach helps you by bridging the gap with some of Angular's advanced features, including: -* Change processing with RxJS observables. -* Compile time optimizations with `NgModule` and Ahead-of-Time compilation. -* Integration with the Angular change detector. +- Change processing with RxJS observables. +- Compile time optimizations with `NgModule` and Ahead-of-Time compilation. +- Integration with the Angular change detector. ## Getting Started -* I already know what Redux and RxJS are. [Give me the TL;DR](https://github.com/angular-redux/store/blob/master/articles/quickstart.md). -* I'm just learning about Redux. [Break it down for me](https://github.com/angular-redux/store/blob/master/articles/intro-tutorial.md)! -* Talk is cheap. [Show me a complete code example](https://github.com/angular-redux/example-app). -* Take me to the [API docs](https://angular-redux.github.io/store). +- I already know what Redux and RxJS are. [Give me the TL;DR](https://github.com/angular-redux/store/blob/master/articles/quickstart.md). +- I'm just learning about Redux. [Break it down for me](https://github.com/angular-redux/store/blob/master/articles/intro-tutorial.md)! +- Talk is cheap. [Show me a complete code example](https://github.com/angular-redux/example-app). +- Take me to the [API docs](https://angular-redux.github.io/store). ## Examples Here are some examples of the `angular-redux` family of packages in action: -* [Zoo Animals Combined Example App](https://github.com/angular-redux/example-app) -* [Simple SystemJS Example (Angular Quickstart)](https://github.com/angular-redux/system-js-example) +- [Zoo Animals Combined Example App](https://github.com/angular-redux/example-app) +- [Simple SystemJS Example (Angular Quickstart)](https://github.com/angular-redux/system-js-example) ## Companion Packages -* [Reduxify your Routing with @angular-redux/router](https://github.com/angular-redux/router) -* [Reduxify your Forms with @angular-redux/form](https://github.com/angular-redux/form) +- [Reduxify your Routing with @angular-redux/router](https://github.com/angular-redux/router) +- [Reduxify your Forms with @angular-redux/form](https://github.com/angular-redux/form) ## Resources -* [Using Redux with Angular - JS Toronto Meetup 2016-07-12](https://www.youtube.com/watch?v=s4xr2avwv3s) -* [Getting started with Redux](https://egghead.io/courses/getting-started-with-redux) -* [Awesome Redux: Community Resources](https://github.com/xgrommx/awesome-redux) +- [Using Redux with Angular - JS Toronto Meetup 2016-07-12](https://www.youtube.com/watch?v=s4xr2avwv3s) +- [Getting started with Redux](https://egghead.io/courses/getting-started-with-redux) +- [Awesome Redux: Community Resources](https://github.com/xgrommx/awesome-redux) ## In-Depth Usage @@ -85,12 +84,12 @@ Read more here: [Select Pattern](https://github.com/angular-redux/store/blob/mas We also have a number of 'cookbooks' for specific Angular topics: -* [Using Angular's Dependency Injector with Action Creators](https://github.com/angular-redux/store/blob/master/articles/action-creator-service.md) -* [Using Angular's Dependency Injector with Middlewares](https://github.com/angular-redux/store/blob/master/articles/di-middleware.md) -* [Managing Side-Effects with redux-observable Epics](https://github.com/angular-redux/store/blob/master/articles/epics.md) -* [Using the Redux DevTools Chrome Extension](https://github.com/angular-redux/store/blob/master/articles/redux-dev-tools.md) -* [@angular-redux/store and ImmutableJS](https://github.com/angular-redux/store/blob/master/articles/immutable-js.md) -* [Strongly Typed Reducers](https://github.com/angular-redux/store/blob/master/articles/strongly-typed-reducers.md) +- [Using Angular's Dependency Injector with Action Creators](https://github.com/angular-redux/store/blob/master/articles/action-creator-service.md) +- [Using Angular's Dependency Injector with Middlewares](https://github.com/angular-redux/store/blob/master/articles/di-middleware.md) +- [Managing Side-Effects with redux-observable Epics](https://github.com/angular-redux/store/blob/master/articles/epics.md) +- [Using the Redux DevTools Chrome Extension](https://github.com/angular-redux/store/blob/master/articles/redux-dev-tools.md) +- [@angular-redux/store and ImmutableJS](https://github.com/angular-redux/store/blob/master/articles/immutable-js.md) +- [Strongly Typed Reducers](https://github.com/angular-redux/store/blob/master/articles/strongly-typed-reducers.md) ## Hacking on angular-redux/store @@ -98,16 +97,16 @@ Want to hack on angular-redux/store or any of the related packages? Feel free to Here's how to do that: -1. Write unit tests. You can check that they work by running -`npm test`. -2. Run the linter. If your editor doesn't do it automatically, do it -manually with `npm run lint`. -3. Test your changes in a 'real world scenario'. We use the [example-app](https://github.com/angular-redux/example-app) for this, using some npm -fakery to 'publish the package locally': - -* clone the example app (`git clone https://github.com/angular-redux/example-app.git`) -* generate a 'local package' (`cd` to your `angular-redux/store` clone and run `npm pack`). This will create a `.tgz` file. -* hook your 'local package' up to your example-app (`cd` to your example-app clone and run `npm install --save /path/to/the/tgz/file/from/above`) -* run `ng serve --aot` +1. Write unit tests. You can check that they work by running + `npm test`. +2. Run the linter. If your editor doesn't do it automatically, do it + manually with `npm run lint`. +3. Test your changes in a 'real world scenario'. We use the [example-app](https://github.com/angular-redux/example-app) for this, using some npm + fakery to 'publish the package locally': + +- clone the example app (`git clone https://github.com/angular-redux/example-app.git`) +- generate a 'local package' (`cd` to your `angular-redux/store` clone and run `npm pack`). This will create a `.tgz` file. +- hook your 'local package' up to your example-app (`cd` to your example-app clone and run `npm install --save /path/to/the/tgz/file/from/above`) +- run `ng serve --aot` Please make sure your changes pass Angular's AoT compiler, because it's a bit finicky with TS syntax. diff --git a/packages/store/articles/action-creator-service.md b/packages/store/articles/action-creator-service.md index 219f187e..a58371ab 100644 --- a/packages/store/articles/action-creator-service.md +++ b/packages/store/articles/action-creator-service.md @@ -6,8 +6,8 @@ them into Angular's dependency injector. We may as well adopt a more class-based approach to satisfy Angular 2's OOP idiom, and to allow us to -1. make our actions `@Injectable()`, and -2. inject other services for our action creators to use. +1. make our actions `@Injectable()`, and +2. inject other services for our action creators to use. Take a look at this example, which injects NgRedux to access `dispatch` and `getState` (a replacement for `redux-thunk`), @@ -22,9 +22,10 @@ import { RandomNumberService } from '../services/random-number'; @Injectable() export class CounterActions { - constructor ( + constructor( private ngRedux: NgRedux, - private randomNumberService: RandomNumberService) {} + private randomNumberService: RandomNumberService + ) {} static INCREMENT_COUNTER: string = 'INCREMENT_COUNTER'; static DECREMENT_COUNTER: string = 'DECREMENT_COUNTER'; @@ -74,7 +75,7 @@ import { RandomNumberService } from '../services/random-number'; @Component({ selector: 'counter', - providers: [ CounterActions, RandomNumberService ], + providers: [CounterActions, RandomNumberService], template: `

Clicked: {{ counter$ | async }} times diff --git a/packages/store/articles/di-middleware.md b/packages/store/articles/di-middleware.md index b579b8a1..42bfad19 100644 --- a/packages/store/articles/di-middleware.md +++ b/packages/store/articles/di-middleware.md @@ -44,18 +44,18 @@ import { LogRemoteName } from './middleware/log-remote-name'; @NgModule({ /* ... */ - imports: [ /* ... */, NgReduxModule ], + imports: [, /* ... */ NgReduxModule], providers: [ - LogRemoteName, + LogRemoteName /* ... */ ] }) export class AppModule { constructor( private ngRedux: NgRedux, - logRemoteName: LogRemoteName) { - - const middleware = [ reduxLogger, logRemoteName.middleware ]; + logRemoteName: LogRemoteName + ) { + const middleware = [reduxLogger, logRemoteName.middleware]; this.ngRedux.configureStore(rootReducer, {}, middleware); } } diff --git a/packages/store/articles/epics.md b/packages/store/articles/epics.md index da315918..75b026f6 100644 --- a/packages/store/articles/epics.md +++ b/packages/store/articles/epics.md @@ -28,13 +28,13 @@ export class SessionActions { loginUser(credentials) { this.ngRedux.dispatch({ type: SessionActions.LOGIN_USER, - payload: credentials, + payload: credentials }); - }; + } logoutUser() { this.ngRedux.dispatch({ type: SessionActions.LOGOUT_USER }); - }; + } } ``` @@ -60,18 +60,20 @@ export class SessionEpics { constructor(private http: Http) {} login = (action$: ActionsObservable) => { - return action$.ofType(SessionActions.LOGIN_USER) - .mergeMap(({payload}) => { - return this.http.post(`${BASE_URL}/auth/login`, payload) - .map(result => ({ - type: SessionActions.LOGIN_USER_SUCCESS, - payload: result.json().meta - })) - .catch(error => Observable.of({ + return action$.ofType(SessionActions.LOGIN_USER).mergeMap(({ payload }) => { + return this.http + .post(`${BASE_URL}/auth/login`, payload) + .map(result => ({ + type: SessionActions.LOGIN_USER_SUCCESS, + payload: result.json().meta + })) + .catch(error => + Observable.of({ type: SessionActions.LOGIN_USER_ERROR - })); - }); - } + }) + ); + }); + }; } ``` @@ -92,21 +94,19 @@ import { SessionEpics } from './epics'; @NgModule({ /* ... */ - imports: [ /* ... */, NgReduxModule ], + imports: [, /* ... */ NgReduxModule], providers: [ - SessionEpics, + SessionEpics /* ... */ ] }) export class AppModule { constructor( private ngRedux: NgRedux, - private epics: SessionEpics) { - - const middleware = [ - createEpicMiddleware(this.epics.login) - ]; - ngRedux.configureStore(rootReducer, {}, middleware); + private epics: SessionEpics + ) { + const middleware = [createEpicMiddleware(this.epics.login)]; + ngRedux.configureStore(rootReducer, {}, middleware); } } ``` diff --git a/packages/store/articles/fractal-store.md b/packages/store/articles/fractal-store.md index b0d95d45..7c3a7da8 100644 --- a/packages/store/articles/fractal-store.md +++ b/packages/store/articles/fractal-store.md @@ -4,13 +4,13 @@ As of 6.4.0, `@angular-redux/store` supports 'subStores'. A subStore expose the same interface as the main Redux store (`dispatch`, `select`, etc.), but is rooted at a particular path in your global state. -In particular, this is useful for Elm-inspired 'fractal components': +In particular, this is useful for Elm-inspired 'fractal components': Components that have instance-specific access to Redux features. For example, imagine your store looked like this: ```typescript -{ +{ users: { bob: { name: 'Bob Smith', @@ -33,15 +33,15 @@ We can do this by creating substores whose 'base paths' point to Alice and Bob's ```typescript interface IUser { - name: string, - occupation: string, - loc: number, -}; + name: string; + occupation: string; + loc: number; +} export const userComponentReducer = (state, action) => - action.type === 'ADD_LOC' ? - { ...state, loc: state.loc + action.payload } : - state; + action.type === 'ADD_LOC' + ? { ...state, loc: state.loc + action.payload } + : state; @Component({ selector: 'user', @@ -50,7 +50,7 @@ export const userComponentReducer = (state, action) =>

occupation: {{ occupation$ | async }}

lines of code: {{ loc$ | async }}

    - `, + ` }) export class UserComponent implements NgOnInit { @Input() userId: String; @@ -68,7 +68,8 @@ export class UserComponent implements NgOnInit { // in the top-level store. this.subStore = this.ngRedux.configureSubStore( ['users', userId], - userComponentReducer); + userComponentReducer + ); // Substore selectons are scoped to the base path used to configure // the substore. @@ -108,15 +109,15 @@ example above with the decorator interface looks like this: ```typescript interface IUser { - name: string, - occupation: string, - loc: number, -}; + name: string; + occupation: string; + loc: number; +} export const userComponentReducer = (state, action) => - action.type === 'ADD_LOC' ? - { ...state, loc: state.loc + action.payload } : - state; + action.type === 'ADD_LOC' + ? { ...state, loc: state.loc + action.payload } + : state; export const defaultToZero = (obs$: Observable) => obs$.map(n => n || 0); @@ -128,11 +129,11 @@ export const defaultToZero = (obs$: Observable) =>

occupation: {{ occupation$ | async }}

lines of code: {{ loc$ | async }}

    - `, + ` }) @WithSubStore({ basePathMethodName: 'getBasePath', - localReducer: userComponentReducer, + localReducer: userComponentReducer }) export class UserComponent implements NgOnInit { @Input() userId: String; @@ -144,9 +145,10 @@ export class UserComponent implements NgOnInit { // These selections are now scoped to the portion of the store rooted // at ['users', userId]; - @select('name') readonly name$: Observable; - @select('occupation') readonly occupation$: Observable; - @select$('loc', defaultToZero) readonly loc$: Observable; + @select('name') readonly name$: Observable; + @select('occupation') readonly occupation$: Observable; + @select$('loc', defaultToZero) + readonly loc$: Observable; // These dispatches will be scoped to the substore as well, as if you // had called ngRedux.configureSubStore(...).dispatch(numLines). diff --git a/packages/store/articles/immutable-js.md b/packages/store/articles/immutable-js.md index a961d4f1..bb76562b 100644 --- a/packages/store/articles/immutable-js.md +++ b/packages/store/articles/immutable-js.md @@ -28,7 +28,7 @@ const mutableFoo = { foo: 1 }; -const foo: number = mutableFoo.foo +const foo: number = mutableFoo.foo; ``` becomes: diff --git a/packages/store/articles/intro-tutorial.md b/packages/store/articles/intro-tutorial.md index fb1b73db..9bddb462 100644 --- a/packages/store/articles/intro-tutorial.md +++ b/packages/store/articles/intro-tutorial.md @@ -38,6 +38,7 @@ we just installed. We do that by importing the `NgReduxModule` into our applicat Open up your app's `src/app/app.module.ts` and add the following lines: `src/app/app.module.ts`: + ```typescript import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; @@ -49,19 +50,17 @@ import { NgReduxModule, NgRedux } from '@angular-redux/store'; // <- New import { AppComponent } from './app.component'; @NgModule({ - declarations: [ - AppComponent - ], + declarations: [AppComponent], imports: [ BrowserModule, FormsModule, HttpModule, - NgReduxModule, // <- New + NgReduxModule // <- New ], providers: [], bootstrap: [AppComponent] }) -export class AppModule { } +export class AppModule {} ``` This will allow us to inject services from `@angular-redux/store` into our app. @@ -143,14 +142,17 @@ So we can think of our application conceptually like this: // Pseudocode const nextValueOfCount = streamOfActions.reduce( (currentValueOfCount, action) => { - switch(action.type) { - case 'INCREMENT': return state + 1; - case 'DECREMENT': return state - 1; + switch (action.type) { + case 'INCREMENT': + return state + 1; + case 'DECREMENT': + return state - 1; } return state; }, - { count: 0 }); + { count: 0 } +); ``` Great! we've just expressed the essence of what our `rootReducer` needs to be for this @@ -159,6 +161,7 @@ simple, one variable, two-action application. Let's go ahead and formalize this in our codebase. Create two new files as follows: `src/app/app.actions.ts`: + ```typescript import { Injectable } from '@angular/core'; import { Action } from 'redux'; @@ -179,6 +182,7 @@ export class CounterActions { ``` `src/store.ts`: + ```typescript import { Action } from 'redux'; import { CounterActions } from './app/app.actions'; @@ -188,13 +192,15 @@ export interface IAppState { } export const INITIAL_STATE: IAppState = { - count: 0, + count: 0 }; export function rootReducer(lastState: IAppState, action: Action): IAppState { - switch(action.type) { - case CounterActions.INCREMENT: return { count: lastState.count + 1 }; - case CounterActions.DECREMENT: return { count: lastState.count - 1 }; + switch (action.type) { + case CounterActions.INCREMENT: + return { count: lastState.count + 1 }; + case CounterActions.DECREMENT: + return { count: lastState.count - 1 }; } // We don't care about any other actions right now. @@ -213,6 +219,7 @@ So, let's use the ingredients above to create a Redux store and hook it up to An `NgRedux.configureStore`. `src/app/app.module.ts`: + ```typescript // ... imports as above @@ -220,15 +227,8 @@ import { rootReducer, IAppState, INITIAL_STATE } from '../store'; // < New import { CounterActions } from './app.actions'; // <- New @NgModule({ - declarations: [ - AppComponent - ], - imports: [ - BrowserModule, - FormsModule, - HttpModule, - NgReduxModule, - ], + declarations: [AppComponent], + imports: [BrowserModule, FormsModule, HttpModule, NgReduxModule], providers: [CounterActions], // <- New bootstrap: [AppComponent] }) @@ -237,15 +237,13 @@ export class AppModule { // Tell @angular-redux/store about our rootReducer and our initial state. // It will use this to create a redux store for us and wire up all the // events. - ngRedux.configureStore( - rootReducer, - INITIAL_STATE); + ngRedux.configureStore(rootReducer, INITIAL_STATE); } } ``` > Note that if your codebase already has a Redux store set up in non-Angular code, you can register -it with NgRedux using `ngRedux.provideStore` instead of `ngRedux.configureStore`. +> it with NgRedux using `ngRedux.provideStore` instead of `ngRedux.configureStore`. ## What's a Reducer Anyway? @@ -273,9 +271,10 @@ ends up looking conceptually a bit like this: ```typescript // Pseudocode -const finalAppState:IAppState = actionsOverTime.reduce( +const finalAppState: IAppState = actionsOverTime.reduce( rootReducer, - INITIAL_STATE); + INITIAL_STATE +); ``` Or perhaps more usefully: @@ -296,13 +295,13 @@ we defined `INCREMENT` and `DECREMENT` actions in `src/app/app.actions.ts`. Let' they are dispatched when the user clicks the buttons: `src/app/app.component.ts`: + ```typescript // Imports as before. import { NgRedux } from '@angular-redux/store'; // <- New import { CounterActions } from './app.actions'; // <- New -import {IAppState} from "../store"; // <- New - +import { IAppState } from '../store'; // <- New @Component({ selector: 'app-root', @@ -313,9 +312,11 @@ export class AppComponent { title = 'app works!'; count: number; - constructor( // <- New + constructor( + // <- New private ngRedux: NgRedux, // <- New - private actions: CounterActions) {} // <- New + private actions: CounterActions + ) {} // <- New increment() { this.ngRedux.dispatch(this.actions.increment()); // <- New @@ -341,28 +342,32 @@ and `select` the `count` property into your component: import { OnDestroy } from '@angular/core'; // Decorator as before -export class AppComponent implements OnDestroy { // <- New +export class AppComponent implements OnDestroy { + // <- New title = 'app works!'; count: number; subscription; // <- New; constructor( private ngRedux: NgRedux, - private actions: CounterActions) { - this.subscription = ngRedux.select('count') // <- New - .subscribe(newCount => this.count = newCount); // <- New + private actions: CounterActions + ) { + this.subscription = ngRedux + .select('count') // <- New + .subscribe(newCount => (this.count = newCount)); // <- New } - ngOnDestroy() { // <- New + ngOnDestroy() { + // <- New this.subscription.unsubscribe(); // <- New - } // <- New + } // <- New // Rest of class as before. } ``` Here, we're listening to a selected observable which will receive the new value of `count` each -time an action happens. We've also added an `ngOnDestroy` so we can 'un-listen' to those events +time an action happens. We've also added an `ngOnDestroy` so we can 'un-listen' to those events when our component is unmounted from the DOM. At this point your counter should be functional. Try clicking the buttons and see the displayed @@ -411,6 +416,7 @@ We can now throw a `| async` in our template, and Angular will take care of subs unpacking its values as they come in: `app/app.component.html`: + ```html @@ -423,7 +429,7 @@ unpacking its values as they come in: `ngRedux.select` is a powerful way to get unfettered access to store Observables; allowing you to do lots of transformations with RxJS operators to massage the store data in to what more complex -UIs need. However in this scenario it's overkill: we just want to display the current value of +UIs need. However in this scenario it's overkill: we just want to display the current value of a property in the store. For simple cases like this, `@angular-redux/store` exposes a shorthand for selection in the form @@ -449,7 +455,8 @@ export class AppComponent { constructor( private actions: CounterActions, - private ngRedux: NgRedux) {} // <- Changed + private ngRedux: NgRedux + ) {} // <- Changed increment() { this.ngRedux.dispatch(this.actions.increment()); @@ -468,8 +475,9 @@ You can also specify a name or even a nested store path manually: ```typescript class MyComponent { - @select('count') readonly differentVarNameInComponent$: Observable - @select(['deeply', 'nested', 'store', 'property']) readonly deeplyNested$: Observable; + @select('count') readonly differentVarNameInComponent$: Observable; + @select(['deeply', 'nested', 'store', 'property']) + readonly deeplyNested$: Observable; } ``` @@ -483,6 +491,7 @@ expose a mock class that can help you. Just pull `NgReduxTestingModule` into your Angular `TestBed` configuration: `my-component.spec.ts`: + ```typescript import { NgReduxTestingModule, MockNgRedux } from '@angular-redux/store/testing'; import { Subject } from 'rxjs/Subject'; @@ -547,7 +556,7 @@ it('dispatches INCREMENT when ...', () => { // Run your test code ... // Perform your expectations - expect(spy).toHaveBeenCalledWith({type: CounterActions.INCREMENT }); + expect(spy).toHaveBeenCalledWith({ type: CounterActions.INCREMENT }); // ... etc. }); ``` @@ -557,10 +566,10 @@ it('dispatches INCREMENT when ...', () => { The Redux community has a lot of powerful extensions that can be plugged into your store to enhance it in different ways. Libraries that let you -* [persist parts of your store to localStorage](https://www.npmjs.com/package/redux-localstorage) -* [handle side-effects and business logic in clean ways](https://www.npmjs.com/package/redux-observable) -* [collect analytics data](https://www.npmjs.com/package/redux-beacon) -* and many more... +- [persist parts of your store to localStorage](https://www.npmjs.com/package/redux-localstorage) +- [handle side-effects and business logic in clean ways](https://www.npmjs.com/package/redux-observable) +- [collect analytics data](https://www.npmjs.com/package/redux-beacon) +- and many more... These libraries are implemented as [Redux Middleware](http://redux.js.org/docs/advanced/Middleware.html) or [StoreEnhancers](https://github.com/reactjs/redux/blob/master/docs/Glossary.md#store-enhancer) and @@ -575,27 +584,32 @@ allows for some very powerful debugging tools. To try them out on an Angular pro Then, make a quick adjustment to enable them in your app: `app/app.module.ts` + ```typescript // Other imports as before -import { NgReduxModule, NgRedux, DevToolsExtension } from '@angular-redux/store'; // <- Changed +import { + NgReduxModule, + NgRedux, + DevToolsExtension +} from '@angular-redux/store'; // <- Changed @NgModule({ // Decorator as before }) export class AppModule { - constructor( - ngRedux: NgRedux, - devTools: DevToolsExtension) { // <- New + constructor(ngRedux: NgRedux, devTools: DevToolsExtension) { + // <- New - const storeEnhancers = devTools.isEnabled() ? // <- New - [ devTools.enhancer() ] : // <- New - []; // <- New + const storeEnhancers = devTools.isEnabled() // <- New + ? [devTools.enhancer()] // <- New + : []; // <- New ngRedux.configureStore( rootReducer, INITIAL_STATE, [], // <- New - storeEnhancers); // <- New + storeEnhancers + ); // <- New } } ``` diff --git a/packages/store/articles/quickstart.md b/packages/store/articles/quickstart.md index 621396ce..00a3aa93 100644 --- a/packages/store/articles/quickstart.md +++ b/packages/store/articles/quickstart.md @@ -14,6 +14,7 @@ import { AppModule } from './containers/app.module'; platformBrowserDynamic().bootstrapModule(AppModule); ``` + Import the `NgReduxModule` class and add it to your application module as an `import`. Once you've done this, you'll be able to inject `NgRedux` into your Angular components. In your top-level app module, you @@ -25,15 +26,17 @@ import { NgReduxModule, NgRedux } from '@angular-redux/store'; import { createLogger } from 'redux-logger'; import { rootReducer } from './reducers'; -interface IAppState { /* ... */ }; +interface IAppState { + /* ... */ +} @NgModule({ /* ... */ - imports: [ /* ... */, NgReduxModule ] + imports: [, /* ... */ NgReduxModule] }) export class AppModule { constructor(ngRedux: NgRedux) { - ngRedux.configureStore(rootReducer, {}, [ createLogger() ]); + ngRedux.configureStore(rootReducer, {}, [createLogger()]); } } ``` @@ -53,7 +56,9 @@ import { NgReduxModule, NgRedux } from '@angular-redux/store'; import { createLogger } from 'redux-logger'; import { rootReducer } from './reducers'; -interface IAppState { /* ... */ }; +interface IAppState { + /* ... */ +} export const store: Store = createStore( rootReducer, @@ -62,7 +67,7 @@ export const store: Store = createStore( @NgModule({ /* ... */ - imports: [ /* ... */, NgReduxModule ] + imports: [, /* ... */ NgReduxModule] }) class AppModule { constructor(ngRedux: NgRedux) { @@ -86,7 +91,8 @@ access your store state, and `.dispatch()` to dispatch actions: import { select } from '@angular-redux/store'; @Component({ - template: '' + template: + '' }) class App { @select() count$: Observable; diff --git a/packages/store/articles/redux-dev-tools.md b/packages/store/articles/redux-dev-tools.md index 3684e077..24421c99 100644 --- a/packages/store/articles/redux-dev-tools.md +++ b/packages/store/articles/redux-dev-tools.md @@ -15,31 +15,29 @@ tools that handles this for you. Here's how to hook the extension up to your app: ```typescript -import { NgReduxModule, NgRedux, DevToolsExtension } from '@angular-redux/store'; +import { + NgReduxModule, + NgRedux, + DevToolsExtension +} from '@angular-redux/store'; // Add the dev tools enhancer your ngRedux.configureStore called // when you initialize your root component: @NgModule({ /* ... */ - imports: [ /* ... */, NgReduxModule ] -})export class AppModule { - constructor( - private ngRedux: NgRedux, - private devTools: DevToolsExtension) { - + imports: [, /* ... */ NgReduxModule] +}) +export class AppModule { + constructor(private ngRedux: NgRedux, private devTools: DevToolsExtension) { let enhancers = []; // ... add whatever other enhancers you want. // You probably only want to expose this tool in devMode. if (__DEVMODE__ && devTools.isEnabled()) { - enhancers = [ ...enhancers, devTools.enhancer() ]; + enhancers = [...enhancers, devTools.enhancer()]; } - this.ngRedux.configureStore( - rootReducer, - initialState, - [], - enhancers); + this.ngRedux.configureStore(rootReducer, initialState, [], enhancers); } } ``` diff --git a/packages/store/articles/select-pattern.md b/packages/store/articles/select-pattern.md index f4e759c8..ecf60e23 100644 --- a/packages/store/articles/select-pattern.md +++ b/packages/store/articles/select-pattern.md @@ -15,11 +15,11 @@ The decorator expects to receive a `string`, an array of `string`s, a `function` parameter at all. - If a `string` is passed the `@select` decorator will attempt to observe a store -property whose name matches the `string`. + property whose name matches the `string`. - If an array of strings is passed, the decorator will attempt to match that path -through the store (similar to `immutableJS`'s `getIn`). + through the store (similar to `immutableJS`'s `getIn`). - If a `function` is passed the `@select` decorator will attempt to use that function -as a selector on the RxJs observable. + as a selector on the RxJs observable. - If nothing is passed then the `@select` decorator will attempt to use the name of the class property to find a matching value in the Redux store. Note that a utility is in place here where any $ characters will be ignored from the class property's name. ```typescript @@ -28,8 +28,8 @@ import { Observable } from 'rxjs/Observable'; import { select } from '@angular-redux/store'; @Component({ - selector: 'counter-value-printed-many-times', - template: ` + selector: 'counter-value-printed-many-times', + template: `

{{counter$ | async}}

{{counter | async}}

{{counterSelectedWithString | async}}

@@ -38,27 +38,28 @@ import { select } from '@angular-redux/store'; ` }) export class CounterValue { + // this selects `counter` from the store and attaches it to this property + // it uses the property name to select, and ignores the $ from it + @select() counter$; - // this selects `counter` from the store and attaches it to this property - // it uses the property name to select, and ignores the $ from it - @select() counter$; + // this selects `counter` from the store and attaches it to this property + @select() counter; - // this selects `counter` from the store and attaches it to this property - @select() counter; + // this selects `counter` from the store and attaches it to this property + @select('counter') counterSelectedWithString; - // this selects `counter` from the store and attaches it to this property - @select('counter') counterSelectedWithString; + // this selects `pathDemo.foo.bar` from the store and attaches it to this + // property. + @select(['pathDemo', 'foo', 'bar']) + pathSelection; - // this selects `pathDemo.foo.bar` from the store and attaches it to this - // property. - @select(['pathDemo', 'foo', 'bar']) pathSelection; + // this selects `counter` from the store and attaches it to this property + @select(state => state.counter) + counterSelectedWithFunction; - // this selects `counter` from the store and attaches it to this property - @select(state => state.counter) counterSelectedWithFunction; - - // this selects `counter` from the store and multiples it by two - @select(state => state.counter * 2) - counterSelectedWithFuntionAndMultipliedByTwo: Observable; + // this selects `counter` from the store and multiples it by two + @select(state => state.counter * 2) + counterSelectedWithFuntionAndMultipliedByTwo: Observable; } ``` @@ -76,11 +77,11 @@ import { NgRedux } from '@angular-redux/store'; interface IAppState { counter: number; -}; +} @Component({ - selector: 'root', - template: ` + selector: 'root', + template: ` @@ -93,15 +94,15 @@ export class Counter { constructor(private ngRedux: NgRedux) {} ngOnInit() { - let {increment, decrement } = CounterActions; + let { increment, decrement } = CounterActions; this.counter$ = this.ngRedux.select('counter'); } - incrementIfOdd = () => this.ngRedux.dispatch( - CounterActions.incrementIfOdd()); + incrementIfOdd = () => + this.ngRedux.dispatch(CounterActions.incrementIfOdd()); - incrementAsync = () => this.ngRedux.dispatch( - CounterActions.incrementAsync()); + incrementAsync = () => + this.ngRedux.dispatch(CounterActions.incrementAsync()); } ``` @@ -116,9 +117,7 @@ The `@select$` decorator works similar to `@select`, however you are able to spe ```typescript import { select$ } from 'angular-redux/store'; -export const debounceAndTriple = obs$ => obs$ - .debounce(300) - .map(x => 3 * x); +export const debounceAndTriple = obs$ => obs$.debounce(300).map(x => 3 * x); class Foo { @select$(['foo', 'bar'], debounceAndTriple) diff --git a/packages/store/articles/strongly-typed-reducers.md b/packages/store/articles/strongly-typed-reducers.md index 37dfa67d..0ef5bb4b 100644 --- a/packages/store/articles/strongly-typed-reducers.md +++ b/packages/store/articles/strongly-typed-reducers.md @@ -69,7 +69,10 @@ particular, consider importing and using the `Action` and `Reducer` types: ```typescript import { Action, Reducer } from 'redux'; -export const fooReducer: Reducer = (state: TFoo, action: Action): TFoo => { +export const fooReducer: Reducer = ( + state: TFoo, + action: Action +): TFoo => { // ... }; ``` @@ -87,14 +90,17 @@ npm install --save flux-standard-action ``` Flux standard actions take 'payload', and 'error' parameters in addition to the -basic `type`. Payloads in particular help you strengthen your reducers even +basic `type`. Payloads in particular help you strengthen your reducers even further: ```typescript import { Reducer } from 'redux'; import { Action } from 'flux-standard-action'; -export const fooReducer: Reducer = (state: TFoo, action: Action): TFoo => { +export const fooReducer: Reducer = ( + state: TFoo, + action: Action +): TFoo => { // ... }; ``` @@ -104,8 +110,11 @@ If you need more flexibility in payload types, you can use a union and [type assertions](https://www.typescriptlang.org/docs/handbook/advanced-types.html): ```typescript -export const barReducer: Reducer = (state: IBar, action: Action): IBar => { - switch(action.type) { +export const barReducer: Reducer = ( + state: IBar, + action: Action +): IBar => { + switch (action.type) { case A_HAS_CHANGED: return Object.assign({}, state, { a: action.payload @@ -127,8 +136,11 @@ In the Babel world, reducers often use `Object.assign` or property spread to maintain immutability. This works in Typescript too, but it's not typesafe: ```typescript -export const barReducer: Reducer = (state: IBar, action: Action): IBar => { - switch(action.type) { +export const barReducer: Reducer = ( + state: IBar, + action: Action +): IBar => { + switch (action.type) { case A_HAS_CHANGED: return Object.assign({}, state, { a: action.payload, @@ -150,8 +162,11 @@ that will catch this type of error: ```typescript import { tassign } from 'tassign'; -export const barReducer: Reducer = (state: IBar, action: Action): IBar => { - switch(action.type) { +export const barReducer: Reducer = ( + state: IBar, + action: Action +): IBar => { + switch (action.type) { case A_HAS_CHANGED: return tassign(state, { a: action.payload, diff --git a/packages/store/docs/assets/css/main.css b/packages/store/docs/assets/css/main.css index 48b3645c..fe716588 100644 --- a/packages/store/docs/assets/css/main.css +++ b/packages/store/docs/assets/css/main.css @@ -1,865 +1,2967 @@ /*! normalize.css v1.1.3 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /** Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. */ -article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } +article, +aside, +details, +figcaption, +figure, +footer, +header, +hgroup, +main, +nav, +section, +summary { + display: block; +} /** Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */ -audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } +audio, +canvas, +video { + display: inline-block; + *display: inline; + *zoom: 1; +} /** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */ -audio:not([controls]) { display: none; height: 0; } +audio:not([controls]) { + display: none; + height: 0; +} /** Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. Known issue: no IE 6 support. */ -[hidden] { display: none; } +[hidden] { + display: none; +} /* ========================================================================== Base ========================================================================== */ /** 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using `em` units. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */ -html { font-size: 100%; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ font-family: sans-serif; } +html { + font-size: 100%; /* 1 */ + -ms-text-size-adjust: 100%; /* 2 */ + -webkit-text-size-adjust: 100%; /* 2 */ + font-family: sans-serif; +} /** Address `font-family` inconsistency between `textarea` and other form elements. */ -button, input, select, textarea { font-family: sans-serif; } +button, +input, +select, +textarea { + font-family: sans-serif; +} /** Address margins handled incorrectly in IE 6/7. */ -body { margin: 0; } +body { + margin: 0; +} /* ========================================================================== Links ========================================================================== */ /** Address `outline` inconsistency between Chrome and other browsers. */ -a:focus { outline: thin dotted; } -a:active, a:hover { outline: 0; } +a:focus { + outline: thin dotted; +} +a:active, +a:hover { + outline: 0; +} /** Improve readability when focused and also mouse hovered in all browsers. */ /* ========================================================================== Typography ========================================================================== */ /** Address font sizes and margins set differently in IE 6/7. Address font sizes within `section` and `article` in Firefox 4+, Safari 5, and Chrome. */ -h1 { font-size: 2em; margin: 0.67em 0; } - -h2 { font-size: 1.5em; margin: 0.83em 0; } - -h3 { font-size: 1.17em; margin: 1em 0; } - -h4, .tsd-index-panel h3 { font-size: 1em; margin: 1.33em 0; } - -h5 { font-size: 0.83em; margin: 1.67em 0; } - -h6 { font-size: 0.67em; margin: 2.33em 0; } +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +h2 { + font-size: 1.5em; + margin: 0.83em 0; +} + +h3 { + font-size: 1.17em; + margin: 1em 0; +} + +h4, +.tsd-index-panel h3 { + font-size: 1em; + margin: 1.33em 0; +} + +h5 { + font-size: 0.83em; + margin: 1.67em 0; +} + +h6 { + font-size: 0.67em; + margin: 2.33em 0; +} /** Address styling not present in IE 7/8/9, Safari 5, and Chrome. */ -abbr[title] { border-bottom: 1px dotted; } +abbr[title] { + border-bottom: 1px dotted; +} /** Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */ -b, strong { font-weight: bold; } +b, +strong { + font-weight: bold; +} -blockquote { margin: 1em 40px; } +blockquote { + margin: 1em 40px; +} /** Address styling not present in Safari 5 and Chrome. */ -dfn { font-style: italic; } +dfn { + font-style: italic; +} /** Address differences between Firefox and other browsers. Known issue: no IE 6/7 normalization. */ -hr { box-sizing: content-box; height: 0; } +hr { + box-sizing: content-box; + height: 0; +} /** Address styling not present in IE 6/7/8/9. */ -mark { background: #ff0; color: #000; } +mark { + background: #ff0; + color: #000; +} /** Address margins set differently in IE 6/7. */ -p, pre { margin: 1em 0; } +p, +pre { + margin: 1em 0; +} /** Correct font family set oddly in IE 6, Safari 4/5, and Chrome. */ -code, kbd, pre, samp { font-family: monospace, serif; _font-family: "courier new", monospace; font-size: 1em; } +code, +kbd, +pre, +samp { + font-family: monospace, serif; + _font-family: 'courier new', monospace; + font-size: 1em; +} /** Improve readability of pre-formatted text in all browsers. */ -pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } +pre { + white-space: pre; + white-space: pre-wrap; + word-wrap: break-word; +} /** Address CSS quotes not supported in IE 6/7. */ -q { quotes: none; } -q:before, q:after { content: ""; content: none; } +q { + quotes: none; +} +q:before, +q:after { + content: ''; + content: none; +} /** Address `quotes` property not supported in Safari 4. */ /** Address inconsistent and variable font size in all browsers. */ -small { font-size: 80%; } +small { + font-size: 80%; +} /** Prevent `sub` and `sup` affecting `line-height` in all browsers. */ -sub { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } - -sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; top: -0.5em; } - -sub { bottom: -0.25em; } +sub { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; + top: -0.5em; +} + +sub { + bottom: -0.25em; +} /* ========================================================================== Lists ========================================================================== */ /** Address margins set differently in IE 6/7. */ -dl, menu, ol, ul { margin: 1em 0; } +dl, +menu, +ol, +ul { + margin: 1em 0; +} -dd { margin: 0 0 0 40px; } +dd { + margin: 0 0 0 40px; +} /** Address paddings set differently in IE 6/7. */ -menu, ol, ul { padding: 0 0 0 40px; } +menu, +ol, +ul { + padding: 0 0 0 40px; +} /** Correct list images handled incorrectly in IE 7. */ -nav ul, nav ol { list-style: none; list-style-image: none; } +nav ul, +nav ol { + list-style: none; + list-style-image: none; +} /* ========================================================================== Embedded content ========================================================================== */ /** 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3. 2. Improve image quality when scaled in IE 7. */ -img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; } +img { + border: 0; /* 1 */ + -ms-interpolation-mode: bicubic; +} /* 2 */ /** Correct overflow displayed oddly in IE 9. */ -svg:not(:root) { overflow: hidden; } +svg:not(:root) { + overflow: hidden; +} /* ========================================================================== Figures ========================================================================== */ /** Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11. */ -figure, form { margin: 0; } +figure, +form { + margin: 0; +} /* ========================================================================== Forms ========================================================================== */ /** Correct margin displayed oddly in IE 6/7. */ /** Define consistent border, margin, and padding. */ -fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} /** 1. Correct color not being inherited in IE 6/7/8/9. 2. Correct text not wrapping in Firefox 3. 3. Correct alignment displayed oddly in IE 6/7. */ -legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; } +legend { + border: 0; /* 1 */ + padding: 0; + white-space: normal; /* 2 */ + *margin-left: -7px; +} /* 3 */ /** 1. Correct font size not being inherited in all browsers. 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5, and Chrome. 3. Improve appearance and consistency in all browsers. */ -button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; } +button, +input, +select, +textarea { + font-size: 100%; /* 1 */ + margin: 0; /* 2 */ + vertical-align: baseline; /* 3 */ + *vertical-align: middle; +} /* 3 */ /** Address Firefox 3+ setting `line-height` on `input` using `!important` in the UA stylesheet. */ -button, input { line-height: normal; } +button, +input { + line-height: normal; +} /** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+. Correct `select` style inheritance in Firefox 4+ and Opera. */ -button, select { text-transform: none; } +button, +select { + text-transform: none; +} /** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. 4. Remove inner spacing in IE 7 without affecting normal text inputs. Known issue: inner spacing remains in IE 6. */ -button, html input[type="button"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; } +button, +html input[type='button'] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ + *overflow: visible; +} /* 4 */ -input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; } +input[type='reset'], +input[type='submit'] { + -webkit-appearance: button; /* 2 */ + cursor: pointer; /* 3 */ + *overflow: visible; +} /* 4 */ /** Re-set default cursor for disabled elements. */ -button[disabled], html input[disabled] { cursor: default; } +button[disabled], +html input[disabled] { + cursor: default; +} /** 1. Address box sizing set to content-box in IE 8/9. 2. Remove excess padding in IE 8/9. 3. Remove excess padding in IE 7. Known issue: excess padding remains in IE 6. */ -input { /* 3 */ } -input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; } -input[type="search"] { -webkit-appearance: textfield; /* 1 */ /* 2 */ box-sizing: content-box; } -input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } +input { + /* 3 */ +} +input[type='checkbox'], +input[type='radio'] { + box-sizing: border-box; /* 1 */ + padding: 0; /* 2 */ + *height: 13px; /* 3 */ + *width: 13px; +} +input[type='search'] { + -webkit-appearance: textfield; /* 1 */ /* 2 */ + box-sizing: content-box; +} +input[type='search']::-webkit-search-cancel-button, +input[type='search']::-webkit-search-decoration { + -webkit-appearance: none; +} /** 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome (include `-moz` to future-proof). */ /** Remove inner padding and search cancel button in Safari 5 and Chrome on OS X. */ /** Remove inner padding and border in Firefox 3+. */ -button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} /** 1. Remove default vertical scrollbar in IE 6/7/8/9. 2. Improve readability and alignment in all browsers. */ -textarea { overflow: auto; /* 1 */ vertical-align: top; } +textarea { + overflow: auto; /* 1 */ + vertical-align: top; +} /* 2 */ /* ========================================================================== Tables ========================================================================== */ /** Remove most spacing between table cells. */ -table { border-collapse: collapse; border-spacing: 0; } +table { + border-collapse: collapse; + border-spacing: 0; +} /* Visual Studio-like style based on original C# coloring by Jason Diamond */ -.hljs { display: inline-block; padding: 0.5em; background: white; color: black; } - -.hljs-comment, .hljs-annotation, .hljs-template_comment, .diff .hljs-header, .hljs-chunk, .apache .hljs-cbracket { color: #008000; } - -.hljs-keyword, .hljs-id, .hljs-built_in, .css .smalltalk .hljs-class, .hljs-winutils, .bash .hljs-variable, .tex .hljs-command, .hljs-request, .hljs-status, .nginx .hljs-title { color: #00f; } - -.xml .hljs-tag { color: #00f; } -.xml .hljs-tag .hljs-value { color: #00f; } - -.hljs-string, .hljs-title, .hljs-parent, .hljs-tag .hljs-value, .hljs-rules .hljs-value { color: #a31515; } - -.ruby .hljs-symbol { color: #a31515; } -.ruby .hljs-symbol .hljs-string { color: #a31515; } - -.hljs-template_tag, .django .hljs-variable, .hljs-addition, .hljs-flow, .hljs-stream, .apache .hljs-tag, .hljs-date, .tex .hljs-formula, .coffeescript .hljs-attribute { color: #a31515; } - -.ruby .hljs-string, .hljs-decorator, .hljs-filter .hljs-argument, .hljs-localvars, .hljs-array, .hljs-attr_selector, .hljs-pseudo, .hljs-pi, .hljs-doctype, .hljs-deletion, .hljs-envvar, .hljs-shebang, .hljs-preprocessor, .hljs-pragma, .userType, .apache .hljs-sqbracket, .nginx .hljs-built_in, .tex .hljs-special, .hljs-prompt { color: #2b91af; } - -.hljs-phpdoc, .hljs-javadoc, .hljs-xmlDocTag { color: #808080; } - -.vhdl .hljs-typename { font-weight: bold; } -.vhdl .hljs-string { color: #666666; } -.vhdl .hljs-literal { color: #a31515; } -.vhdl .hljs-attribute { color: #00b0e8; } - -.xml .hljs-attribute { color: #f00; } - -.col > :first-child, .col-1 > :first-child, .col-2 > :first-child, .col-3 > :first-child, .col-4 > :first-child, .col-5 > :first-child, .col-6 > :first-child, .col-7 > :first-child, .col-8 > :first-child, .col-9 > :first-child, .col-10 > :first-child, .col-11 > :first-child, .tsd-panel > :first-child, ul.tsd-descriptions > li > :first-child, .col > :first-child > :first-child, .col-1 > :first-child > :first-child, .col-2 > :first-child > :first-child, .col-3 > :first-child > :first-child, .col-4 > :first-child > :first-child, .col-5 > :first-child > :first-child, .col-6 > :first-child > :first-child, .col-7 > :first-child > :first-child, .col-8 > :first-child > :first-child, .col-9 > :first-child > :first-child, .col-10 > :first-child > :first-child, .col-11 > :first-child > :first-child, .tsd-panel > :first-child > :first-child, ul.tsd-descriptions > li > :first-child > :first-child, .col > :first-child > :first-child > :first-child, .col-1 > :first-child > :first-child > :first-child, .col-2 > :first-child > :first-child > :first-child, .col-3 > :first-child > :first-child > :first-child, .col-4 > :first-child > :first-child > :first-child, .col-5 > :first-child > :first-child > :first-child, .col-6 > :first-child > :first-child > :first-child, .col-7 > :first-child > :first-child > :first-child, .col-8 > :first-child > :first-child > :first-child, .col-9 > :first-child > :first-child > :first-child, .col-10 > :first-child > :first-child > :first-child, .col-11 > :first-child > :first-child > :first-child, .tsd-panel > :first-child > :first-child > :first-child, ul.tsd-descriptions > li > :first-child > :first-child > :first-child { margin-top: 0; } -.col > :last-child, .col-1 > :last-child, .col-2 > :last-child, .col-3 > :last-child, .col-4 > :last-child, .col-5 > :last-child, .col-6 > :last-child, .col-7 > :last-child, .col-8 > :last-child, .col-9 > :last-child, .col-10 > :last-child, .col-11 > :last-child, .tsd-panel > :last-child, ul.tsd-descriptions > li > :last-child, .col > :last-child > :last-child, .col-1 > :last-child > :last-child, .col-2 > :last-child > :last-child, .col-3 > :last-child > :last-child, .col-4 > :last-child > :last-child, .col-5 > :last-child > :last-child, .col-6 > :last-child > :last-child, .col-7 > :last-child > :last-child, .col-8 > :last-child > :last-child, .col-9 > :last-child > :last-child, .col-10 > :last-child > :last-child, .col-11 > :last-child > :last-child, .tsd-panel > :last-child > :last-child, ul.tsd-descriptions > li > :last-child > :last-child, .col > :last-child > :last-child > :last-child, .col-1 > :last-child > :last-child > :last-child, .col-2 > :last-child > :last-child > :last-child, .col-3 > :last-child > :last-child > :last-child, .col-4 > :last-child > :last-child > :last-child, .col-5 > :last-child > :last-child > :last-child, .col-6 > :last-child > :last-child > :last-child, .col-7 > :last-child > :last-child > :last-child, .col-8 > :last-child > :last-child > :last-child, .col-9 > :last-child > :last-child > :last-child, .col-10 > :last-child > :last-child > :last-child, .col-11 > :last-child > :last-child > :last-child, .tsd-panel > :last-child > :last-child > :last-child, ul.tsd-descriptions > li > :last-child > :last-child > :last-child { margin-bottom: 0; } - -.container { max-width: 1200px; margin: 0 auto; padding: 0 40px; } -@media (max-width: 640px) { .container { padding: 0 20px; } } - -.container-main { padding-bottom: 200px; } - -.row { position: relative; margin: 0 -10px; } -.row:after { visibility: hidden; display: block; content: ""; clear: both; height: 0; } - -.col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11 { box-sizing: border-box; float: left; padding: 0 10px; } - -.col-1 { width: 8.33333%; } - -.offset-1 { margin-left: 8.33333%; } - -.col-2 { width: 16.66667%; } - -.offset-2 { margin-left: 16.66667%; } - -.col-3 { width: 25%; } - -.offset-3 { margin-left: 25%; } - -.col-4 { width: 33.33333%; } - -.offset-4 { margin-left: 33.33333%; } - -.col-5 { width: 41.66667%; } - -.offset-5 { margin-left: 41.66667%; } - -.col-6 { width: 50%; } - -.offset-6 { margin-left: 50%; } - -.col-7 { width: 58.33333%; } - -.offset-7 { margin-left: 58.33333%; } - -.col-8 { width: 66.66667%; } - -.offset-8 { margin-left: 66.66667%; } - -.col-9 { width: 75%; } - -.offset-9 { margin-left: 75%; } - -.col-10 { width: 83.33333%; } - -.offset-10 { margin-left: 83.33333%; } - -.col-11 { width: 91.66667%; } - -.offset-11 { margin-left: 91.66667%; } - -.tsd-kind-icon { display: block; position: relative; padding-left: 20px; text-indent: -20px; } -.tsd-kind-icon:before { content: ''; display: inline-block; vertical-align: middle; width: 17px; height: 17px; margin: 0 3px 2px 0; background-image: url(../images/icons.png); } -@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { .tsd-kind-icon:before { background-image: url(../images/icons@2x.png); background-size: 238px 204px; } } - -.tsd-signature.tsd-kind-icon:before { background-position: 0 -153px; } - -.tsd-kind-object-literal > .tsd-kind-icon:before { background-position: 0px -17px; } -.tsd-kind-object-literal.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -17px; } -.tsd-kind-object-literal.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -17px; } - -.tsd-kind-class > .tsd-kind-icon:before { background-position: 0px -34px; } -.tsd-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -34px; } -.tsd-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -34px; } - -.tsd-kind-class.tsd-has-type-parameter > .tsd-kind-icon:before { background-position: 0px -51px; } -.tsd-kind-class.tsd-has-type-parameter.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -51px; } -.tsd-kind-class.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -51px; } - -.tsd-kind-interface > .tsd-kind-icon:before { background-position: 0px -68px; } -.tsd-kind-interface.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -68px; } -.tsd-kind-interface.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -68px; } - -.tsd-kind-interface.tsd-has-type-parameter > .tsd-kind-icon:before { background-position: 0px -85px; } -.tsd-kind-interface.tsd-has-type-parameter.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -85px; } -.tsd-kind-interface.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -85px; } - -.tsd-kind-module > .tsd-kind-icon:before { background-position: 0px -102px; } -.tsd-kind-module.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -102px; } -.tsd-kind-module.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -102px; } - -.tsd-kind-external-module > .tsd-kind-icon:before { background-position: 0px -102px; } -.tsd-kind-external-module.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -102px; } -.tsd-kind-external-module.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -102px; } - -.tsd-kind-enum > .tsd-kind-icon:before { background-position: 0px -119px; } -.tsd-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -119px; } -.tsd-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -119px; } - -.tsd-kind-enum-member > .tsd-kind-icon:before { background-position: 0px -136px; } -.tsd-kind-enum-member.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -136px; } -.tsd-kind-enum-member.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -136px; } - -.tsd-kind-signature > .tsd-kind-icon:before { background-position: 0px -153px; } -.tsd-kind-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -153px; } -.tsd-kind-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -153px; } - -.tsd-kind-type-alias > .tsd-kind-icon:before { background-position: 0px -170px; } -.tsd-kind-type-alias.tsd-is-protected > .tsd-kind-icon:before { background-position: -17px -170px; } -.tsd-kind-type-alias.tsd-is-private > .tsd-kind-icon:before { background-position: -34px -170px; } - -.tsd-kind-variable > .tsd-kind-icon:before { background-position: -136px -0px; } -.tsd-kind-variable.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -0px; } -.tsd-kind-variable.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-variable.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -0px; } -.tsd-kind-variable.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -0px; } -.tsd-kind-variable.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -0px; } -.tsd-kind-variable.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -0px; } -.tsd-kind-variable.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-variable.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -0px; } -.tsd-kind-variable.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -0px; } -.tsd-kind-variable.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-variable.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -0px; } -.tsd-kind-variable.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -0px; } - -.tsd-kind-property > .tsd-kind-icon:before { background-position: -136px -0px; } -.tsd-kind-property.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -0px; } -.tsd-kind-property.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-property.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -0px; } -.tsd-kind-property.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -0px; } -.tsd-kind-property.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -0px; } -.tsd-kind-property.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -0px; } -.tsd-kind-property.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-property.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -0px; } -.tsd-kind-property.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -0px; } -.tsd-kind-property.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -0px; } -.tsd-kind-property.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -0px; } -.tsd-kind-property.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -0px; } - -.tsd-kind-get-signature > .tsd-kind-icon:before { background-position: -136px -17px; } -.tsd-kind-get-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -17px; } -.tsd-kind-get-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -17px; } -.tsd-kind-get-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -17px; } - -.tsd-kind-set-signature > .tsd-kind-icon:before { background-position: -136px -34px; } -.tsd-kind-set-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -34px; } -.tsd-kind-set-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -34px; } -.tsd-kind-set-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -34px; } - -.tsd-kind-accessor > .tsd-kind-icon:before { background-position: -136px -51px; } -.tsd-kind-accessor.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -51px; } -.tsd-kind-accessor.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -51px; } -.tsd-kind-accessor.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -51px; } -.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -51px; } -.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -51px; } -.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -51px; } -.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -51px; } -.tsd-kind-accessor.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -51px; } -.tsd-kind-accessor.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -51px; } -.tsd-kind-accessor.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -51px; } -.tsd-kind-accessor.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -51px; } -.tsd-kind-accessor.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -51px; } - -.tsd-kind-function > .tsd-kind-icon:before { background-position: -136px -68px; } -.tsd-kind-function.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -68px; } -.tsd-kind-function.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-function.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -68px; } -.tsd-kind-function.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -68px; } -.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -68px; } -.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -68px; } -.tsd-kind-function.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-function.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -68px; } -.tsd-kind-function.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -68px; } -.tsd-kind-function.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-function.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -68px; } -.tsd-kind-function.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -68px; } - -.tsd-kind-method > .tsd-kind-icon:before { background-position: -136px -68px; } -.tsd-kind-method.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -68px; } -.tsd-kind-method.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-method.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -68px; } -.tsd-kind-method.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -68px; } -.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -68px; } -.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -68px; } -.tsd-kind-method.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-method.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -68px; } -.tsd-kind-method.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -68px; } -.tsd-kind-method.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-method.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -68px; } -.tsd-kind-method.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -68px; } - -.tsd-kind-call-signature > .tsd-kind-icon:before { background-position: -136px -68px; } -.tsd-kind-call-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -68px; } -.tsd-kind-call-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -68px; } -.tsd-kind-call-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -68px; } - -.tsd-kind-function.tsd-has-type-parameter > .tsd-kind-icon:before { background-position: -136px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -85px; } -.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -85px; } - -.tsd-kind-method.tsd-has-type-parameter > .tsd-kind-icon:before { background-position: -136px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -85px; } -.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -85px; } - -.tsd-kind-constructor > .tsd-kind-icon:before { background-position: -136px -102px; } -.tsd-kind-constructor.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -102px; } -.tsd-kind-constructor.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -102px; } -.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -102px; } -.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -102px; } -.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -102px; } -.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -102px; } -.tsd-kind-constructor.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -102px; } -.tsd-kind-constructor.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -102px; } -.tsd-kind-constructor.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -102px; } - -.tsd-kind-constructor-signature > .tsd-kind-icon:before { background-position: -136px -102px; } -.tsd-kind-constructor-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -102px; } -.tsd-kind-constructor-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -102px; } -.tsd-kind-constructor-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -102px; } - -.tsd-kind-index-signature > .tsd-kind-icon:before { background-position: -136px -119px; } -.tsd-kind-index-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -119px; } -.tsd-kind-index-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -119px; } -.tsd-kind-index-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -119px; } - -.tsd-kind-event > .tsd-kind-icon:before { background-position: -136px -136px; } -.tsd-kind-event.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -136px; } -.tsd-kind-event.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -136px; } -.tsd-kind-event.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -136px; } -.tsd-kind-event.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -136px; } -.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -136px; } -.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -136px; } -.tsd-kind-event.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -136px; } -.tsd-kind-event.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -136px; } -.tsd-kind-event.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -136px; } -.tsd-kind-event.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -136px; } -.tsd-kind-event.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -136px; } -.tsd-kind-event.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -136px; } - -.tsd-is-static > .tsd-kind-icon:before { background-position: -136px -153px; } -.tsd-is-static.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -153px; } -.tsd-is-static.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -153px; } -.tsd-is-static.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -153px; } -.tsd-is-static.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -153px; } -.tsd-is-static.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -153px; } -.tsd-is-static.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -153px; } -.tsd-is-static.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -153px; } -.tsd-is-static.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -153px; } -.tsd-is-static.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -153px; } -.tsd-is-static.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -153px; } -.tsd-is-static.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -153px; } -.tsd-is-static.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -153px; } - -.tsd-is-static.tsd-kind-function > .tsd-kind-icon:before { background-position: -136px -170px; } -.tsd-is-static.tsd-kind-function.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -170px; } -.tsd-is-static.tsd-kind-function.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -170px; } -.tsd-is-static.tsd-kind-function.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -170px; } - -.tsd-is-static.tsd-kind-method > .tsd-kind-icon:before { background-position: -136px -170px; } -.tsd-is-static.tsd-kind-method.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -170px; } -.tsd-is-static.tsd-kind-method.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -170px; } -.tsd-is-static.tsd-kind-method.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -170px; } - -.tsd-is-static.tsd-kind-call-signature > .tsd-kind-icon:before { background-position: -136px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -170px; } -.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -170px; } - -.tsd-is-static.tsd-kind-event > .tsd-kind-icon:before { background-position: -136px -187px; } -.tsd-is-static.tsd-kind-event.tsd-is-protected > .tsd-kind-icon:before { background-position: -153px -187px; } -.tsd-is-static.tsd-kind-event.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-class > .tsd-kind-icon:before { background-position: -51px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { background-position: -68px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { background-position: -85px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited > .tsd-kind-icon:before { background-position: -102px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum > .tsd-kind-icon:before { background-position: -170px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { background-position: -187px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { background-position: -119px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-interface > .tsd-kind-icon:before { background-position: -204px -187px; } -.tsd-is-static.tsd-kind-event.tsd-parent-kind-interface.tsd-is-inherited > .tsd-kind-icon:before { background-position: -221px -187px; } - -.no-transition { transition: none !important; } - -@-webkit-keyframes fade-in { from { opacity: 0; } - to { opacity: 1; } } - -@keyframes fade-in { from { opacity: 0; } - to { opacity: 1; } } -@-webkit-keyframes fade-out { from { opacity: 1; visibility: visible; } - to { opacity: 0; } } -@keyframes fade-out { from { opacity: 1; visibility: visible; } - to { opacity: 0; } } -@-webkit-keyframes fade-in-delayed { 0% { opacity: 0; } - 33% { opacity: 0; } - 100% { opacity: 1; } } -@keyframes fade-in-delayed { 0% { opacity: 0; } - 33% { opacity: 0; } - 100% { opacity: 1; } } -@-webkit-keyframes fade-out-delayed { 0% { opacity: 1; visibility: visible; } - 66% { opacity: 0; } - 100% { opacity: 0; } } -@keyframes fade-out-delayed { 0% { opacity: 1; visibility: visible; } - 66% { opacity: 0; } - 100% { opacity: 0; } } -@-webkit-keyframes shift-to-left { from { -webkit-transform: translate(0, 0); transform: translate(0, 0); } - to { -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); } } -@keyframes shift-to-left { from { -webkit-transform: translate(0, 0); transform: translate(0, 0); } - to { -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); } } -@-webkit-keyframes unshift-to-left { from { -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); } - to { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } -@keyframes unshift-to-left { from { -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); } - to { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } -@-webkit-keyframes pop-in-from-right { from { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } - to { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } -@keyframes pop-in-from-right { from { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } - to { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } -@-webkit-keyframes pop-out-to-right { from { -webkit-transform: translate(0, 0); transform: translate(0, 0); visibility: visible; } - to { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } } -@keyframes pop-out-to-right { from { -webkit-transform: translate(0, 0); transform: translate(0, 0); visibility: visible; } - to { -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } } -body { background: #fdfdfd; font-family: "Segoe UI", sans-serif; font-size: 16px; color: #222; } - -a { color: #4da6ff; text-decoration: none; } -a:hover { text-decoration: underline; } - -code, pre { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; padding: 0.2em; margin: 0; font-size: 14px; background-color: rgba(0, 0, 0, 0.04); } - -pre { padding: 10px; } -pre code { padding: 0; font-size: 100%; background-color: transparent; } - -.tsd-typography { line-height: 1.333em; } -.tsd-typography ul { list-style: square; padding: 0 0 0 20px; margin: 0; } -.tsd-typography h4, .tsd-typography .tsd-index-panel h3, .tsd-index-panel .tsd-typography h3, .tsd-typography h5, .tsd-typography h6 { font-size: 1em; margin: 0; } -.tsd-typography h5, .tsd-typography h6 { font-weight: normal; } -.tsd-typography p, .tsd-typography ul, .tsd-typography ol { margin: 1em 0; } - -@media (min-width: 901px) and (max-width: 1024px) { html.default .col-content { width: 72%; } - html.default .col-menu { width: 28%; } - html.default .tsd-navigation { padding-left: 10px; } } -@media (max-width: 900px) { html.default .col-content { float: none; width: 100%; } - html.default .col-menu { position: fixed !important; overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; z-index: 1024; top: 0 !important; bottom: 0 !important; left: auto !important; right: 0 !important; width: 100%; padding: 20px 20px 0 0; max-width: 450px; visibility: hidden; background-color: #fff; -webkit-transform: translate(100%, 0); transform: translate(100%, 0); } - html.default .col-menu > *:last-child { padding-bottom: 20px; } - html.default .overlay { content: ""; display: block; position: fixed; z-index: 1023; top: 0; left: 0; right: 0; bottom: 0; background-color: rgba(0, 0, 0, 0.75); visibility: hidden; } - html.default.to-has-menu .overlay { -webkit-animation: fade-in 0.4s; animation: fade-in 0.4s; } - html.default.to-has-menu header, html.default.to-has-menu footer, html.default.to-has-menu .col-content { -webkit-animation: shift-to-left 0.4s; animation: shift-to-left 0.4s; } - html.default.to-has-menu .col-menu { -webkit-animation: pop-in-from-right 0.4s; animation: pop-in-from-right 0.4s; } - html.default.from-has-menu .overlay { -webkit-animation: fade-out 0.4s; animation: fade-out 0.4s; } - html.default.from-has-menu header, html.default.from-has-menu footer, html.default.from-has-menu .col-content { -webkit-animation: unshift-to-left 0.4s; animation: unshift-to-left 0.4s; } - html.default.from-has-menu .col-menu { -webkit-animation: pop-out-to-right 0.4s; animation: pop-out-to-right 0.4s; } - html.default.has-menu body { overflow: hidden; } - html.default.has-menu .overlay { visibility: visible; } - html.default.has-menu header, html.default.has-menu footer, html.default.has-menu .col-content { -webkit-transform: translate(-25%, 0); transform: translate(-25%, 0); } - html.default.has-menu .col-menu { visibility: visible; -webkit-transform: translate(0, 0); transform: translate(0, 0); } } - -.tsd-page-title { padding: 70px 0 20px 0; margin: 0 0 40px 0; background: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.35); } -.tsd-page-title h1 { margin: 0; } - -.tsd-breadcrumb { margin: 0; padding: 0; color: #808080; } -.tsd-breadcrumb a { color: #808080; text-decoration: none; } -.tsd-breadcrumb a:hover { text-decoration: underline; } -.tsd-breadcrumb li { display: inline; } -.tsd-breadcrumb li:after { content: " / "; } - -html.minimal .container { margin: 0; } -html.minimal .container-main { padding-top: 50px; padding-bottom: 0; } -html.minimal .content-wrap { padding-left: 300px; } -html.minimal .tsd-navigation { position: fixed !important; overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; box-sizing: border-box; z-index: 1; left: 0; top: 40px; bottom: 0; width: 300px; padding: 20px; margin: 0; } -html.minimal .tsd-member .tsd-member { margin-left: 0; } -html.minimal .tsd-page-toolbar { position: fixed; z-index: 2; } -html.minimal #tsd-filter .tsd-filter-group { right: 0; -webkit-transform: none; transform: none; } -html.minimal footer { background-color: transparent; } -html.minimal footer .container { padding: 0; } -html.minimal .tsd-generator { padding: 0; } -@media (max-width: 900px) { html.minimal .tsd-navigation { display: none; } - html.minimal .content-wrap { padding-left: 0; } } - -dl.tsd-comment-tags { overflow: hidden; } -dl.tsd-comment-tags dt { clear: both; float: left; padding: 1px 5px; margin: 0 10px 0 0; border-radius: 4px; border: 1px solid #808080; color: #808080; font-size: 0.8em; font-weight: normal; } -dl.tsd-comment-tags dd { margin: 0 0 10px 0; } -dl.tsd-comment-tags p { margin: 0; } - -.tsd-panel.tsd-comment .lead { font-size: 1.1em; line-height: 1.333em; margin-bottom: 2em; } -.tsd-panel.tsd-comment .lead:last-child { margin-bottom: 0; } - -.toggle-protected .tsd-is-private { display: none; } - -.toggle-public .tsd-is-private, .toggle-public .tsd-is-protected, .toggle-public .tsd-is-private-protected { display: none; } - -.toggle-inherited .tsd-is-inherited { display: none; } - -.toggle-only-exported .tsd-is-not-exported { display: none; } - -.toggle-externals .tsd-is-external { display: none; } - -#tsd-filter { position: relative; display: inline-block; height: 40px; vertical-align: bottom; } -.no-filter #tsd-filter { display: none; } -#tsd-filter .tsd-filter-group { display: inline-block; height: 40px; vertical-align: bottom; white-space: nowrap; } -#tsd-filter input { display: none; } -@media (max-width: 900px) { #tsd-filter .tsd-filter-group { display: block; position: absolute; top: 40px; right: 20px; height: auto; background-color: #fff; visibility: hidden; -webkit-transform: translate(50%, 0); transform: translate(50%, 0); box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); } - .has-options #tsd-filter .tsd-filter-group { visibility: visible; } - .to-has-options #tsd-filter .tsd-filter-group { -webkit-animation: fade-in 0.2s; animation: fade-in 0.2s; } - .from-has-options #tsd-filter .tsd-filter-group { -webkit-animation: fade-out 0.2s; animation: fade-out 0.2s; } - #tsd-filter label, #tsd-filter .tsd-select { display: block; padding-right: 20px; } } - -footer { border-top: 1px solid #eee; background-color: #fff; } -footer.with-border-bottom { border-bottom: 1px solid #eee; } -footer .tsd-legend-group { font-size: 0; } -footer .tsd-legend { display: inline-block; width: 25%; padding: 0; font-size: 16px; list-style: none; line-height: 1.333em; vertical-align: top; } -@media (max-width: 900px) { footer .tsd-legend { width: 50%; } } - -.tsd-hierarchy { list-style: square; padding: 0 0 0 20px; margin: 0; } -.tsd-hierarchy .target { font-weight: bold; } - -.tsd-index-panel .tsd-index-content { margin-bottom: -30px !important; } -.tsd-index-panel .tsd-index-section { margin-bottom: 30px !important; } -.tsd-index-panel h3 { margin: 0 -20px 10px -20px; padding: 0 20px 10px 20px; border-bottom: 1px solid #eee; } -.tsd-index-panel ul.tsd-index-list { -webkit-column-count: 3; -moz-column-count: 3; -ms-column-count: 3; -o-column-count: 3; column-count: 3; -webkit-column-gap: 20px; -moz-column-gap: 20px; -ms-column-gap: 20px; -o-column-gap: 20px; column-gap: 20px; padding: 0; list-style: none; line-height: 1.333em; } -@media (max-width: 900px) { .tsd-index-panel ul.tsd-index-list { -webkit-column-count: 1; -moz-column-count: 1; -ms-column-count: 1; -o-column-count: 1; column-count: 1; } } -@media (min-width: 901px) and (max-width: 1024px) { .tsd-index-panel ul.tsd-index-list { -webkit-column-count: 2; -moz-column-count: 2; -ms-column-count: 2; -o-column-count: 2; column-count: 2; } } -.tsd-index-panel ul.tsd-index-list li { -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; -ms-column-break-inside: avoid; -o-column-break-inside: avoid; column-break-inside: avoid; -webkit-page-break-inside: avoid; -moz-page-break-inside: avoid; -ms-page-break-inside: avoid; -o-page-break-inside: avoid; page-break-inside: avoid; } -.tsd-index-panel a, .tsd-index-panel .tsd-parent-kind-module a { color: #9600ff; } -.tsd-index-panel .tsd-parent-kind-interface a { color: #7da01f; } -.tsd-index-panel .tsd-parent-kind-enum a { color: #cc9900; } -.tsd-index-panel .tsd-parent-kind-class a { color: #4da6ff; } -.tsd-index-panel .tsd-kind-module a { color: #9600ff; } -.tsd-index-panel .tsd-kind-interface a { color: #7da01f; } -.tsd-index-panel .tsd-kind-enum a { color: #cc9900; } -.tsd-index-panel .tsd-kind-class a { color: #4da6ff; } -.tsd-index-panel .tsd-is-private a { color: #808080; } - -.tsd-flag { display: inline-block; padding: 1px 5px; border-radius: 4px; color: #fff; background-color: #808080; text-indent: 0; font-size: 14px; font-weight: normal; } - -.tsd-anchor { position: absolute; top: -100px; } - -.tsd-member { position: relative; } -.tsd-member .tsd-anchor + h3 { margin-top: 0; margin-bottom: 0; border-bottom: none; } - -.tsd-navigation { padding: 0 0 0 40px; } -.tsd-navigation a { display: block; padding-top: 2px; padding-bottom: 2px; border-left: 2px solid transparent; color: #222; text-decoration: none; transition: border-left-color 0.1s; } -.tsd-navigation a:hover { text-decoration: underline; } -.tsd-navigation ul { margin: 0; padding: 0; list-style: none; } -.tsd-navigation li { padding: 0; } - -.tsd-navigation.primary { padding-bottom: 40px; } -.tsd-navigation.primary a { display: block; padding-top: 6px; padding-bottom: 6px; } -.tsd-navigation.primary ul li a { padding-left: 5px; } -.tsd-navigation.primary ul li li a { padding-left: 25px; } -.tsd-navigation.primary ul li li li a { padding-left: 45px; } -.tsd-navigation.primary ul li li li li a { padding-left: 65px; } -.tsd-navigation.primary ul li li li li li a { padding-left: 85px; } -.tsd-navigation.primary ul li li li li li li a { padding-left: 105px; } -.tsd-navigation.primary > ul { border-bottom: 1px solid #eee; } -.tsd-navigation.primary li { border-top: 1px solid #eee; } -.tsd-navigation.primary li.current > a { font-weight: bold; } -.tsd-navigation.primary li.label span { display: block; padding: 20px 0 6px 5px; color: #808080; } -.tsd-navigation.primary li.globals + li > span, .tsd-navigation.primary li.globals + li > a { padding-top: 20px; } - -.tsd-navigation.secondary ul { transition: opacity 0.2s; } -.tsd-navigation.secondary ul li a { padding-left: 25px; } -.tsd-navigation.secondary ul li li a { padding-left: 45px; } -.tsd-navigation.secondary ul li li li a { padding-left: 65px; } -.tsd-navigation.secondary ul li li li li a { padding-left: 85px; } -.tsd-navigation.secondary ul li li li li li a { padding-left: 105px; } -.tsd-navigation.secondary ul li li li li li li a { padding-left: 125px; } -.tsd-navigation.secondary ul.current a { border-left-color: #eee; } -.tsd-navigation.secondary li.focus > a, .tsd-navigation.secondary ul.current li.focus > a { border-left-color: #000; } -.tsd-navigation.secondary li.current { margin-top: 20px; margin-bottom: 20px; border-left-color: #eee; } -.tsd-navigation.secondary li.current > a { font-weight: bold; } - -@media (min-width: 901px) { .menu-sticky-wrap { position: static; } - .no-csspositionsticky .menu-sticky-wrap.sticky { position: fixed; } - .no-csspositionsticky .menu-sticky-wrap.sticky-current { position: fixed; } - .no-csspositionsticky .menu-sticky-wrap.sticky-current ul.before-current, .no-csspositionsticky .menu-sticky-wrap.sticky-current ul.after-current { opacity: 0; } - .no-csspositionsticky .menu-sticky-wrap.sticky-bottom { position: absolute; top: auto !important; left: auto !important; bottom: 0; right: 0; } - .csspositionsticky .menu-sticky-wrap.sticky { position: -webkit-sticky; position: sticky; } - .csspositionsticky .menu-sticky-wrap.sticky-current { position: -webkit-sticky; position: sticky; } } - -.tsd-panel { margin: 20px 0; padding: 20px; background-color: #fff; box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); } -.tsd-panel:empty { display: none; } -.tsd-panel > h1, .tsd-panel > h2, .tsd-panel > h3 { margin: 1.5em -20px 10px -20px; padding: 0 20px 10px 20px; border-bottom: 1px solid #eee; } -.tsd-panel > h1.tsd-before-signature, .tsd-panel > h2.tsd-before-signature, .tsd-panel > h3.tsd-before-signature { margin-bottom: 0; border-bottom: 0; } -.tsd-panel table { display: block; width: 100%; overflow: auto; margin-top: 10px; word-break: normal; word-break: keep-all; } -.tsd-panel table th { font-weight: bold; } -.tsd-panel table th, .tsd-panel table td { padding: 6px 13px; border: 1px solid #ddd; } -.tsd-panel table tr { background-color: #fff; border-top: 1px solid #ccc; } -.tsd-panel table tr:nth-child(2n) { background-color: #f8f8f8; } - -.tsd-panel-group { margin: 60px 0; } -.tsd-panel-group > h1, .tsd-panel-group > h2, .tsd-panel-group > h3 { padding-left: 20px; padding-right: 20px; } - -#tsd-search { transition: background-color 0.2s; } -#tsd-search .title { position: relative; z-index: 2; } -#tsd-search .field { position: absolute; left: 0; top: 0; right: 40px; height: 40px; } -#tsd-search .field input { box-sizing: border-box; position: relative; top: -50px; z-index: 1; width: 100%; padding: 0 10px; opacity: 0; outline: 0; border: 0; background: transparent; color: #222; } -#tsd-search .field label { position: absolute; overflow: hidden; right: -40px; } -#tsd-search .field input, #tsd-search .title { transition: opacity 0.2s; } -#tsd-search .results { position: absolute; visibility: hidden; top: 40px; width: 100%; margin: 0; padding: 0; list-style: none; box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); } -#tsd-search .results li { padding: 0 10px; background-color: #fdfdfd; } -#tsd-search .results li:nth-child(even) { background-color: #fff; } -#tsd-search .results li.state { display: none; } -#tsd-search .results li.current, #tsd-search .results li:hover { background-color: #eee; } -#tsd-search .results a { display: block; } -#tsd-search .results a:before { top: 10px; } -#tsd-search .results span.parent { color: #808080; font-weight: normal; } -#tsd-search.has-focus { background-color: #eee; } -#tsd-search.has-focus .field input { top: 0; opacity: 1; } -#tsd-search.has-focus .title { z-index: 0; opacity: 0; } -#tsd-search.has-focus .results { visibility: visible; } -#tsd-search.loading .results li.state.loading { display: block; } -#tsd-search.failure .results li.state.failure { display: block; } - -.tsd-signature { margin: 0 0 1em 0; padding: 10px; border: 1px solid #eee; font-family: Menlo, Monaco, Consolas, "Courier New", monospace; font-size: 14px; } -.tsd-signature.tsd-kind-icon { padding-left: 30px; } -.tsd-signature.tsd-kind-icon:before { top: 10px; left: 10px; } -.tsd-panel > .tsd-signature { margin-left: -20px; margin-right: -20px; border-width: 1px 0; } -.tsd-panel > .tsd-signature.tsd-kind-icon { padding-left: 40px; } -.tsd-panel > .tsd-signature.tsd-kind-icon:before { left: 20px; } - -.tsd-signature-symbol { color: #808080; font-weight: normal; } - -.tsd-signature-type { font-style: italic; font-weight: normal; } - -.tsd-signatures { padding: 0; margin: 0 0 1em 0; border: 1px solid #eee; } -.tsd-signatures .tsd-signature { margin: 0; border-width: 1px 0 0 0; transition: background-color 0.1s; } -.tsd-signatures .tsd-signature:first-child { border-top-width: 0; } -.tsd-signatures .tsd-signature.current { background-color: #eee; } -.tsd-signatures.active > .tsd-signature { cursor: pointer; } -.tsd-panel > .tsd-signatures { margin-left: -20px; margin-right: -20px; border-width: 1px 0; } -.tsd-panel > .tsd-signatures .tsd-signature.tsd-kind-icon { padding-left: 40px; } -.tsd-panel > .tsd-signatures .tsd-signature.tsd-kind-icon:before { left: 20px; } -.tsd-panel > a.anchor + .tsd-signatures { border-top-width: 0; margin-top: -20px; } - -ul.tsd-descriptions { position: relative; overflow: hidden; transition: height 0.3s; padding: 0; list-style: none; } -ul.tsd-descriptions.active > .tsd-description { display: none; } -ul.tsd-descriptions.active > .tsd-description.current { display: block; } -ul.tsd-descriptions.active > .tsd-description.fade-in { -webkit-animation: fade-in-delayed 0.3s; animation: fade-in-delayed 0.3s; } -ul.tsd-descriptions.active > .tsd-description.fade-out { -webkit-animation: fade-out-delayed 0.3s; animation: fade-out-delayed 0.3s; position: absolute; display: block; top: 0; left: 0; right: 0; opacity: 0; visibility: hidden; } -ul.tsd-descriptions h4, ul.tsd-descriptions .tsd-index-panel h3, .tsd-index-panel ul.tsd-descriptions h3 { font-size: 16px; margin: 1em 0 0.5em 0; } - -ul.tsd-parameters, ul.tsd-type-parameters { list-style: square; margin: 0; padding-left: 20px; } -ul.tsd-parameters > li.tsd-parameter-siganture, ul.tsd-type-parameters > li.tsd-parameter-siganture { list-style: none; margin-left: -20px; } -ul.tsd-parameters h5, ul.tsd-type-parameters h5 { font-size: 16px; margin: 1em 0 0.5em 0; } -ul.tsd-parameters .tsd-comment, ul.tsd-type-parameters .tsd-comment { margin-top: -0.5em; } - -.tsd-sources { font-size: 14px; color: #808080; margin: 0 0 1em 0; } -.tsd-sources a { color: #808080; text-decoration: underline; } -.tsd-sources ul, .tsd-sources p { margin: 0 !important; } -.tsd-sources ul { list-style: none; padding: 0; } - -.tsd-page-toolbar { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 40px; color: #333; background: #fff; border-bottom: 1px solid #eee; } -.tsd-page-toolbar a { color: #333; text-decoration: none; } -.tsd-page-toolbar a.title { font-weight: bold; } -.tsd-page-toolbar a.title:hover { text-decoration: underline; } -.tsd-page-toolbar .table-wrap { display: table; width: 100%; height: 40px; } -.tsd-page-toolbar .table-cell { display: table-cell; position: relative; white-space: nowrap; line-height: 40px; } -.tsd-page-toolbar .table-cell:first-child { width: 100%; } - -.tsd-widget:before, .tsd-select .tsd-select-label:before, .tsd-select .tsd-select-list li:before { content: ""; display: inline-block; width: 40px; height: 40px; margin: 0 -8px 0 0; background-image: url(../images/widgets.png); background-repeat: no-repeat; text-indent: -1024px; vertical-align: bottom; } -@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { .tsd-widget:before, .tsd-select .tsd-select-label:before, .tsd-select .tsd-select-list li:before { background-image: url(../images/widgets@2x.png); background-size: 320px 40px; } } - -.tsd-widget { display: inline-block; overflow: hidden; opacity: 0.6; height: 40px; transition: opacity 0.1s, background-color 0.2s; vertical-align: bottom; cursor: pointer; } -.tsd-widget:hover { opacity: 0.8; } -.tsd-widget.active { opacity: 1; background-color: #eee; } -.tsd-widget.no-caption { width: 40px; } -.tsd-widget.no-caption:before { margin: 0; } -.tsd-widget.search:before { background-position: 0 0; } -.tsd-widget.menu:before { background-position: -40px 0; } -.tsd-widget.options:before { background-position: -80px 0; } -.tsd-widget.options, .tsd-widget.menu { display: none; } -@media (max-width: 900px) { .tsd-widget.options, .tsd-widget.menu { display: inline-block; } } -input[type=checkbox] + .tsd-widget:before { background-position: -120px 0; } -input[type=checkbox]:checked + .tsd-widget:before { background-position: -160px 0; } - -.tsd-select { position: relative; display: inline-block; height: 40px; transition: opacity 0.1s, background-color 0.2s; vertical-align: bottom; cursor: pointer; } -.tsd-select .tsd-select-label { opacity: 0.6; transition: opacity 0.2s; } -.tsd-select .tsd-select-label:before { background-position: -240px 0; } -.tsd-select.active .tsd-select-label { opacity: 0.8; } -.tsd-select.active .tsd-select-list { visibility: visible; opacity: 1; transition-delay: 0s; } -.tsd-select .tsd-select-list { position: absolute; visibility: hidden; top: 40px; left: 0; margin: 0; padding: 0; opacity: 0; list-style: none; box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); transition: visibility 0s 0.2s, opacity 0.2s; } -.tsd-select .tsd-select-list li { padding: 0 20px 0 0; background-color: #fdfdfd; } -.tsd-select .tsd-select-list li:before { background-position: 40px 0; } -.tsd-select .tsd-select-list li:nth-child(even) { background-color: #fff; } -.tsd-select .tsd-select-list li:hover { background-color: #eee; } -.tsd-select .tsd-select-list li.selected:before { background-position: -200px 0; } -@media (max-width: 900px) { .tsd-select .tsd-select-list { top: 0; left: auto; right: 100%; margin-right: -5px; } - .tsd-select .tsd-select-label:before { background-position: -280px 0; } } - -img { max-width: 100%; } +.hljs { + display: inline-block; + padding: 0.5em; + background: white; + color: black; +} + +.hljs-comment, +.hljs-annotation, +.hljs-template_comment, +.diff .hljs-header, +.hljs-chunk, +.apache .hljs-cbracket { + color: #008000; +} + +.hljs-keyword, +.hljs-id, +.hljs-built_in, +.css .smalltalk .hljs-class, +.hljs-winutils, +.bash .hljs-variable, +.tex .hljs-command, +.hljs-request, +.hljs-status, +.nginx .hljs-title { + color: #00f; +} + +.xml .hljs-tag { + color: #00f; +} +.xml .hljs-tag .hljs-value { + color: #00f; +} + +.hljs-string, +.hljs-title, +.hljs-parent, +.hljs-tag .hljs-value, +.hljs-rules .hljs-value { + color: #a31515; +} + +.ruby .hljs-symbol { + color: #a31515; +} +.ruby .hljs-symbol .hljs-string { + color: #a31515; +} + +.hljs-template_tag, +.django .hljs-variable, +.hljs-addition, +.hljs-flow, +.hljs-stream, +.apache .hljs-tag, +.hljs-date, +.tex .hljs-formula, +.coffeescript .hljs-attribute { + color: #a31515; +} + +.ruby .hljs-string, +.hljs-decorator, +.hljs-filter .hljs-argument, +.hljs-localvars, +.hljs-array, +.hljs-attr_selector, +.hljs-pseudo, +.hljs-pi, +.hljs-doctype, +.hljs-deletion, +.hljs-envvar, +.hljs-shebang, +.hljs-preprocessor, +.hljs-pragma, +.userType, +.apache .hljs-sqbracket, +.nginx .hljs-built_in, +.tex .hljs-special, +.hljs-prompt { + color: #2b91af; +} + +.hljs-phpdoc, +.hljs-javadoc, +.hljs-xmlDocTag { + color: #808080; +} + +.vhdl .hljs-typename { + font-weight: bold; +} +.vhdl .hljs-string { + color: #666666; +} +.vhdl .hljs-literal { + color: #a31515; +} +.vhdl .hljs-attribute { + color: #00b0e8; +} + +.xml .hljs-attribute { + color: #f00; +} + +.col > :first-child, +.col-1 > :first-child, +.col-2 > :first-child, +.col-3 > :first-child, +.col-4 > :first-child, +.col-5 > :first-child, +.col-6 > :first-child, +.col-7 > :first-child, +.col-8 > :first-child, +.col-9 > :first-child, +.col-10 > :first-child, +.col-11 > :first-child, +.tsd-panel > :first-child, +ul.tsd-descriptions > li > :first-child, +.col > :first-child > :first-child, +.col-1 > :first-child > :first-child, +.col-2 > :first-child > :first-child, +.col-3 > :first-child > :first-child, +.col-4 > :first-child > :first-child, +.col-5 > :first-child > :first-child, +.col-6 > :first-child > :first-child, +.col-7 > :first-child > :first-child, +.col-8 > :first-child > :first-child, +.col-9 > :first-child > :first-child, +.col-10 > :first-child > :first-child, +.col-11 > :first-child > :first-child, +.tsd-panel > :first-child > :first-child, +ul.tsd-descriptions > li > :first-child > :first-child, +.col > :first-child > :first-child > :first-child, +.col-1 > :first-child > :first-child > :first-child, +.col-2 > :first-child > :first-child > :first-child, +.col-3 > :first-child > :first-child > :first-child, +.col-4 > :first-child > :first-child > :first-child, +.col-5 > :first-child > :first-child > :first-child, +.col-6 > :first-child > :first-child > :first-child, +.col-7 > :first-child > :first-child > :first-child, +.col-8 > :first-child > :first-child > :first-child, +.col-9 > :first-child > :first-child > :first-child, +.col-10 > :first-child > :first-child > :first-child, +.col-11 > :first-child > :first-child > :first-child, +.tsd-panel > :first-child > :first-child > :first-child, +ul.tsd-descriptions > li > :first-child > :first-child > :first-child { + margin-top: 0; +} +.col > :last-child, +.col-1 > :last-child, +.col-2 > :last-child, +.col-3 > :last-child, +.col-4 > :last-child, +.col-5 > :last-child, +.col-6 > :last-child, +.col-7 > :last-child, +.col-8 > :last-child, +.col-9 > :last-child, +.col-10 > :last-child, +.col-11 > :last-child, +.tsd-panel > :last-child, +ul.tsd-descriptions > li > :last-child, +.col > :last-child > :last-child, +.col-1 > :last-child > :last-child, +.col-2 > :last-child > :last-child, +.col-3 > :last-child > :last-child, +.col-4 > :last-child > :last-child, +.col-5 > :last-child > :last-child, +.col-6 > :last-child > :last-child, +.col-7 > :last-child > :last-child, +.col-8 > :last-child > :last-child, +.col-9 > :last-child > :last-child, +.col-10 > :last-child > :last-child, +.col-11 > :last-child > :last-child, +.tsd-panel > :last-child > :last-child, +ul.tsd-descriptions > li > :last-child > :last-child, +.col > :last-child > :last-child > :last-child, +.col-1 > :last-child > :last-child > :last-child, +.col-2 > :last-child > :last-child > :last-child, +.col-3 > :last-child > :last-child > :last-child, +.col-4 > :last-child > :last-child > :last-child, +.col-5 > :last-child > :last-child > :last-child, +.col-6 > :last-child > :last-child > :last-child, +.col-7 > :last-child > :last-child > :last-child, +.col-8 > :last-child > :last-child > :last-child, +.col-9 > :last-child > :last-child > :last-child, +.col-10 > :last-child > :last-child > :last-child, +.col-11 > :last-child > :last-child > :last-child, +.tsd-panel > :last-child > :last-child > :last-child, +ul.tsd-descriptions > li > :last-child > :last-child > :last-child { + margin-bottom: 0; +} + +.container { + max-width: 1200px; + margin: 0 auto; + padding: 0 40px; +} +@media (max-width: 640px) { + .container { + padding: 0 20px; + } +} + +.container-main { + padding-bottom: 200px; +} + +.row { + position: relative; + margin: 0 -10px; +} +.row:after { + visibility: hidden; + display: block; + content: ''; + clear: both; + height: 0; +} + +.col, +.col-1, +.col-2, +.col-3, +.col-4, +.col-5, +.col-6, +.col-7, +.col-8, +.col-9, +.col-10, +.col-11 { + box-sizing: border-box; + float: left; + padding: 0 10px; +} + +.col-1 { + width: 8.33333%; +} + +.offset-1 { + margin-left: 8.33333%; +} + +.col-2 { + width: 16.66667%; +} + +.offset-2 { + margin-left: 16.66667%; +} + +.col-3 { + width: 25%; +} + +.offset-3 { + margin-left: 25%; +} + +.col-4 { + width: 33.33333%; +} + +.offset-4 { + margin-left: 33.33333%; +} + +.col-5 { + width: 41.66667%; +} + +.offset-5 { + margin-left: 41.66667%; +} + +.col-6 { + width: 50%; +} + +.offset-6 { + margin-left: 50%; +} + +.col-7 { + width: 58.33333%; +} + +.offset-7 { + margin-left: 58.33333%; +} + +.col-8 { + width: 66.66667%; +} + +.offset-8 { + margin-left: 66.66667%; +} + +.col-9 { + width: 75%; +} + +.offset-9 { + margin-left: 75%; +} + +.col-10 { + width: 83.33333%; +} + +.offset-10 { + margin-left: 83.33333%; +} + +.col-11 { + width: 91.66667%; +} + +.offset-11 { + margin-left: 91.66667%; +} + +.tsd-kind-icon { + display: block; + position: relative; + padding-left: 20px; + text-indent: -20px; +} +.tsd-kind-icon:before { + content: ''; + display: inline-block; + vertical-align: middle; + width: 17px; + height: 17px; + margin: 0 3px 2px 0; + background-image: url(../images/icons.png); +} +@media (-webkit-min-device-pixel-ratio: 1.5), + (min-device-pixel-ratio: 1.5), + (min-resolution: 144dpi) { + .tsd-kind-icon:before { + background-image: url(../images/icons@2x.png); + background-size: 238px 204px; + } +} + +.tsd-signature.tsd-kind-icon:before { + background-position: 0 -153px; +} + +.tsd-kind-object-literal > .tsd-kind-icon:before { + background-position: 0px -17px; +} +.tsd-kind-object-literal.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -17px; +} +.tsd-kind-object-literal.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -17px; +} + +.tsd-kind-class > .tsd-kind-icon:before { + background-position: 0px -34px; +} +.tsd-kind-class.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -34px; +} +.tsd-kind-class.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -34px; +} + +.tsd-kind-class.tsd-has-type-parameter > .tsd-kind-icon:before { + background-position: 0px -51px; +} +.tsd-kind-class.tsd-has-type-parameter.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -17px -51px; +} +.tsd-kind-class.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -51px; +} + +.tsd-kind-interface > .tsd-kind-icon:before { + background-position: 0px -68px; +} +.tsd-kind-interface.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -68px; +} +.tsd-kind-interface.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -68px; +} + +.tsd-kind-interface.tsd-has-type-parameter > .tsd-kind-icon:before { + background-position: 0px -85px; +} +.tsd-kind-interface.tsd-has-type-parameter.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -17px -85px; +} +.tsd-kind-interface.tsd-has-type-parameter.tsd-is-private + > .tsd-kind-icon:before { + background-position: -34px -85px; +} + +.tsd-kind-module > .tsd-kind-icon:before { + background-position: 0px -102px; +} +.tsd-kind-module.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -102px; +} +.tsd-kind-module.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -102px; +} + +.tsd-kind-external-module > .tsd-kind-icon:before { + background-position: 0px -102px; +} +.tsd-kind-external-module.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -102px; +} +.tsd-kind-external-module.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -102px; +} + +.tsd-kind-enum > .tsd-kind-icon:before { + background-position: 0px -119px; +} +.tsd-kind-enum.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -119px; +} +.tsd-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -119px; +} + +.tsd-kind-enum-member > .tsd-kind-icon:before { + background-position: 0px -136px; +} +.tsd-kind-enum-member.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -136px; +} +.tsd-kind-enum-member.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -136px; +} + +.tsd-kind-signature > .tsd-kind-icon:before { + background-position: 0px -153px; +} +.tsd-kind-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -153px; +} +.tsd-kind-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -153px; +} + +.tsd-kind-type-alias > .tsd-kind-icon:before { + background-position: 0px -170px; +} +.tsd-kind-type-alias.tsd-is-protected > .tsd-kind-icon:before { + background-position: -17px -170px; +} +.tsd-kind-type-alias.tsd-is-private > .tsd-kind-icon:before { + background-position: -34px -170px; +} + +.tsd-kind-variable > .tsd-kind-icon:before { + background-position: -136px -0px; +} +.tsd-kind-variable.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -0px; +} +.tsd-kind-variable.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-variable.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -0px; +} +.tsd-kind-variable.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -0px; +} +.tsd-kind-variable.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -0px; +} +.tsd-kind-variable.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -0px; +} +.tsd-kind-variable.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-variable.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -0px; +} +.tsd-kind-variable.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -0px; +} +.tsd-kind-variable.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-variable.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -0px; +} +.tsd-kind-variable.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -0px; +} + +.tsd-kind-property > .tsd-kind-icon:before { + background-position: -136px -0px; +} +.tsd-kind-property.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -0px; +} +.tsd-kind-property.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-property.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -0px; +} +.tsd-kind-property.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -0px; +} +.tsd-kind-property.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -0px; +} +.tsd-kind-property.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -0px; +} +.tsd-kind-property.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-property.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -0px; +} +.tsd-kind-property.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -0px; +} +.tsd-kind-property.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -0px; +} +.tsd-kind-property.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -0px; +} +.tsd-kind-property.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -0px; +} + +.tsd-kind-get-signature > .tsd-kind-icon:before { + background-position: -136px -17px; +} +.tsd-kind-get-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -17px; +} +.tsd-kind-get-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -17px; +} +.tsd-kind-get-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -17px; +} + +.tsd-kind-set-signature > .tsd-kind-icon:before { + background-position: -136px -34px; +} +.tsd-kind-set-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -34px; +} +.tsd-kind-set-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -34px; +} +.tsd-kind-set-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -34px; +} + +.tsd-kind-accessor > .tsd-kind-icon:before { + background-position: -136px -51px; +} +.tsd-kind-accessor.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -51px; +} +.tsd-kind-accessor.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -51px; +} +.tsd-kind-accessor.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -51px; +} + +.tsd-kind-function > .tsd-kind-icon:before { + background-position: -136px -68px; +} +.tsd-kind-function.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -68px; +} +.tsd-kind-function.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-function.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -68px; +} +.tsd-kind-function.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -68px; +} +.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -68px; +} +.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -68px; +} +.tsd-kind-function.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-function.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -68px; +} +.tsd-kind-function.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -68px; +} +.tsd-kind-function.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-function.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -68px; +} +.tsd-kind-function.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -68px; +} + +.tsd-kind-method > .tsd-kind-icon:before { + background-position: -136px -68px; +} +.tsd-kind-method.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -68px; +} +.tsd-kind-method.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-method.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -68px; +} +.tsd-kind-method.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -68px; +} +.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -68px; +} +.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -68px; +} +.tsd-kind-method.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-method.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -68px; +} +.tsd-kind-method.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { + background-position: -187px -68px; +} +.tsd-kind-method.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-method.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -68px; +} +.tsd-kind-method.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -68px; +} + +.tsd-kind-call-signature > .tsd-kind-icon:before { + background-position: -136px -68px; +} +.tsd-kind-call-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -68px; +} +.tsd-kind-call-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -68px; +} +.tsd-kind-call-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -68px; +} + +.tsd-kind-function.tsd-has-type-parameter > .tsd-kind-icon:before { + background-position: -136px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -153px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class + > .tsd-kind-icon:before { + background-position: -51px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum + > .tsd-kind-icon:before { + background-position: -170px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -85px; +} +.tsd-kind-function.tsd-has-type-parameter.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -85px; +} + +.tsd-kind-method.tsd-has-type-parameter > .tsd-kind-icon:before { + background-position: -136px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -153px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class + > .tsd-kind-icon:before { + background-position: -51px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum + > .tsd-kind-icon:before { + background-position: -170px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -85px; +} +.tsd-kind-method.tsd-has-type-parameter.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -85px; +} + +.tsd-kind-constructor > .tsd-kind-icon:before { + background-position: -136px -102px; +} +.tsd-kind-constructor.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -102px; +} +.tsd-kind-constructor.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -102px; +} +.tsd-kind-constructor.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -102px; +} + +.tsd-kind-constructor-signature > .tsd-kind-icon:before { + background-position: -136px -102px; +} +.tsd-kind-constructor-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -102px; +} +.tsd-kind-constructor-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -102px; +} +.tsd-kind-constructor-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -102px; +} + +.tsd-kind-index-signature > .tsd-kind-icon:before { + background-position: -136px -119px; +} +.tsd-kind-index-signature.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -119px; +} +.tsd-kind-index-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -119px; +} +.tsd-kind-index-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -119px; +} + +.tsd-kind-event > .tsd-kind-icon:before { + background-position: -136px -136px; +} +.tsd-kind-event.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -136px; +} +.tsd-kind-event.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -136px; +} +.tsd-kind-event.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -136px; +} +.tsd-kind-event.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { + background-position: -68px -136px; +} +.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { + background-position: -85px -136px; +} +.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -136px; +} +.tsd-kind-event.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -136px; +} +.tsd-kind-event.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -136px; +} +.tsd-kind-event.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { + background-position: -187px -136px; +} +.tsd-kind-event.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -136px; +} +.tsd-kind-event.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -136px; +} +.tsd-kind-event.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -136px; +} + +.tsd-is-static > .tsd-kind-icon:before { + background-position: -136px -153px; +} +.tsd-is-static.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -153px; +} +.tsd-is-static.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -153px; +} +.tsd-is-static.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -153px; +} +.tsd-is-static.tsd-parent-kind-class.tsd-is-inherited > .tsd-kind-icon:before { + background-position: -68px -153px; +} +.tsd-is-static.tsd-parent-kind-class.tsd-is-protected > .tsd-kind-icon:before { + background-position: -85px -153px; +} +.tsd-is-static.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -153px; +} +.tsd-is-static.tsd-parent-kind-class.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -153px; +} +.tsd-is-static.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -153px; +} +.tsd-is-static.tsd-parent-kind-enum.tsd-is-protected > .tsd-kind-icon:before { + background-position: -187px -153px; +} +.tsd-is-static.tsd-parent-kind-enum.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -153px; +} +.tsd-is-static.tsd-parent-kind-interface > .tsd-kind-icon:before { + background-position: -204px -153px; +} +.tsd-is-static.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -153px; +} + +.tsd-is-static.tsd-kind-function > .tsd-kind-icon:before { + background-position: -136px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -170px; +} +.tsd-is-static.tsd-kind-function.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -170px; +} + +.tsd-is-static.tsd-kind-method > .tsd-kind-icon:before { + background-position: -136px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -170px; +} +.tsd-is-static.tsd-kind-method.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -170px; +} + +.tsd-is-static.tsd-kind-call-signature > .tsd-kind-icon:before { + background-position: -136px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -153px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class + > .tsd-kind-icon:before { + background-position: -51px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum + > .tsd-kind-icon:before { + background-position: -170px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -170px; +} +.tsd-is-static.tsd-kind-call-signature.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -170px; +} + +.tsd-is-static.tsd-kind-event > .tsd-kind-icon:before { + background-position: -136px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-is-protected > .tsd-kind-icon:before { + background-position: -153px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-is-private > .tsd-kind-icon:before { + background-position: -119px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-class > .tsd-kind-icon:before { + background-position: -51px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -68px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -85px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-protected.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -102px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-class.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum > .tsd-kind-icon:before { + background-position: -170px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum.tsd-is-protected + > .tsd-kind-icon:before { + background-position: -187px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-enum.tsd-is-private + > .tsd-kind-icon:before { + background-position: -119px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-interface + > .tsd-kind-icon:before { + background-position: -204px -187px; +} +.tsd-is-static.tsd-kind-event.tsd-parent-kind-interface.tsd-is-inherited + > .tsd-kind-icon:before { + background-position: -221px -187px; +} + +.no-transition { + transition: none !important; +} + +@-webkit-keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } +} + +@keyframes fade-in { + from { + opacity: 0; + } + to { + opacity: 1; + } +} +@-webkit-keyframes fade-out { + from { + opacity: 1; + visibility: visible; + } + to { + opacity: 0; + } +} +@keyframes fade-out { + from { + opacity: 1; + visibility: visible; + } + to { + opacity: 0; + } +} +@-webkit-keyframes fade-in-delayed { + 0% { + opacity: 0; + } + 33% { + opacity: 0; + } + 100% { + opacity: 1; + } +} +@keyframes fade-in-delayed { + 0% { + opacity: 0; + } + 33% { + opacity: 0; + } + 100% { + opacity: 1; + } +} +@-webkit-keyframes fade-out-delayed { + 0% { + opacity: 1; + visibility: visible; + } + 66% { + opacity: 0; + } + 100% { + opacity: 0; + } +} +@keyframes fade-out-delayed { + 0% { + opacity: 1; + visibility: visible; + } + 66% { + opacity: 0; + } + 100% { + opacity: 0; + } +} +@-webkit-keyframes shift-to-left { + from { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } + to { + -webkit-transform: translate(-25%, 0); + transform: translate(-25%, 0); + } +} +@keyframes shift-to-left { + from { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } + to { + -webkit-transform: translate(-25%, 0); + transform: translate(-25%, 0); + } +} +@-webkit-keyframes unshift-to-left { + from { + -webkit-transform: translate(-25%, 0); + transform: translate(-25%, 0); + } + to { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@keyframes unshift-to-left { + from { + -webkit-transform: translate(-25%, 0); + transform: translate(-25%, 0); + } + to { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@-webkit-keyframes pop-in-from-right { + from { + -webkit-transform: translate(100%, 0); + transform: translate(100%, 0); + } + to { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@keyframes pop-in-from-right { + from { + -webkit-transform: translate(100%, 0); + transform: translate(100%, 0); + } + to { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} +@-webkit-keyframes pop-out-to-right { + from { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + visibility: visible; + } + to { + -webkit-transform: translate(100%, 0); + transform: translate(100%, 0); + } +} +@keyframes pop-out-to-right { + from { + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + visibility: visible; + } + to { + -webkit-transform: translate(100%, 0); + transform: translate(100%, 0); + } +} +body { + background: #fdfdfd; + font-family: 'Segoe UI', sans-serif; + font-size: 16px; + color: #222; +} + +a { + color: #4da6ff; + text-decoration: none; +} +a:hover { + text-decoration: underline; +} + +code, +pre { + font-family: Menlo, Monaco, Consolas, 'Courier New', monospace; + padding: 0.2em; + margin: 0; + font-size: 14px; + background-color: rgba(0, 0, 0, 0.04); +} + +pre { + padding: 10px; +} +pre code { + padding: 0; + font-size: 100%; + background-color: transparent; +} + +.tsd-typography { + line-height: 1.333em; +} +.tsd-typography ul { + list-style: square; + padding: 0 0 0 20px; + margin: 0; +} +.tsd-typography h4, +.tsd-typography .tsd-index-panel h3, +.tsd-index-panel .tsd-typography h3, +.tsd-typography h5, +.tsd-typography h6 { + font-size: 1em; + margin: 0; +} +.tsd-typography h5, +.tsd-typography h6 { + font-weight: normal; +} +.tsd-typography p, +.tsd-typography ul, +.tsd-typography ol { + margin: 1em 0; +} + +@media (min-width: 901px) and (max-width: 1024px) { + html.default .col-content { + width: 72%; + } + html.default .col-menu { + width: 28%; + } + html.default .tsd-navigation { + padding-left: 10px; + } +} +@media (max-width: 900px) { + html.default .col-content { + float: none; + width: 100%; + } + html.default .col-menu { + position: fixed !important; + overflow: auto; + -webkit-overflow-scrolling: touch; + overflow-scrolling: touch; + z-index: 1024; + top: 0 !important; + bottom: 0 !important; + left: auto !important; + right: 0 !important; + width: 100%; + padding: 20px 20px 0 0; + max-width: 450px; + visibility: hidden; + background-color: #fff; + -webkit-transform: translate(100%, 0); + transform: translate(100%, 0); + } + html.default .col-menu > *:last-child { + padding-bottom: 20px; + } + html.default .overlay { + content: ''; + display: block; + position: fixed; + z-index: 1023; + top: 0; + left: 0; + right: 0; + bottom: 0; + background-color: rgba(0, 0, 0, 0.75); + visibility: hidden; + } + html.default.to-has-menu .overlay { + -webkit-animation: fade-in 0.4s; + animation: fade-in 0.4s; + } + html.default.to-has-menu header, + html.default.to-has-menu footer, + html.default.to-has-menu .col-content { + -webkit-animation: shift-to-left 0.4s; + animation: shift-to-left 0.4s; + } + html.default.to-has-menu .col-menu { + -webkit-animation: pop-in-from-right 0.4s; + animation: pop-in-from-right 0.4s; + } + html.default.from-has-menu .overlay { + -webkit-animation: fade-out 0.4s; + animation: fade-out 0.4s; + } + html.default.from-has-menu header, + html.default.from-has-menu footer, + html.default.from-has-menu .col-content { + -webkit-animation: unshift-to-left 0.4s; + animation: unshift-to-left 0.4s; + } + html.default.from-has-menu .col-menu { + -webkit-animation: pop-out-to-right 0.4s; + animation: pop-out-to-right 0.4s; + } + html.default.has-menu body { + overflow: hidden; + } + html.default.has-menu .overlay { + visibility: visible; + } + html.default.has-menu header, + html.default.has-menu footer, + html.default.has-menu .col-content { + -webkit-transform: translate(-25%, 0); + transform: translate(-25%, 0); + } + html.default.has-menu .col-menu { + visibility: visible; + -webkit-transform: translate(0, 0); + transform: translate(0, 0); + } +} + +.tsd-page-title { + padding: 70px 0 20px 0; + margin: 0 0 40px 0; + background: #fff; + box-shadow: 0 0 5px rgba(0, 0, 0, 0.35); +} +.tsd-page-title h1 { + margin: 0; +} + +.tsd-breadcrumb { + margin: 0; + padding: 0; + color: #808080; +} +.tsd-breadcrumb a { + color: #808080; + text-decoration: none; +} +.tsd-breadcrumb a:hover { + text-decoration: underline; +} +.tsd-breadcrumb li { + display: inline; +} +.tsd-breadcrumb li:after { + content: ' / '; +} + +html.minimal .container { + margin: 0; +} +html.minimal .container-main { + padding-top: 50px; + padding-bottom: 0; +} +html.minimal .content-wrap { + padding-left: 300px; +} +html.minimal .tsd-navigation { + position: fixed !important; + overflow: auto; + -webkit-overflow-scrolling: touch; + overflow-scrolling: touch; + box-sizing: border-box; + z-index: 1; + left: 0; + top: 40px; + bottom: 0; + width: 300px; + padding: 20px; + margin: 0; +} +html.minimal .tsd-member .tsd-member { + margin-left: 0; +} +html.minimal .tsd-page-toolbar { + position: fixed; + z-index: 2; +} +html.minimal #tsd-filter .tsd-filter-group { + right: 0; + -webkit-transform: none; + transform: none; +} +html.minimal footer { + background-color: transparent; +} +html.minimal footer .container { + padding: 0; +} +html.minimal .tsd-generator { + padding: 0; +} +@media (max-width: 900px) { + html.minimal .tsd-navigation { + display: none; + } + html.minimal .content-wrap { + padding-left: 0; + } +} + +dl.tsd-comment-tags { + overflow: hidden; +} +dl.tsd-comment-tags dt { + clear: both; + float: left; + padding: 1px 5px; + margin: 0 10px 0 0; + border-radius: 4px; + border: 1px solid #808080; + color: #808080; + font-size: 0.8em; + font-weight: normal; +} +dl.tsd-comment-tags dd { + margin: 0 0 10px 0; +} +dl.tsd-comment-tags p { + margin: 0; +} + +.tsd-panel.tsd-comment .lead { + font-size: 1.1em; + line-height: 1.333em; + margin-bottom: 2em; +} +.tsd-panel.tsd-comment .lead:last-child { + margin-bottom: 0; +} + +.toggle-protected .tsd-is-private { + display: none; +} + +.toggle-public .tsd-is-private, +.toggle-public .tsd-is-protected, +.toggle-public .tsd-is-private-protected { + display: none; +} + +.toggle-inherited .tsd-is-inherited { + display: none; +} + +.toggle-only-exported .tsd-is-not-exported { + display: none; +} + +.toggle-externals .tsd-is-external { + display: none; +} + +#tsd-filter { + position: relative; + display: inline-block; + height: 40px; + vertical-align: bottom; +} +.no-filter #tsd-filter { + display: none; +} +#tsd-filter .tsd-filter-group { + display: inline-block; + height: 40px; + vertical-align: bottom; + white-space: nowrap; +} +#tsd-filter input { + display: none; +} +@media (max-width: 900px) { + #tsd-filter .tsd-filter-group { + display: block; + position: absolute; + top: 40px; + right: 20px; + height: auto; + background-color: #fff; + visibility: hidden; + -webkit-transform: translate(50%, 0); + transform: translate(50%, 0); + box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); + } + .has-options #tsd-filter .tsd-filter-group { + visibility: visible; + } + .to-has-options #tsd-filter .tsd-filter-group { + -webkit-animation: fade-in 0.2s; + animation: fade-in 0.2s; + } + .from-has-options #tsd-filter .tsd-filter-group { + -webkit-animation: fade-out 0.2s; + animation: fade-out 0.2s; + } + #tsd-filter label, + #tsd-filter .tsd-select { + display: block; + padding-right: 20px; + } +} + +footer { + border-top: 1px solid #eee; + background-color: #fff; +} +footer.with-border-bottom { + border-bottom: 1px solid #eee; +} +footer .tsd-legend-group { + font-size: 0; +} +footer .tsd-legend { + display: inline-block; + width: 25%; + padding: 0; + font-size: 16px; + list-style: none; + line-height: 1.333em; + vertical-align: top; +} +@media (max-width: 900px) { + footer .tsd-legend { + width: 50%; + } +} + +.tsd-hierarchy { + list-style: square; + padding: 0 0 0 20px; + margin: 0; +} +.tsd-hierarchy .target { + font-weight: bold; +} + +.tsd-index-panel .tsd-index-content { + margin-bottom: -30px !important; +} +.tsd-index-panel .tsd-index-section { + margin-bottom: 30px !important; +} +.tsd-index-panel h3 { + margin: 0 -20px 10px -20px; + padding: 0 20px 10px 20px; + border-bottom: 1px solid #eee; +} +.tsd-index-panel ul.tsd-index-list { + -webkit-column-count: 3; + -moz-column-count: 3; + -ms-column-count: 3; + -o-column-count: 3; + column-count: 3; + -webkit-column-gap: 20px; + -moz-column-gap: 20px; + -ms-column-gap: 20px; + -o-column-gap: 20px; + column-gap: 20px; + padding: 0; + list-style: none; + line-height: 1.333em; +} +@media (max-width: 900px) { + .tsd-index-panel ul.tsd-index-list { + -webkit-column-count: 1; + -moz-column-count: 1; + -ms-column-count: 1; + -o-column-count: 1; + column-count: 1; + } +} +@media (min-width: 901px) and (max-width: 1024px) { + .tsd-index-panel ul.tsd-index-list { + -webkit-column-count: 2; + -moz-column-count: 2; + -ms-column-count: 2; + -o-column-count: 2; + column-count: 2; + } +} +.tsd-index-panel ul.tsd-index-list li { + -webkit-column-break-inside: avoid; + -moz-column-break-inside: avoid; + -ms-column-break-inside: avoid; + -o-column-break-inside: avoid; + column-break-inside: avoid; + -webkit-page-break-inside: avoid; + -moz-page-break-inside: avoid; + -ms-page-break-inside: avoid; + -o-page-break-inside: avoid; + page-break-inside: avoid; +} +.tsd-index-panel a, +.tsd-index-panel .tsd-parent-kind-module a { + color: #9600ff; +} +.tsd-index-panel .tsd-parent-kind-interface a { + color: #7da01f; +} +.tsd-index-panel .tsd-parent-kind-enum a { + color: #cc9900; +} +.tsd-index-panel .tsd-parent-kind-class a { + color: #4da6ff; +} +.tsd-index-panel .tsd-kind-module a { + color: #9600ff; +} +.tsd-index-panel .tsd-kind-interface a { + color: #7da01f; +} +.tsd-index-panel .tsd-kind-enum a { + color: #cc9900; +} +.tsd-index-panel .tsd-kind-class a { + color: #4da6ff; +} +.tsd-index-panel .tsd-is-private a { + color: #808080; +} + +.tsd-flag { + display: inline-block; + padding: 1px 5px; + border-radius: 4px; + color: #fff; + background-color: #808080; + text-indent: 0; + font-size: 14px; + font-weight: normal; +} + +.tsd-anchor { + position: absolute; + top: -100px; +} + +.tsd-member { + position: relative; +} +.tsd-member .tsd-anchor + h3 { + margin-top: 0; + margin-bottom: 0; + border-bottom: none; +} + +.tsd-navigation { + padding: 0 0 0 40px; +} +.tsd-navigation a { + display: block; + padding-top: 2px; + padding-bottom: 2px; + border-left: 2px solid transparent; + color: #222; + text-decoration: none; + transition: border-left-color 0.1s; +} +.tsd-navigation a:hover { + text-decoration: underline; +} +.tsd-navigation ul { + margin: 0; + padding: 0; + list-style: none; +} +.tsd-navigation li { + padding: 0; +} + +.tsd-navigation.primary { + padding-bottom: 40px; +} +.tsd-navigation.primary a { + display: block; + padding-top: 6px; + padding-bottom: 6px; +} +.tsd-navigation.primary ul li a { + padding-left: 5px; +} +.tsd-navigation.primary ul li li a { + padding-left: 25px; +} +.tsd-navigation.primary ul li li li a { + padding-left: 45px; +} +.tsd-navigation.primary ul li li li li a { + padding-left: 65px; +} +.tsd-navigation.primary ul li li li li li a { + padding-left: 85px; +} +.tsd-navigation.primary ul li li li li li li a { + padding-left: 105px; +} +.tsd-navigation.primary > ul { + border-bottom: 1px solid #eee; +} +.tsd-navigation.primary li { + border-top: 1px solid #eee; +} +.tsd-navigation.primary li.current > a { + font-weight: bold; +} +.tsd-navigation.primary li.label span { + display: block; + padding: 20px 0 6px 5px; + color: #808080; +} +.tsd-navigation.primary li.globals + li > span, +.tsd-navigation.primary li.globals + li > a { + padding-top: 20px; +} + +.tsd-navigation.secondary ul { + transition: opacity 0.2s; +} +.tsd-navigation.secondary ul li a { + padding-left: 25px; +} +.tsd-navigation.secondary ul li li a { + padding-left: 45px; +} +.tsd-navigation.secondary ul li li li a { + padding-left: 65px; +} +.tsd-navigation.secondary ul li li li li a { + padding-left: 85px; +} +.tsd-navigation.secondary ul li li li li li a { + padding-left: 105px; +} +.tsd-navigation.secondary ul li li li li li li a { + padding-left: 125px; +} +.tsd-navigation.secondary ul.current a { + border-left-color: #eee; +} +.tsd-navigation.secondary li.focus > a, +.tsd-navigation.secondary ul.current li.focus > a { + border-left-color: #000; +} +.tsd-navigation.secondary li.current { + margin-top: 20px; + margin-bottom: 20px; + border-left-color: #eee; +} +.tsd-navigation.secondary li.current > a { + font-weight: bold; +} + +@media (min-width: 901px) { + .menu-sticky-wrap { + position: static; + } + .no-csspositionsticky .menu-sticky-wrap.sticky { + position: fixed; + } + .no-csspositionsticky .menu-sticky-wrap.sticky-current { + position: fixed; + } + .no-csspositionsticky .menu-sticky-wrap.sticky-current ul.before-current, + .no-csspositionsticky .menu-sticky-wrap.sticky-current ul.after-current { + opacity: 0; + } + .no-csspositionsticky .menu-sticky-wrap.sticky-bottom { + position: absolute; + top: auto !important; + left: auto !important; + bottom: 0; + right: 0; + } + .csspositionsticky .menu-sticky-wrap.sticky { + position: -webkit-sticky; + position: sticky; + } + .csspositionsticky .menu-sticky-wrap.sticky-current { + position: -webkit-sticky; + position: sticky; + } +} + +.tsd-panel { + margin: 20px 0; + padding: 20px; + background-color: #fff; + box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); +} +.tsd-panel:empty { + display: none; +} +.tsd-panel > h1, +.tsd-panel > h2, +.tsd-panel > h3 { + margin: 1.5em -20px 10px -20px; + padding: 0 20px 10px 20px; + border-bottom: 1px solid #eee; +} +.tsd-panel > h1.tsd-before-signature, +.tsd-panel > h2.tsd-before-signature, +.tsd-panel > h3.tsd-before-signature { + margin-bottom: 0; + border-bottom: 0; +} +.tsd-panel table { + display: block; + width: 100%; + overflow: auto; + margin-top: 10px; + word-break: normal; + word-break: keep-all; +} +.tsd-panel table th { + font-weight: bold; +} +.tsd-panel table th, +.tsd-panel table td { + padding: 6px 13px; + border: 1px solid #ddd; +} +.tsd-panel table tr { + background-color: #fff; + border-top: 1px solid #ccc; +} +.tsd-panel table tr:nth-child(2n) { + background-color: #f8f8f8; +} + +.tsd-panel-group { + margin: 60px 0; +} +.tsd-panel-group > h1, +.tsd-panel-group > h2, +.tsd-panel-group > h3 { + padding-left: 20px; + padding-right: 20px; +} + +#tsd-search { + transition: background-color 0.2s; +} +#tsd-search .title { + position: relative; + z-index: 2; +} +#tsd-search .field { + position: absolute; + left: 0; + top: 0; + right: 40px; + height: 40px; +} +#tsd-search .field input { + box-sizing: border-box; + position: relative; + top: -50px; + z-index: 1; + width: 100%; + padding: 0 10px; + opacity: 0; + outline: 0; + border: 0; + background: transparent; + color: #222; +} +#tsd-search .field label { + position: absolute; + overflow: hidden; + right: -40px; +} +#tsd-search .field input, +#tsd-search .title { + transition: opacity 0.2s; +} +#tsd-search .results { + position: absolute; + visibility: hidden; + top: 40px; + width: 100%; + margin: 0; + padding: 0; + list-style: none; + box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); +} +#tsd-search .results li { + padding: 0 10px; + background-color: #fdfdfd; +} +#tsd-search .results li:nth-child(even) { + background-color: #fff; +} +#tsd-search .results li.state { + display: none; +} +#tsd-search .results li.current, +#tsd-search .results li:hover { + background-color: #eee; +} +#tsd-search .results a { + display: block; +} +#tsd-search .results a:before { + top: 10px; +} +#tsd-search .results span.parent { + color: #808080; + font-weight: normal; +} +#tsd-search.has-focus { + background-color: #eee; +} +#tsd-search.has-focus .field input { + top: 0; + opacity: 1; +} +#tsd-search.has-focus .title { + z-index: 0; + opacity: 0; +} +#tsd-search.has-focus .results { + visibility: visible; +} +#tsd-search.loading .results li.state.loading { + display: block; +} +#tsd-search.failure .results li.state.failure { + display: block; +} + +.tsd-signature { + margin: 0 0 1em 0; + padding: 10px; + border: 1px solid #eee; + font-family: Menlo, Monaco, Consolas, 'Courier New', monospace; + font-size: 14px; +} +.tsd-signature.tsd-kind-icon { + padding-left: 30px; +} +.tsd-signature.tsd-kind-icon:before { + top: 10px; + left: 10px; +} +.tsd-panel > .tsd-signature { + margin-left: -20px; + margin-right: -20px; + border-width: 1px 0; +} +.tsd-panel > .tsd-signature.tsd-kind-icon { + padding-left: 40px; +} +.tsd-panel > .tsd-signature.tsd-kind-icon:before { + left: 20px; +} + +.tsd-signature-symbol { + color: #808080; + font-weight: normal; +} + +.tsd-signature-type { + font-style: italic; + font-weight: normal; +} + +.tsd-signatures { + padding: 0; + margin: 0 0 1em 0; + border: 1px solid #eee; +} +.tsd-signatures .tsd-signature { + margin: 0; + border-width: 1px 0 0 0; + transition: background-color 0.1s; +} +.tsd-signatures .tsd-signature:first-child { + border-top-width: 0; +} +.tsd-signatures .tsd-signature.current { + background-color: #eee; +} +.tsd-signatures.active > .tsd-signature { + cursor: pointer; +} +.tsd-panel > .tsd-signatures { + margin-left: -20px; + margin-right: -20px; + border-width: 1px 0; +} +.tsd-panel > .tsd-signatures .tsd-signature.tsd-kind-icon { + padding-left: 40px; +} +.tsd-panel > .tsd-signatures .tsd-signature.tsd-kind-icon:before { + left: 20px; +} +.tsd-panel > a.anchor + .tsd-signatures { + border-top-width: 0; + margin-top: -20px; +} + +ul.tsd-descriptions { + position: relative; + overflow: hidden; + transition: height 0.3s; + padding: 0; + list-style: none; +} +ul.tsd-descriptions.active > .tsd-description { + display: none; +} +ul.tsd-descriptions.active > .tsd-description.current { + display: block; +} +ul.tsd-descriptions.active > .tsd-description.fade-in { + -webkit-animation: fade-in-delayed 0.3s; + animation: fade-in-delayed 0.3s; +} +ul.tsd-descriptions.active > .tsd-description.fade-out { + -webkit-animation: fade-out-delayed 0.3s; + animation: fade-out-delayed 0.3s; + position: absolute; + display: block; + top: 0; + left: 0; + right: 0; + opacity: 0; + visibility: hidden; +} +ul.tsd-descriptions h4, +ul.tsd-descriptions .tsd-index-panel h3, +.tsd-index-panel ul.tsd-descriptions h3 { + font-size: 16px; + margin: 1em 0 0.5em 0; +} + +ul.tsd-parameters, +ul.tsd-type-parameters { + list-style: square; + margin: 0; + padding-left: 20px; +} +ul.tsd-parameters > li.tsd-parameter-siganture, +ul.tsd-type-parameters > li.tsd-parameter-siganture { + list-style: none; + margin-left: -20px; +} +ul.tsd-parameters h5, +ul.tsd-type-parameters h5 { + font-size: 16px; + margin: 1em 0 0.5em 0; +} +ul.tsd-parameters .tsd-comment, +ul.tsd-type-parameters .tsd-comment { + margin-top: -0.5em; +} + +.tsd-sources { + font-size: 14px; + color: #808080; + margin: 0 0 1em 0; +} +.tsd-sources a { + color: #808080; + text-decoration: underline; +} +.tsd-sources ul, +.tsd-sources p { + margin: 0 !important; +} +.tsd-sources ul { + list-style: none; + padding: 0; +} + +.tsd-page-toolbar { + position: absolute; + z-index: 1; + top: 0; + left: 0; + width: 100%; + height: 40px; + color: #333; + background: #fff; + border-bottom: 1px solid #eee; +} +.tsd-page-toolbar a { + color: #333; + text-decoration: none; +} +.tsd-page-toolbar a.title { + font-weight: bold; +} +.tsd-page-toolbar a.title:hover { + text-decoration: underline; +} +.tsd-page-toolbar .table-wrap { + display: table; + width: 100%; + height: 40px; +} +.tsd-page-toolbar .table-cell { + display: table-cell; + position: relative; + white-space: nowrap; + line-height: 40px; +} +.tsd-page-toolbar .table-cell:first-child { + width: 100%; +} + +.tsd-widget:before, +.tsd-select .tsd-select-label:before, +.tsd-select .tsd-select-list li:before { + content: ''; + display: inline-block; + width: 40px; + height: 40px; + margin: 0 -8px 0 0; + background-image: url(../images/widgets.png); + background-repeat: no-repeat; + text-indent: -1024px; + vertical-align: bottom; +} +@media (-webkit-min-device-pixel-ratio: 1.5), + (min-device-pixel-ratio: 1.5), + (min-resolution: 144dpi) { + .tsd-widget:before, + .tsd-select .tsd-select-label:before, + .tsd-select .tsd-select-list li:before { + background-image: url(../images/widgets@2x.png); + background-size: 320px 40px; + } +} + +.tsd-widget { + display: inline-block; + overflow: hidden; + opacity: 0.6; + height: 40px; + transition: opacity 0.1s, background-color 0.2s; + vertical-align: bottom; + cursor: pointer; +} +.tsd-widget:hover { + opacity: 0.8; +} +.tsd-widget.active { + opacity: 1; + background-color: #eee; +} +.tsd-widget.no-caption { + width: 40px; +} +.tsd-widget.no-caption:before { + margin: 0; +} +.tsd-widget.search:before { + background-position: 0 0; +} +.tsd-widget.menu:before { + background-position: -40px 0; +} +.tsd-widget.options:before { + background-position: -80px 0; +} +.tsd-widget.options, +.tsd-widget.menu { + display: none; +} +@media (max-width: 900px) { + .tsd-widget.options, + .tsd-widget.menu { + display: inline-block; + } +} +input[type='checkbox'] + .tsd-widget:before { + background-position: -120px 0; +} +input[type='checkbox']:checked + .tsd-widget:before { + background-position: -160px 0; +} + +.tsd-select { + position: relative; + display: inline-block; + height: 40px; + transition: opacity 0.1s, background-color 0.2s; + vertical-align: bottom; + cursor: pointer; +} +.tsd-select .tsd-select-label { + opacity: 0.6; + transition: opacity 0.2s; +} +.tsd-select .tsd-select-label:before { + background-position: -240px 0; +} +.tsd-select.active .tsd-select-label { + opacity: 0.8; +} +.tsd-select.active .tsd-select-list { + visibility: visible; + opacity: 1; + transition-delay: 0s; +} +.tsd-select .tsd-select-list { + position: absolute; + visibility: hidden; + top: 40px; + left: 0; + margin: 0; + padding: 0; + opacity: 0; + list-style: none; + box-shadow: 0 0 4px rgba(0, 0, 0, 0.25); + transition: visibility 0s 0.2s, opacity 0.2s; +} +.tsd-select .tsd-select-list li { + padding: 0 20px 0 0; + background-color: #fdfdfd; +} +.tsd-select .tsd-select-list li:before { + background-position: 40px 0; +} +.tsd-select .tsd-select-list li:nth-child(even) { + background-color: #fff; +} +.tsd-select .tsd-select-list li:hover { + background-color: #eee; +} +.tsd-select .tsd-select-list li.selected:before { + background-position: -200px 0; +} +@media (max-width: 900px) { + .tsd-select .tsd-select-list { + top: 0; + left: auto; + right: 100%; + margin-right: -5px; + } + .tsd-select .tsd-select-label:before { + background-position: -280px 0; + } +} + +img { + max-width: 100%; +} diff --git a/packages/store/docs/assets/js/main.js b/packages/store/docs/assets/js/main.js index 528a3b02..6850a095 100644 --- a/packages/store/docs/assets/js/main.js +++ b/packages/store/docs/assets/js/main.js @@ -1,5 +1,8726 @@ -!function(a,b){"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){function s(a){var b=a.length,c=n.type(a);return"function"!==c&&!n.isWindow(a)&&(!(1!==a.nodeType||!b)||("array"===c||0===b||"number"==typeof b&&b>0&&b-1 in a))}function x(a,b,c){if(n.isFunction(b))return n.grep(a,function(a,d){return!!b.call(a,d,a)!==c});if(b.nodeType)return n.grep(a,function(a){return a===b!==c});if("string"==typeof b){if(w.test(b))return n.filter(b,a,c);b=n.filter(b,a)}return n.grep(a,function(a){return g.call(b,a)>=0!==c})}function D(a,b){for(;(a=a[b])&&1!==a.nodeType;);return a}function G(a){var b=F[a]={};return n.each(a.match(E)||[],function(a,c){b[c]=!0}),b}function I(){l.removeEventListener("DOMContentLoaded",I,!1),a.removeEventListener("load",I,!1),n.ready()}function K(){Object.defineProperty(this.cache={},0,{get:function(){return{}}}),this.expando=n.expando+Math.random()}function P(a,b,c){var d;if(void 0===c&&1===a.nodeType)if(d="data-"+b.replace(O,"-$1").toLowerCase(),"string"==typeof(c=a.getAttribute(d))){try{c="true"===c||"false"!==c&&("null"===c?null:+c+""===c?+c:N.test(c)?n.parseJSON(c):c)}catch(e){}M.set(a,b,c)}else c=void 0;return c}function Z(){return!0}function $(){return!1}function _(){try{return l.activeElement}catch(a){}}function jb(a,b){return n.nodeName(a,"table")&&n.nodeName(11!==b.nodeType?b:b.firstChild,"tr")?a.getElementsByTagName("tbody")[0]||a.appendChild(a.ownerDocument.createElement("tbody")):a}function kb(a){return a.type=(null!==a.getAttribute("type"))+"/"+a.type,a}function lb(a){var b=gb.exec(a.type);return b?a.type=b[1]:a.removeAttribute("type"),a}function mb(a,b){for(var c=0,d=a.length;d>c;c++)L.set(a[c],"globalEval",!b||L.get(b[c],"globalEval"))}function nb(a,b){var c,d,e,f,g,h,i,j;if(1===b.nodeType){if(L.hasData(a)&&(f=L.access(a),g=L.set(b,f),j=f.events)){delete g.handle,g.events={};for(e in j)for(c=0,d=j[e].length;d>c;c++)n.event.add(b,e,j[e][c])}M.hasData(a)&&(h=M.access(a),i=n.extend({},h),M.set(b,i))}}function ob(a,b){var c=a.getElementsByTagName?a.getElementsByTagName(b||"*"):a.querySelectorAll?a.querySelectorAll(b||"*"):[];return void 0===b||b&&n.nodeName(a,b)?n.merge([a],c):c}function pb(a,b){var c=b.nodeName.toLowerCase();"input"===c&&T.test(a.type)?b.checked=a.checked:("input"===c||"textarea"===c)&&(b.defaultValue=a.defaultValue)}function sb(b,c){var d,e=n(c.createElement(b)).appendTo(c.body),f=a.getDefaultComputedStyle&&(d=a.getDefaultComputedStyle(e[0]))?d.display:n.css(e[0],"display");return e.detach(),f}function tb(a){var b=l,c=rb[a];return c||(c=sb(a,b),"none"!==c&&c||(qb=(qb||n("