@dereekb/dbx-form 13.10.2 → 13.10.3
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.
|
@@ -5,6 +5,29 @@ $dbx-forge-form-field-slider-thumb-margin: 22px;
|
|
|
5
5
|
|
|
6
6
|
// MARK: Mixin
|
|
7
7
|
@mixin core() {
|
|
8
|
+
// Forge form-field wrapper host: ensure block-level layout. The host element
|
|
9
|
+
// is a custom element (default `inline`); it previously inherited
|
|
10
|
+
// `display: inline-flex` from Material's `.mat-mdc-form-field` rule because
|
|
11
|
+
// the wrapper borrowed that class — that's no longer the case, so make the
|
|
12
|
+
// block layout explicit.
|
|
13
|
+
dbx-forge-form-field-wrapper.dbx-forge-form-field {
|
|
14
|
+
display: block;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
// Restore the 300ms subscript fade animation. Material's base rule
|
|
18
|
+
// `animation: _mat-form-field-subscript-animation 0ms ...` matches
|
|
19
|
+
// `.mat-mdc-form-field-{hint,error}-wrapper` standalone (no parent
|
|
20
|
+
// required), but the duration extension to 300ms is scoped to
|
|
21
|
+
// `.mat-mdc-form-field.mat-form-field-animations-enabled` — which the
|
|
22
|
+
// wrapper no longer has on its host (the `mat-mdc-form-field` class was
|
|
23
|
+
// dropped because it carried Material's typography/layout leak). Mirror
|
|
24
|
+
// the duration rule using our own host class so the subscript still fades
|
|
25
|
+
// over 300ms once Material's stylesheet is loaded.
|
|
26
|
+
.dbx-forge-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-hint-wrapper,
|
|
27
|
+
.dbx-forge-form-field.mat-form-field-animations-enabled .mat-mdc-form-field-error-wrapper {
|
|
28
|
+
animation-duration: 300ms;
|
|
29
|
+
}
|
|
30
|
+
|
|
8
31
|
// Forge form-field wrapper: suppress child field label/hint/error inside the wrapper.
|
|
9
32
|
// The wrapper provides its own label (notched outline), hint, and error subscript.
|
|
10
33
|
dbx-forge-form-field-wrapper {
|
|
@@ -35,17 +58,6 @@ $dbx-forge-form-field-slider-thumb-margin: 22px;
|
|
|
35
58
|
padding-bottom: 0 !important;
|
|
36
59
|
}
|
|
37
60
|
|
|
38
|
-
// The wrapper's mat-mdc-form-field host class causes Angular Material's
|
|
39
|
-
// form-field line-height (24px) and letter-spacing (0.496px) to cascade
|
|
40
|
-
// into all descendants. For list selection fields this distorts the list
|
|
41
|
-
// item layout. Reset typography on the list field element so descendant
|
|
42
|
-
// components inherit normal values instead of the form-field overrides.
|
|
43
|
-
dbx-forge-form-field-wrapper dbx-forge-list-selection-field {
|
|
44
|
-
display: block;
|
|
45
|
-
line-height: normal;
|
|
46
|
-
letter-spacing: normal;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
61
|
// Boolean fields (mat-checkbox / mat-slide-toggle): make the whole content
|
|
50
62
|
// box clickable. Stretches the Material `<label for="...">` to fill the
|
|
51
63
|
// rectangle so native HTML label-click delegation toggles the control on
|
package/lib/formly/_formly.scss
CHANGED
|
@@ -6,8 +6,9 @@
|
|
|
6
6
|
@mixin core() {
|
|
7
7
|
// MARK: Material Global Styles
|
|
8
8
|
|
|
9
|
-
.mat-mdc-form-field
|
|
10
|
-
|
|
9
|
+
.mat-mdc-form-field,
|
|
10
|
+
.dbx-forge-form-field {
|
|
11
|
+
// in Angular Material 16 when using dynamic padding there is no space reserved between fields; the only space is the hint or error if applicable. This adds a minor amount of padding to each input. The forge form-field wrapper opts in via its own host class so spacing is identical for both formly Material fields and forge wrapper fields.
|
|
11
12
|
padding: 6px 0;
|
|
12
13
|
}
|
|
13
14
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@dereekb/dbx-form",
|
|
3
|
-
"version": "13.10.
|
|
3
|
+
"version": "13.10.3",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@angular/cdk": "^21.2.8",
|
|
6
6
|
"@angular/common": "21.2.10",
|
|
@@ -10,15 +10,15 @@
|
|
|
10
10
|
"@angular/material-date-fns-adapter": "21.2.8",
|
|
11
11
|
"@angular/platform-browser": "21.2.10",
|
|
12
12
|
"@bobbyquantum/ngx-editor": "21.0.0",
|
|
13
|
-
"@dereekb/date": "13.10.
|
|
14
|
-
"@dereekb/dbx-core": "13.10.
|
|
15
|
-
"@dereekb/dbx-web": "13.10.
|
|
16
|
-
"@dereekb/model": "13.10.
|
|
17
|
-
"@dereekb/rxjs": "13.10.
|
|
18
|
-
"@dereekb/util": "13.10.
|
|
19
|
-
"@dereekb/vitest": "13.10.
|
|
20
|
-
"@ng-forge/dynamic-forms": "
|
|
21
|
-
"@ng-forge/dynamic-forms-material": "0.8.0
|
|
13
|
+
"@dereekb/date": "13.10.3",
|
|
14
|
+
"@dereekb/dbx-core": "13.10.3",
|
|
15
|
+
"@dereekb/dbx-web": "13.10.3",
|
|
16
|
+
"@dereekb/model": "13.10.3",
|
|
17
|
+
"@dereekb/rxjs": "13.10.3",
|
|
18
|
+
"@dereekb/util": "13.10.3",
|
|
19
|
+
"@dereekb/vitest": "13.10.3",
|
|
20
|
+
"@ng-forge/dynamic-forms": "~0.8.0",
|
|
21
|
+
"@ng-forge/dynamic-forms-material": "~0.8.0",
|
|
22
22
|
"@ng-web-apis/geolocation": "^5.2.0",
|
|
23
23
|
"@ngbracket/ngx-layout": "^21.0.0",
|
|
24
24
|
"@ngrx/component-store": "^21.1.0",
|