@coolon/angular-ui-powerups 2.0.0-alpha.2 → 2.0.0-alpha.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (173) hide show
  1. package/CHANGELOG.md +133 -0
  2. package/assets/form.scss +33 -0
  3. package/bundles/coolon-angular-ui-powerups.umd.js +571 -330
  4. package/bundles/coolon-angular-ui-powerups.umd.js.map +1 -1
  5. package/bundles/coolon-angular-ui-powerups.umd.min.js +2 -2
  6. package/bundles/coolon-angular-ui-powerups.umd.min.js.map +1 -1
  7. package/coolon-angular-ui-powerups.d.ts +55 -54
  8. package/coolon-angular-ui-powerups.metadata.json +1 -1
  9. package/esm2015/coolon-angular-ui-powerups.js +53 -52
  10. package/esm2015/coolon-angular-ui-powerups.js.map +1 -1
  11. package/esm2015/coolon-angular-ui-powerups.metadata.json +1 -1
  12. package/esm2015/lib/angular-ui-powerups.module.ngfactory.js.map +1 -1
  13. package/esm2015/lib/components/card-container/card-container.component.js +1 -1
  14. package/esm2015/lib/components/card-container/card-container.component.metadata.json +1 -1
  15. package/esm2015/lib/components/components.module.js +29 -12
  16. package/esm2015/lib/components/components.module.js.map +1 -1
  17. package/esm2015/lib/components/components.module.metadata.json +1 -1
  18. package/esm2015/lib/components/components.module.ngfactory.js.map +1 -1
  19. package/esm2015/lib/components/forms/abstract-input.component.js +26 -6
  20. package/esm2015/lib/components/forms/abstract-input.component.js.map +1 -1
  21. package/esm2015/lib/components/forms/abstract-input.component.metadata.json +1 -1
  22. package/esm2015/lib/components/forms/abstract-list-input.component.js +51 -6
  23. package/esm2015/lib/components/forms/abstract-list-input.component.js.map +1 -1
  24. package/esm2015/lib/components/forms/abstract-list-input.component.metadata.json +1 -1
  25. package/esm2015/lib/components/forms/abstract-value-input.component.js +46 -7
  26. package/esm2015/lib/components/forms/abstract-value-input.component.js.map +1 -1
  27. package/esm2015/lib/components/forms/abstract-value-input.component.metadata.json +1 -1
  28. package/esm2015/lib/components/forms/autocomplete-input/autocomplete-input.component.js +70 -0
  29. package/esm2015/lib/components/forms/autocomplete-input/autocomplete-input.component.js.map +1 -0
  30. package/esm2015/lib/components/forms/autocomplete-input/autocomplete-input.component.metadata.json +1 -0
  31. package/esm2015/lib/components/forms/autocomplete-input/autocomplete-input.component.ngfactory.js.map +1 -0
  32. package/esm2015/lib/components/forms/autocomplete-input/autocomplete-input.component.scss.shim.ngstyle.js.map +1 -0
  33. package/esm2015/lib/components/forms/checkbox-input/checkbox-input.component.js +4 -7
  34. package/esm2015/lib/components/forms/checkbox-input/checkbox-input.component.js.map +1 -1
  35. package/esm2015/lib/components/forms/checkbox-input/checkbox-input.component.metadata.json +1 -1
  36. package/esm2015/lib/components/forms/multiple-select-input/multiple-select-input.component.js +8 -13
  37. package/esm2015/lib/components/forms/multiple-select-input/multiple-select-input.component.js.map +1 -1
  38. package/esm2015/lib/components/forms/multiple-select-input/multiple-select-input.component.metadata.json +1 -1
  39. package/esm2015/lib/components/forms/number-input/number-input.component.js +4 -7
  40. package/esm2015/lib/components/forms/number-input/number-input.component.js.map +1 -1
  41. package/esm2015/lib/components/forms/number-input/number-input.component.metadata.json +1 -1
  42. package/esm2015/lib/components/forms/password-input/password-input.component.js +5 -8
  43. package/esm2015/lib/components/forms/password-input/password-input.component.js.map +1 -1
  44. package/esm2015/lib/components/forms/password-input/password-input.component.metadata.json +1 -1
  45. package/esm2015/lib/components/forms/select-input/select-input.component.js +8 -5
  46. package/esm2015/lib/components/forms/select-input/select-input.component.js.map +1 -1
  47. package/esm2015/lib/components/forms/select-input/select-input.component.metadata.json +1 -1
  48. package/esm2015/lib/components/forms/string-input/string-input.component.js +4 -8
  49. package/esm2015/lib/components/forms/string-input/string-input.component.js.map +1 -1
  50. package/esm2015/lib/components/forms/string-input/string-input.component.metadata.json +1 -1
  51. package/esm2015/lib/components/forms/text-input/text-input.component.js +4 -7
  52. package/esm2015/lib/components/forms/text-input/text-input.component.js.map +1 -1
  53. package/esm2015/lib/components/forms/text-input/text-input.component.metadata.json +1 -1
  54. package/esm2015/lib/components/index.js +2 -1
  55. package/esm2015/lib/components/index.js.map +1 -1
  56. package/esm2015/lib/components/index.metadata.json +1 -1
  57. package/esm2015/lib/components/table/cell-editors.js.map +1 -1
  58. package/esm2015/lib/components/table/{cell-protal-ref.js → cell-portal-ref.js} +7 -3
  59. package/esm2015/lib/components/table/cell-portal-ref.js.map +1 -0
  60. package/esm2015/lib/components/table/{cell-protal-ref.metadata.json → cell-portal-ref.metadata.json} +1 -1
  61. package/esm2015/lib/components/table/column-model.js +66 -11
  62. package/esm2015/lib/components/table/column-model.js.map +1 -1
  63. package/esm2015/lib/components/table/column-model.metadata.json +1 -1
  64. package/esm2015/lib/components/table/mutable-cell-renderer.js +1 -0
  65. package/esm2015/lib/components/table/mutable-cell-renderer.js.map +1 -0
  66. package/esm2015/lib/components/table/mutable-cell-renderer.metadata.json +1 -0
  67. package/esm2015/lib/components/table/table-cell-renderer/table-cell-renderer.component.js +1 -1
  68. package/esm2015/lib/components/table/table-cell-renderer/table-cell-renderer.component.js.map +1 -1
  69. package/esm2015/lib/components/table/table-header-cell-renderer/table-header-cell-renderer.component.js +1 -1
  70. package/esm2015/lib/components/table/table-header-cell-renderer/table-header-cell-renderer.component.js.map +1 -1
  71. package/esm2015/lib/components/table/table-model.js +11 -10
  72. package/esm2015/lib/components/table/table-model.js.map +1 -1
  73. package/esm2015/lib/components/table/table-model.metadata.json +1 -1
  74. package/esm2015/lib/components/table/table.component.js +1 -1
  75. package/esm2015/lib/components/table/table.component.js.map +1 -1
  76. package/esm2015/lib/components/table/table.component.metadata.json +1 -1
  77. package/esm2015/lib/interaction/components/activity-container/activity-container.component.js +2 -7
  78. package/esm2015/lib/interaction/components/activity-container/activity-container.component.js.map +1 -1
  79. package/esm2015/lib/interaction/components/activity-container/activity-container.component.metadata.json +1 -1
  80. package/esm2015/lib/interaction/interaction.module.ngfactory.js.map +1 -1
  81. package/esm2015/lib/place/place-component.js +1 -1
  82. package/esm2015/lib/place/place-component.js.map +1 -1
  83. package/esm2015/lib/place/place-router.js +2 -8
  84. package/esm2015/lib/place/place-router.js.map +1 -1
  85. package/esm2015/lib/place/place-router.metadata.json +1 -1
  86. package/esm2015/lib/place/place.module.ngfactory.js.map +1 -1
  87. package/esm2015/lib/place/route/parameter-decorators.js +2 -3
  88. package/esm2015/lib/place/route/parameter-decorators.js.map +1 -1
  89. package/esm2015/lib/place/route/parameter-decorators.metadata.json +1 -1
  90. package/esm5/coolon-angular-ui-powerups.js +53 -52
  91. package/esm5/coolon-angular-ui-powerups.js.map +1 -1
  92. package/esm5/lib/angular-ui-powerups.module.ngfactory.js.map +1 -1
  93. package/esm5/lib/components/card-container/card-container.component.js +1 -1
  94. package/esm5/lib/components/components.module.js +29 -12
  95. package/esm5/lib/components/components.module.js.map +1 -1
  96. package/esm5/lib/components/components.module.ngfactory.js.map +1 -1
  97. package/esm5/lib/components/forms/abstract-input.component.js +34 -6
  98. package/esm5/lib/components/forms/abstract-input.component.js.map +1 -1
  99. package/esm5/lib/components/forms/abstract-list-input.component.js +56 -6
  100. package/esm5/lib/components/forms/abstract-list-input.component.js.map +1 -1
  101. package/esm5/lib/components/forms/abstract-value-input.component.js +51 -7
  102. package/esm5/lib/components/forms/abstract-value-input.component.js.map +1 -1
  103. package/esm5/lib/components/forms/autocomplete-input/autocomplete-input.component.js +73 -0
  104. package/esm5/lib/components/forms/autocomplete-input/autocomplete-input.component.js.map +1 -0
  105. package/esm5/lib/components/forms/autocomplete-input/autocomplete-input.component.ngfactory.js.map +1 -0
  106. package/esm5/lib/components/forms/autocomplete-input/autocomplete-input.component.scss.shim.ngstyle.js.map +1 -0
  107. package/esm5/lib/components/forms/checkbox-input/checkbox-input.component.js +4 -7
  108. package/esm5/lib/components/forms/checkbox-input/checkbox-input.component.js.map +1 -1
  109. package/esm5/lib/components/forms/multiple-select-input/multiple-select-input.component.js +8 -13
  110. package/esm5/lib/components/forms/multiple-select-input/multiple-select-input.component.js.map +1 -1
  111. package/esm5/lib/components/forms/number-input/number-input.component.js +4 -7
  112. package/esm5/lib/components/forms/number-input/number-input.component.js.map +1 -1
  113. package/esm5/lib/components/forms/password-input/password-input.component.js +5 -8
  114. package/esm5/lib/components/forms/password-input/password-input.component.js.map +1 -1
  115. package/esm5/lib/components/forms/select-input/select-input.component.js +8 -5
  116. package/esm5/lib/components/forms/select-input/select-input.component.js.map +1 -1
  117. package/esm5/lib/components/forms/string-input/string-input.component.js +4 -8
  118. package/esm5/lib/components/forms/string-input/string-input.component.js.map +1 -1
  119. package/esm5/lib/components/forms/text-input/text-input.component.js +4 -7
  120. package/esm5/lib/components/forms/text-input/text-input.component.js.map +1 -1
  121. package/esm5/lib/components/index.js +2 -1
  122. package/esm5/lib/components/index.js.map +1 -1
  123. package/esm5/lib/components/table/cell-editors.js.map +1 -1
  124. package/esm5/lib/components/table/{cell-protal-ref.js → cell-portal-ref.js} +7 -3
  125. package/esm5/lib/components/table/cell-portal-ref.js.map +1 -0
  126. package/esm5/lib/components/table/column-model.js +67 -11
  127. package/esm5/lib/components/table/column-model.js.map +1 -1
  128. package/esm5/lib/components/table/mutable-cell-renderer.js +1 -0
  129. package/esm5/lib/components/table/mutable-cell-renderer.js.map +1 -0
  130. package/esm5/lib/components/table/table-cell-renderer/table-cell-renderer.component.js +1 -1
  131. package/esm5/lib/components/table/table-cell-renderer/table-cell-renderer.component.js.map +1 -1
  132. package/esm5/lib/components/table/table-header-cell-renderer/table-header-cell-renderer.component.js +1 -1
  133. package/esm5/lib/components/table/table-header-cell-renderer/table-header-cell-renderer.component.js.map +1 -1
  134. package/esm5/lib/components/table/table-model.js +11 -11
  135. package/esm5/lib/components/table/table-model.js.map +1 -1
  136. package/esm5/lib/components/table/table.component.js +1 -1
  137. package/esm5/lib/components/table/table.component.js.map +1 -1
  138. package/esm5/lib/interaction/components/activity-container/activity-container.component.js +2 -7
  139. package/esm5/lib/interaction/components/activity-container/activity-container.component.js.map +1 -1
  140. package/esm5/lib/interaction/interaction.module.ngfactory.js.map +1 -1
  141. package/esm5/lib/place/place-component.js +1 -1
  142. package/esm5/lib/place/place-component.js.map +1 -1
  143. package/esm5/lib/place/place-router.js +2 -8
  144. package/esm5/lib/place/place-router.js.map +1 -1
  145. package/esm5/lib/place/place.module.ngfactory.js.map +1 -1
  146. package/esm5/lib/place/route/parameter-decorators.js +2 -3
  147. package/esm5/lib/place/route/parameter-decorators.js.map +1 -1
  148. package/fesm2015/coolon-angular-ui-powerups.js +466 -247
  149. package/fesm2015/coolon-angular-ui-powerups.js.map +1 -1
  150. package/fesm5/coolon-angular-ui-powerups.js +503 -263
  151. package/fesm5/coolon-angular-ui-powerups.js.map +1 -1
  152. package/lib/components/forms/abstract-input.component.d.ts +12 -3
  153. package/lib/components/forms/abstract-list-input.component.d.ts +10 -3
  154. package/lib/components/forms/abstract-value-input.component.d.ts +9 -3
  155. package/lib/components/forms/autocomplete-input/autocomplete-input.component.d.ts +25 -0
  156. package/lib/components/forms/checkbox-input/checkbox-input.component.d.ts +0 -2
  157. package/lib/components/forms/multiple-select-input/multiple-select-input.component.d.ts +8 -4
  158. package/lib/components/forms/number-input/number-input.component.d.ts +0 -2
  159. package/lib/components/forms/password-input/password-input.component.d.ts +0 -2
  160. package/lib/components/forms/select-input/select-input.component.d.ts +8 -2
  161. package/lib/components/forms/string-input/string-input.component.d.ts +1 -2
  162. package/lib/components/forms/text-input/text-input.component.d.ts +0 -2
  163. package/lib/components/index.d.ts +3 -1
  164. package/lib/components/table/cell-editors.d.ts +3 -3
  165. package/lib/components/table/{cell-protal-ref.d.ts → cell-portal-ref.d.ts} +4 -4
  166. package/lib/components/table/column-model.d.ts +18 -12
  167. package/lib/components/table/mutable-cell-renderer.d.ts +6 -0
  168. package/lib/components/table/table-cell-renderer/table-cell-renderer.component.d.ts +1 -1
  169. package/lib/components/table/table-header-cell-renderer/table-header-cell-renderer.component.d.ts +1 -1
  170. package/lib/components/table/table-model.d.ts +15 -4
  171. package/package.json +4 -4
  172. package/esm2015/lib/components/table/cell-protal-ref.js.map +0 -1
  173. package/esm5/lib/components/table/cell-protal-ref.js.map +0 -1
