@mgremy/ng-primitives 0.12.0 → 0.13.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.
- package/fesm2022/mgremy-ng-primitives-form-field.mjs +84 -0
- package/fesm2022/mgremy-ng-primitives-form-field.mjs.map +1 -0
- package/form-field/README.md +4 -0
- package/package.json +5 -1
- package/theme/components/form-field.css +78 -0
- package/theme/mgnp.css +1 -0
- package/types/mgremy-ng-primitives-form-field.d.ts +28 -0
|
@@ -0,0 +1,84 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { Directive } from '@angular/core';
|
|
3
|
+
|
|
4
|
+
class MgnpDescription {
|
|
5
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
6
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpDescription, isStandalone: true, selector: "[ngpDescription][mgnpDescription]", host: { attributes: { "data-mgnp-component": "mgnp-description" } }, ngImport: i0 });
|
|
7
|
+
}
|
|
8
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpDescription, decorators: [{
|
|
9
|
+
type: Directive,
|
|
10
|
+
args: [{
|
|
11
|
+
selector: '[ngpDescription][mgnpDescription]',
|
|
12
|
+
standalone: true,
|
|
13
|
+
host: {
|
|
14
|
+
'data-mgnp-component': 'mgnp-description',
|
|
15
|
+
},
|
|
16
|
+
}]
|
|
17
|
+
}] });
|
|
18
|
+
|
|
19
|
+
class MgnpError {
|
|
20
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpError, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
21
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpError, isStandalone: true, selector: "[ngpError][mgnpError]", host: { attributes: { "data-mgnp-component": "mgnp-error" } }, ngImport: i0 });
|
|
22
|
+
}
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpError, decorators: [{
|
|
24
|
+
type: Directive,
|
|
25
|
+
args: [{
|
|
26
|
+
selector: '[ngpError][mgnpError]',
|
|
27
|
+
standalone: true,
|
|
28
|
+
host: {
|
|
29
|
+
'data-mgnp-component': 'mgnp-error',
|
|
30
|
+
},
|
|
31
|
+
}]
|
|
32
|
+
}] });
|
|
33
|
+
|
|
34
|
+
class MgnpFormControl {
|
|
35
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpFormControl, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
36
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpFormControl, isStandalone: true, selector: "[ngpFormControl][mgnpFormControl]", host: { attributes: { "data-mgnp-component": "mgnp-form-control" } }, ngImport: i0 });
|
|
37
|
+
}
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpFormControl, decorators: [{
|
|
39
|
+
type: Directive,
|
|
40
|
+
args: [{
|
|
41
|
+
selector: '[ngpFormControl][mgnpFormControl]',
|
|
42
|
+
standalone: true,
|
|
43
|
+
host: {
|
|
44
|
+
'data-mgnp-component': 'mgnp-form-control',
|
|
45
|
+
},
|
|
46
|
+
}]
|
|
47
|
+
}] });
|
|
48
|
+
|
|
49
|
+
class MgnpFormField {
|
|
50
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpFormField, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
51
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpFormField, isStandalone: true, selector: "[ngpFormField][mgnpFormField]", host: { attributes: { "data-mgnp-component": "mgnp-form-field" } }, ngImport: i0 });
|
|
52
|
+
}
|
|
53
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpFormField, decorators: [{
|
|
54
|
+
type: Directive,
|
|
55
|
+
args: [{
|
|
56
|
+
selector: '[ngpFormField][mgnpFormField]',
|
|
57
|
+
standalone: true,
|
|
58
|
+
host: {
|
|
59
|
+
'data-mgnp-component': 'mgnp-form-field',
|
|
60
|
+
},
|
|
61
|
+
}]
|
|
62
|
+
}] });
|
|
63
|
+
|
|
64
|
+
class MgnpLabel {
|
|
65
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
66
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.1", type: MgnpLabel, isStandalone: true, selector: "[ngpLabel][mgnpLabel]", host: { attributes: { "data-mgnp-component": "mgnp-label" } }, ngImport: i0 });
|
|
67
|
+
}
|
|
68
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.1", ngImport: i0, type: MgnpLabel, decorators: [{
|
|
69
|
+
type: Directive,
|
|
70
|
+
args: [{
|
|
71
|
+
selector: '[ngpLabel][mgnpLabel]',
|
|
72
|
+
standalone: true,
|
|
73
|
+
host: {
|
|
74
|
+
'data-mgnp-component': 'mgnp-label',
|
|
75
|
+
},
|
|
76
|
+
}]
|
|
77
|
+
}] });
|
|
78
|
+
|
|
79
|
+
/**
|
|
80
|
+
* Generated bundle index. Do not edit.
|
|
81
|
+
*/
|
|
82
|
+
|
|
83
|
+
export { MgnpDescription, MgnpError, MgnpFormControl, MgnpFormField, MgnpLabel };
|
|
84
|
+
//# sourceMappingURL=mgremy-ng-primitives-form-field.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"mgremy-ng-primitives-form-field.mjs","sources":["../../../../libs/ng-primitives/form-field/src/lib/mgnp-description/mgnp-description.directive.ts","../../../../libs/ng-primitives/form-field/src/lib/mgnp-error/mgnp-error.directive.ts","../../../../libs/ng-primitives/form-field/src/lib/mgnp-form-control/mgnp-form-control.directive.ts","../../../../libs/ng-primitives/form-field/src/lib/mgnp-form-field/mgnp-form-field.directive.ts","../../../../libs/ng-primitives/form-field/src/lib/mgnp-label/mgnp-form-label.directive.ts","../../../../libs/ng-primitives/form-field/src/mgremy-ng-primitives-form-field.ts"],"sourcesContent":["import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngpDescription][mgnpDescription]',\n standalone: true,\n host: {\n 'data-mgnp-component': 'mgnp-description',\n },\n})\nexport class MgnpDescription {}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngpError][mgnpError]',\n standalone: true,\n host: {\n 'data-mgnp-component': 'mgnp-error',\n },\n})\nexport class MgnpError {}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngpFormControl][mgnpFormControl]',\n standalone: true,\n host: {\n 'data-mgnp-component': 'mgnp-form-control',\n },\n})\nexport class MgnpFormControl {}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngpFormField][mgnpFormField]',\n standalone: true,\n host: {\n 'data-mgnp-component': 'mgnp-form-field',\n },\n})\nexport class MgnpFormField {}\n","import { Directive } from '@angular/core';\n\n@Directive({\n selector: '[ngpLabel][mgnpLabel]',\n standalone: true,\n host: {\n 'data-mgnp-component': 'mgnp-label',\n },\n})\nexport class MgnpLabel {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mgremy/ng-primitives",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.13.0",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"homepage": "https://doc.mgremy.xyz/ng-primitives",
|
|
6
6
|
"publishConfig": {
|
|
@@ -45,6 +45,10 @@
|
|
|
45
45
|
"types": "./types/mgremy-ng-primitives-dialog.d.ts",
|
|
46
46
|
"default": "./fesm2022/mgremy-ng-primitives-dialog.mjs"
|
|
47
47
|
},
|
|
48
|
+
"./form-field": {
|
|
49
|
+
"types": "./types/mgremy-ng-primitives-form-field.d.ts",
|
|
50
|
+
"default": "./fesm2022/mgremy-ng-primitives-form-field.mjs"
|
|
51
|
+
},
|
|
48
52
|
"./input": {
|
|
49
53
|
"types": "./types/mgremy-ng-primitives-input.d.ts",
|
|
50
54
|
"default": "./fesm2022/mgremy-ng-primitives-input.mjs"
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
@utility mgnp-description {
|
|
2
|
+
color: var(--mg-text-ui-secondary);
|
|
3
|
+
font-size: var(--text-sm);
|
|
4
|
+
line-height: var(--text-sm--line-height);
|
|
5
|
+
margin-inline: --spacing(0);
|
|
6
|
+
margin-top: --spacing(0);
|
|
7
|
+
margin-bottom: --spacing(1);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
@utility mgnp-error {
|
|
11
|
+
display: none;
|
|
12
|
+
color: var(--mg-text-danger);
|
|
13
|
+
font-size: var(--text-sm);
|
|
14
|
+
line-height: var(--text-sm--line-height);
|
|
15
|
+
margin: --spacing(0);
|
|
16
|
+
|
|
17
|
+
@variant data-[validator='fail']:data-dirty {
|
|
18
|
+
display: block;
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
@utility mgnp-form-control {
|
|
23
|
+
width: 100%;
|
|
24
|
+
border: none;
|
|
25
|
+
outline: none;
|
|
26
|
+
background-color: var(--mg-background-ui);
|
|
27
|
+
box-shadow: var(--mg-shadow-input);
|
|
28
|
+
border-radius: var(--radius-lg);
|
|
29
|
+
padding-block: --spacing(0);
|
|
30
|
+
padding-inline: --spacing(4);
|
|
31
|
+
height: --spacing(10);
|
|
32
|
+
|
|
33
|
+
@variant focus {
|
|
34
|
+
outline-offset: 2px;
|
|
35
|
+
outline: 2px solid var(--mg-ring-ui);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
::placeholder {
|
|
39
|
+
color: var(--mg-text-placeholder);
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
@utility mgnp-form-field {
|
|
44
|
+
display: flex;
|
|
45
|
+
flex-direction: column;
|
|
46
|
+
width: 90%;
|
|
47
|
+
gap: --spacing(1.5);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
@utility mgnp-label {
|
|
51
|
+
color: var(--mg-text-ui);
|
|
52
|
+
font-size: var(--text-base);
|
|
53
|
+
line-height: var(--text-base--line-height);
|
|
54
|
+
font-weight: var(--font-weight-semibold);
|
|
55
|
+
margin: --spacing(0);
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
@layer base {
|
|
59
|
+
[mgnpDescription][data-mgnp-component='mgnp-description'] {
|
|
60
|
+
@apply mgnp-description transition;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
[mgnpError][data-mgnp-component='mgnp-error'] {
|
|
64
|
+
@apply mgnp-error transition;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
[mgnpFormControl][data-mgnp-component='mgnp-form-control'] {
|
|
68
|
+
@apply mgnp-form-control transition;
|
|
69
|
+
}
|
|
70
|
+
|
|
71
|
+
[mgnpFormField][data-mgnp-component='mgnp-form-field'] {
|
|
72
|
+
@apply mgnp-form-field transition;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
[mgnpLabel][data-mgnp-component='mgnp-label'] {
|
|
76
|
+
@apply mgnp-label transition;
|
|
77
|
+
}
|
|
78
|
+
}
|
package/theme/mgnp.css
CHANGED
|
@@ -5,6 +5,7 @@
|
|
|
5
5
|
@import './components/checkbox.css';
|
|
6
6
|
@import './components/combobox.css';
|
|
7
7
|
@import './components/dialog.css';
|
|
8
|
+
@import './components/form-field.css';
|
|
8
9
|
@import './components/input.css';
|
|
9
10
|
@import './components/menu.css';
|
|
10
11
|
@import './components/pagination.css';
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
|
|
3
|
+
declare class MgnpDescription {
|
|
4
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MgnpDescription, never>;
|
|
5
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpDescription, "[ngpDescription][mgnpDescription]", never, {}, {}, never, never, true, never>;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
declare class MgnpError {
|
|
9
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MgnpError, never>;
|
|
10
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpError, "[ngpError][mgnpError]", never, {}, {}, never, never, true, never>;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
declare class MgnpFormControl {
|
|
14
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MgnpFormControl, never>;
|
|
15
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpFormControl, "[ngpFormControl][mgnpFormControl]", never, {}, {}, never, never, true, never>;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
declare class MgnpFormField {
|
|
19
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MgnpFormField, never>;
|
|
20
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpFormField, "[ngpFormField][mgnpFormField]", never, {}, {}, never, never, true, never>;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
declare class MgnpLabel {
|
|
24
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<MgnpLabel, never>;
|
|
25
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<MgnpLabel, "[ngpLabel][mgnpLabel]", never, {}, {}, never, never, true, never>;
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
export { MgnpDescription, MgnpError, MgnpFormControl, MgnpFormField, MgnpLabel };
|