@daffodil/design 0.82.0 → 0.84.0

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 (176) hide show
  1. package/accordion/src/accordion-theme.scss +28 -6
  2. package/article/src/article-theme.scss +118 -64
  3. package/atoms/form/checkbox/cva/checkbox-cva.directive.d.ts +3 -0
  4. package/atoms/form/error-message/error-message.component.d.ts +4 -1
  5. package/atoms/form/error-message/error-message.module.d.ts +4 -1
  6. package/atoms/form/form-field/form-field/form-field.component.d.ts +23 -29
  7. package/atoms/form/form-field/form-field-control.d.ts +18 -4
  8. package/atoms/form/form-field/form-field-state.d.ts +7 -0
  9. package/atoms/form/form-field/form-field.d.ts +10 -0
  10. package/atoms/form/form-field/form-field.module.d.ts +6 -4
  11. package/atoms/form/form-field/public_api.d.ts +2 -1
  12. package/atoms/form/form-label/form-label.directive.d.ts +4 -1
  13. package/atoms/form/form-label/form-label.module.d.ts +4 -1
  14. package/atoms/form/hint/hint.component.d.ts +9 -0
  15. package/atoms/form/hint/public_api.d.ts +1 -0
  16. package/atoms/form/input/input.component.d.ts +15 -19
  17. package/atoms/form/input/input.module.d.ts +4 -2
  18. package/atoms/form/native-select/native-select.component.d.ts +5 -1
  19. package/atoms/form/quantity-field/quantity-field.component.d.ts +2 -1
  20. package/atoms/form/quantity-field/quantity-field.module.d.ts +3 -3
  21. package/atoms/form/quantity-field/quantity-input/quantity-input.component.d.ts +3 -0
  22. package/atoms/form/radio/cva/radio-cva.directive.d.ts +3 -0
  23. package/breadcrumb/breadcrumb/breadcrumb.component.d.ts +3 -0
  24. package/breadcrumb/src/breadcrumb-theme.scss +12 -3
  25. package/button/button/button-base.directive.d.ts +6 -23
  26. package/button/src/button/basic/button-theme.scss +17 -40
  27. package/button/src/button/button-base.scss +32 -5
  28. package/button/src/button/flat/flat-theme.scss +4 -38
  29. package/button/src/button/icon/icon-theme.scss +157 -79
  30. package/button/src/button/raised/raised-theme.scss +2 -2
  31. package/button/src/button/stroked/stroked-theme.scss +7 -39
  32. package/button/src/button/underline/underline-theme.scss +4 -18
  33. package/callout/src/callout-theme.scss +27 -10
  34. package/card/card/basic/basic.component.d.ts +3 -0
  35. package/card/card/raised/raised.component.d.ts +3 -0
  36. package/card/card/stroked/stroked.component.d.ts +3 -0
  37. package/card/examples/card-theming/card-theming.component.d.ts +2 -1
  38. package/card/examples/public_api.d.ts +1 -1
  39. package/card/src/card/stroked/stroked-theme.scss +102 -13
  40. package/card/src/card-base-theme.scss +126 -55
  41. package/checkbox/examples/basic-checkbox/basic-checkbox.component.d.ts +3 -0
  42. package/checkbox/examples/checkbox-set/checkbox-set.component.d.ts +3 -0
  43. package/core/article-encapsulated/article-encapsulated.directive.d.ts +3 -0
  44. package/core/colorable/colorable.directive.d.ts +8 -0
  45. package/core/manage-container-layout/manage-container-layout.directive.d.ts +3 -0
  46. package/core/openable/openable.directive.d.ts +3 -0
  47. package/core/prefix-suffix/prefix-suffix.module.d.ts +1 -1
  48. package/core/prefix-suffix/prefix.directive.d.ts +4 -1
  49. package/core/prefix-suffix/public_api.d.ts +0 -4
  50. package/core/prefix-suffix/suffix.directive.d.ts +4 -1
  51. package/core/sizable/sizable.directive.d.ts +8 -0
  52. package/core/statusable/statusable.directive.d.ts +2 -0
  53. package/core/text-alignable/text-alignable.directive.d.ts +6 -1
  54. package/fesm2022/daffodil-design-accordion.mjs +2 -2
  55. package/fesm2022/daffodil-design-accordion.mjs.map +1 -1
  56. package/fesm2022/daffodil-design-breadcrumb.mjs +5 -2
  57. package/fesm2022/daffodil-design-breadcrumb.mjs.map +1 -1
  58. package/fesm2022/daffodil-design-button-examples.mjs +21 -17
  59. package/fesm2022/daffodil-design-button-examples.mjs.map +1 -1
  60. package/fesm2022/daffodil-design-button.mjs +25 -32
  61. package/fesm2022/daffodil-design-button.mjs.map +1 -1
  62. package/fesm2022/daffodil-design-card-examples.mjs +14 -12
  63. package/fesm2022/daffodil-design-card-examples.mjs.map +1 -1
  64. package/fesm2022/daffodil-design-card.mjs +9 -0
  65. package/fesm2022/daffodil-design-card.mjs.map +1 -1
  66. package/fesm2022/daffodil-design-checkbox-examples.mjs +6 -0
  67. package/fesm2022/daffodil-design-checkbox-examples.mjs.map +1 -1
  68. package/fesm2022/daffodil-design-image.mjs +2 -2
  69. package/fesm2022/daffodil-design-image.mjs.map +1 -1
  70. package/fesm2022/daffodil-design-input-examples.mjs +45 -22
  71. package/fesm2022/daffodil-design-input-examples.mjs.map +1 -1
  72. package/fesm2022/daffodil-design-media-gallery.mjs +57 -18
  73. package/fesm2022/daffodil-design-media-gallery.mjs.map +1 -1
  74. package/fesm2022/daffodil-design-menu.mjs +23 -10
  75. package/fesm2022/daffodil-design-menu.mjs.map +1 -1
  76. package/fesm2022/daffodil-design-modal.mjs +33 -0
  77. package/fesm2022/daffodil-design-modal.mjs.map +1 -1
  78. package/fesm2022/daffodil-design-navbar.mjs +2 -2
  79. package/fesm2022/daffodil-design-notification-examples.mjs +8 -12
  80. package/fesm2022/daffodil-design-notification-examples.mjs.map +1 -1
  81. package/fesm2022/daffodil-design-notification.mjs +32 -5
  82. package/fesm2022/daffodil-design-notification.mjs.map +1 -1
  83. package/fesm2022/daffodil-design-paginator.mjs +2 -2
  84. package/fesm2022/daffodil-design-paginator.mjs.map +1 -1
  85. package/fesm2022/daffodil-design-progress-bar-examples.mjs +2 -2
  86. package/fesm2022/daffodil-design-progress-bar-examples.mjs.map +1 -1
  87. package/fesm2022/daffodil-design-progress-bar.mjs +18 -3
  88. package/fesm2022/daffodil-design-progress-bar.mjs.map +1 -1
  89. package/fesm2022/daffodil-design-quantity-field-examples.mjs +9 -9
  90. package/fesm2022/daffodil-design-quantity-field-examples.mjs.map +1 -1
  91. package/fesm2022/daffodil-design-sidebar.mjs +3 -8
  92. package/fesm2022/daffodil-design-sidebar.mjs.map +1 -1
  93. package/fesm2022/daffodil-design-switch-examples.mjs +6 -6
  94. package/fesm2022/daffodil-design-switch-examples.mjs.map +1 -1
  95. package/fesm2022/daffodil-design-switch.mjs +35 -11
  96. package/fesm2022/daffodil-design-switch.mjs.map +1 -1
  97. package/fesm2022/daffodil-design-tabs.mjs +27 -8
  98. package/fesm2022/daffodil-design-tabs.mjs.map +1 -1
  99. package/fesm2022/daffodil-design-toast-examples.mjs +6 -0
  100. package/fesm2022/daffodil-design-toast-examples.mjs.map +1 -1
  101. package/fesm2022/daffodil-design-toast.mjs +17 -18
  102. package/fesm2022/daffodil-design-toast.mjs.map +1 -1
  103. package/fesm2022/daffodil-design-tree.mjs +21 -7
  104. package/fesm2022/daffodil-design-tree.mjs.map +1 -1
  105. package/fesm2022/daffodil-design-youtube-player.mjs +3 -0
  106. package/fesm2022/daffodil-design-youtube-player.mjs.map +1 -1
  107. package/fesm2022/daffodil-design.mjs +301 -224
  108. package/fesm2022/daffodil-design.mjs.map +1 -1
  109. package/hero/src/hero-theme.scss +27 -10
  110. package/input/examples/examples.d.ts +2 -2
  111. package/input/examples/input-disabled/input-disabled.component.d.ts +2 -0
  112. package/input/examples/input-hint/input-hint.component.d.ts +5 -0
  113. package/input/examples/input-with-form-field/input-with-form-field.component.d.ts +2 -0
  114. package/list/list/list.component.d.ts +1 -1
  115. package/list/src/list-theme.scss +16 -20
  116. package/media-gallery/README.md +3 -3
  117. package/media-gallery/media-gallery/media-gallery.component.d.ts +21 -5
  118. package/media-gallery/public_api.d.ts +3 -3
  119. package/media-gallery/thumbnail/thumbnail.directive.d.ts +23 -6
  120. package/menu/menu/menu.component.d.ts +15 -0
  121. package/menu/menu-activator/menu-activator.component.d.ts +3 -0
  122. package/menu/src/menu-theme.scss +29 -10
  123. package/modal/modal/modal.component.d.ts +21 -0
  124. package/modal/modal-actions/modal-actions.component.d.ts +3 -0
  125. package/modal/modal-close/modal-close.directive.d.ts +3 -0
  126. package/modal/modal-content/modal-content.component.d.ts +3 -0
  127. package/modal/modal-title/modal-title.directive.d.ts +3 -0
  128. package/navbar/src/navbar-theme.scss +8 -3
  129. package/notification/README.md +11 -12
  130. package/notification/notification/notification.component.d.ts +17 -2
  131. package/notification/notification-actions/notification-actions.directive.d.ts +3 -0
  132. package/notification/notification-message/notification-message.directive.d.ts +3 -0
  133. package/notification/notification-subtitle/notification-subtitle.directive.d.ts +3 -0
  134. package/notification/notification-title/notification-title.directive.d.ts +3 -0
  135. package/notification/notification.d.ts +2 -2
  136. package/notification/src/notification-theme.scss +62 -23
  137. package/package.json +1 -1
  138. package/paginator/src/paginator-theme.scss +22 -17
  139. package/progress-bar/README.md +2 -4
  140. package/progress-bar/progress-bar-label/progress-bar-label.directive.d.ts +3 -0
  141. package/progress-bar/progress-bar.component.d.ts +15 -3
  142. package/progress-bar/src/progress-bar-theme.scss +17 -8
  143. package/public_api.d.ts +1 -0
  144. package/scss/state/skeleton/_mixins.scss +19 -9
  145. package/scss/theme.scss +2 -0
  146. package/sidebar/public_api.d.ts +10 -11
  147. package/sidebar/sidebar.d.ts +1 -2
  148. package/sidebar/sidebar.module.d.ts +1 -2
  149. package/src/atoms/form/error-message/error-message-theme.scss +4 -1
  150. package/src/atoms/form/form-field/form-field/form-field-theme.scss +22 -10
  151. package/src/atoms/form/hint/hint-theme.scss +17 -0
  152. package/src/atoms/form/input/input-theme.scss +1 -5
  153. package/switch/src/switch-theme.scss +29 -10
  154. package/switch/switch/switch.component.d.ts +31 -6
  155. package/switch/switch.d.ts +2 -2
  156. package/tabs/src/tabs-theme.scss +31 -13
  157. package/tabs/tabs/tab-activator/tab-activator.component.d.ts +15 -0
  158. package/tabs/tabs/tab-label/tab-label.component.d.ts +2 -5
  159. package/tabs/tabs/tabs.component.d.ts +3 -0
  160. package/toast/examples/default-toast/default-toast.component.d.ts +3 -0
  161. package/toast/examples/toast-positions/toast-positions.component.d.ts +3 -0
  162. package/toast/src/toast-theme.scss +80 -33
  163. package/toast/toast/toast-template.component.d.ts +3 -1
  164. package/toast/toast/toast.component.d.ts +3 -5
  165. package/tree/interfaces/tree-data.d.ts +15 -0
  166. package/tree/interfaces/tree-render-mode.d.ts +2 -2
  167. package/tree/src/tree-theme.scss +39 -13
  168. package/tree/tree/tree-notifier.service.d.ts +3 -3
  169. package/tree/tree/tree.component.d.ts +13 -3
  170. package/tree/tree-item/tree-item.directive.d.ts +6 -0
  171. package/youtube-player/youtube-player.component.d.ts +3 -0
  172. package/core/prefix-suffix/prefixable/prefixable-interface.d.ts +0 -7
  173. package/core/prefix-suffix/prefixable/prefixable.d.ts +0 -11
  174. package/core/prefix-suffix/suffixable/suffixable-interface.d.ts +0 -7
  175. package/core/prefix-suffix/suffixable/suffixable.d.ts +0 -11
  176. package/input/examples/basic-input/basic-input.component.d.ts +0 -5