@@ -1,11 +1,11 @@
1
- import { __decorate } from "tslib";
1
+ import { __decorate, __metadata } from "tslib";
2
2
  /* tslint:disable:no-input-rename */
3
- import { Component } from '@angular/core';
4
- import { Form } from '@coolon/pectin';
3
+ import { Component, EventEmitter, Input, Output } from '@angular/core';
4
+ import { Binding, DebugContext, Dsl, Form, Guard, MutableListModel, TrackExternal } from '@coolon/pectin';
5
5
  import { AbstractInputComponent } from './abstract-input.component';
6
6
  let AbstractListInputComponent = class AbstractListInputComponent extends AbstractInputComponent {
7
7
  constructor() {
8
- super(...arguments);
8
+ super();
9
9
  /**
10
10
  * A backing model for all our @Input() valueModel properties which should be defined as follows.
11
11
  *
@@ -17,11 +17,56 @@ let AbstractListInputComponent = class AbstractListInputComponent extends Abstra
17
17
  * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).
18
18
  */
19
19
  // We have to register it as a disposable so it ditches any listeners when we're disposed.
20
- this.inputModel = this.registerDisposable(new Form.DelegatingListModel());
20
+ this.formValueModel = this.registerDisposable(new Form.DelegatingListModel());
21
+ this.componentListModel = new MutableListModel();
22
+ this.setValueIsInProgress = new Guard();
23
+ this.valueChange = new EventEmitter();
24
+ const { when, valueOf, chain } = Dsl.disposeWith(this);
25
+ const binding = new Binding.Identity(this.formValueModel, this.componentListModel);
26
+ const inExternalChange = valueOf.any(this.setValueIsInProgress, chain(binding.direction).equals(Binding.Direction.RIGHT)).areTruthy();
27
+ when(this.componentListModel).changes((is, was) => {
28
+ this.valueChange.emit(is);
29
+ this.onValueEditedListeners.fire(l => l(is, was));
30
+ }, {
31
+ initialValue: 'ignore',
32
+ // we never fire events during an external changes to the value. This allows
33
+ // the component to behave when used in the conventional angular
34
+ // fashion, i.e. [(value)]="..."
35
+ unless: inExternalChange
36
+ });
37
+ DebugContext.tag(this.formValueModel, `${this.constructor.name}.formValueModel`);
38
+ }
39
+ // We add support for simple direct display of values by allowing components to be used
40
+ // by `component.value = ...` This use of the component without a value model in tables
41
+ // and the like.
42
+ set value(value) {
43
+ this.setValueIsInProgress.whileTrue(() => {
44
+ if (!this.listHolder) {
45
+ this.listHolder = new MutableListModel(value);
46
+ this.listModel = this.listHolder;
47
+ }
48
+ else {
49
+ this.listHolder.value = value;
50
+ }
51
+ });
21
52
  }
22
53
  };
54
+ __decorate([
55
+ Input(), TrackExternal({ delegateTo: 'formValueModel' }),
56
+ __metadata("design:type", Object)
57
+ ], AbstractListInputComponent.prototype, "listModel", void 0);
58
+ __decorate([
59
+ Input(),
60
+ __metadata("design:type", Array),
61
+ __metadata("design:paramtypes", [Array])
62
+ ], AbstractListInputComponent.prototype, "value", null);
63
+ __decorate([
64
+ Output(),
65
+ __metadata("design:type", Object)
66
+ ], AbstractListInputComponent.prototype, "valueChange", void 0);
23
67
  AbstractListInputComponent = __decorate([
24
- Component({ template: '' })
68
+ Component({ template: '' }),
69
+ __metadata("design:paramtypes", [])
25
70
  ], AbstractListInputComponent);
26
71
  export { AbstractListInputComponent };
