Skip to content

Commit 7cde852

Browse files
SethDavenportSethDavenport
authored
Angular 4 Compatibility, Toolchain Fixes
* Angular 4 no longer ships with its source easily accessible in `npm`. Had to update a couple of things that were depending on angular internals (thanks @clbond) * Reworked the toolchain to build on publish instead on on install. This should result in fewer moving parts for package consumers.
1 parent 7e3f34c commit 7cde852

File tree

8 files changed

+116
-50
lines changed

8 files changed

+116
-50
lines changed

‎.npmignore‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
test
2+
examples
3+
.travis.yml
4+
.gitignore
5+
.babelrc
6+
.nyc_output/
7+
coverage/
8+
.vscode/
9+
docs/
10+
webpack/

‎examples/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@
77
"dev": "cross-env NODE_ENV=development webpack-dev-server -d --devtool=inline-source-map --inline --progress --no-info"
88
},
99
"devDependencies": {
10-
"@angular-redux/store": "^5.1.0",
10+
"@angular-redux/store": "^6.1.0-alpha.1",
11+
"@angular-redux/form": "^6.1.0-alpha.0",
1112
"@angular/common": "^2.4.2",
1213
"@angular/compiler": "^2.4.2",
1314
"@angular/core": "^2.4.2",

‎examples/source/module.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,8 @@ import {
1616
NgReduxFormModule,
1717
composeReducers,
1818
defaultFormReducer,
19-
} from '../../source';
19+
} from '@angular-redux/form';
20+
// from '../../source';
2021

2122
import {logger} from '../../source/tests.utilities';
2223

‎package.json‎

Lines changed: 31 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,24 @@
11
{
22
"name": "@angular-redux/form",
3-
"version": "6.0.1",
3+
"version": "6.1.0-alpha.6",
44
"description": "Build Angular 2+ forms with Redux",
5+
"dependencies": {
6+
"immutable": "^3.8.1"
7+
},
58
"devDependencies": {
6-
"@angular/common": "^2.4.2",
7-
"@angular/compiler": "^2.4.2",
8-
"@angular/platform-browser": "^2.4.2",
9-
"@angular/platform-browser-dynamic": "^2.4.2",
9+
"@types/chai": "^3.4.34",
10+
"rimraf": "^2.5.4",
11+
"babel-core": "^6.11.4",
12+
"babel-loader": "^6.2.5",
13+
"babel-preset-es2015": "^6.14.0",
14+
"@angular/common": "^4.0.0",
15+
"@angular/compiler": "^4.0.0",
16+
"@angular/platform-browser": "^4.0.0",
17+
"@angular/platform-browser-dynamic": "^4.0.0",
18+
"@angular/compiler-cli": "^4.0.0",
19+
"@angular/core": "^4.0.0",
20+
"@angular/forms": "^4.0.0",
21+
"@angular/tsc-wrapped": "^4.0.0",
1022
"istanbul-instrumenter-loader": "^0.2.0",
1123
"jasmine-core": "^2.4.1",
1224
"karma": "^1.1.1",
@@ -19,40 +31,27 @@
1931
"karma-sourcemap-writer": "^0.1.2",
2032
"karma-spec-reporter": "0.0.26",
2133
"karma-transform-path-preprocessor": "0.0.3",
22-
"karma-webpack": "^1.7.0"
23-
},
24-
"dependencies": {
25-
"@angular-redux/store": "^6.0.0",
26-
"@angular/compiler": "^2.4.2",
27-
"@angular/compiler-cli": "^2.4.2",
28-
"@angular/core": "^2.4.2",
29-
"@angular/forms": "^2.4.2",
30-
"@angular/tsc-wrapped": "^0.5.1",
34+
"karma-webpack": "^1.7.0",
35+
"@angular-redux/store": "^6.1.0-alpha.1",
3136
"@ngtools/webpack": "^1.2.1",
32-
"@types/chai": "^3.4.34",
3337
"@types/jasmine": "^2.5.35",
3438
"@types/node": "^6.0.45",
35-
"babel-core": "^6.11.4",
36-
"babel-loader": "^6.2.5",
37-
"babel-preset-es2015": "^6.14.0",
3839
"chai": "^3.5.0",
3940
"cross-env": "^2.0.0",
40-
"immutable": "^3.8.1",
4141
"redux": "^3.0",
4242
"redux-logger": "^2.6.1",
4343
"reflect-metadata": "^0.1.3",
44-
"rimraf": "^2.5.4",
4544
"rxjs": "^5.0.1",
46-
"typescript": "^2.0.3",
45+
"typescript": "^2.1.0",
4746
"webpack": "^2.1.0-beta.25",
48-
"zone.js": "^0.7.2"
47+
"zone.js": "^0.8.4"
4948
},
5049
"peerDependencies": {
51-
"@angular/common": "^2.4.0",
52-
"@angular/compiler": "^2.4.0",
53-
"@angular/core": "^2.4.0",
54-
"@angular/forms": "^2.4.0",
55-
"@angular-redux/store": "^6.0.0",
50+
"@angular/common": "^2.4.0 || ^4.0.0",
51+
"@angular/compiler": "^2.4.0 || ^4.0.0",
52+
"@angular/core": "^2.4.0 || ^4.0.0",
53+
"@angular/forms": "^2.4.0 || ^4.0.0",
54+
"@angular-redux/store": "^6.1.0-alpha.0",
5655
"redux": "^3.0"
5756
},
5857
"engines": {
@@ -63,12 +62,14 @@
6362
"build": "ngc",
6463
"clean": "rimraf dist",
6564
"cover": "istanbul report --include=**/chrome/coverage-final.json text text-summary",
66-
"postinstall": "npm run build",
6765
"pretest": "rimraf coverage",
6866
"test": "cross-env NODE_ENV=development karma start --singleRun true",
6967
"posttest": "npm run cover",
70-
"test:watch": "cross-env NODE_ENV=development karma start --singleRun false"
68+
"test:watch": "cross-env NODE_ENV=development karma start --singleRun false",
69+
"prepublish": "npm run build"
7170
},
7271
"main": "dist/source/index.js",
73-
"typings": "source/index"
72+
"typings": "source/index",
73+
"repository": "https://github.com/angular-redux/form",
74+
"license": "MIT"
7475
}