@@ -5,17 +5,39 @@
5
5
  @mixin daff-accordion-theme($theme) {
6
6
  $neutral: core.daff-map-get($theme, 'core', 'neutral');
7
7
  $base: core.daff-map-get($theme, 'core', 'base');
8
+ $base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
9
+ $type: core.daff-map-get($theme, 'core', 'type');
8
10
 
9
11
  .daff-accordion-item {
10
- border-top: 1px solid theming.daff-illuminate($base, $neutral, 2);
12
+ @include theming.light($type) {
13
+ border-top: 1px solid theming.daff-color($neutral, 20);
11
14
 
12
- &:last-child {
13
- border-bottom: 1px solid theming.daff-illuminate($base, $neutral, 2);
15
+ &:last-child {
16
+ border-bottom: 1px solid theming.daff-color($neutral, 20);
17
+ }
18
+
19
+ .daff-accordion-item__header {
20
+ color: $base-contrast;
21
+
22
+ &::after {
23
+ border-color: $base-contrast;
24
+ }
25
+ }
14
26
  }
15
27
 
16
- &__header {
17
- &::after {
18
- border-color: currentColor;
28
+ @include theming.dark($type) {
29
+ border-top: 1px solid theming.daff-color($neutral, 80);
30
+
31
+ &:last-child {
32
+ border-bottom: 1px solid theming.daff-color($neutral, 80);
33
+ }
34
+
35
+ .daff-accordion-item__header {
36
+ color: $base-contrast;
37
+
38
+ &::after {
39
+ border-color: $base-contrast;
40
+ }
19
41
  }
20
42
  }
21
43
  }
@@ -5,104 +5,158 @@
5
5
 
6
6
  @mixin daff-article-theme($theme) {
7
7
  $primary: core.daff-map-get($theme, primary);
8
- $secondary: core.daff-map-get($theme, secondary);
9
- $tertiary: core.daff-map-get($theme, tertiary);
10
- $base: core.daff-map-get($theme, 'core', 'base');
11
- $base-contrast: core.daff-map-get($theme, 'core', 'base-contrast');
12
- $white: core.daff-map-get($theme, 'core', 'white');
13
- $black: core.daff-map-get($theme, 'core', 'black');
14
8
  $neutral: core.daff-map-get($theme, 'core', 'neutral');
9
+ $type: core.daff-map-get($theme, 'core', 'type');
15
10
 
16
- $text-color: theming.daff-illuminate($base-contrast, $neutral, 2);
17
- $table-border-color: theming.daff-illuminate($base, $neutral, 2);
11
+ $link-color-light: theming.daff-color($primary);
12
+ $link-color-dark: theming.daff-color($primary, 40);
13
+ $text-color-light: theming.daff-color($neutral, 90);
14
+ $text-color-dark: theming.daff-color($neutral, 10);
15
+ $table-border-light: theming.daff-color($neutral, 20);
16
+ $table-border-dark: theming.daff-color($neutral, 80);
18
17
 
19
18
  .daff-article {
20
- color: $text-color;
19
+ @include theming.light($type) {
20
+ color: $text-color-light;
21
21
 
22
- &__meta {
23
- color: theming.daff-illuminate($base-contrast, $neutral, 3);
24
- }
25
-
26
- @include stopsArticleCascade(a) {
27
- color: theming.daff-color($primary);
22
+ @include stopsArticleCascade(a) {
23
+ color: $link-color-light;
24
+ text-decoration-color: $link-color-light;
25
+ }
28
26
 
29
27
  code {
30
- background: theming.daff-illuminate($base, $primary, 1);
31
- color: theming.daff-illuminate($base-contrast, $primary, 4);
28
+ background: rgba(theming.daff-color($neutral, 20), 0.5);
32
29
  }
33
- }
34
30
 
35
- pre {
36
- background: theming.daff-illuminate($base, $neutral, 1);
37
- border: 1px solid theming.daff-illuminate($base, $neutral, 2);
38
- color: $base-contrast;
31
+ pre {
32
+ background: rgba(theming.daff-color($neutral, 20), 0.3);
33
+ border: 1px solid theming.daff-color($neutral, 20);
39
34
 
40
- code {
41
- background: none;
42
- border: none;
35
+ code {
36
+ background: none;
37
+ border: none;
38
+ }
39
+ }
40
+
41
+ hr {
42
+ background: theming.daff-color($neutral, 20);
43
43
  }
44
- }
45
44
 
46
- code {
47
- background: rgba(theming.daff-illuminate($base, $neutral, 2), 0.5);
48
- color: $base-contrast;
45
+ blockquote {
46
+ background: rgba(theming.daff-color($primary), 0.1);
47
+ border-left: 4px solid theming.daff-color($primary, 50);
48
+ color: theming.daff-color($primary, 100);
49
49
 
50
- @include stopsArticleCascade(a) {
51
- color: theming.daff-color($primary, 70);
50
+ code {
51
+ background: rgba(theming.daff-color($primary), 0.12);
52
+ color: theming.daff-color($primary, 100);
53
+
54
+ @include stopsArticleCascade(a) {
55
+ color: theming.daff-color($primary, 70);
56
+ text-decoration-color: theming.daff-color($primary, 70);
57
+ }
58
+ }
52
59
  }
53
- }
54
60
 
55
- hr {
56
- background: theming.daff-illuminate($base, $neutral, 2);
57
- }
61
+ table {
62
+ border: 1px solid $table-border-light;
63
+
64
+ th {
65
+ background: theming.daff-color($neutral, 10);
66
+ }
58
67
 
59
- blockquote {
60
- background: rgba(theming.daff-color($primary), 0.1);
61
- border-left: 4px solid theming.daff-illuminate($base, $primary, 5);
62
- color: theming.daff-illuminate($base-contrast, $primary, 1);
68
+ th,
69
+ td {
70
+ &:not(:last-child) {
71
+ border-right: 1px solid $table-border-light;
72
+ }
73
+ }
63
74
 
64
- code {
65
- background: rgba(theming.daff-color($primary), 0.15);
66
- color: $base-contrast;
75
+ thead {
76
+ th {
77
+ border-bottom: 1px solid $table-border-light;
78
+ }
79
+ }
80
+
81
+ tr {
82
+ &:not(:last-child) {
83
+ th,
84
+ td {
85
+ border-bottom: 1px solid $table-border-light;
86
+ }
87
+ }
88
+ }
67
89
  }
90
+ }
91
+
92
+ @include theming.dark($type) {
93
+ color: $text-color-dark;
68
94
 
69
95
  @include stopsArticleCascade(a) {
70
- color: theming.daff-illuminate($base, $primary, 7);
96
+ color: $link-color-dark;
97
+ text-decoration-color: $link-color-dark;
71
98
  }
72
99
 
73
- @include stopsArticleCascade(a) {
100
+ code {
101
+ background: rgba(theming.daff-color($neutral, 20), 0.15);
102
+ }
103
+
104
+ pre {
105
+ background: rgba(theming.daff-color($neutral, 20), 0.15);
106
+ border: 1px solid rgba(theming.daff-color($neutral, 20), 0.15);
107
+
74
108
  code {
75
- background: rgba(theming.daff-color($primary), 0.15);
76
- color: theming.daff-illuminate($base-contrast, $primary, 4);
109
+ background: none;
110
+ border: none;
77
111
  }
78
112
  }
79
- }
80
-
81
- table {
82
- border: 1px solid $table-border-color;
83
113
 
84
- th {
85
- background: theming.daff-illuminate($base, $neutral, 1);
114
+ hr {
115
+ background: theming.daff-color($neutral, 80);
86
116
  }
87
117
 
88
- th,
89
- td {
90
- &:not(:last-child) {
91
- border-right: 1px solid $table-border-color;
118
+ blockquote {
119
+ background: rgba(theming.daff-color($primary), 0.12);
120
+ border-left: 4px solid theming.daff-color($primary, 40);
121
+ color: theming.daff-color($primary, 10);
122
+
123
+ code {
124
+ background: rgba(theming.daff-color($primary), 0.18);
125
+ color: theming.daff-color($primary, 10);
126
+
127
+ @include stopsArticleCascade(a) {
128
+ color: theming.daff-color($primary, 40);
129
+ text-decoration-color: theming.daff-color($primary, 40);
130
+ }
92
131
  }
93
132
  }
94
133
 
95
- thead {
134
+ table {
135
+ border: 1px solid $table-border-dark;
136
+
96
137
  th {
97
- border-bottom: 1px solid $table-border-color;
138
+ background: theming.daff-color($neutral, 90);
139
+ }
140
+
141
+ th,
142
+ td {
143
+ &:not(:last-child) {
144
+ border-right: 1px solid $table-border-dark;
145
+ }
146
+ }
147
+
148
+ thead {
149
+ th {
150
+ border-bottom: 1px solid $table-border-dark;
151
+ }
98
152
  }
99
- }
100
153
 
101
- tr {
102
- &:not(:last-child) {
103
- th,
104
- td {
105
- border-bottom: 1px solid $table-border-color;
154
+ tr {
155
+ &:not(:last-child) {
156
+ th,
157
+ td {
158
+ border-bottom: 1px solid $table-border-dark;
159
+ }
106
160
  }
107
161
  }
108
162
  }
@@ -22,6 +22,9 @@ export declare class DaffCheckboxControlValueAccessorDirective implements OnInit
22
22
  /**
23
23
  * A lifecycle method called when the directive is initialized.
24
24
  */
25
+ /**
26
+ * @docs-private
27
+ */
25
28
  ngOnInit(): void;
26
29
  /**
27
30
  * writes a new value down into the component.
@@ -1,6 +1,9 @@
1
1
  import * as i0 from "@angular/core";
2
2
  export declare class DaffErrorMessageComponent {
3
+ /**
4
+ * @docs-private
5
+ */
3
6
  class: boolean;
4
7
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffErrorMessageComponent, never>;
5
- static ɵcmp: i0.ɵɵComponentDeclaration<DaffErrorMessageComponent, "daff-error-message", never, {}, {}, never, ["*"], false, never>;
8
+ static ɵcmp: i0.ɵɵComponentDeclaration<DaffErrorMessageComponent, "daff-error-message", never, {}, {}, never, ["*"], true, never>;
6
9
  }
@@ -1,7 +1,10 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import * as i1 from "./error-message.component";
3
+ /**
4
+ * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.
5
+ */
3
6
  export declare class DaffErrorMessageModule {
4
7
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffErrorMessageModule, never>;
5
- static ɵmod: i0.ɵɵNgModuleDeclaration<DaffErrorMessageModule, [typeof i1.DaffErrorMessageComponent], never, [typeof i1.DaffErrorMessageComponent]>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DaffErrorMessageModule, never, [typeof i1.DaffErrorMessageComponent], [typeof i1.DaffErrorMessageComponent]>;
6
9
  static ɵinj: i0.ɵɵInjectorDeclaration<DaffErrorMessageModule>;
7
10
  }
@@ -1,53 +1,47 @@
1
- import { DoCheck, AfterContentInit, AfterContentChecked } from '@angular/core';
1
+ import { AfterContentInit, AfterContentChecked, ChangeDetectorRef } from '@angular/core';
2
+ import { DaffPrefixDirective } from '../../../../core/prefix-suffix/prefix.directive';
3
+ import { DaffSuffixDirective } from '../../../../core/prefix-suffix/suffix.directive';
2
4
  import { DaffFormFieldControl } from '../form-field-control';
3
5
  import * as i0 from "@angular/core";
4
- export declare class DaffFormFieldComponent implements DoCheck, AfterContentInit, AfterContentChecked {
5
- /**
6
- * @docs-private
7
- */
8
- faChevronDown: import("@fortawesome/fontawesome-common-types").IconDefinition;
6
+ export declare class DaffFormFieldComponent implements AfterContentInit, AfterContentChecked {
7
+ private cd;
8
+ /** @docs-private */
9
9
  class: boolean;
10
+ /** @docs-private */
11
+ get isSelectField(): boolean;
12
+ /** @docs-private */
13
+ _prefix: DaffPrefixDirective;
14
+ /** @docs-private */
15
+ _suffix: DaffSuffixDirective;
10
16
  /**
11
- * The tracking property used to determine if the parent form has been submitted,
12
- * and thus show an error message (even if the field hasn't been touched).
13
- *
14
- * @deprecated Deprecated in version 0.78.0. Will be removed in version 1.0.0.
15
- */
16
- formSubmitted: boolean;
17
- /**
18
- * The child form control that the form-field manages
17
+ * The child form control that the form field manages.
19
18
  *
20
19
  * @docs-private
21
20
  */
22
- _control: DaffFormFieldControl;
21
+ _control: DaffFormFieldControl<unknown>;
23
22
  /**
24
23
  * Tracking property to keep a record of whether or not the
25
24
  * form field should be marked as error.
26
25
  */
27
26
  isError: boolean;
27
+ /**
28
+ * Tracking property to keep a record of whether or not the
29
+ * form field contains any user input.
30
+ */
31
+ isFilled: boolean;
32
+ isDisabled: boolean;
28
33
  /**
29
34
  * Tracking property to keep a record of whether or not the
30
35
  * form field should be marked as valid.
31
36
  */
32
37
  isValid: boolean;
38
+ constructor(cd: ChangeDetectorRef);
33
39
  /**
34
- * @docs
35
- *
36
40
  * Determines whether or not the form field should display its focused state.
37
41
  */
38
42
  get isFocused(): boolean;
39
43
  /**
40
- * Keeps the state of the form field consistent with its child DaffFormControl
41
- *
42
- * TODO: consider whether or not this can be refactored to some kind of
43
- * observable to remove unnecessary change detection.
44
- *
45
- * @docs-private
46
- */
47
- ngDoCheck(): void;
48
- /**
49
- * Validate whether or not the FormField is in
50
- * a "usable" state.
44
+ * Validate whether or not the FormField is in a "usable" state.
51
45
  */
52
46
  private _validateFormControl;
53
47
  /**
@@ -67,5 +61,5 @@ export declare class DaffFormFieldComponent implements DoCheck, AfterContentInit
67
61
  */
68
62
  ngAfterContentChecked(): void;
69
63
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffFormFieldComponent, never>;
70
- static ɵcmp: i0.ɵɵComponentDeclaration<DaffFormFieldComponent, "daff-form-field", never, { "formSubmitted": { "alias": "formSubmitted"; "required": false; }; }, {}, ["_control"], ["*", "daff-error-message"], false, never>;
64
+ static ɵcmp: i0.ɵɵComponentDeclaration<DaffFormFieldComponent, "daff-form-field", never, {}, {}, ["_prefix", "_suffix", "_control"], ["[daffPrefix]", "label[daffFormLabel]", "*", "[daffSuffix]", "daff-error-message", "daff-hint"], true, never>;
71
65
  }
@@ -1,4 +1,6 @@
1
1
  import { NgControl } from '@angular/forms';
2
+ import { BehaviorSubject, Observable } from 'rxjs';
3
+ import { DaffFormFieldState } from './form-field-state';
2
4
  /**
3
5
  *
4
6
  * The class that a form control must **implement** in order to be
@@ -10,9 +12,21 @@ import { NgControl } from '@angular/forms';
10
12
  * in javascript, they get thrown out by the typescript compiler and cannot
11
13
  * be used for the necessary dependency injection.
12
14
  */
13
- export declare abstract class DaffFormFieldControl {
14
- readonly ngControl: NgControl | null;
15
- readonly controlType?: any;
16
- readonly focused: boolean;
15
+ export declare abstract class DaffFormFieldControl<T> {
16
+ ngControl: NgControl | null;
17
+ abstract readonly controlType?: any;
18
+ abstract readonly focused: boolean;
17
19
  abstract focus(event?: Event): void;
20
+ abstract readonly value: T;
21
+ constructor(ngControl: NgControl | null);
22
+ get state(): DaffFormFieldState;
23
+ _stateChanges: BehaviorSubject<{
24
+ focused: boolean;
25
+ filled: boolean;
26
+ disabled: boolean;
27
+ error: boolean;
28
+ valid: boolean;
29
+ }>;
30
+ stateChanges: Observable<DaffFormFieldState>;
31
+ emitState(): void;
18
32
  }
@@ -0,0 +1,7 @@
1
+ export interface DaffFormFieldState {
2
+ focused: boolean;
3
+ filled: boolean;
4
+ disabled: boolean;
5
+ error: boolean;
6
+ valid: boolean;
7
+ }
@@ -0,0 +1,10 @@
1
+ import { DaffFormFieldComponent } from './form-field/form-field.component';
2
+ import { DaffPrefixDirective } from '../../../core/prefix-suffix/prefix.directive';
3
+ import { DaffSuffixDirective } from '../../../core/prefix-suffix/suffix.directive';
4
+ import { DaffErrorMessageComponent } from '../error-message/error-message.component';
5
+ import { DaffFormLabelDirective } from '../form-label/form-label.directive';
6
+ import { DaffHintComponent } from '../hint/hint.component';
7
+ /**
8
+ * @docs-private
9
+ */
10
+ export declare const DAFF_FORM_FIELD_COMPONENTS: readonly [typeof DaffFormFieldComponent, typeof DaffErrorMessageComponent, typeof DaffFormLabelDirective, typeof DaffHintComponent, typeof DaffPrefixDirective, typeof DaffSuffixDirective];
@@ -1,10 +1,12 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import * as i1 from "./form-field/form-field.component";
3
- import * as i2 from "@angular/common";
4
- import * as i3 from "@fortawesome/angular-fontawesome";
5
- import * as i4 from "../error-message/error-message.module";
3
+ import * as i2 from "../error-message/error-message.module";
4
+ import * as i3 from "../form-label/form-label.module";
5
+ /**
6
+ * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.
7
+ */
6
8
  export declare class DaffFormFieldModule {
7
9
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffFormFieldModule, never>;
8
- static ɵmod: i0.ɵɵNgModuleDeclaration<DaffFormFieldModule, [typeof i1.DaffFormFieldComponent], [typeof i2.CommonModule, typeof i3.FontAwesomeModule, typeof i4.DaffErrorMessageModule], [typeof i1.DaffFormFieldComponent, typeof i4.DaffErrorMessageModule]>;
10
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DaffFormFieldModule, never, [typeof i1.DaffFormFieldComponent, typeof i2.DaffErrorMessageModule, typeof i3.DaffFormLabelModule], [typeof i1.DaffFormFieldComponent, typeof i2.DaffErrorMessageModule, typeof i3.DaffFormLabelModule]>;
9
11
  static ɵinj: i0.ɵɵInjectorDeclaration<DaffFormFieldModule>;
10
12
  }
@@ -1,3 +1,4 @@
1
1
  export { DaffFormFieldModule } from './form-field.module';
2
- export * from './form-field/form-field.component';
2
+ export { DaffFormFieldComponent } from './form-field/form-field.component';
3
3
  export { DaffFormFieldControl } from './form-field-control';
4
+ export { DAFF_FORM_FIELD_COMPONENTS } from './form-field';
@@ -1,6 +1,9 @@
1
1
  import * as i0 from "@angular/core";
2
2
  export declare class DaffFormLabelDirective {
3
+ /**
4
+ * @docs-private
5
+ */
3
6
  class: boolean;
4
7
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffFormLabelDirective, never>;
5
- static ɵdir: i0.ɵɵDirectiveDeclaration<DaffFormLabelDirective, "[daffFormLabel]", never, {}, {}, never, never, false, never>;
8
+ static ɵdir: i0.ɵɵDirectiveDeclaration<DaffFormLabelDirective, "[daffFormLabel]", never, {}, {}, never, never, true, never>;
6
9
  }
@@ -1,7 +1,10 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import * as i1 from "./form-label.directive";
3
+ /**
4
+ * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.
5
+ */
3
6
  export declare class DaffFormLabelModule {
4
7
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffFormLabelModule, never>;
5
- static ɵmod: i0.ɵɵNgModuleDeclaration<DaffFormLabelModule, [typeof i1.DaffFormLabelDirective], never, [typeof i1.DaffFormLabelDirective]>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DaffFormLabelModule, never, [typeof i1.DaffFormLabelDirective], [typeof i1.DaffFormLabelDirective]>;
6
9
  static ɵinj: i0.ɵɵInjectorDeclaration<DaffFormLabelModule>;
7
10
  }
@@ -0,0 +1,9 @@
1
+ import * as i0 from "@angular/core";
2
+ export declare class DaffHintComponent {
3
+ /**
4
+ * @docs-private
5
+ */
6
+ class: boolean;
7
+ static ɵfac: i0.ɵɵFactoryDeclaration<DaffHintComponent, never>;
8
+ static ɵcmp: i0.ɵɵComponentDeclaration<DaffHintComponent, "daff-hint", never, {}, {}, never, ["*"], true, never>;
9
+ }
@@ -0,0 +1 @@
1
+ export { DaffHintComponent } from './hint.component';
@@ -1,35 +1,31 @@
1
- import { ElementRef } from '@angular/core';
1
+ import { ElementRef, OnInit } from '@angular/core';
2
2
  import { NgControl } from '@angular/forms';
3
3
  import { DaffFormFieldControl } from '../form-field/form-field-control';
4
4
  import * as i0 from "@angular/core";
5
5
  /**
6
6
  * DaffInputComponent provides the same functionality as a native `<input>` and contains custom styling and functionality.
7
7
  */
8
- export declare class DaffInputComponent implements DaffFormFieldControl {
9
- /**
10
- * @docs-private
11
- */
8
+ export declare class DaffInputComponent extends DaffFormFieldControl<string> implements DaffFormFieldControl<string>, OnInit {
9
+ /** @docs-private */
12
10
  ngControl: NgControl;
13
11
  private _elementRef;
14
- /**
15
- * Has the form been submitted.
16
- */
17
- formSubmitted: boolean;
12
+ /** @docs-private */
13
+ class: boolean;
14
+ /** @docs-private */
15
+ controlType: string;
18
16
  focused: boolean;
19
- /**
20
- * @docs-private
21
- */
17
+ /** @docs-private */
22
18
  focus(): void;
23
- /**
24
- * @docs-private
25
- */
19
+ /** @docs-private */
26
20
  blur(): void;
27
21
  constructor(
28
- /**
29
- * @docs-private
30
- */
22
+ /** @docs-private */
31
23
  ngControl: NgControl, _elementRef: ElementRef<HTMLInputElement>);
24
+ /** @docs-private */
25
+ ngOnInit(): void;
26
+ /** @docs-private */
32
27
  onFocus(): void;
28
+ get value(): string;
33
29
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffInputComponent, [{ optional: true; self: true; }, null]>;
34
- static ɵcmp: i0.ɵɵComponentDeclaration<DaffInputComponent, "input[daff-input]", never, { "formSubmitted": { "alias": "formSubmitted"; "required": false; }; }, {}, never, ["*"], false, never>;
30
+ static ɵcmp: i0.ɵɵComponentDeclaration<DaffInputComponent, "input[daff-input]", never, {}, {}, never, ["*"], true, never>;
35
31
  }
@@ -1,8 +1,10 @@
1
1
  import * as i0 from "@angular/core";
2
2
  import * as i1 from "./input.component";
3
- import * as i2 from "@angular/common";
3
+ /**
4
+ * @deprecated in favor of standalone components. Deprecated in version 0.84.0. Will be removed in version 1.0.0.
5
+ */
4
6
  export declare class DaffInputModule {
5
7
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffInputModule, never>;
6
- static ɵmod: i0.ɵɵNgModuleDeclaration<DaffInputModule, [typeof i1.DaffInputComponent], [typeof i2.CommonModule], [typeof i1.DaffInputComponent]>;
8
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DaffInputModule, never, [typeof i1.DaffInputComponent], [typeof i1.DaffInputComponent]>;
7
9
  static ɵinj: i0.ɵɵInjectorDeclaration<DaffInputModule>;
8
10
  }
@@ -2,7 +2,7 @@ import { ElementRef } from '@angular/core';
2
2
  import { NgControl } from '@angular/forms';
3
3
  import { DaffFormFieldControl } from '../form-field/form-field-control';
4
4
  import * as i0 from "@angular/core";
5
- export declare class DaffNativeSelectComponent implements DaffFormFieldControl {
5
+ export declare class DaffNativeSelectComponent extends DaffFormFieldControl<string | number> implements DaffFormFieldControl<string | number> {
6
6
  /**
7
7
  * @docs-private
8
8
  */
@@ -12,6 +12,9 @@ export declare class DaffNativeSelectComponent implements DaffFormFieldControl {
12
12
  * @docs-private
13
13
  */
14
14
  controlType: string;
15
+ /**
16
+ * @docs-private
17
+ */
15
18
  class: boolean;
16
19
  /**
17
20
  * Has the form been submitted.
@@ -32,6 +35,7 @@ export declare class DaffNativeSelectComponent implements DaffFormFieldControl {
32
35
  */
33
36
  ngControl: NgControl, _elementRef: ElementRef<HTMLInputElement>);
34
37
  onFocus(): void;
38
+ get value(): string;
35
39
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffNativeSelectComponent, [{ optional: true; self: true; }, null]>;
36
40
  static ɵcmp: i0.ɵɵComponentDeclaration<DaffNativeSelectComponent, "select[daff-native-select]", never, { "formSubmitted": { "alias": "formSubmitted"; "required": false; }; }, {}, never, ["*"], false, never>;
37
41
  }
@@ -4,7 +4,7 @@ import { DaffQuantityInputComponent } from './quantity-input/quantity-input.comp
4
4
  import { DaffQuantitySelectComponent } from './quantity-select/quantity-select.component';
5
5
  import { DaffFormFieldControl } from '../form-field/form-field-control';
6
6
  import * as i0 from "@angular/core";
7
- export declare class DaffQuantityFieldComponent implements ControlValueAccessor, DaffFormFieldControl {
7
+ export declare class DaffQuantityFieldComponent extends DaffFormFieldControl<number> implements ControlValueAccessor, DaffFormFieldControl<number> {
8
8
  ngControl: NgControl;
9
9
  private cd;
10
10
  input: DaffQuantityInputComponent;
@@ -49,6 +49,7 @@ export declare class DaffQuantityFieldComponent implements ControlValueAccessor,
49
49
  registerOnTouched(fn: any): void;
50
50
  setDisabledState(isDisabled: boolean): void;
51
51
  focus(): void;
52
+ get value(): any;
52
53
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffQuantityFieldComponent, [{ optional: true; self: true; }, null]>;
53
54
  static ɵcmp: i0.ɵɵComponentDeclaration<DaffQuantityFieldComponent, "daff-quantity-field", never, { "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "selectMax": { "alias": "selectMax"; "required": false; }; "id": { "alias": "id"; "required": false; }; }, {}, never, never, false, never>;
54
55
  }
@@ -4,10 +4,10 @@ import * as i2 from "./quantity-input/quantity-input.component";
4
4
  import * as i3 from "./quantity-select/quantity-select.component";
5
5
  import * as i4 from "@angular/common";
6
6
  import * as i5 from "../native-select/native-select.module";
7
- import * as i6 from "../input/input.module";
8
- import * as i7 from "@angular/forms";
7
+ import * as i6 from "@angular/forms";
8
+ import * as i7 from "../input/input.module";
9
9
  export declare class DaffQuantityFieldModule {
10
10
  static ɵfac: i0.ɵɵFactoryDeclaration<DaffQuantityFieldModule, never>;
11
- static ɵmod: i0.ɵɵNgModuleDeclaration<DaffQuantityFieldModule, [typeof i1.DaffQuantityFieldComponent, typeof i2.DaffQuantityInputComponent, typeof i3.DaffQuantitySelectComponent], [typeof i4.CommonModule, typeof i5.DaffNativeSelectModule, typeof i6.DaffInputModule, typeof i7.ReactiveFormsModule], [typeof i1.DaffQuantityFieldComponent, typeof i2.DaffQuantityInputComponent, typeof i3.DaffQuantitySelectComponent]>;
11
+ static ɵmod: i0.ɵɵNgModuleDeclaration<DaffQuantityFieldModule, [typeof i1.DaffQuantityFieldComponent, typeof i2.DaffQuantityInputComponent, typeof i3.DaffQuantitySelectComponent], [typeof i4.CommonModule, typeof i5.DaffNativeSelectModule, typeof i6.ReactiveFormsModule, typeof i7.DaffInputModule], [typeof i1.DaffQuantityFieldComponent, typeof i2.DaffQuantityInputComponent, typeof i3.DaffQuantitySelectComponent]>;
12
12
  static ɵinj: i0.ɵɵInjectorDeclaration<DaffQuantityFieldModule>;
13
13
  }
@@ -30,6 +30,9 @@ export declare class DaffQuantityInputComponent implements OnInit, OnDestroy {
30
30
  set value(value: any);
31
31
  get disabled(): boolean;
32
32
  constructor(ngControl: NgControl, changeDetectorRef: ChangeDetectorRef);
33
+ /**
34
+ * @docs-private
35
+ */
33
36
  ngOnInit(): void;
34
37
  ngOnDestroy(): void;
35
38
  focus(): void;
@@ -21,6 +21,9 @@ export declare class DaffRadioControlValueAccessorDirective implements OnInit, C
21
21
  */
22
22
  name: string;
23
23
  constructor(_control: NgControl, _registry: DaffRadioRegistry, _radio: DaffRadioComponent);
24
+ /**
25
+ * @docs-private
26
+ */
24
27
  ngOnInit(): void;
25
28
  /**
26
29
  *