27
72
  //# sourceMappingURL=abstract-list-input.component.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"abstract-list-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/abstract-list-input.component.ts"],"names":[],"mappings":";AAAA,oCAAoC;AACpC,OAAO,EAAE,SAAS,EAAU,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAGpE,IAAa,0BAA0B,GAAvC,MAAa,0BAA8B,SAAQ,sBAA2B;IAA9E;;QAEE;;;;;;;;;WASG;QACD,0FAA0F;QACnF,eAAU,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,mBAAmB,EAAK,CAAC,CAAC;IAEnF,CAAC;CAAA,CAAA;AAfY,0BAA0B;IADtC,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;GACf,0BAA0B,CAetC;SAfY,0BAA0B","sourcesContent":["/* tslint:disable:no-input-rename */\nimport { Component, OnInit } from '@angular/core';\nimport { Form } from '@coolon/pectin';\nimport { AbstractInputComponent } from './abstract-input.component';\n\n@Component({ template: '' })\nexport class AbstractListInputComponent<T> extends AbstractInputComponent<T[]> implements OnInit {\n\n /**\n * A backing model for all our @Input() valueModel properties which should be defined as follows.\n *\n * @Input() @TrackExternal({useExisting: \"inputModel\"})\n * valueModel: Form.ListModelBase<string> | IMutableListModel<string>;\n *\n * This approach allows the input to accept plain or form models but all backed by a form\n * friendly delegate. We have to use an existing delegate for union types as pectin just\n * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).\n */\n // We have to register it as a disposable so it ditches any listeners when we're disposed.\n readonly inputModel = this.registerDisposable(new Form.DelegatingListModel<T>());\n\n}\n"]}
1
+ {"version":3,"file":"abstract-list-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/abstract-list-input.component.ts"],"names":[],"mappings":";AAAA,oCAAoC;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EACL,OAAO,EACP,YAAY,EACZ,GAAG,EAEH,IAAI,EACJ,KAAK,EAEL,gBAAgB,EAChB,aAAa,EACd,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAGpE,IAAa,0BAA0B,GAAvC,MAAa,0BAA8B,SAAQ,sBAA2B;IAuC5E;QACE,KAAK,EAAE,CAAC;QAnCV;;;;;;;;;WASG;QACD,0FAA0F;QACzE,mBAAc,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,mBAAmB,EAAK,CAAC,CAAC;QACtF,uBAAkB,GAAG,IAAI,gBAAgB,EAAK,CAAC;QAEhD,yBAAoB,GAAG,IAAI,KAAK,EAAE,CAAC;QAkBxB,gBAAW,GAAG,IAAI,YAAY,EAAO,CAAC;QAIvD,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACvD,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QACnF,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,CAClC,IAAI,CAAC,oBAAoB,EACzB,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,CACzD,CAAC,SAAS,EAAE,CAAC;QAEd,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE;YAChD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC1B,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC;QACpD,CAAC,EAAE;YACD,YAAY,EAAE,QAAQ;YACtB,4EAA4E;YAC5E,gEAAgE;YAChE,gCAAgC;YAChC,MAAM,EAAE,gBAAgB;SACzB,CAAC,CAAC;QACH,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,iBAAiB,CAAC,CAAC;IACnF,CAAC;IApCD,uFAAuF;IACvF,wFAAwF;IACxF,gBAAgB;IACP,IAAI,KAAK,CAAC,KAAU;QAC3B,IAAI,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,EAAE;YACvC,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;gBACpB,IAAI,CAAC,UAAU,GAAG,IAAI,gBAAgB,CAAI,KAAK,CAAC,CAAC;gBACjD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,UAAU,CAAC;aAClC;iBAAM;gBACL,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,KAAK,CAAC;aAC/B;QACH,CAAC,CAAC,CAAC;IACL,CAAC;CA0BF,CAAA;AA1DC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC;;6DACD;AAuB/C;IAAR,KAAK,EAAE;;;uDASP;AAES;IAAT,MAAM,EAAE;;+DAAgD;AArC9C,0BAA0B;IADtC,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;;GACf,0BAA0B,CA6DtC;SA7DY,0BAA0B","sourcesContent":["/* tslint:disable:no-input-rename */\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport {\n Binding,\n DebugContext,\n Dsl,\n EventListenerList,\n Form,\n Guard,\n IMutableListModel,\n MutableListModel,\n TrackExternal\n} from '@coolon/pectin';\nimport { AbstractInputComponent } from './abstract-input.component';\n\n@Component({ template: '' })\nexport class AbstractListInputComponent<T> extends AbstractInputComponent<T[]> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'formValueModel' })\n listModel: Form.ListModelBase<T> | IMutableListModel<T>;\n\n /**\n * A backing model for all our @Input() valueModel properties which should be defined as follows.\n *\n * @Input() @TrackExternal({useExisting: \"inputModel\"})\n * valueModel: Form.ListModelBase<string> | IMutableListModel<string>;\n *\n * This approach allows the input to accept plain or form models but all backed by a form\n * friendly delegate. We have to use an existing delegate for union types as pectin just\n * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).\n */\n // We have to register it as a disposable so it ditches any listeners when we're disposed.\n protected readonly formValueModel = this.registerDisposable(new Form.DelegatingListModel<T>());\n readonly componentListModel = new MutableListModel<T>();\n\n private setValueIsInProgress = new Guard();\n // we need this for plain values otherwise our Form.DelegatingListModel will stay disabled.\n private listHolder: MutableListModel<T>;\n\n // We add support for simple direct display of values by allowing components to be used\n // by `component.value = ...` This use of the component without a value model in tables\n // and the like.\n @Input() set value(value: T[]) {\n this.setValueIsInProgress.whileTrue(() => {\n if (!this.listHolder) {\n this.listHolder = new MutableListModel<T>(value);\n this.listModel = this.listHolder;\n } else {\n this.listHolder.value = value;\n }\n });\n }\n\n @Output() readonly valueChange = new EventEmitter<T[]>();\n\n constructor() {\n super();\n const { when, valueOf, chain } = Dsl.disposeWith(this);\n const binding = new Binding.Identity(this.formValueModel, this.componentListModel);\n const inExternalChange = valueOf.any(\n this.setValueIsInProgress,\n chain(binding.direction).equals(Binding.Direction.RIGHT)\n ).areTruthy();\n\n when(this.componentListModel).changes((is, was) => {\n this.valueChange.emit(is);\n this.onValueEditedListeners.fire(l => l(is, was));\n }, {\n initialValue: 'ignore',\n // we never fire events during an external changes to the value. This allows\n // the component to behave when used in the conventional angular\n // fashion, i.e. [(value)]=\"...\"\n unless: inExternalChange\n });\n DebugContext.tag(this.formValueModel, `${this.constructor.name}.formValueModel`);\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"AbstractListInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-input.component","name":"AbstractInputComponent","line":6,"character":51},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"template":""}]}]}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"AbstractListInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-input.component","name":"AbstractInputComponent","line":16,"character":51},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"template":""}]}],"members":{"listModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":18,"character":12},"arguments":[{"delegateTo":"formValueModel"}]}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":53,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}]}}}}]
@@ -1,7 +1,7 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
2
  /* tslint:disable:no-input-rename */
3
- import { Component } from '@angular/core';
4
- import { Form } from '@coolon/pectin';
3
+ import { Component, EventEmitter, Input, Output } from '@angular/core';
4
+ import { Binding, DebugContext, Dsl, Form, Guard, MutableValueModel, TrackExternal } from '@coolon/pectin';
5
5
  import { AbstractInputComponent } from './abstract-input.component';