‎source/connect-array.ts‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -25,29 +25,24 @@ import {
2525
ControlContainer,
2626
ControlValueAccessor,
2727
} from '@angular/forms';
28-
import {
29-
composeAsyncValidators,
30-
composeValidators,
31-
controlPath,
32-
setUpFormContainer,
33-
selectValueAccessor,
34-
} from '@angular/forms/src/directives/shared';
28+
3529
import {
3630
AsyncValidatorFn,
37-
ValidatorFn
38-
} from '@angular/forms/src/directives/validators';
31+
ValidatorFn,
32+
Validators,
33+
} from '@angular/forms';
3934
import {
4035
NG_ASYNC_VALIDATORS,
4136
NG_VALIDATORS
42-
} from '@angular/forms/src/validators';
43-
37+
} from '@angular/forms';
4438
import {Unsubscribe} from 'redux';
4539

4640
import {Subscription} from 'rxjs';
4741

4842
import {Connect} from './connect';
4943
import {FormStore} from './form-store';
5044
import {State} from './state';
45+
import {controlPath, selectValueAccessor} from './shims';
5146

5247
export class ConnectArrayTemplate {
5348
constructor(
@@ -122,11 +117,11 @@ export class ConnectArray extends ControlContainer implements OnInit {
122117
}
123118

124119
get validator(): ValidatorFn {
125-
return composeValidators(this.rawValidators);
120+
return Validators.compose(this.rawValidators);
126121
}
127122

128123
get asyncValidator(): AsyncValidatorFn {
129-
return composeAsyncValidators(this.rawAsyncValidators);
124+
return Validators.composeAsync(this.rawAsyncValidators);
130125
}
131126

132127
private get formArray(): FormArrayName {

‎source/connect.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,6 @@ import {
1212
NgControl,
1313
} from '@angular/forms';
1414

15-
import {scheduleMicroTask} from '@angular/forms/src/facade/lang';
16-
1715
import {Subscription} from 'rxjs';
1816

1917
import {Unsubscribe} from 'redux';
@@ -75,14 +73,14 @@ export class Connect {
7573
}
7674

7775
private ngAfterContentInit() {
78-
scheduleMicroTask(() => {
76+
Promise.resolve().then(() => {
7977
this.resetState();
8078

8179
this.stateSubscription = this.store.subscribe(state => {
8280
this.resetState();
8381
});
8482

85-
scheduleMicroTask(() => {
83+
Promise.resolve().then(() => {
8684
this.formSubscription = (<any>this.form.valueChanges).debounceTime(0).subscribe(values => this.publish(values));
8785
});
8886
});

‎source/shims.ts‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
import {
2+
NgControl,
3+
ControlContainer,
4+
ControlValueAccessor,
5+
DefaultValueAccessor,
6+
CheckboxControlValueAccessor,
7+
SelectControlValueAccessor,
8+
SelectMultipleControlValueAccessor,
9+
RadioControlValueAccessor,
10+
} from '@angular/forms';
11+
12+
export function controlPath(name: string, parent: ControlContainer): string[] {
13+
return [...parent.path, name];
14+
}
15+
16+
export function selectValueAccessor(
17+
dir: NgControl, valueAccessors: ControlValueAccessor[]): ControlValueAccessor {
18+
if (!valueAccessors) return null;
19+
20+
let defaultAccessor: ControlValueAccessor;
21+
let builtinAccessor: ControlValueAccessor;
22+
let customAccessor: ControlValueAccessor;
23+
valueAccessors.forEach((v: ControlValueAccessor) => {
24+
if (v.constructor === DefaultValueAccessor) {
25+
defaultAccessor = v;
26+
} else if (isBuiltInAccessor(v)) {
27+
if (builtinAccessor) {
28+
throw new Error(
29+
`More than one built-in value accessor matches form control with ${dir}`);
30+
}
31+
32+
builtinAccessor = v;
33+
} else {
34+
if (customAccessor) {
35+
throw new Error(
36+
`More than one custom value accessor matches form control with ${dir}`);
37+
}
38+
customAccessor = v;
39+
}
40+
});
41+
42+
if (customAccessor) return customAccessor;
43+
if (builtinAccessor) return builtinAccessor;
44+
if (defaultAccessor) return defaultAccessor;
45+
46+
throw new Error(`No valid value accessor for form control with, ${dir}`);
47+
}
48+
49+
const BUILTIN_ACCESSORS = [
50+
CheckboxControlValueAccessor,
51+
SelectControlValueAccessor,
52+
SelectMultipleControlValueAccessor,
53+
RadioControlValueAccessor,
54+
];
55+
56+
export function isBuiltInAccessor(valueAccessor: ControlValueAccessor): boolean {
57+
return BUILTIN_ACCESSORS.some(a => valueAccessor.constructor === a);
58+
}

‎source/state.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -217,7 +217,9 @@ export abstract class State {
217217
},
218218

219219
// Clone
220-
() => new Map<string, any>(<any> object)
220+
() => object instanceof WeakMap
221+
? new WeakMap<Object, any>(<any> object)
222+
: new Map<string, any>(<any> object)
221223
);
222224
}
223225
else if (object instanceof WeakSet || object instanceof Set) {

0 commit comments

Comments
 (0)