6
6
  let AbstractValueInputComponent = class AbstractValueInputComponent extends AbstractInputComponent {
7
7
  constructor() {
@@ -17,14 +17,53 @@ let AbstractValueInputComponent = class AbstractValueInputComponent extends Abst
17
17
  * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).
18
18
  */
19
19
  // We have to register it as a disposable so it ditches any listeners when we're disposed.
20
- this.inputModel = this.registerDisposable(new Form.DelegatingValueModel());
21
- this.inputModel.onTransactionStart(tx => {
22
- tx.onRootTransactionFinalised(() => {
23
- console.log({ changed: tx.hasChanged() });
24
- });
20
+ this.formValueModel = this.registerDisposable(new Form.DelegatingValueModel());
21
+ this.setValueInProgress = new Guard();
22
+ this.componentValueModel = new MutableValueModel();
23
+ this.valueChange = new EventEmitter();
24
+ const { when, chain, valueOf } = Dsl.disposeWith(this);
25
+ const binding = new Binding.Identity(this.formValueModel, this.componentValueModel);
26
+ const inExternalChange = valueOf.any(this.setValueInProgress, chain(binding.direction).equals(Binding.Direction.RIGHT)).areTruthy();
27
+ when(this.componentValueModel).changes((is, was) => {
28
+ this.valueChange.emit(is);
29
+ this.onValueEditedListeners.fire(l => l(is, was));
30
+ }, {
31
+ initialValue: 'ignore',
32
+ // we never fire events during an external set value operation. This allows
33
+ // the component to behave when used in the conventional angular
34
+ // fashion, i.e. [(value)]="..."
35
+ unless: inExternalChange
36
+ });
37
+ DebugContext.tag(this.formValueModel, `${this.constructor.name}.formValueModel`);
38
+ }
39
+ // We add support for simple direct display of values by allowing components to be used
40
+ // by `component.value = ...` This use of the component without a value model in tables
41
+ // and the like.
42
+ set value(value) {
43
+ this.setValueInProgress.whileTrue(() => {
44
+ if (!this.plainValueHolder) {
45
+ this.plainValueHolder = new MutableValueModel(value);
46
+ this.valueModel = this.plainValueHolder;
47
+ }
48
+ else {
49
+ this.plainValueHolder.value = value;
50
+ }
25
51
  });
26
52
  }
27
53
  };
54
+ __decorate([
55
+ Input(), TrackExternal({ delegateTo: 'formValueModel' }),
56
+ __metadata("design:type", Object)
57
+ ], AbstractValueInputComponent.prototype, "valueModel", void 0);
58
+ __decorate([
59
+ Input(),
60
+ __metadata("design:type", Object),
61
+ __metadata("design:paramtypes", [Object])
62
+ ], AbstractValueInputComponent.prototype, "value", null);
63
+ __decorate([
64
+ Output(),
65
+ __metadata("design:type", Object)
66
+ ], AbstractValueInputComponent.prototype, "valueChange", void 0);
28
67
  AbstractValueInputComponent = __decorate([
29
68
  Component({ template: '' }),
30
69
  __metadata("design:paramtypes", [])
@@ -1 +1 @@
1
- {"version":3,"file":"abstract-value-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/abstract-value-input.component.ts"],"names":[],"mappings":";AAAA,oCAAoC;AACpC,OAAO,EAAE,SAAS,EAAU,MAAM,eAAe,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,gBAAgB,CAAC;AACtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAGpE,IAAa,2BAA2B,GAAxC,MAAa,2BAA+B,SAAQ,sBAAyB;IAe3E;QACE,KAAK,EAAE,CAAC;QAdV;;;;;;;;;WASG;QACD,0FAA0F;QACnF,eAAU,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,oBAAoB,EAAK,CAAC,CAAC;QAIhF,IAAI,CAAC,UAAU,CAAC,kBAAkB,CAAC,EAAE,CAAC,EAAE;YACtC,EAAE,CAAC,0BAA0B,CAAC,GAAG,EAAE;gBACjC,OAAO,CAAC,GAAG,CAAC,EAAE,OAAO,EAAE,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;YAC5C,CAAC,CAAC,CAAC;QACL,CAAC,CAAC,CAAC;IAEL,CAAC;CACF,CAAA;AAxBY,2BAA2B;IADvC,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;;GACf,2BAA2B,CAwBvC;SAxBY,2BAA2B","sourcesContent":["/* tslint:disable:no-input-rename */\nimport { Component, OnInit } from '@angular/core';\nimport { Form } from '@coolon/pectin';\nimport { AbstractInputComponent } from './abstract-input.component';\n\n@Component({ template: '' })\nexport class AbstractValueInputComponent<T> extends AbstractInputComponent<T> implements OnInit {\n\n /**\n * A backing model for all our @Input() valueModel properties which should be defined as follows.\n *\n * @Input() @TrackExternal({useExisting: \"inputModel\"})\n * valueModel: DirtyTrackingForm.ValueModel<string> | IMutableValueModel<string>;\n *\n * This approach allows the input to accept plain or form models but all backed by a form\n * friendly delegate. We have to use an existing delegate for union types as pectin just\n * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).\n */\n // We have to register it as a disposable so it ditches any listeners when we're disposed.\n readonly inputModel = this.registerDisposable(new Form.DelegatingValueModel<T>());\n\n constructor() {\n super();\n this.inputModel.onTransactionStart(tx => {\n tx.onRootTransactionFinalised(() => {\n console.log({ changed: tx.hasChanged() });\n });\n });\n\n }\n}\n"]}
1
+ {"version":3,"file":"abstract-value-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/abstract-value-input.component.ts"],"names":[],"mappings":";AAAA,oCAAoC;AACpC,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,MAAM,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EACL,OAAO,EACP,YAAY,EACZ,GAAG,EACH,IAAI,EACJ,KAAK,EAEL,iBAAiB,EACjB,aAAa,EACd,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,sBAAsB,EAAE,MAAM,4BAA4B,CAAC;AAGpE,IAAa,2BAA2B,GAAxC,MAAa,2BAA+B,SAAQ,sBAAyB;IAuC3E;QACE,KAAK,EAAE,CAAC;QAnCV;;;;;;;;;WASG;QACD,0FAA0F;QACzE,mBAAc,GAAG,IAAI,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,oBAAoB,EAAK,CAAC,CAAC;QAEtF,uBAAkB,GAAG,IAAI,KAAK,EAAE,CAAC;QAClC,wBAAmB,GAAG,IAAI,iBAAiB,EAAK,CAAC;QAkBvC,gBAAW,GAAG,IAAI,YAAY,EAAK,CAAC;QAIrD,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACvD,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACpF,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,CAClC,IAAI,CAAC,kBAAkB,EACvB,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,CACzD,CAAC,SAAS,EAAE,CAAC;QAEd,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,OAAO,CAAC,CAAC,EAAE,EAAE,GAAG,EAAE,EAAE;YACjD,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAC1B,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC,CAAC;QACpD,CAAC,EAAE;YACD,YAAY,EAAE,QAAQ;YACtB,2EAA2E;YAC3E,gEAAgE;YAChE,gCAAgC;YAChC,MAAM,EAAE,gBAAgB;SACzB,CAAC,CAAC;QACH,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,iBAAiB,CAAC,CAAC;IACnF,CAAC;IApCD,uFAAuF;IACvF,wFAAwF;IACxF,gBAAgB;IACP,IAAI,KAAK,CAAC,KAAQ;QACzB,IAAI,CAAC,kBAAkB,CAAC,SAAS,CAAC,GAAG,EAAE;YACrC,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;gBAC1B,IAAI,CAAC,gBAAgB,GAAG,IAAI,iBAAiB,CAAI,KAAK,CAAC,CAAC;gBACxD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,gBAAgB,CAAC;aACzC;iBAAM;gBACL,IAAI,CAAC,gBAAgB,CAAC,KAAK,GAAG,KAAK,CAAC;aACrC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;CA0BF,CAAA;AA1DC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,gBAAgB,EAAE,CAAC;;+DACE;AAuBlD;IAAR,KAAK,EAAE;;;wDASP;AAES;IAAT,MAAM,EAAE;;gEAA8C;AArC5C,2BAA2B;IADvC,SAAS,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;;GACf,2BAA2B,CA6DvC;SA7DY,2BAA2B","sourcesContent":["/* tslint:disable:no-input-rename */\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport {\n Binding,\n DebugContext,\n Dsl,\n Form,\n Guard,\n IMutableValueModel,\n MutableValueModel,\n TrackExternal\n} from '@coolon/pectin';\nimport { AbstractInputComponent } from './abstract-input.component';\n\n@Component({ template: '' })\nexport class AbstractValueInputComponent<T> extends AbstractInputComponent<T> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'formValueModel' })\n valueModel: Form.ValueModelBase<T> | IMutableValueModel<T>;\n\n /**\n * A backing model for all our @Input() valueModel properties which should be defined as follows.\n *\n * @Input() @TrackExternal({useExisting: \"inputModel\"})\n * valueModel: DirtyTrackingForm.ValueModel<string> | IMutableValueModel<string>;\n *\n * This approach allows the input to accept plain or form models but all backed by a form\n * friendly delegate. We have to use an existing delegate for union types as pectin just\n * gets told it's an Object and can't scan for a base type annotated with @DelegateUsing(..).\n */\n // We have to register it as a disposable so it ditches any listeners when we're disposed.\n protected readonly formValueModel = this.registerDisposable(new Form.DelegatingValueModel<T>());\n\n protected setValueInProgress = new Guard();\n readonly componentValueModel = new MutableValueModel<T>();\n // we need this for plain values otherwise our Form.DelegatingValueModel will stay disabled.\n private plainValueHolder: MutableValueModel<T>;\n\n // We add support for simple direct display of values by allowing components to be used\n // by `component.value = ...` This use of the component without a value model in tables\n // and the like.\n @Input() set value(value: T) {\n this.setValueInProgress.whileTrue(() => {\n if (!this.plainValueHolder) {\n this.plainValueHolder = new MutableValueModel<T>(value);\n this.valueModel = this.plainValueHolder;\n } else {\n this.plainValueHolder.value = value;\n }\n });\n }\n\n @Output() readonly valueChange = new EventEmitter<T>();\n\n constructor() {\n super();\n const { when, chain, valueOf } = Dsl.disposeWith(this);\n const binding = new Binding.Identity(this.formValueModel, this.componentValueModel);\n const inExternalChange = valueOf.any(\n this.setValueInProgress,\n chain(binding.direction).equals(Binding.Direction.RIGHT)\n ).areTruthy();\n\n when(this.componentValueModel).changes((is, was) => {\n this.valueChange.emit(is);\n this.onValueEditedListeners.fire(l => l(is, was));\n }, {\n initialValue: 'ignore',\n // we never fire events during an external set value operation. This allows\n // the component to behave when used in the conventional angular\n // fashion, i.e. [(value)]=\"...\"\n unless: inExternalChange\n });\n DebugContext.tag(this.formValueModel, `${this.constructor.name}.formValueModel`);\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"AbstractValueInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-input.component","name":"AbstractInputComponent","line":6,"character":52},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"template":""}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"AbstractValueInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"./abstract-input.component","name":"AbstractInputComponent","line":15,"character":52},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"template":""}]}],"members":{"valueModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":17,"character":12},"arguments":[{"delegateTo":"formValueModel"}]}]}],"value":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"valueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":52,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}]}}}}]
@@ -0,0 +1,70 @@
1
+ import { __decorate, __metadata } from "tslib";
2
+ import { Component, ContentChild, Input, TemplateRef } from '@angular/core';
3
+ import { Dsl, ListModel, MutableValueModel, StoreInListModel, TrackExternal } from '@coolon/pectin';
4
+ import _ from 'lodash';
5
+ import { AbstractValueInputComponent } from '../abstract-value-input.component';
6
+ /**
7
+ * Using templates (not only supported for nil values:
8
+ * <aup-autocomplete-input [valueModel]="myModel" [options]="myOptions">
9
+ * <ng-template #nilOptionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>
10
+ * </aup-autocomplete-input>
11
+ */
12
+ let AutocompleteInputComponent = class AutocompleteInputComponent extends AbstractValueInputComponent {
13
+ constructor() {
14
+ super();
15
+ this.filterValue = new MutableValueModel();
16
+ this.optionLabelFormat = (option) => (option && this.optionLabel) ? option[this.optionLabel] : option;
17
+ const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
18
+ const lowerCaseFilterValue = chain(this.filterValue)
19
+ .map(v => _.isString(v) ? v.toLowerCase() : '');
20
+ this.filteredOptions = chain(this.optionsModel)
21
+ .select(option => {
22
+ return _.isEmpty(this.filterValue.value) || this.optionLabelFormat(option).toString().toLowerCase().includes(lowerCaseFilterValue.value);
23
+ }, { dependsOn: lowerCaseFilterValue });
24
+ }
25
+ ngOnInit() {
26
+ }
27
+ formatOption(option) {
28
+ return this.optionLabelFormat(option);
29
+ }
30
+ updateFilter($event) {
31
+ this.filterValue.value = $event;
32
+ }
33
+ onSelect($event) {
34
+ this.valueModel.value = $event.option.value;
35
+ }
36
+ };
37
+ __decorate([
38
+ Input(), TrackExternal(),
39
+ __metadata("design:type", ListModel)
40
+ ], AutocompleteInputComponent.prototype, "optionsModel", void 0);
41
+ __decorate([
42
+ Input(), StoreInListModel('optionsModel'),
43
+ __metadata("design:type", Array)
44
+ ], AutocompleteInputComponent.prototype, "options", void 0);
45
+ __decorate([
46
+ Input(),
47
+ __metadata("design:type", Object)
48
+ ], AutocompleteInputComponent.prototype, "optionLabel", void 0);
49
+ __decorate([
50
+ Input(),
51
+ __metadata("design:type", Boolean)
52
+ ], AutocompleteInputComponent.prototype, "allowNil", void 0);
53
+ __decorate([
54
+ ContentChild('nilOptionTemplate'),
55
+ __metadata("design:type", TemplateRef)
56
+ ], AutocompleteInputComponent.prototype, "nilOptionTemplateRef", void 0);
57
+ __decorate([
58
+ Input(),
59
+ __metadata("design:type", Function)
60
+ ], AutocompleteInputComponent.prototype, "optionLabelFormat", void 0);
61
+ AutocompleteInputComponent = __decorate([
62
+ Component({
63
+ selector: 'aup-autocomplete-input',
64
+ template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"string\"\n matInput\n [matAutocomplete]=\"autocomplete\"\n placeholder=\"{{placeholder}}\"\n [ngModel]=\"componentValueModel.value\"\n (ngModelChange)=\"updateFilter($event)\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-autocomplete #autocomplete [displayWith]=\"optionLabelFormat\" [autoActiveFirstOption]=\"true\" (optionSelected)=\"onSelect($event)\">\n <mat-option *ngFor=\"let option of filteredOptions.value; let i = index\"\n [value]=\"option\"\n >{{formatOption(option)}}</mat-option>\n <mat-option *ngIf=\"allowNil\">{{placeholder}}</mat-option>\n </mat-autocomplete>\n\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
65
+ styles: [":host{display:inline-block}mat-form-field{width:100%}"]
66
+ }),
67
+ __metadata("design:paramtypes", [])
68
+ ], AutocompleteInputComponent);
69
+ export { AutocompleteInputComponent };
70
+ //# sourceMappingURL=autocomplete-input.component.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"autocomplete-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/autocomplete-input/autocomplete-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,WAAW,EAAE,MAAM,eAAe,CAAC;AAEpF,OAAO,EACL,GAAG,EACH,SAAS,EAET,iBAAiB,EACjB,gBAAgB,EAEhB,aAAa,EACd,MAAM,gBAAgB,CAAC;AACxB,OAAO,CAAC,MAAM,QAAQ,CAAC;AACvB,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAEhF;;;;;GAKG;AAMH,IAAa,0BAA0B,GAAvC,MAAa,0BAAoC,SAAQ,2BAA8B;IAuBrF;QACE,KAAK,EAAE,CAAC;QAPF,gBAAW,GAAG,IAAI,iBAAiB,EAAU,CAAC;QAItD,sBAAiB,GAAuB,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;QAInH,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzF,MAAO,oBAAoB,GAAG,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC;aAClD,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QAElD,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC;aAC5C,MAAM,CAAC,MAAM,CAAC,EAAE;YACf,OAAO,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,oBAAoB,CAAC,KAAK,CAAC,CAAC;QAC3I,CAAC,EAAE,EAAE,SAAS,EAAE,oBAAoB,EAAE,CAAC,CAAC;IAC5C,CAAC;IAED,QAAQ;IACR,CAAC;IAED,YAAY,CAAC,MAAS;QACpB,OAAO,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACxC,CAAC;IAED,YAAY,CAAC,MAAc;QACzB,IAAI,CAAC,WAAW,CAAC,KAAK,GAAG,MAAM,CAAC;IAClC,CAAC;IAED,QAAQ,CAAC,MAAoC;QAC3C,IAAI,CAAC,UAAU,CAAC,KAAK,GAAG,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC;IAC9C,CAAC;CACF,CAAA;AA9CC;IADC,KAAK,EAAE,EAAE,aAAa,EAAE;8BACX,SAAS;gEAAI;AAG3B;IADC,KAAK,EAAE,EAAE,gBAAgB,CAAC,cAAc,CAAC;;2DAC7B;AAGb;IADC,KAAK,EAAE;;+DACa;AAGrB;IADC,KAAK,EAAE;;4DACU;AAGlB;IADC,YAAY,CAAC,mBAAmB,CAAC;8BACZ,WAAW;wEAAM;AAMvC;IADC,KAAK,EAAE;;qEAC6G;AArB1G,0BAA0B;IALtC,SAAS,CAAC;QACT,QAAQ,EAAE,wBAAwB;QAClC,gnCAAkD;;KAEnD,CAAC;;GACW,0BAA0B,CAiDtC;SAjDY,0BAA0B","sourcesContent":["import { Component, ContentChild, Input, OnInit, TemplateRef } from '@angular/core';\nimport { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';\nimport {\n Dsl,\n ListModel,\n ListModelChain,\n MutableValueModel,\n StoreInListModel,\n Trace,\n TrackExternal, TransactionObserver\n} from '@coolon/pectin';\nimport _ from 'lodash';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n/**\n * Using templates (not only supported for nil values:\n * <aup-autocomplete-input [valueModel]=\"myModel\" [options]=\"myOptions\">\n * <ng-template #nilOptionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>\n * </aup-autocomplete-input>\n */\n@Component({\n selector: 'aup-autocomplete-input',\n templateUrl: './autocomplete-input.component.html',\n styleUrls: ['./autocomplete-input.component.scss']\n})\nexport class AutocompleteInputComponent<T = any> extends AbstractValueInputComponent<T> implements OnInit {\n\n @Input() @TrackExternal()\n optionsModel: ListModel<T>;\n\n @Input() @StoreInListModel('optionsModel')\n options: T[];\n\n @Input()\n optionLabel: keyof T;\n\n @Input()\n allowNil: boolean;\n\n @ContentChild('nilOptionTemplate')\n nilOptionTemplateRef: TemplateRef<any>;\n\n private filterValue = new MutableValueModel<string>();\n readonly filteredOptions: ListModelChain<T>;\n\n @Input()\n optionLabelFormat: (option: T) => any = (option) => (option && this.optionLabel) ? option[this.optionLabel] : option;\n\n constructor() {\n super();\n const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);\n const lowerCaseFilterValue = chain(this.filterValue)\n .map(v => _.isString(v) ? v.toLowerCase() : '');\n\n this.filteredOptions = chain(this.optionsModel)\n .select(option => {\n return _.isEmpty(this.filterValue.value) || this.optionLabelFormat(option).toString().toLowerCase().includes(lowerCaseFilterValue.value);\n }, { dependsOn: lowerCaseFilterValue });\n }\n\n ngOnInit() {\n }\n\n formatOption(option: T) {\n return this.optionLabelFormat(option);\n }\n\n updateFilter($event: string) {\n this.filterValue.value = $event;\n }\n\n onSelect($event: MatAutocompleteSelectedEvent) {\n this.valueModel.value = $event.option.value;\n }\n}\n"]}
@@ -0,0 +1 @@
1
+ [{"__symbolic":"module","version":4,"metadata":{"AutocompleteInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":25,"character":57},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"aup-autocomplete-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"string\"\n matInput\n [matAutocomplete]=\"autocomplete\"\n placeholder=\"{{placeholder}}\"\n [ngModel]=\"componentValueModel.value\"\n (ngModelChange)=\"updateFilter($event)\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-autocomplete #autocomplete [displayWith]=\"optionLabelFormat\" [autoActiveFirstOption]=\"true\" (optionSelected)=\"onSelect($event)\">\n <mat-option *ngFor=\"let option of filteredOptions.value; let i = index\"\n [value]=\"option\"\n >{{formatOption(option)}}</mat-option>\n <mat-option *ngIf=\"allowNil\">{{placeholder}}</mat-option>\n </mat-autocomplete>\n\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n","styles":[":host{display:inline-block}mat-form-field{width:100%}"]}]}],"members":{"optionsModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":27,"character":12}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInListModel","line":30,"character":12},"arguments":["optionsModel"]}]}],"optionLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"allowNil":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"nilOptionTemplateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":39,"character":3},"arguments":["nilOptionTemplate"]}]}],"optionLabelFormat":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"formatOption":[{"__symbolic":"method"}],"updateFilter":[{"__symbolic":"method"}],"onSelect":[{"__symbolic":"method"}]}}}}]
@@ -0,0 +1 @@
1
+ {"version":3,"file":"autocomplete-input.component.ngfactory.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/autocomplete-input/autocomplete-input.component.ngfactory.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n"]}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"autocomplete-input.component.scss.shim.ngstyle.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/autocomplete-input/autocomplete-input.component.scss.shim.ngstyle.ts"],"names":[],"mappings":"","sourcesContent":["import * as i0 from '@angular/core';\ni0.ComponentFactory;\n"]}
@@ -1,20 +1,17 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
2
  import { Component, Input } from '@angular/core';
3
- import { TrackExternal } from '@coolon/pectin';
4
3
  import { AbstractValueInputComponent } from '../abstract-value-input.component';
5
4
  let CheckboxInputComponent = class CheckboxInputComponent extends AbstractValueInputComponent {
6
5
  constructor() {
7
6
  super();
7
+ // @Input() @TrackExternal({ delegateTo: 'inputModel' })
8
+ // valueModel: Form.ValueModelBase<boolean> | IMutableValueModel<boolean>;
8
9
  this.color = 'accent';
9
10
  this.labelPosition = 'after';
10
11
  }
11
12
  ngOnInit() {
12
13
  }
13
14
  };
14
- __decorate([
15
- Input(), TrackExternal({ delegateTo: 'inputModel' }),
16
- __metadata("design:type", Object)
17
- ], CheckboxInputComponent.prototype, "valueModel", void 0);
18
15
  __decorate([
19
16
  Input(),
20
17
  __metadata("design:type", String)
@@ -26,8 +23,8 @@ __decorate([
26
23
  CheckboxInputComponent = __decorate([
27
24
  Component({
28
25
  selector: 'aup-checkbox-input',
29
- template: "<!-- TODO: add focus binding -->\n<mat-checkbox\n [(ngModel)]=\"valueModel.value\"\n [color]=\"color\"\n [labelPosition]=\"labelPosition\"\n [disabled]=\"!isEnabled()\"\n>{{label}}</mat-checkbox>\n<mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n<mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n",
30
- styles: [":host{display:inline-flex;flex-direction:column;margin-top:24px;margin-bottom:16px}mat-error,mat-hint{margin-top:4px;margin-left:24px;font-size:12px;font-weight:400;line-height:13.5px}"]
26
+ template: "<!-- TODO: add focus binding -->\n<mat-checkbox\n [(ngModel)]=\"componentValueModel.value\"\n [color]=\"color\"\n [labelPosition]=\"labelPosition\"\n [disabled]=\"!isEnabled()\"\n>{{label}}</mat-checkbox>\n<mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n<mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n",
27
+ styles: [":host{display:inline-flex;flex-direction:column;padding:24px 0 16px}:host.dense{padding:6px 0 2px}mat-error,mat-hint{margin-top:4px;margin-left:24px;font-size:12px;font-weight:400;line-height:13.5px}"]
31
28
  }),
32
29
  __metadata("design:paramtypes", [])
33
30
  ], CheckboxInputComponent);
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/checkbox-input/checkbox-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AACzD,OAAO,EAA4B,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAOhF,IAAa,sBAAsB,GAAnC,MAAa,sBAAuB,SAAQ,2BAAoC;IAW9E;QACE,KAAK,EAAE,CAAC;QANV,UAAK,GAAkC,QAAQ,CAAC;QAGhD,kBAAa,GAAuB,OAAO,CAAC;IAI5C,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAfC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC;;0DACkB;AAGvE;IADC,KAAK,EAAE;;qDACwC;AAGhD;IADC,KAAK,EAAE;;6DACoC;AATjC,sBAAsB;IALlC,SAAS,CAAC;QACT,QAAQ,EAAE,oBAAoB;QAC9B,8TAA8C;;KAE/C,CAAC;;GACW,sBAAsB,CAkBlC;SAlBY,sBAAsB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n@Component({\n selector: 'aup-checkbox-input',\n templateUrl: './checkbox-input.component.html',\n styleUrls: ['./checkbox-input.component.scss']\n})\nexport class CheckboxInputComponent extends AbstractValueInputComponent<boolean> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'inputModel' })\n valueModel: Form.ValueModelBase<boolean> | IMutableValueModel<boolean>;\n\n @Input()\n color: 'primary' | 'warn' | 'accent' = 'accent';\n\n @Input()\n labelPosition: 'before' | 'after' = 'after';\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
1
+ {"version":3,"file":"checkbox-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/checkbox-input/checkbox-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAEzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAOhF,IAAa,sBAAsB,GAAnC,MAAa,sBAAuB,SAAQ,2BAAoC;IAW9E;QACE,KAAK,EAAE,CAAC;QAVV,wDAAwD;QACxD,0EAA0E;QAG1E,UAAK,GAAkC,QAAQ,CAAC;QAGhD,kBAAa,GAAuB,OAAO,CAAC;IAI5C,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAZC;IADC,KAAK,EAAE;;qDACwC;AAGhD;IADC,KAAK,EAAE;;6DACoC;AATjC,sBAAsB;IALlC,SAAS,CAAC;QACT,QAAQ,EAAE,oBAAoB;QAC9B,2UAA8C;;KAE/C,CAAC;;GACW,sBAAsB,CAkBlC;SAlBY,sBAAsB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n@Component({\n selector: 'aup-checkbox-input',\n templateUrl: './checkbox-input.component.html',\n styleUrls: ['./checkbox-input.component.scss']\n})\nexport class CheckboxInputComponent extends AbstractValueInputComponent<boolean> implements OnInit {\n\n // @Input() @TrackExternal({ delegateTo: 'inputModel' })\n // valueModel: Form.ValueModelBase<boolean> | IMutableValueModel<boolean>;\n\n @Input()\n color: 'primary' | 'warn' | 'accent' = 'accent';\n\n @Input()\n labelPosition: 'before' | 'after' = 'after';\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"CheckboxInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":9,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"aup-checkbox-input","template":"<!-- TODO: add focus binding -->\n<mat-checkbox\n [(ngModel)]=\"valueModel.value\"\n [color]=\"color\"\n [labelPosition]=\"labelPosition\"\n [disabled]=\"!isEnabled()\"\n>{{label}}</mat-checkbox>\n<mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n<mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n","styles":[":host{display:inline-flex;flex-direction:column;margin-top:24px;margin-bottom:16px}mat-error,mat-hint{margin-top:4px;margin-left:24px;font-size:12px;font-weight:400;line-height:13.5px}"]}]}],"members":{"valueModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":11,"character":12},"arguments":[{"delegateTo":"inputModel"}]}]}],"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"labelPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"CheckboxInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":9,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"aup-checkbox-input","template":"<!-- TODO: add focus binding -->\n<mat-checkbox\n [(ngModel)]=\"componentValueModel.value\"\n [color]=\"color\"\n [labelPosition]=\"labelPosition\"\n [disabled]=\"!isEnabled()\"\n>{{label}}</mat-checkbox>\n<mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n<mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n","styles":[":host{display:inline-flex;flex-direction:column;padding:24px 0 16px}:host.dense{padding:6px 0 2px}mat-error,mat-hint{margin-top:4px;margin-left:24px;font-size:12px;font-weight:400;line-height:13.5px}"]}]}],"members":{"color":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"labelPosition":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
@@ -2,6 +2,13 @@ import { __decorate, __metadata } from "tslib";
2
2
  import { Component, ContentChild, Input, TemplateRef } from '@angular/core';
3
3
  import { ListModel, StoreInListModel, TrackExternal } from '@coolon/pectin';
4
4
  import { AbstractListInputComponent } from '../abstract-list-input.component';
5
+ /**
6
+ * Using templates:
7
+ * <aup-multiple-select-input [valueModel]="myModel" [options]="myOptions">
8
+ * <ng-template #optionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>
9
+ * <ng-template #nilOptionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>
10
+ * </aup-multiple-select_input>
11
+ */
5
12
  let MultipleSelectInputComponent = class MultipleSelectInputComponent extends AbstractListInputComponent {
6
13
  constructor() {
7
14
  super();
@@ -10,10 +17,6 @@ let MultipleSelectInputComponent = class MultipleSelectInputComponent extends Ab
10
17
  ngOnInit() {
11
18
  }
12
19
  };
13
- __decorate([
14
- Input(), TrackExternal({ delegateTo: 'inputModel' }),
15
- __metadata("design:type", Object)
16
- ], MultipleSelectInputComponent.prototype, "listModel", void 0);
17
20
  __decorate([
18
21
  Input(), TrackExternal(),
19
22
  __metadata("design:type", ListModel)
@@ -26,18 +29,10 @@ __decorate([
26
29
  Input(),
27
30
  __metadata("design:type", Object)
28
31
  ], MultipleSelectInputComponent.prototype, "optionLabel", void 0);
29
- __decorate([
30
- Input(),
31
- __metadata("design:type", Boolean)
32
- ], MultipleSelectInputComponent.prototype, "allowNil", void 0);
33
32
  __decorate([
34
33
  ContentChild('optionTemplate'),
35
34
  __metadata("design:type", TemplateRef)
36
35
  ], MultipleSelectInputComponent.prototype, "optionTemplateRef", void 0);
37
- __decorate([
38
- ContentChild('nilOptionTemplate'),
39
- __metadata("design:type", TemplateRef)
40
- ], MultipleSelectInputComponent.prototype, "nilOptionTemplateRef", void 0);
41
36
  __decorate([
42
37
  Input(),
43
38
  __metadata("design:type", Function)
@@ -45,7 +40,7 @@ __decorate([
45
40
  MultipleSelectInputComponent = __decorate([
46
41
  Component({
47
42
  selector: 'aup-multiple-select-input',
48
- template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <mat-select placeholder=\"{{placeholder}}\"\n multiple\n [(ngModel)]=\"listModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-option *ngIf=\"allowNil\">{{placeholder}}</mat-option>\n <mat-option *ngFor=\"let option of optionsModel.value; let i = index\" [value]=\"option\">\n <ng-container *ngIf=\"!optionTemplateRef\">{{optionLabelFormat(option)}}</ng-container>\n <ng-container *ngIf=\"optionTemplateRef\"\n [ngTemplateOutlet]=\"optionTemplateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: option, index: i }\"\n >\n </ng-container>\n </mat-option>\n </mat-select>\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
43
+ template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <mat-select placeholder=\"{{placeholder}}\"\n multiple\n [(ngModel)]=\"componentListModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-option *ngFor=\"let option of optionsModel.value; let i = index\" [value]=\"option\">\n <ng-container *ngIf=\"!optionTemplateRef\">{{optionLabelFormat(option)}}</ng-container>\n <ng-container *ngIf=\"optionTemplateRef\"\n [ngTemplateOutlet]=\"optionTemplateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: option, index: i }\"\n >\n </ng-container>\n </mat-option>\n </mat-select>\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
49
44
  styles: [":host{display:inline-block}mat-form-field{width:100%}"]
50
45
  }),
51
46
  __metadata("design:paramtypes", [])
@@ -1 +1 @@
1
- {"version":3,"file":"multiple-select-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/multiple-select-input/multiple-select-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,WAAW,EAAE,MAAM,eAAe,CAAC;AACpF,OAAO,EAA2B,SAAS,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACrG,OAAO,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAC;AAO9E,IAAa,4BAA4B,GAAzC,MAAa,4BAAsC,SAAQ,0BAA6B;IA0BtF;QACE,KAAK,EAAE,CAAC;QAHV,sBAAiB,GAAuB,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IAIrH,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AA9BC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC;;+DACG;AAGxD;IADC,KAAK,EAAE,EAAE,aAAa,EAAE;8BACX,SAAS;kEAAI;AAG3B;IADC,KAAK,EAAE,EAAE,gBAAgB,CAAC,cAAc,CAAC;;6DAC7B;AAGb;IADC,KAAK,EAAE;;iEACa;AAGrB;IADC,KAAK,EAAE;;8DACU;AAGlB;IADC,YAAY,CAAC,gBAAgB,CAAC;8BACZ,WAAW;uEAAM;AAGpC;IADC,YAAY,CAAC,mBAAmB,CAAC;8BACZ,WAAW;0EAAM;AAGvC;IADC,KAAK,EAAE;;uEAC6G;AAxB1G,4BAA4B;IALxC,SAAS,CAAC;QACT,QAAQ,EAAE,2BAA2B;QACrC,onCAAqD;;KAEtD,CAAC;;GACW,4BAA4B,CAiCxC;SAjCY,4BAA4B","sourcesContent":["import { Component, ContentChild, Input, OnInit, TemplateRef } from '@angular/core';\nimport { Form, IMutableListModel, ListModel, StoreInListModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractListInputComponent } from '../abstract-list-input.component';\n\n@Component({\n selector: 'aup-multiple-select-input',\n templateUrl: './multiple-select-input.component.html',\n styleUrls: ['./multiple-select-input.component.scss']\n})\nexport class MultipleSelectInputComponent<T = any> extends AbstractListInputComponent<T> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'inputModel' })\n listModel: Form.ListModelBase<T> | IMutableListModel<T>;\n\n @Input() @TrackExternal()\n optionsModel: ListModel<T>;\n\n @Input() @StoreInListModel('optionsModel')\n options: T[];\n\n @Input()\n optionLabel: keyof T;\n\n @Input()\n allowNil: boolean;\n\n @ContentChild('optionTemplate')\n optionTemplateRef: TemplateRef<any>;\n\n @ContentChild('nilOptionTemplate')\n nilOptionTemplateRef: TemplateRef<any>;\n\n @Input()\n optionLabelFormat: (option: T) => any = (option) => (option && this.optionLabel) ? option[this.optionLabel] : option;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
1
+ {"version":3,"file":"multiple-select-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/multiple-select-input/multiple-select-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,KAAK,EAAU,WAAW,EAAE,MAAM,eAAe,CAAC;AACpF,OAAO,EAA2B,SAAS,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACrG,OAAO,EAAE,0BAA0B,EAAE,MAAM,kCAAkC,CAAC;AAE9E;;;;;;GAMG;AAMH,IAAa,4BAA4B,GAAzC,MAAa,4BAAsC,SAAQ,0BAA6B;IAiBtF;QACE,KAAK,EAAE,CAAC;QAHV,sBAAiB,GAAuB,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IAIrH,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AArBC;IADC,KAAK,EAAE,EAAE,aAAa,EAAE;8BACX,SAAS;kEAAI;AAG3B;IADC,KAAK,EAAE,EAAE,gBAAgB,CAAC,cAAc,CAAC;;6DAC7B;AAGb;IADC,KAAK,EAAE;;iEACa;AAGrB;IADC,YAAY,CAAC,gBAAgB,CAAC;8BACZ,WAAW;uEAAM;AAGpC;IADC,KAAK,EAAE;;uEAC6G;AAf1G,4BAA4B;IALxC,SAAS,CAAC;QACT,QAAQ,EAAE,2BAA2B;QACrC,gkCAAqD;;KAEtD,CAAC;;GACW,4BAA4B,CAwBxC;SAxBY,4BAA4B","sourcesContent":["import { Component, ContentChild, Input, OnInit, TemplateRef } from '@angular/core';\nimport { Form, IMutableListModel, ListModel, StoreInListModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractListInputComponent } from '../abstract-list-input.component';\n\n/**\n * Using templates:\n * <aup-multiple-select-input [valueModel]=\"myModel\" [options]=\"myOptions\">\n * <ng-template #optionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>\n * <ng-template #nilOptionTemplate let-option>{{option.thePropertyYouWant}}</ng-template>\n * </aup-multiple-select_input>\n */\n@Component({\n selector: 'aup-multiple-select-input',\n templateUrl: './multiple-select-input.component.html',\n styleUrls: ['./multiple-select-input.component.scss']\n})\nexport class MultipleSelectInputComponent<T = any> extends AbstractListInputComponent<T> implements OnInit {\n\n @Input() @TrackExternal()\n optionsModel: ListModel<T>;\n\n @Input() @StoreInListModel('optionsModel')\n options: T[];\n\n @Input()\n optionLabel: keyof T;\n\n @ContentChild('optionTemplate')\n optionTemplateRef: TemplateRef<any>;\n\n @Input()\n optionLabelFormat: (option: T) => any = (option) => (option && this.optionLabel) ? option[this.optionLabel] : option;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"MultipleSelectInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-list-input.component","name":"AbstractListInputComponent","line":9,"character":59},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"aup-multiple-select-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <mat-select placeholder=\"{{placeholder}}\"\n multiple\n [(ngModel)]=\"listModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-option *ngIf=\"allowNil\">{{placeholder}}</mat-option>\n <mat-option *ngFor=\"let option of optionsModel.value; let i = index\" [value]=\"option\">\n <ng-container *ngIf=\"!optionTemplateRef\">{{optionLabelFormat(option)}}</ng-container>\n <ng-container *ngIf=\"optionTemplateRef\"\n [ngTemplateOutlet]=\"optionTemplateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: option, index: i }\"\n >\n </ng-container>\n </mat-option>\n </mat-select>\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n","styles":[":host{display:inline-block}mat-form-field{width:100%}"]}]}],"members":{"listModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":11,"character":12},"arguments":[{"delegateTo":"inputModel"}]}]}],"optionsModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":14,"character":12}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInListModel","line":17,"character":12},"arguments":["optionsModel"]}]}],"optionLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"allowNil":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"optionTemplateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":26,"character":3},"arguments":["optionTemplate"]}]}],"nilOptionTemplateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":29,"character":3},"arguments":["nilOptionTemplate"]}]}],"optionLabelFormat":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"MultipleSelectInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-list-input.component","name":"AbstractListInputComponent","line":16,"character":59},"arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"aup-multiple-select-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <mat-select placeholder=\"{{placeholder}}\"\n multiple\n [(ngModel)]=\"componentListModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-option *ngFor=\"let option of optionsModel.value; let i = index\" [value]=\"option\">\n <ng-container *ngIf=\"!optionTemplateRef\">{{optionLabelFormat(option)}}</ng-container>\n <ng-container *ngIf=\"optionTemplateRef\"\n [ngTemplateOutlet]=\"optionTemplateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: option, index: i }\"\n >\n </ng-container>\n </mat-option>\n </mat-select>\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n","styles":[":host{display:inline-block}mat-form-field{width:100%}"]}]}],"members":{"optionsModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":18,"character":12}}]}],"options":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"StoreInListModel","line":21,"character":12},"arguments":["optionsModel"]}]}],"optionLabel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"optionTemplateRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":27,"character":3},"arguments":["optionTemplate"]}]}],"optionLabelFormat":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
@@ -1,20 +1,17 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
2
  import { Component, Input } from '@angular/core';
3
- import { TrackExternal } from '@coolon/pectin';
4
3
  import { AbstractValueInputComponent } from '../abstract-value-input.component';
5
4
  let NumberInputComponent = class NumberInputComponent extends AbstractValueInputComponent {
6
5
  constructor() {
7
6
  super();
7
+ // @Input() @TrackExternal({ delegateTo: 'inputModel' })
8
+ // valueModel: Form.ValueModelBase<number> | IMutableValueModel<number>;
8
9
  this.min = Number.MIN_SAFE_INTEGER;
9
10
  this.max = Number.MAX_SAFE_INTEGER;
10
11
  }
11
12
  ngOnInit() {
12
13
  }
13
14
  };
14
- __decorate([
15
- Input(), TrackExternal({ delegateTo: 'inputModel' }),
16
- __metadata("design:type", Object)
17
- ], NumberInputComponent.prototype, "valueModel", void 0);
18
15
  __decorate([
19
16
  Input(),
20
17
  __metadata("design:type", Object)
@@ -26,8 +23,8 @@ __decorate([
26
23
  NumberInputComponent = __decorate([
27
24
  Component({
28
25
  selector: 'aup-number-input',
29
- template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"number\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"valueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [min]=\"min\"\n [max]=\"max\"\n >\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
30
- styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}:host-context(aup-table-cell-renderer) mat-form-field div.mat-form-field-infix{width:auto}"]
26
+ template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"number\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"componentValueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [min]=\"min\"\n [max]=\"max\"\n >\n <mat-hint *ngIf=\"hint && !dense\" >{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n",
27
+ styles: [""]
31
28
  }),
32
29
  __metadata("design:paramtypes", [])
33
30
  ], NumberInputComponent);
@@ -1 +1 @@
1
- {"version":3,"file":"number-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/number-input/number-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AACzD,OAAO,EAAiC,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAQhF,IAAa,oBAAoB,GAAjC,MAAa,oBAAqB,SAAQ,2BAAmC;IAW3E;QACE,KAAK,EAAE,CAAC;QANV,QAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC;QAG9B,QAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC;IAI9B,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAfC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC;;wDACgB;AAGrE;IADC,KAAK,EAAE;;iDACsB;AAG9B;IADC,KAAK,EAAE;;iDACsB;AATnB,oBAAoB;IALhC,SAAS,CAAC;QACT,QAAQ,EAAE,kBAAkB;QAC5B,yqBAA4C;;KAE7C,CAAC;;GACW,oBAAoB,CAkBhC;SAlBY,oBAAoB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Dsl, Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n\n@Component({\n selector: 'aup-number-input',\n templateUrl: './number-input.component.html',\n styleUrls: ['./number-input.component.scss']\n})\nexport class NumberInputComponent extends AbstractValueInputComponent<number> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'inputModel' })\n valueModel: Form.ValueModelBase<number> | IMutableValueModel<number>;\n\n @Input()\n min = Number.MIN_SAFE_INTEGER;\n\n @Input()\n max = Number.MAX_SAFE_INTEGER;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
1
+ {"version":3,"file":"number-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/number-input/number-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AAEzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAQhF,IAAa,oBAAoB,GAAjC,MAAa,oBAAqB,SAAQ,2BAAmC;IAW3E;QACE,KAAK,EAAE,CAAC;QAVV,wDAAwD;QACxD,wEAAwE;QAGxE,QAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC;QAG9B,QAAG,GAAG,MAAM,CAAC,gBAAgB,CAAC;IAI9B,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAZC;IADC,KAAK,EAAE;;iDACsB;AAG9B;IADC,KAAK,EAAE;;iDACsB;AATnB,oBAAoB;IALhC,SAAS,CAAC;QACT,QAAQ,EAAE,kBAAkB;QAC5B,6rBAA4C;;KAE7C,CAAC;;GACW,oBAAoB,CAkBhC;SAlBY,oBAAoB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Dsl, Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n\n@Component({\n selector: 'aup-number-input',\n templateUrl: './number-input.component.html',\n styleUrls: ['./number-input.component.scss']\n})\nexport class NumberInputComponent extends AbstractValueInputComponent<number> implements OnInit {\n\n // @Input() @TrackExternal({ delegateTo: 'inputModel' })\n // valueModel: Form.ValueModelBase<number> | IMutableValueModel<number>;\n\n @Input()\n min = Number.MIN_SAFE_INTEGER;\n\n @Input()\n max = Number.MAX_SAFE_INTEGER;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"NumberInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":10,"character":42},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"aup-number-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"number\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"valueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [min]=\"min\"\n [max]=\"max\"\n >\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n","styles":[":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}:host-context(aup-table-cell-renderer) mat-form-field div.mat-form-field-infix{width:auto}"]}]}],"members":{"valueModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":12,"character":12},"arguments":[{"delegateTo":"inputModel"}]}]}],"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"NumberInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":10,"character":42},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"aup-number-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"number\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"componentValueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n [min]=\"min\"\n [max]=\"max\"\n >\n <mat-hint *ngIf=\"hint && !dense\" >{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n","styles":[""]}]}],"members":{"min":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"max":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
@@ -1,23 +1,20 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
- import { Component, Input } from '@angular/core';
3
- import { TrackExternal } from '@coolon/pectin';
2
+ import { Component } from '@angular/core';
4
3
  import { AbstractValueInputComponent } from '../abstract-value-input.component';
5
4
  let PasswordInputComponent = class PasswordInputComponent extends AbstractValueInputComponent {
5
+ // @Input() @TrackExternal({ delegateTo: 'inputModel' })
6
+ // valueModel: Form.ValueModelBase<string> | IMutableValueModel<string>;
6
7
  constructor() {
7
8
  super();
8
9
  }
9
10
  ngOnInit() {
10
11
  }
11
12
  };
12
- __decorate([
13
- Input(), TrackExternal({ delegateTo: 'inputModel' }),
14
- __metadata("design:type", Object)
15
- ], PasswordInputComponent.prototype, "valueModel", void 0);
16
13
  PasswordInputComponent = __decorate([
17
14
  Component({
18
15
  selector: 'aup-password-input',
19
- template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"password\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"valueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
20
- styles: [":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}:host-context(aup-table-cell-renderer) mat-form-field div.mat-form-field-infix{width:auto}"]
16
+ template: "<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"password\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"componentValueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n",
17
+ styles: [""]
21
18
  }),
22
19
  __metadata("design:paramtypes", [])
23
20
  ], PasswordInputComponent);
@@ -1 +1 @@
1
- {"version":3,"file":"password-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/password-input/password-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAU,MAAM,eAAe,CAAC;AACzD,OAAO,EAA4B,aAAa,EAAE,MAAM,gBAAgB,CAAC;AACzE,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAOhF,IAAa,sBAAsB,GAAnC,MAAa,sBAAuB,SAAQ,2BAAmC;IAK7E;QACE,KAAK,EAAE,CAAC;IACV,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AATC;IADC,KAAK,EAAE,EAAE,aAAa,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,CAAC;;0DACgB;AAH1D,sBAAsB;IALlC,SAAS,CAAC;QACT,QAAQ,EAAE,oBAAoB;QAC9B,6nBAA8C;;KAE/C,CAAC;;GACW,sBAAsB,CAYlC;SAZY,sBAAsB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n@Component({\n selector: 'aup-password-input',\n templateUrl: './password-input.component.html',\n styleUrls: ['./password-input.component.scss']\n})\nexport class PasswordInputComponent extends AbstractValueInputComponent<string> implements OnInit {\n\n @Input() @TrackExternal({ delegateTo: 'inputModel' })\n valueModel: Form.ValueModelBase<string> | IMutableValueModel<string>;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
1
+ {"version":3,"file":"password-input.component.js","sourceRoot":"ng://@coolon/angular-ui-powerups/","sources":["lib/components/forms/password-input/password-input.component.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAiB,MAAM,eAAe,CAAC;AAEzD,OAAO,EAAE,2BAA2B,EAAE,MAAM,mCAAmC,CAAC;AAOhF,IAAa,sBAAsB,GAAnC,MAAa,sBAAuB,SAAQ,2BAAmC;IAE7E,wDAAwD;IACxD,wEAAwE;IAExE;QACE,KAAK,EAAE,CAAC;IACV,CAAC;IAED,QAAQ;IACR,CAAC;CAEF,CAAA;AAZY,sBAAsB;IALlC,SAAS,CAAC;QACT,QAAQ,EAAE,oBAAoB;QAC9B,0oBAA8C;;KAE/C,CAAC;;GACW,sBAAsB,CAYlC;SAZY,sBAAsB","sourcesContent":["import { Component, Input, OnInit } from '@angular/core';\nimport { Form, IMutableValueModel, TrackExternal } from '@coolon/pectin';\nimport { AbstractValueInputComponent } from '../abstract-value-input.component';\n\n@Component({\n selector: 'aup-password-input',\n templateUrl: './password-input.component.html',\n styleUrls: ['./password-input.component.scss']\n})\nexport class PasswordInputComponent extends AbstractValueInputComponent<string> implements OnInit {\n\n // @Input() @TrackExternal({ delegateTo: 'inputModel' })\n // valueModel: Form.ValueModelBase<string> | IMutableValueModel<string>;\n\n constructor() {\n super();\n }\n\n ngOnInit() {\n }\n\n}\n"]}
@@ -1 +1 @@
1
- [{"__symbolic":"module","version":4,"metadata":{"PasswordInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":9,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"aup-password-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"password\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"valueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"hint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n","styles":[":host{display:block}input,mat-form-field{width:100%}input mat-hint.faux-error,mat-form-field mat-hint.faux-error{color:#f44336}:host-context(aup-table-cell-renderer) mat-form-field div.mat-form-field-infix{width:auto}"]}]}],"members":{"valueModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@coolon/pectin","name":"TrackExternal","line":11,"character":12},"arguments":[{"delegateTo":"inputModel"}]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]
1
+ [{"__symbolic":"module","version":4,"metadata":{"PasswordInputComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"../abstract-value-input.component","name":"AbstractValueInputComponent","line":9,"character":44},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"aup-password-input","template":"<mat-form-field appearance=\"standard\" [floatLabel]=\"floatLabel\">\n <mat-label *ngIf=\"label\">{{label}}</mat-label>\n <input type=\"password\"\n matInput\n placeholder=\"{{placeholder}}\"\n [(ngModel)]=\"componentValueModel.value\"\n [disabled]=\"!enabled.value\"\n (keydown.enter)=\"notifyEnterKey()\"\n (keydown.escape)=\"notifyEscapeKey()\"\n [pectinFocusBinding]=\"focusContext\"\n [errorStateMatcher]=\"errorStateMatcher\"\n >\n <mat-hint *ngIf=\"showHint\">{{hint}}</mat-hint>\n <mat-error *ngIf=\"hasErrors\">{{firstError}}</mat-error>\n</mat-form-field>\n\n","styles":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}}}}]