@lluc_llull/ui-lib 0.35.0 → 0.36.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/lluc_llull-ui-lib-forms-contact-form.mjs +254 -0
- package/fesm2022/lluc_llull-ui-lib-forms-contact-form.mjs.map +1 -0
- package/fesm2022/lluc_llull-ui-lib-forms.mjs +443 -0
- package/fesm2022/lluc_llull-ui-lib-forms.mjs.map +1 -0
- package/fesm2022/lluc_llull-ui-lib-mapper.mjs +6 -1
- package/fesm2022/lluc_llull-ui-lib-mapper.mjs.map +1 -1
- package/package.json +10 -1
- package/types/lluc_llull-ui-lib-forms-contact-form.d.ts +86 -0
- package/types/lluc_llull-ui-lib-forms.d.ts +220 -0
- package/types/lluc_llull-ui-lib-mapper.d.ts +1 -0
|
@@ -0,0 +1,254 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { Component, EventEmitter, Input, Output, signal } from "@angular/core";
|
|
3
|
+
import * as i1 from "@angular/forms";
|
|
4
|
+
import { FormControl, FormGroup, ReactiveFormsModule, Validators } from "@angular/forms";
|
|
5
|
+
import { FormFieldComponent, FormInputComponent, FormTextareaComponent } from "@lluc_llull/ui-lib/forms";
|
|
6
|
+
import { UiIconComponent, UiImageComponent } from "@lluc_llull/ui-lib/shared";
|
|
7
|
+
var ContactFormComponent = class ContactFormComponent {
|
|
8
|
+
texts;
|
|
9
|
+
privacyUrl = "/es/privacy";
|
|
10
|
+
img = null;
|
|
11
|
+
messageSubmitted = new EventEmitter();
|
|
12
|
+
status = signal("idle", ...ngDevMode ? [{ debugName: "status" }] : /* istanbul ignore next */ []);
|
|
13
|
+
submissionError = signal("", ...ngDevMode ? [{ debugName: "submissionError" }] : /* istanbul ignore next */ []);
|
|
14
|
+
submitted = false;
|
|
15
|
+
form = new FormGroup({
|
|
16
|
+
name: new FormControl("", {
|
|
17
|
+
nonNullable: true,
|
|
18
|
+
validators: [
|
|
19
|
+
Validators.required,
|
|
20
|
+
Validators.pattern(/\S/),
|
|
21
|
+
Validators.maxLength(80)
|
|
22
|
+
]
|
|
23
|
+
}),
|
|
24
|
+
surname: new FormControl("", {
|
|
25
|
+
nonNullable: true,
|
|
26
|
+
validators: [Validators.maxLength(100)]
|
|
27
|
+
}),
|
|
28
|
+
email: new FormControl("", {
|
|
29
|
+
nonNullable: true,
|
|
30
|
+
validators: [
|
|
31
|
+
Validators.required,
|
|
32
|
+
Validators.email,
|
|
33
|
+
Validators.maxLength(254)
|
|
34
|
+
]
|
|
35
|
+
}),
|
|
36
|
+
phone: new FormControl("", {
|
|
37
|
+
nonNullable: true,
|
|
38
|
+
validators: [Validators.maxLength(40)]
|
|
39
|
+
}),
|
|
40
|
+
message: new FormControl("", {
|
|
41
|
+
nonNullable: true,
|
|
42
|
+
validators: [
|
|
43
|
+
Validators.required,
|
|
44
|
+
Validators.pattern(/\S/),
|
|
45
|
+
Validators.maxLength(5e3)
|
|
46
|
+
]
|
|
47
|
+
}),
|
|
48
|
+
website: new FormControl("", { nonNullable: true })
|
|
49
|
+
});
|
|
50
|
+
getError(field) {
|
|
51
|
+
const control = this.form.controls[field];
|
|
52
|
+
if (!control.invalid || !control.touched && !this.submitted) return "";
|
|
53
|
+
if (control.hasError("required") || control.hasError("pattern")) return this.texts.requiredError;
|
|
54
|
+
if (control.hasError("email")) return this.texts.emailError;
|
|
55
|
+
if (control.hasError("maxlength")) return this.texts.lengthError;
|
|
56
|
+
return this.texts.invalidError;
|
|
57
|
+
}
|
|
58
|
+
submit() {
|
|
59
|
+
if (this.status() === "sending") return;
|
|
60
|
+
this.submitted = true;
|
|
61
|
+
this.status.set("idle");
|
|
62
|
+
if (this.form.invalid) {
|
|
63
|
+
this.form.markAllAsTouched();
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
66
|
+
this.status.set("sending");
|
|
67
|
+
this.messageSubmitted.emit(this.form.getRawValue());
|
|
68
|
+
}
|
|
69
|
+
setSubmissionResult(success, errorMessage = this.texts.error) {
|
|
70
|
+
this.status.set(success ? "success" : "error");
|
|
71
|
+
this.submissionError.set(success ? "" : errorMessage);
|
|
72
|
+
if (success) {
|
|
73
|
+
this.form.reset();
|
|
74
|
+
this.submitted = false;
|
|
75
|
+
}
|
|
76
|
+
}
|
|
77
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
78
|
+
minVersion: "12.0.0",
|
|
79
|
+
version: "22.2.4",
|
|
80
|
+
ngImport: i0,
|
|
81
|
+
type: ContactFormComponent,
|
|
82
|
+
deps: [],
|
|
83
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
84
|
+
});
|
|
85
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
86
|
+
minVersion: "17.0.0",
|
|
87
|
+
version: "22.2.4",
|
|
88
|
+
type: ContactFormComponent,
|
|
89
|
+
isStandalone: true,
|
|
90
|
+
selector: "lib-contact-form",
|
|
91
|
+
inputs: {
|
|
92
|
+
texts: "texts",
|
|
93
|
+
privacyUrl: "privacyUrl",
|
|
94
|
+
img: "img"
|
|
95
|
+
},
|
|
96
|
+
outputs: { messageSubmitted: "messageSubmitted" },
|
|
97
|
+
host: { styleAttribute: "display: contents" },
|
|
98
|
+
ngImport: i0,
|
|
99
|
+
template: "<section\n class=\"contact-form-section main-grid col-span-full md:col-span-12 md:col-start-1\"\n aria-labelledby=\"contact-form-title\"\n>\n <div class=\"contact-form-heading col-span-full md:col-span-12 md:col-start-1\">\n @if(texts.title) {\n <h2 class=\"title\" id=\"contact-form-title\">{{ texts.title }}</h2> \n }\n @if(texts.intro) {\n <p class=\"text\">{{ texts.intro }}</p>\n }\n </div>\n\n <form\n class=\"contact-form col-span-full\"\n [formGroup]=\"form\"\n (ngSubmit)=\"submit()\"\n [attr.aria-busy]=\"status() === 'sending' ? 'true' : null\"\n novalidate\n >\n <p class=\"contact-form-required-hint col-span-full\">{{ texts.requiredHint }}</p>\n\n <div class=\"contact-form-body main-grid col-span-full\">\n <div class=\"contact-form-grid col-span-full md:col-span-6 md:col-start-1\">\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-name\"\n [label]=\"texts.name\"\n [required]=\"true\"\n [error]=\"getError('name')\"\n >\n <lib-form-input\n id=\"contact-name\"\n formControlName=\"name\"\n autocomplete=\"given-name\"\n [placeholder]=\"texts.namePlaceholder\"\n [describedBy]=\"getError('name') ? 'contact-name-error' : ''\"\n [invalid]=\"!!getError('name')\"\n [required]=\"true\"\n [maxLength]=\"80\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-surname\"\n [label]=\"texts.surname\"\n >\n <lib-form-input\n id=\"contact-surname\"\n formControlName=\"surname\"\n autocomplete=\"family-name\"\n [placeholder]=\"texts.surnamePlaceholder\"\n [maxLength]=\"100\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-email\"\n [label]=\"texts.email\"\n [required]=\"true\"\n [error]=\"getError('email')\"\n >\n <lib-form-input\n id=\"contact-email\"\n type=\"email\"\n formControlName=\"email\"\n autocomplete=\"email\"\n [placeholder]=\"texts.emailPlaceholder\"\n [describedBy]=\"getError('email') ? 'contact-email-error' : ''\"\n [invalid]=\"!!getError('email')\"\n [required]=\"true\"\n [maxLength]=\"254\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-phone\"\n [label]=\"texts.phone\"\n >\n <lib-form-input\n id=\"contact-phone\"\n type=\"tel\"\n formControlName=\"phone\"\n autocomplete=\"tel\"\n [placeholder]=\"texts.phonePlaceholder\"\n [maxLength]=\"40\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"contact-form-field--message col-span-full\"\n controlId=\"contact-message\"\n [label]=\"texts.message\"\n [required]=\"true\"\n [error]=\"getError('message')\"\n >\n <lib-form-textarea\n id=\"contact-message\"\n formControlName=\"message\"\n [placeholder]=\"texts.messagePlaceholder\"\n [describedBy]=\"getError('message') ? 'contact-message-error' : ''\"\n [invalid]=\"!!getError('message')\"\n [required]=\"true\"\n [maxLength]=\"5000\"\n [rows]=\"6\"\n [showCounter]=\"true\"\n />\n </lib-form-field>\n\n </div>\n\n @if (img) {\n <figure class=\"contact-form-image col-span-full md:col-span-6 md:col-start-7\">\n @if (img.publicId) {\n <ui-image\n [publicId]=\"img.publicId\"\n [width]=\"img.width\"\n [height]=\"img.height\"\n [eager]=\"true\"\n />\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </figure>\n }\n </div>\n\n <div class=\"contact-form-honeypot\" aria-hidden=\"true\">\n <label for=\"contact-website\">Website</label>\n <input\n id=\"contact-website\"\n type=\"text\"\n formControlName=\"website\"\n tabindex=\"-1\"\n autocomplete=\"off\"\n />\n </div>\n\n <div class=\"contact-form-footer col-span-full\">\n <p class=\"contact-form-privacy col-span-full md:col-span-8\">\n <strong>{{ texts.privacyTitle }}</strong>\n {{ texts.privacyResponsible }}\n {{ texts.privacyPurpose }}\n {{ texts.privacyLegalBasis }}\n {{ texts.privacyRecipients }}\n {{ texts.privacyRetention }}\n {{ texts.privacyRights }}\n {{ texts.privacyLinkLead }}\n <a class=\"contact-form-privacy__link\" [href]=\"privacyUrl\">{{ texts.privacyLink }}</a>\n {{ texts.privacyLinkTail }}\n </p>\n\n <button\n class=\"contact-form-submit col-span-full md:col-span-4\"\n type=\"submit\"\n [disabled]=\"status() === 'sending'\"\n >\n <span>{{ status() === 'sending' ? texts.sending : texts.send }}</span>\n <ui-icon name=\"arrow-up-right\" [size]=\"20\" color=\"currentColor\"></ui-icon>\n </button>\n </div>\n\n @if (status() !== 'idle') {\n <p\n class=\"contact-form-status col-span-full\"\n [class.contact-form-status--success]=\"status() === 'success'\"\n [class.contact-form-status--error]=\"status() === 'error'\"\n [attr.role]=\"status() === 'error' ? 'alert' : 'status'\"\n aria-live=\"polite\"\n >\n {{\n status() === 'sending'\n ? texts.sending\n : status() === 'success'\n ? texts.success\n : submissionError() || texts.error\n }}\n </p>\n }\n </form>\n</section>\n",
|
|
100
|
+
styles: [":host{color:var(--text-primary)}.contact-form-section{padding-top:0!important}.title{text-transform:uppercase}.contact-form-required-hint{font-family:var(--font-base);text-transform:uppercase}.contact-form-body{padding-top:0!important}.contact-form-required-hint{margin:0;color:var(--text-primary-60);font-size:.8rem}.contact-form-image{min-width:0;min-height:100%;margin:0;overflow:hidden}.contact-form-image ui-image,.contact-form-image img{display:block;width:100%;min-height:20rem;object-fit:cover}@media(max-width:1024px){.contact-form-image{display:none}}.contact-form-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.contact-form-privacy{margin:0;padding-bottom:2rem!important;color:var(--text-primary-60);font-family:var(--font-base);font-size:.82rem;line-height:1.65}.contact-form-privacy strong{color:var(--text-primary-80);font-weight:600}.contact-form-privacy a{color:var(--text-primary);background-image:linear-gradient(var(--text-primary-70),var(--text-primary-70));background-size:100% 1px;background-position:0% 100%;background-repeat:no-repeat;transition:background-size .3s ease-in-out,background-position .3s ease-in-out}.contact-form-privacy a:hover{background-size:0% 1px;background-position:100% 100%;animation:linkMove .4s forwards}@keyframes linkMove{0%{background-size:100% 1px;background-position:0% 100%}50%{background-size:0% 1px;background-position:100% 100%}51%{background-size:0% 1px;background-position:0% 100%}to{background-size:100% 1px;background-position:0% 100%}}.contact-form-footer button{padding-bottom:2rem;display:inline-flex;min-height:3.5rem;align-items:center;justify-content:space-between;gap:.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1.2rem;background:var(--button-primary-bg);color:var(--button-primary-text);cursor:pointer;font-family:var(--font-base);font-size:1rem;text-transform:uppercase;transition:background-color .16s ease,color .16s ease,transform .16s ease;justify-self:end}.contact-form-footer button:hover:not(:disabled){background:var(--button-primary-bg-hover);transform:translateY(-2px)}.contact-form-footer button:focus-visible{outline:2px solid var(--color-secondary);outline-offset:4px}.contact-form-footer button:disabled{cursor:wait;opacity:.65}.contact-form-arrow{font-size:1.2rem}.contact-form-status{margin:0;font-family:var(--font-base);line-height:1.5}.contact-form-status--success{color:#18794e}.contact-form-status--error{color:#b42318}.contact-form-submit{max-width:100%}@media(max-width:1024px){.contact-form-submit{width:100%}}@media(prefers-reduced-motion:reduce){.contact-form-footer button{transition:none}}\n"],
|
|
101
|
+
dependencies: [
|
|
102
|
+
{
|
|
103
|
+
kind: "ngmodule",
|
|
104
|
+
type: ReactiveFormsModule
|
|
105
|
+
},
|
|
106
|
+
{
|
|
107
|
+
kind: "directive",
|
|
108
|
+
type: i1.ɵNgNoValidate,
|
|
109
|
+
selector: "form:not([ngNoForm]):not([ngNativeValidate])"
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
kind: "directive",
|
|
113
|
+
type: i1.DefaultValueAccessor,
|
|
114
|
+
selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]"
|
|
115
|
+
},
|
|
116
|
+
{
|
|
117
|
+
kind: "directive",
|
|
118
|
+
type: i1.NgControlStatus,
|
|
119
|
+
selector: "[formControlName],[ngModel],[formControl]"
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
kind: "directive",
|
|
123
|
+
type: i1.NgControlStatusGroup,
|
|
124
|
+
selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]"
|
|
125
|
+
},
|
|
126
|
+
{
|
|
127
|
+
kind: "directive",
|
|
128
|
+
type: i1.RequiredValidator,
|
|
129
|
+
selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]",
|
|
130
|
+
inputs: ["required"]
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
kind: "directive",
|
|
134
|
+
type: i1.FormGroupDirective,
|
|
135
|
+
selector: "[formGroup]",
|
|
136
|
+
inputs: ["formGroup"],
|
|
137
|
+
outputs: ["ngSubmit"],
|
|
138
|
+
exportAs: ["ngForm"]
|
|
139
|
+
},
|
|
140
|
+
{
|
|
141
|
+
kind: "directive",
|
|
142
|
+
type: i1.FormControlName,
|
|
143
|
+
selector: "[formControlName]",
|
|
144
|
+
inputs: [
|
|
145
|
+
"formControlName",
|
|
146
|
+
"disabled",
|
|
147
|
+
"ngModel"
|
|
148
|
+
],
|
|
149
|
+
outputs: ["ngModelChange"]
|
|
150
|
+
},
|
|
151
|
+
{
|
|
152
|
+
kind: "component",
|
|
153
|
+
type: FormFieldComponent,
|
|
154
|
+
selector: "lib-form-field",
|
|
155
|
+
inputs: [
|
|
156
|
+
"controlId",
|
|
157
|
+
"label",
|
|
158
|
+
"required",
|
|
159
|
+
"hint",
|
|
160
|
+
"error"
|
|
161
|
+
]
|
|
162
|
+
},
|
|
163
|
+
{
|
|
164
|
+
kind: "component",
|
|
165
|
+
type: FormInputComponent,
|
|
166
|
+
selector: "lib-form-input",
|
|
167
|
+
inputs: [
|
|
168
|
+
"id",
|
|
169
|
+
"type",
|
|
170
|
+
"placeholder",
|
|
171
|
+
"autocomplete",
|
|
172
|
+
"describedBy",
|
|
173
|
+
"maxLength",
|
|
174
|
+
"required",
|
|
175
|
+
"invalid"
|
|
176
|
+
]
|
|
177
|
+
},
|
|
178
|
+
{
|
|
179
|
+
kind: "component",
|
|
180
|
+
type: FormTextareaComponent,
|
|
181
|
+
selector: "lib-form-textarea",
|
|
182
|
+
inputs: [
|
|
183
|
+
"id",
|
|
184
|
+
"placeholder",
|
|
185
|
+
"describedBy",
|
|
186
|
+
"rows",
|
|
187
|
+
"maxLength",
|
|
188
|
+
"required",
|
|
189
|
+
"invalid",
|
|
190
|
+
"showCounter"
|
|
191
|
+
]
|
|
192
|
+
},
|
|
193
|
+
{
|
|
194
|
+
kind: "component",
|
|
195
|
+
type: UiImageComponent,
|
|
196
|
+
selector: "ui-image",
|
|
197
|
+
inputs: [
|
|
198
|
+
"publicId",
|
|
199
|
+
"cloudName",
|
|
200
|
+
"transformations",
|
|
201
|
+
"eager",
|
|
202
|
+
"width",
|
|
203
|
+
"height"
|
|
204
|
+
]
|
|
205
|
+
},
|
|
206
|
+
{
|
|
207
|
+
kind: "component",
|
|
208
|
+
type: UiIconComponent,
|
|
209
|
+
selector: "ui-icon",
|
|
210
|
+
inputs: [
|
|
211
|
+
"name",
|
|
212
|
+
"size",
|
|
213
|
+
"color"
|
|
214
|
+
]
|
|
215
|
+
}
|
|
216
|
+
]
|
|
217
|
+
});
|
|
218
|
+
};
|
|
219
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
220
|
+
minVersion: "12.0.0",
|
|
221
|
+
version: "22.2.4",
|
|
222
|
+
ngImport: i0,
|
|
223
|
+
type: ContactFormComponent,
|
|
224
|
+
decorators: [{
|
|
225
|
+
type: Component,
|
|
226
|
+
args: [{
|
|
227
|
+
selector: "lib-contact-form",
|
|
228
|
+
standalone: true,
|
|
229
|
+
imports: [
|
|
230
|
+
ReactiveFormsModule,
|
|
231
|
+
FormFieldComponent,
|
|
232
|
+
FormInputComponent,
|
|
233
|
+
FormTextareaComponent,
|
|
234
|
+
UiImageComponent,
|
|
235
|
+
UiIconComponent
|
|
236
|
+
],
|
|
237
|
+
host: { style: "display: contents" },
|
|
238
|
+
template: "<section\n class=\"contact-form-section main-grid col-span-full md:col-span-12 md:col-start-1\"\n aria-labelledby=\"contact-form-title\"\n>\n <div class=\"contact-form-heading col-span-full md:col-span-12 md:col-start-1\">\n @if(texts.title) {\n <h2 class=\"title\" id=\"contact-form-title\">{{ texts.title }}</h2> \n }\n @if(texts.intro) {\n <p class=\"text\">{{ texts.intro }}</p>\n }\n </div>\n\n <form\n class=\"contact-form col-span-full\"\n [formGroup]=\"form\"\n (ngSubmit)=\"submit()\"\n [attr.aria-busy]=\"status() === 'sending' ? 'true' : null\"\n novalidate\n >\n <p class=\"contact-form-required-hint col-span-full\">{{ texts.requiredHint }}</p>\n\n <div class=\"contact-form-body main-grid col-span-full\">\n <div class=\"contact-form-grid col-span-full md:col-span-6 md:col-start-1\">\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-name\"\n [label]=\"texts.name\"\n [required]=\"true\"\n [error]=\"getError('name')\"\n >\n <lib-form-input\n id=\"contact-name\"\n formControlName=\"name\"\n autocomplete=\"given-name\"\n [placeholder]=\"texts.namePlaceholder\"\n [describedBy]=\"getError('name') ? 'contact-name-error' : ''\"\n [invalid]=\"!!getError('name')\"\n [required]=\"true\"\n [maxLength]=\"80\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-surname\"\n [label]=\"texts.surname\"\n >\n <lib-form-input\n id=\"contact-surname\"\n formControlName=\"surname\"\n autocomplete=\"family-name\"\n [placeholder]=\"texts.surnamePlaceholder\"\n [maxLength]=\"100\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-email\"\n [label]=\"texts.email\"\n [required]=\"true\"\n [error]=\"getError('email')\"\n >\n <lib-form-input\n id=\"contact-email\"\n type=\"email\"\n formControlName=\"email\"\n autocomplete=\"email\"\n [placeholder]=\"texts.emailPlaceholder\"\n [describedBy]=\"getError('email') ? 'contact-email-error' : ''\"\n [invalid]=\"!!getError('email')\"\n [required]=\"true\"\n [maxLength]=\"254\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-phone\"\n [label]=\"texts.phone\"\n >\n <lib-form-input\n id=\"contact-phone\"\n type=\"tel\"\n formControlName=\"phone\"\n autocomplete=\"tel\"\n [placeholder]=\"texts.phonePlaceholder\"\n [maxLength]=\"40\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"contact-form-field--message col-span-full\"\n controlId=\"contact-message\"\n [label]=\"texts.message\"\n [required]=\"true\"\n [error]=\"getError('message')\"\n >\n <lib-form-textarea\n id=\"contact-message\"\n formControlName=\"message\"\n [placeholder]=\"texts.messagePlaceholder\"\n [describedBy]=\"getError('message') ? 'contact-message-error' : ''\"\n [invalid]=\"!!getError('message')\"\n [required]=\"true\"\n [maxLength]=\"5000\"\n [rows]=\"6\"\n [showCounter]=\"true\"\n />\n </lib-form-field>\n\n </div>\n\n @if (img) {\n <figure class=\"contact-form-image col-span-full md:col-span-6 md:col-start-7\">\n @if (img.publicId) {\n <ui-image\n [publicId]=\"img.publicId\"\n [width]=\"img.width\"\n [height]=\"img.height\"\n [eager]=\"true\"\n />\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </figure>\n }\n </div>\n\n <div class=\"contact-form-honeypot\" aria-hidden=\"true\">\n <label for=\"contact-website\">Website</label>\n <input\n id=\"contact-website\"\n type=\"text\"\n formControlName=\"website\"\n tabindex=\"-1\"\n autocomplete=\"off\"\n />\n </div>\n\n <div class=\"contact-form-footer col-span-full\">\n <p class=\"contact-form-privacy col-span-full md:col-span-8\">\n <strong>{{ texts.privacyTitle }}</strong>\n {{ texts.privacyResponsible }}\n {{ texts.privacyPurpose }}\n {{ texts.privacyLegalBasis }}\n {{ texts.privacyRecipients }}\n {{ texts.privacyRetention }}\n {{ texts.privacyRights }}\n {{ texts.privacyLinkLead }}\n <a class=\"contact-form-privacy__link\" [href]=\"privacyUrl\">{{ texts.privacyLink }}</a>\n {{ texts.privacyLinkTail }}\n </p>\n\n <button\n class=\"contact-form-submit col-span-full md:col-span-4\"\n type=\"submit\"\n [disabled]=\"status() === 'sending'\"\n >\n <span>{{ status() === 'sending' ? texts.sending : texts.send }}</span>\n <ui-icon name=\"arrow-up-right\" [size]=\"20\" color=\"currentColor\"></ui-icon>\n </button>\n </div>\n\n @if (status() !== 'idle') {\n <p\n class=\"contact-form-status col-span-full\"\n [class.contact-form-status--success]=\"status() === 'success'\"\n [class.contact-form-status--error]=\"status() === 'error'\"\n [attr.role]=\"status() === 'error' ? 'alert' : 'status'\"\n aria-live=\"polite\"\n >\n {{\n status() === 'sending'\n ? texts.sending\n : status() === 'success'\n ? texts.success\n : submissionError() || texts.error\n }}\n </p>\n }\n </form>\n</section>\n",
|
|
239
|
+
styles: [":host{color:var(--text-primary)}.contact-form-section{padding-top:0!important}.title{text-transform:uppercase}.contact-form-required-hint{font-family:var(--font-base);text-transform:uppercase}.contact-form-body{padding-top:0!important}.contact-form-required-hint{margin:0;color:var(--text-primary-60);font-size:.8rem}.contact-form-image{min-width:0;min-height:100%;margin:0;overflow:hidden}.contact-form-image ui-image,.contact-form-image img{display:block;width:100%;min-height:20rem;object-fit:cover}@media(max-width:1024px){.contact-form-image{display:none}}.contact-form-honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.contact-form-privacy{margin:0;padding-bottom:2rem!important;color:var(--text-primary-60);font-family:var(--font-base);font-size:.82rem;line-height:1.65}.contact-form-privacy strong{color:var(--text-primary-80);font-weight:600}.contact-form-privacy a{color:var(--text-primary);background-image:linear-gradient(var(--text-primary-70),var(--text-primary-70));background-size:100% 1px;background-position:0% 100%;background-repeat:no-repeat;transition:background-size .3s ease-in-out,background-position .3s ease-in-out}.contact-form-privacy a:hover{background-size:0% 1px;background-position:100% 100%;animation:linkMove .4s forwards}@keyframes linkMove{0%{background-size:100% 1px;background-position:0% 100%}50%{background-size:0% 1px;background-position:100% 100%}51%{background-size:0% 1px;background-position:0% 100%}to{background-size:100% 1px;background-position:0% 100%}}.contact-form-footer button{padding-bottom:2rem;display:inline-flex;min-height:3.5rem;align-items:center;justify-content:space-between;gap:.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1.2rem;background:var(--button-primary-bg);color:var(--button-primary-text);cursor:pointer;font-family:var(--font-base);font-size:1rem;text-transform:uppercase;transition:background-color .16s ease,color .16s ease,transform .16s ease;justify-self:end}.contact-form-footer button:hover:not(:disabled){background:var(--button-primary-bg-hover);transform:translateY(-2px)}.contact-form-footer button:focus-visible{outline:2px solid var(--color-secondary);outline-offset:4px}.contact-form-footer button:disabled{cursor:wait;opacity:.65}.contact-form-arrow{font-size:1.2rem}.contact-form-status{margin:0;font-family:var(--font-base);line-height:1.5}.contact-form-status--success{color:#18794e}.contact-form-status--error{color:#b42318}.contact-form-submit{max-width:100%}@media(max-width:1024px){.contact-form-submit{width:100%}}@media(prefers-reduced-motion:reduce){.contact-form-footer button{transition:none}}\n"]
|
|
240
|
+
}]
|
|
241
|
+
}],
|
|
242
|
+
propDecorators: {
|
|
243
|
+
texts: [{
|
|
244
|
+
type: Input,
|
|
245
|
+
args: [{ required: true }]
|
|
246
|
+
}],
|
|
247
|
+
privacyUrl: [{ type: Input }],
|
|
248
|
+
img: [{ type: Input }],
|
|
249
|
+
messageSubmitted: [{ type: Output }]
|
|
250
|
+
}
|
|
251
|
+
});
|
|
252
|
+
export { ContactFormComponent };
|
|
253
|
+
|
|
254
|
+
//# sourceMappingURL=lluc_llull-ui-lib-forms-contact-form.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lluc_llull-ui-lib-forms-contact-form.mjs","names":[],"sources":["../../../projects/ui-lib/forms/contact-form/contact-form.component.ts","../../../projects/ui-lib/forms/contact-form/contact-form.component.html"],"sourcesContent":["import { Component, EventEmitter, Input, Output, signal } from '@angular/core';\nimport { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';\nimport {\n FormFieldComponent,\n FormInputComponent,\n FormTextareaComponent,\n} from '@lluc_llull/ui-lib/forms';\nimport { UiLibImageI } from '@lluc_llull/ui-lib/interfaces';\nimport { UiImageComponent } from '@lluc_llull/ui-lib/shared';\nimport { ContactFormSubmissionI, ContactFormTextsI } from './contact-form.interface';\nimport { UiIconComponent } from '@lluc_llull/ui-lib/shared';\n\ntype ContactField = 'name' | 'email' | 'message';\ntype ContactFormStatus = 'idle' | 'sending' | 'success' | 'error';\n\n@Component({\n selector: 'lib-contact-form',\n standalone: true,\n imports: [\n ReactiveFormsModule,\n FormFieldComponent,\n FormInputComponent,\n FormTextareaComponent,\n UiImageComponent,\n UiIconComponent\n ],\n templateUrl: './contact-form.component.html',\n styleUrl: './contact-form.component.scss',\n host: {\n style: 'display: contents',\n },\n})\nexport class ContactFormComponent {\n @Input({ required: true }) texts!: ContactFormTextsI;\n @Input() privacyUrl = '/es/privacy';\n @Input() img: UiLibImageI | null = null;\n @Output() readonly messageSubmitted = new EventEmitter<ContactFormSubmissionI>();\n\n readonly status = signal<ContactFormStatus>('idle');\n readonly submissionError = signal('');\n submitted = false;\n\n readonly form = new FormGroup({\n name: new FormControl('', {\n nonNullable: true,\n validators: [Validators.required, Validators.pattern(/\\S/), Validators.maxLength(80)],\n }),\n surname: new FormControl('', {\n nonNullable: true,\n validators: [Validators.maxLength(100)],\n }),\n email: new FormControl('', {\n nonNullable: true,\n validators: [Validators.required, Validators.email, Validators.maxLength(254)],\n }),\n phone: new FormControl('', {\n nonNullable: true,\n validators: [Validators.maxLength(40)],\n }),\n message: new FormControl('', {\n nonNullable: true,\n validators: [Validators.required, Validators.pattern(/\\S/), Validators.maxLength(5000)],\n }),\n website: new FormControl('', { nonNullable: true }),\n });\n\n getError(field: ContactField): string {\n const control = this.form.controls[field];\n if (!control.invalid || (!control.touched && !this.submitted)) return '';\n if (control.hasError('required') || control.hasError('pattern')) {\n return this.texts.requiredError;\n }\n if (control.hasError('email')) return this.texts.emailError;\n if (control.hasError('maxlength')) return this.texts.lengthError;\n return this.texts.invalidError;\n }\n\n submit(): void {\n if (this.status() === 'sending') return;\n\n this.submitted = true;\n this.status.set('idle');\n if (this.form.invalid) {\n this.form.markAllAsTouched();\n return;\n }\n\n this.status.set('sending');\n this.messageSubmitted.emit(this.form.getRawValue());\n }\n\n setSubmissionResult(success: boolean, errorMessage = this.texts.error): void {\n this.status.set(success ? 'success' : 'error');\n this.submissionError.set(success ? '' : errorMessage);\n if (success) {\n this.form.reset();\n this.submitted = false;\n }\n }\n}\n","<section\n class=\"contact-form-section main-grid col-span-full md:col-span-12 md:col-start-1\"\n aria-labelledby=\"contact-form-title\"\n>\n <div class=\"contact-form-heading col-span-full md:col-span-12 md:col-start-1\">\n @if(texts.title) {\n <h2 class=\"title\" id=\"contact-form-title\">{{ texts.title }}</h2> \n }\n @if(texts.intro) {\n <p class=\"text\">{{ texts.intro }}</p>\n }\n </div>\n\n <form\n class=\"contact-form col-span-full\"\n [formGroup]=\"form\"\n (ngSubmit)=\"submit()\"\n [attr.aria-busy]=\"status() === 'sending' ? 'true' : null\"\n novalidate\n >\n <p class=\"contact-form-required-hint col-span-full\">{{ texts.requiredHint }}</p>\n\n <div class=\"contact-form-body main-grid col-span-full\">\n <div class=\"contact-form-grid col-span-full md:col-span-6 md:col-start-1\">\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-name\"\n [label]=\"texts.name\"\n [required]=\"true\"\n [error]=\"getError('name')\"\n >\n <lib-form-input\n id=\"contact-name\"\n formControlName=\"name\"\n autocomplete=\"given-name\"\n [placeholder]=\"texts.namePlaceholder\"\n [describedBy]=\"getError('name') ? 'contact-name-error' : ''\"\n [invalid]=\"!!getError('name')\"\n [required]=\"true\"\n [maxLength]=\"80\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-surname\"\n [label]=\"texts.surname\"\n >\n <lib-form-input\n id=\"contact-surname\"\n formControlName=\"surname\"\n autocomplete=\"family-name\"\n [placeholder]=\"texts.surnamePlaceholder\"\n [maxLength]=\"100\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-email\"\n [label]=\"texts.email\"\n [required]=\"true\"\n [error]=\"getError('email')\"\n >\n <lib-form-input\n id=\"contact-email\"\n type=\"email\"\n formControlName=\"email\"\n autocomplete=\"email\"\n [placeholder]=\"texts.emailPlaceholder\"\n [describedBy]=\"getError('email') ? 'contact-email-error' : ''\"\n [invalid]=\"!!getError('email')\"\n [required]=\"true\"\n [maxLength]=\"254\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"col-span-full md:col-span-6\"\n controlId=\"contact-phone\"\n [label]=\"texts.phone\"\n >\n <lib-form-input\n id=\"contact-phone\"\n type=\"tel\"\n formControlName=\"phone\"\n autocomplete=\"tel\"\n [placeholder]=\"texts.phonePlaceholder\"\n [maxLength]=\"40\"\n />\n </lib-form-field>\n\n <lib-form-field\n class=\"contact-form-field--message col-span-full\"\n controlId=\"contact-message\"\n [label]=\"texts.message\"\n [required]=\"true\"\n [error]=\"getError('message')\"\n >\n <lib-form-textarea\n id=\"contact-message\"\n formControlName=\"message\"\n [placeholder]=\"texts.messagePlaceholder\"\n [describedBy]=\"getError('message') ? 'contact-message-error' : ''\"\n [invalid]=\"!!getError('message')\"\n [required]=\"true\"\n [maxLength]=\"5000\"\n [rows]=\"6\"\n [showCounter]=\"true\"\n />\n </lib-form-field>\n\n </div>\n\n @if (img) {\n <figure class=\"contact-form-image col-span-full md:col-span-6 md:col-start-7\">\n @if (img.publicId) {\n <ui-image\n [publicId]=\"img.publicId\"\n [width]=\"img.width\"\n [height]=\"img.height\"\n [eager]=\"true\"\n />\n } @else {\n <img\n [src]=\"img.url\"\n [alt]=\"img.alt\"\n loading=\"eager\"\n fetchpriority=\"high\"\n [attr.width]=\"img.width || 800\"\n [attr.height]=\"img.height || 600\"\n />\n }\n </figure>\n }\n </div>\n\n <div class=\"contact-form-honeypot\" aria-hidden=\"true\">\n <label for=\"contact-website\">Website</label>\n <input\n id=\"contact-website\"\n type=\"text\"\n formControlName=\"website\"\n tabindex=\"-1\"\n autocomplete=\"off\"\n />\n </div>\n\n <div class=\"contact-form-footer col-span-full\">\n <p class=\"contact-form-privacy col-span-full md:col-span-8\">\n <strong>{{ texts.privacyTitle }}</strong>\n {{ texts.privacyResponsible }}\n {{ texts.privacyPurpose }}\n {{ texts.privacyLegalBasis }}\n {{ texts.privacyRecipients }}\n {{ texts.privacyRetention }}\n {{ texts.privacyRights }}\n {{ texts.privacyLinkLead }}\n <a class=\"contact-form-privacy__link\" [href]=\"privacyUrl\">{{ texts.privacyLink }}</a>\n {{ texts.privacyLinkTail }}\n </p>\n\n <button\n class=\"contact-form-submit col-span-full md:col-span-4\"\n type=\"submit\"\n [disabled]=\"status() === 'sending'\"\n >\n <span>{{ status() === 'sending' ? texts.sending : texts.send }}</span>\n <ui-icon name=\"arrow-up-right\" [size]=\"20\" color=\"currentColor\"></ui-icon>\n </button>\n </div>\n\n @if (status() !== 'idle') {\n <p\n class=\"contact-form-status col-span-full\"\n [class.contact-form-status--success]=\"status() === 'success'\"\n [class.contact-form-status--error]=\"status() === 'error'\"\n [attr.role]=\"status() === 'error' ? 'alert' : 'status'\"\n aria-live=\"polite\"\n >\n {{\n status() === 'sending'\n ? texts.sending\n : status() === 'success'\n ? texts.success\n : submissionError() || texts.error\n }}\n </p>\n }\n </form>\n</section>\n"],"mappings":";;;;;;AAgCA,IAAa,uBAAb,MAAa,qBAAoB;CACF;CAClB,aAAa;CACb,MAA0B;CAChB,mBAAmB,IAAI,aAAY;CAE7C,SAAS,OAA0B,QAAO,GAAA,YAAA,CAAA,EAAA,WAAA,SAAA,CAAA,+BAAA,CAAA,CAAA;CAC1C,kBAAkB,OAAO,IAAG,GAAA,YAAA,CAAA,EAAA,WAAA,kBAAA,CAAA,+BAAA,CAAA,CAAA;CACrC,YAAY;CAEH,OAAO,IAAI,UAAU;EAC1B,MAAM,IAAI,YAAY,IAAI;GACtB,aAAa;GACb,YAAY;IAAC,WAAW;IAAU,WAAW,QAAQ,IAAI;IAAG,WAAW,UAAU,EAAE;GAAC;EACvF,CAAA;EACD,SAAS,IAAI,YAAY,IAAI;GACzB,aAAa;GACb,YAAY,CAAC,WAAW,UAAU,GAAG,CAAC;EACzC,CAAA;EACD,OAAO,IAAI,YAAY,IAAI;GACvB,aAAa;GACb,YAAY;IAAC,WAAW;IAAU,WAAW;IAAO,WAAW,UAAU,GAAG;GAAC;EAChF,CAAA;EACD,OAAO,IAAI,YAAY,IAAI;GACvB,aAAa;GACb,YAAY,CAAC,WAAW,UAAU,EAAE,CAAC;EACxC,CAAA;EACD,SAAS,IAAI,YAAY,IAAI;GACzB,aAAa;GACb,YAAY;IAAC,WAAW;IAAU,WAAW,QAAQ,IAAI;IAAG,WAAW,UAAU,GAAI;GAAC;EACzF,CAAA;EACD,SAAS,IAAI,YAAY,IAAI,EAAE,aAAa,KAAI,CAAE;CACrD,CAAA;CAED,SAAS,OAAmB;EACxB,MAAM,UAAU,KAAK,KAAK,SAAS;EACnC,IAAI,CAAC,QAAQ,WAAY,CAAC,QAAQ,WAAW,CAAC,KAAK,WAAY,OAAO;EACtE,IAAI,QAAQ,SAAS,UAAU,KAAK,QAAQ,SAAS,SAAS,GAC1D,OAAO,KAAK,MAAM;EAEtB,IAAI,QAAQ,SAAS,OAAO,GAAG,OAAO,KAAK,MAAM;EACjD,IAAI,QAAQ,SAAS,WAAW,GAAG,OAAO,KAAK,MAAM;EACrD,OAAO,KAAK,MAAM;CACtB;CAEA,SAAM;EACF,IAAI,KAAK,OAAM,MAAO,WAAW;EAEjC,KAAK,YAAY;EACjB,KAAK,OAAO,IAAI,MAAM;EACtB,IAAI,KAAK,KAAK,SAAS;GACnB,KAAK,KAAK,iBAAgB;GAC1B;EACJ;EAEA,KAAK,OAAO,IAAI,SAAS;EACzB,KAAK,iBAAiB,KAAK,KAAK,KAAK,YAAW,CAAE;CACtD;CAEA,oBAAoB,SAAkB,eAAe,KAAK,MAAM,OAAK;EACjE,KAAK,OAAO,IAAI,UAAU,YAAY,OAAO;EAC7C,KAAK,gBAAgB,IAAI,UAAU,KAAK,YAAY;EACpD,IAAI,SAAS;GACT,KAAK,KAAK,MAAK;GACf,KAAK,YAAY;EACrB;CACJ;CAlES,OAAA,OAAA,GAAA,mBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,UAAA;EAAA,MAAA;EAAoB,MAAA,CAAA;EAAA,QAAA,GAAA,gBAAA;CAAA,CAAA;CAApB,OAAA,OAAA,GAAA,qBAAA;EAAA,YAAA;EAAA,SAAA;EAAA,MAAA;EAAoB,cAAA;EAAA,UAAA;EAAA,QAAA;GAAA,OAAA;GAAA,YAAA;GAAA,KAAA;EAAA;EAAA,SAAA,EAAA,kBAAA,mBAAA;EAAA,MAAA,EAAA,gBAAA,oBAAA;EAAA,UAAA;EAAA,UChCjC;EA+LA,QAAA,CAAA,unFAAA;EAAA,cAAA;GAAA;IAAA,MAAA;IAAA,MD5KQ;GAAmB;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;IAAA,QAAA,CAAA,UAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;IAAA,QAAA,CAAA,WAAA;IAAA,SAAA,CAAA,UAAA;IAAA,UAAA,CAAA,QAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAAA,GAAA;IAAA,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;IAAA;IAAA,SAAA,CAAA,eAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MACnB;IAAkB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAClB;IAAkB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAClB;IAAqB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MACrB;IAAgB,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;KAAA;KAAA;KAAA;IAAA;GAAA;GAAA;IAAA,MAAA;IAAA,MAChB;IAAe,UAAA;IAAA,QAAA;KAAA;KAAA;KAAA;IAAA;GAAA;EAAA;CAAA,CAAA;;AAQV,GAAA,yBAAA;CAAA,YAAA;CAAA,SAAA;CAAA,UAAA;CAAA,MAAA;CAAoB,YAAA,CAAA;EAjBhC,MAAA;EACa,MAAA,CAAA;GAAA,UAAA;GAAkB,YAChB;GAAI,SACP;IACL;IACA;IACA;IACA;IACA;IACA;GACH;GAAA,MAGK,EACF,OAAO,oBACV;GAAA,UAAA;GAAA,QAAA,CAAA,unFAAA;EAAA,CAAA;;;;GAGA,MAAA;GAAM,MAAA,CAAA,EAAE,UAAU,KAAI,CAAE;;E,eACxB,MAAA,M;E,QACA,MAAA,M;E,qBACA,MAAA,O"}
|
|
@@ -0,0 +1,443 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { Component, Input, forwardRef } from "@angular/core";
|
|
3
|
+
import { NG_VALUE_ACCESSOR } from "@angular/forms";
|
|
4
|
+
var FormFieldComponent = class FormFieldComponent {
|
|
5
|
+
controlId = "";
|
|
6
|
+
label = "";
|
|
7
|
+
required = false;
|
|
8
|
+
hint = "";
|
|
9
|
+
error = "";
|
|
10
|
+
get errorId() {
|
|
11
|
+
return `${this.controlId}-error`;
|
|
12
|
+
}
|
|
13
|
+
get hintId() {
|
|
14
|
+
return `${this.controlId}-hint`;
|
|
15
|
+
}
|
|
16
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
17
|
+
minVersion: "12.0.0",
|
|
18
|
+
version: "22.2.4",
|
|
19
|
+
ngImport: i0,
|
|
20
|
+
type: FormFieldComponent,
|
|
21
|
+
deps: [],
|
|
22
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
23
|
+
});
|
|
24
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
25
|
+
minVersion: "17.0.0",
|
|
26
|
+
version: "22.2.4",
|
|
27
|
+
type: FormFieldComponent,
|
|
28
|
+
isStandalone: true,
|
|
29
|
+
selector: "lib-form-field",
|
|
30
|
+
inputs: {
|
|
31
|
+
controlId: "controlId",
|
|
32
|
+
label: "label",
|
|
33
|
+
required: "required",
|
|
34
|
+
hint: "hint",
|
|
35
|
+
error: "error"
|
|
36
|
+
},
|
|
37
|
+
host: { classAttribute: "form-field" },
|
|
38
|
+
ngImport: i0,
|
|
39
|
+
template: "@if (label) {\n <label [for]=\"controlId\">\n {{ label }}\n @if (required) {\n <span class=\"form-field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n}\n<ng-content />\n@if (hint && !error) {\n <span class=\"form-field-hint\" [id]=\"hintId\">{{ hint }}</span>\n}\n@if (error) {\n <span class=\"form-field-error\" [id]=\"errorId\" role=\"alert\">{{ error }}</span>\n}\n",
|
|
40
|
+
styles: [":host{display:flex;min-width:0;flex-direction:column;gap:.65rem}:host>label{color:var(--text-primary);font-family:var(--font-base);font-size:.9rem;letter-spacing:.04em;text-transform:uppercase;padding-top:1rem}.form-field-required{color:var(--color-secondary)}.form-field-hint{color:var(--text-primary-60);font-size:.8rem;line-height:1.4}.form-field-error{color:#b42318;font-size:.875rem;line-height:1.4}\n"]
|
|
41
|
+
});
|
|
42
|
+
};
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
44
|
+
minVersion: "12.0.0",
|
|
45
|
+
version: "22.2.4",
|
|
46
|
+
ngImport: i0,
|
|
47
|
+
type: FormFieldComponent,
|
|
48
|
+
decorators: [{
|
|
49
|
+
type: Component,
|
|
50
|
+
args: [{
|
|
51
|
+
selector: "lib-form-field",
|
|
52
|
+
standalone: true,
|
|
53
|
+
host: { class: "form-field" },
|
|
54
|
+
template: "@if (label) {\n <label [for]=\"controlId\">\n {{ label }}\n @if (required) {\n <span class=\"form-field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n}\n<ng-content />\n@if (hint && !error) {\n <span class=\"form-field-hint\" [id]=\"hintId\">{{ hint }}</span>\n}\n@if (error) {\n <span class=\"form-field-error\" [id]=\"errorId\" role=\"alert\">{{ error }}</span>\n}\n",
|
|
55
|
+
styles: [":host{display:flex;min-width:0;flex-direction:column;gap:.65rem}:host>label{color:var(--text-primary);font-family:var(--font-base);font-size:.9rem;letter-spacing:.04em;text-transform:uppercase;padding-top:1rem}.form-field-required{color:var(--color-secondary)}.form-field-hint{color:var(--text-primary-60);font-size:.8rem;line-height:1.4}.form-field-error{color:#b42318;font-size:.875rem;line-height:1.4}\n"]
|
|
56
|
+
}]
|
|
57
|
+
}],
|
|
58
|
+
propDecorators: {
|
|
59
|
+
controlId: [{
|
|
60
|
+
type: Input,
|
|
61
|
+
args: [{ required: true }]
|
|
62
|
+
}],
|
|
63
|
+
label: [{ type: Input }],
|
|
64
|
+
required: [{ type: Input }],
|
|
65
|
+
hint: [{ type: Input }],
|
|
66
|
+
error: [{ type: Input }]
|
|
67
|
+
}
|
|
68
|
+
});
|
|
69
|
+
var FormInputComponent = class FormInputComponent {
|
|
70
|
+
id = "";
|
|
71
|
+
type = "text";
|
|
72
|
+
placeholder = "";
|
|
73
|
+
autocomplete = "";
|
|
74
|
+
describedBy = "";
|
|
75
|
+
maxLength = null;
|
|
76
|
+
required = false;
|
|
77
|
+
invalid = false;
|
|
78
|
+
value = "";
|
|
79
|
+
disabled = false;
|
|
80
|
+
onChange = () => {};
|
|
81
|
+
onTouched = () => {};
|
|
82
|
+
writeValue(value) {
|
|
83
|
+
this.value = value ?? "";
|
|
84
|
+
}
|
|
85
|
+
registerOnChange(fn) {
|
|
86
|
+
this.onChange = fn;
|
|
87
|
+
}
|
|
88
|
+
registerOnTouched(fn) {
|
|
89
|
+
this.onTouched = fn;
|
|
90
|
+
}
|
|
91
|
+
setDisabledState(disabled) {
|
|
92
|
+
this.disabled = disabled;
|
|
93
|
+
}
|
|
94
|
+
handleInput(event) {
|
|
95
|
+
this.value = event.target.value;
|
|
96
|
+
this.onChange(this.value);
|
|
97
|
+
}
|
|
98
|
+
handleBlur() {
|
|
99
|
+
this.onTouched();
|
|
100
|
+
}
|
|
101
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
102
|
+
minVersion: "12.0.0",
|
|
103
|
+
version: "22.2.4",
|
|
104
|
+
ngImport: i0,
|
|
105
|
+
type: FormInputComponent,
|
|
106
|
+
deps: [],
|
|
107
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
108
|
+
});
|
|
109
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
110
|
+
minVersion: "14.0.0",
|
|
111
|
+
version: "22.2.4",
|
|
112
|
+
type: FormInputComponent,
|
|
113
|
+
isStandalone: true,
|
|
114
|
+
selector: "lib-form-input",
|
|
115
|
+
inputs: {
|
|
116
|
+
id: "id",
|
|
117
|
+
type: "type",
|
|
118
|
+
placeholder: "placeholder",
|
|
119
|
+
autocomplete: "autocomplete",
|
|
120
|
+
describedBy: "describedBy",
|
|
121
|
+
maxLength: "maxLength",
|
|
122
|
+
required: "required",
|
|
123
|
+
invalid: "invalid"
|
|
124
|
+
},
|
|
125
|
+
providers: [{
|
|
126
|
+
provide: NG_VALUE_ACCESSOR,
|
|
127
|
+
useExisting: forwardRef(() => FormInputComponent),
|
|
128
|
+
multi: true
|
|
129
|
+
}],
|
|
130
|
+
ngImport: i0,
|
|
131
|
+
template: "<input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [attr.autocomplete]=\"autocomplete || null\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n/>\n",
|
|
132
|
+
styles: [":host{display:block;min-width:0}input{box-sizing:border-box;width:100%;min-height:3.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base);transition:border-color .16s ease,box-shadow .16s ease}input::placeholder{color:var(--text-primary-50);opacity:1}input:hover:not(:disabled){border-color:var(--text-primary)}input:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px;box-shadow:inset 0 -3px 0 var(--color-secondary)}input[aria-invalid=true]{border-color:#b42318}input:disabled{cursor:not-allowed;opacity:.65}@media(prefers-reduced-motion:reduce){input{transition:none}}\n"]
|
|
133
|
+
});
|
|
134
|
+
};
|
|
135
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
136
|
+
minVersion: "12.0.0",
|
|
137
|
+
version: "22.2.4",
|
|
138
|
+
ngImport: i0,
|
|
139
|
+
type: FormInputComponent,
|
|
140
|
+
decorators: [{
|
|
141
|
+
type: Component,
|
|
142
|
+
args: [{
|
|
143
|
+
selector: "lib-form-input",
|
|
144
|
+
standalone: true,
|
|
145
|
+
providers: [{
|
|
146
|
+
provide: NG_VALUE_ACCESSOR,
|
|
147
|
+
useExisting: forwardRef(() => FormInputComponent),
|
|
148
|
+
multi: true
|
|
149
|
+
}],
|
|
150
|
+
template: "<input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [attr.autocomplete]=\"autocomplete || null\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n/>\n",
|
|
151
|
+
styles: [":host{display:block;min-width:0}input{box-sizing:border-box;width:100%;min-height:3.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base);transition:border-color .16s ease,box-shadow .16s ease}input::placeholder{color:var(--text-primary-50);opacity:1}input:hover:not(:disabled){border-color:var(--text-primary)}input:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px;box-shadow:inset 0 -3px 0 var(--color-secondary)}input[aria-invalid=true]{border-color:#b42318}input:disabled{cursor:not-allowed;opacity:.65}@media(prefers-reduced-motion:reduce){input{transition:none}}\n"]
|
|
152
|
+
}]
|
|
153
|
+
}],
|
|
154
|
+
propDecorators: {
|
|
155
|
+
id: [{
|
|
156
|
+
type: Input,
|
|
157
|
+
args: [{ required: true }]
|
|
158
|
+
}],
|
|
159
|
+
type: [{ type: Input }],
|
|
160
|
+
placeholder: [{ type: Input }],
|
|
161
|
+
autocomplete: [{ type: Input }],
|
|
162
|
+
describedBy: [{ type: Input }],
|
|
163
|
+
maxLength: [{ type: Input }],
|
|
164
|
+
required: [{ type: Input }],
|
|
165
|
+
invalid: [{ type: Input }]
|
|
166
|
+
}
|
|
167
|
+
});
|
|
168
|
+
var FormSelectComponent = class FormSelectComponent {
|
|
169
|
+
id = "";
|
|
170
|
+
options = [];
|
|
171
|
+
placeholder = "";
|
|
172
|
+
describedBy = "";
|
|
173
|
+
required = false;
|
|
174
|
+
invalid = false;
|
|
175
|
+
value = "";
|
|
176
|
+
disabled = false;
|
|
177
|
+
onChange = () => {};
|
|
178
|
+
onTouched = () => {};
|
|
179
|
+
writeValue(value) {
|
|
180
|
+
this.value = value ?? "";
|
|
181
|
+
}
|
|
182
|
+
registerOnChange(fn) {
|
|
183
|
+
this.onChange = fn;
|
|
184
|
+
}
|
|
185
|
+
registerOnTouched(fn) {
|
|
186
|
+
this.onTouched = fn;
|
|
187
|
+
}
|
|
188
|
+
setDisabledState(disabled) {
|
|
189
|
+
this.disabled = disabled;
|
|
190
|
+
}
|
|
191
|
+
handleChange(event) {
|
|
192
|
+
this.value = event.target.value;
|
|
193
|
+
this.onChange(this.value);
|
|
194
|
+
}
|
|
195
|
+
handleBlur() {
|
|
196
|
+
this.onTouched();
|
|
197
|
+
}
|
|
198
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
199
|
+
minVersion: "12.0.0",
|
|
200
|
+
version: "22.2.4",
|
|
201
|
+
ngImport: i0,
|
|
202
|
+
type: FormSelectComponent,
|
|
203
|
+
deps: [],
|
|
204
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
205
|
+
});
|
|
206
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
207
|
+
minVersion: "17.0.0",
|
|
208
|
+
version: "22.2.4",
|
|
209
|
+
type: FormSelectComponent,
|
|
210
|
+
isStandalone: true,
|
|
211
|
+
selector: "lib-form-select",
|
|
212
|
+
inputs: {
|
|
213
|
+
id: "id",
|
|
214
|
+
options: "options",
|
|
215
|
+
placeholder: "placeholder",
|
|
216
|
+
describedBy: "describedBy",
|
|
217
|
+
required: "required",
|
|
218
|
+
invalid: "invalid"
|
|
219
|
+
},
|
|
220
|
+
providers: [{
|
|
221
|
+
provide: NG_VALUE_ACCESSOR,
|
|
222
|
+
useExisting: forwardRef(() => FormSelectComponent),
|
|
223
|
+
multi: true
|
|
224
|
+
}],
|
|
225
|
+
ngImport: i0,
|
|
226
|
+
template: "<select\n [id]=\"id\"\n [value]=\"value\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n>\n @if (placeholder) {\n <option value=\"\" disabled>{{ placeholder }}</option>\n }\n @for (option of options; track option.value) {\n <option [value]=\"option.value\" [disabled]=\"option.disabled ?? false\">\n {{ option.label }}\n </option>\n }\n</select>\n",
|
|
227
|
+
styles: [":host{display:block;min-width:0}select{box-sizing:border-box;width:100%;min-height:3.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base)}select:hover:not(:disabled){border-color:var(--text-primary)}select:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px}select[aria-invalid=true]{border-color:#b42318}select:disabled{cursor:not-allowed;opacity:.65}\n"]
|
|
228
|
+
});
|
|
229
|
+
};
|
|
230
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
231
|
+
minVersion: "12.0.0",
|
|
232
|
+
version: "22.2.4",
|
|
233
|
+
ngImport: i0,
|
|
234
|
+
type: FormSelectComponent,
|
|
235
|
+
decorators: [{
|
|
236
|
+
type: Component,
|
|
237
|
+
args: [{
|
|
238
|
+
selector: "lib-form-select",
|
|
239
|
+
standalone: true,
|
|
240
|
+
providers: [{
|
|
241
|
+
provide: NG_VALUE_ACCESSOR,
|
|
242
|
+
useExisting: forwardRef(() => FormSelectComponent),
|
|
243
|
+
multi: true
|
|
244
|
+
}],
|
|
245
|
+
template: "<select\n [id]=\"id\"\n [value]=\"value\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n>\n @if (placeholder) {\n <option value=\"\" disabled>{{ placeholder }}</option>\n }\n @for (option of options; track option.value) {\n <option [value]=\"option.value\" [disabled]=\"option.disabled ?? false\">\n {{ option.label }}\n </option>\n }\n</select>\n",
|
|
246
|
+
styles: [":host{display:block;min-width:0}select{box-sizing:border-box;width:100%;min-height:3.5rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base)}select:hover:not(:disabled){border-color:var(--text-primary)}select:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px}select[aria-invalid=true]{border-color:#b42318}select:disabled{cursor:not-allowed;opacity:.65}\n"]
|
|
247
|
+
}]
|
|
248
|
+
}],
|
|
249
|
+
propDecorators: {
|
|
250
|
+
id: [{
|
|
251
|
+
type: Input,
|
|
252
|
+
args: [{ required: true }]
|
|
253
|
+
}],
|
|
254
|
+
options: [{ type: Input }],
|
|
255
|
+
placeholder: [{ type: Input }],
|
|
256
|
+
describedBy: [{ type: Input }],
|
|
257
|
+
required: [{ type: Input }],
|
|
258
|
+
invalid: [{ type: Input }]
|
|
259
|
+
}
|
|
260
|
+
});
|
|
261
|
+
var FormTextareaComponent = class FormTextareaComponent {
|
|
262
|
+
id = "";
|
|
263
|
+
placeholder = "";
|
|
264
|
+
describedBy = "";
|
|
265
|
+
rows = 6;
|
|
266
|
+
maxLength = null;
|
|
267
|
+
required = false;
|
|
268
|
+
invalid = false;
|
|
269
|
+
showCounter = false;
|
|
270
|
+
value = "";
|
|
271
|
+
disabled = false;
|
|
272
|
+
onChange = () => {};
|
|
273
|
+
onTouched = () => {};
|
|
274
|
+
writeValue(value) {
|
|
275
|
+
this.value = value ?? "";
|
|
276
|
+
}
|
|
277
|
+
registerOnChange(fn) {
|
|
278
|
+
this.onChange = fn;
|
|
279
|
+
}
|
|
280
|
+
registerOnTouched(fn) {
|
|
281
|
+
this.onTouched = fn;
|
|
282
|
+
}
|
|
283
|
+
setDisabledState(disabled) {
|
|
284
|
+
this.disabled = disabled;
|
|
285
|
+
}
|
|
286
|
+
handleInput(event) {
|
|
287
|
+
this.value = event.target.value;
|
|
288
|
+
this.onChange(this.value);
|
|
289
|
+
}
|
|
290
|
+
handleBlur() {
|
|
291
|
+
this.onTouched();
|
|
292
|
+
}
|
|
293
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
294
|
+
minVersion: "12.0.0",
|
|
295
|
+
version: "22.2.4",
|
|
296
|
+
ngImport: i0,
|
|
297
|
+
type: FormTextareaComponent,
|
|
298
|
+
deps: [],
|
|
299
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
300
|
+
});
|
|
301
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
302
|
+
minVersion: "17.0.0",
|
|
303
|
+
version: "22.2.4",
|
|
304
|
+
type: FormTextareaComponent,
|
|
305
|
+
isStandalone: true,
|
|
306
|
+
selector: "lib-form-textarea",
|
|
307
|
+
inputs: {
|
|
308
|
+
id: "id",
|
|
309
|
+
placeholder: "placeholder",
|
|
310
|
+
describedBy: "describedBy",
|
|
311
|
+
rows: "rows",
|
|
312
|
+
maxLength: "maxLength",
|
|
313
|
+
required: "required",
|
|
314
|
+
invalid: "invalid",
|
|
315
|
+
showCounter: "showCounter"
|
|
316
|
+
},
|
|
317
|
+
providers: [{
|
|
318
|
+
provide: NG_VALUE_ACCESSOR,
|
|
319
|
+
useExisting: forwardRef(() => FormTextareaComponent),
|
|
320
|
+
multi: true
|
|
321
|
+
}],
|
|
322
|
+
ngImport: i0,
|
|
323
|
+
template: "<textarea\n [id]=\"id\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [rows]=\"rows\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n></textarea>\n@if (showCounter && maxLength) {\n <span class=\"form-textarea-counter\" aria-live=\"polite\">\n {{ value.length }} / {{ maxLength }}\n </span>\n}\n",
|
|
324
|
+
styles: [":host{display:block;min-width:0}textarea{box-sizing:border-box;display:block;width:100%;min-height:12rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base);resize:vertical;transition:border-color .16s ease,box-shadow .16s ease}textarea::placeholder{color:var(--text-primary-50);opacity:1}textarea:hover:not(:disabled){border-color:var(--text-primary)}textarea:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px;box-shadow:inset 0 -3px 0 var(--color-secondary)}textarea[aria-invalid=true]{border-color:#b42318}textarea:disabled{cursor:not-allowed;opacity:.65}.form-textarea-counter{display:block;margin-top:.35rem;color:var(--text-primary-60);font-size:.75rem;text-align:right}@media(prefers-reduced-motion:reduce){textarea{transition:none}}\n"]
|
|
325
|
+
});
|
|
326
|
+
};
|
|
327
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
328
|
+
minVersion: "12.0.0",
|
|
329
|
+
version: "22.2.4",
|
|
330
|
+
ngImport: i0,
|
|
331
|
+
type: FormTextareaComponent,
|
|
332
|
+
decorators: [{
|
|
333
|
+
type: Component,
|
|
334
|
+
args: [{
|
|
335
|
+
selector: "lib-form-textarea",
|
|
336
|
+
standalone: true,
|
|
337
|
+
providers: [{
|
|
338
|
+
provide: NG_VALUE_ACCESSOR,
|
|
339
|
+
useExisting: forwardRef(() => FormTextareaComponent),
|
|
340
|
+
multi: true
|
|
341
|
+
}],
|
|
342
|
+
template: "<textarea\n [id]=\"id\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [rows]=\"rows\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n></textarea>\n@if (showCounter && maxLength) {\n <span class=\"form-textarea-counter\" aria-live=\"polite\">\n {{ value.length }} / {{ maxLength }}\n </span>\n}\n",
|
|
343
|
+
styles: [":host{display:block;min-width:0}textarea{box-sizing:border-box;display:block;width:100%;min-height:12rem;border:4px solid var(--border-primary);border-radius:0;padding:.9rem 1rem;background:var(--surface-primary);color:var(--text-primary);font:1rem/1.5 var(--font-base);resize:vertical;transition:border-color .16s ease,box-shadow .16s ease}textarea::placeholder{color:var(--text-primary-50);opacity:1}textarea:hover:not(:disabled){border-color:var(--text-primary)}textarea:focus-visible{border-color:var(--color-secondary);outline:2px solid var(--color-secondary);outline-offset:3px;box-shadow:inset 0 -3px 0 var(--color-secondary)}textarea[aria-invalid=true]{border-color:#b42318}textarea:disabled{cursor:not-allowed;opacity:.65}.form-textarea-counter{display:block;margin-top:.35rem;color:var(--text-primary-60);font-size:.75rem;text-align:right}@media(prefers-reduced-motion:reduce){textarea{transition:none}}\n"]
|
|
344
|
+
}]
|
|
345
|
+
}],
|
|
346
|
+
propDecorators: {
|
|
347
|
+
id: [{
|
|
348
|
+
type: Input,
|
|
349
|
+
args: [{ required: true }]
|
|
350
|
+
}],
|
|
351
|
+
placeholder: [{ type: Input }],
|
|
352
|
+
describedBy: [{ type: Input }],
|
|
353
|
+
rows: [{ type: Input }],
|
|
354
|
+
maxLength: [{ type: Input }],
|
|
355
|
+
required: [{ type: Input }],
|
|
356
|
+
invalid: [{ type: Input }],
|
|
357
|
+
showCounter: [{ type: Input }]
|
|
358
|
+
}
|
|
359
|
+
});
|
|
360
|
+
var FormToggleComponent = class FormToggleComponent {
|
|
361
|
+
id = "";
|
|
362
|
+
describedBy = "";
|
|
363
|
+
checked = false;
|
|
364
|
+
disabled = false;
|
|
365
|
+
onChange = () => {};
|
|
366
|
+
onTouched = () => {};
|
|
367
|
+
writeValue(value) {
|
|
368
|
+
this.checked = value ?? false;
|
|
369
|
+
}
|
|
370
|
+
registerOnChange(fn) {
|
|
371
|
+
this.onChange = fn;
|
|
372
|
+
}
|
|
373
|
+
registerOnTouched(fn) {
|
|
374
|
+
this.onTouched = fn;
|
|
375
|
+
}
|
|
376
|
+
setDisabledState(disabled) {
|
|
377
|
+
this.disabled = disabled;
|
|
378
|
+
}
|
|
379
|
+
handleChange(event) {
|
|
380
|
+
this.checked = event.target.checked;
|
|
381
|
+
this.onChange(this.checked);
|
|
382
|
+
}
|
|
383
|
+
handleBlur() {
|
|
384
|
+
this.onTouched();
|
|
385
|
+
}
|
|
386
|
+
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
387
|
+
minVersion: "12.0.0",
|
|
388
|
+
version: "22.2.4",
|
|
389
|
+
ngImport: i0,
|
|
390
|
+
type: FormToggleComponent,
|
|
391
|
+
deps: [],
|
|
392
|
+
target: i0.ɵɵFactoryTarget.Component
|
|
393
|
+
});
|
|
394
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({
|
|
395
|
+
minVersion: "14.0.0",
|
|
396
|
+
version: "22.2.4",
|
|
397
|
+
type: FormToggleComponent,
|
|
398
|
+
isStandalone: true,
|
|
399
|
+
selector: "lib-form-toggle",
|
|
400
|
+
inputs: {
|
|
401
|
+
id: "id",
|
|
402
|
+
describedBy: "describedBy"
|
|
403
|
+
},
|
|
404
|
+
providers: [{
|
|
405
|
+
provide: NG_VALUE_ACCESSOR,
|
|
406
|
+
useExisting: forwardRef(() => FormToggleComponent),
|
|
407
|
+
multi: true
|
|
408
|
+
}],
|
|
409
|
+
ngImport: i0,
|
|
410
|
+
template: "<label class=\"form-toggle\" [for]=\"id\">\n <input\n [id]=\"id\"\n type=\"checkbox\"\n role=\"switch\"\n [checked]=\"checked\"\n [attr.aria-describedby]=\"describedBy || null\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n />\n <span class=\"form-toggle-track\" aria-hidden=\"true\"><span></span></span>\n <span class=\"form-toggle-label\"><ng-content /></span>\n</label>\n",
|
|
411
|
+
styles: [":host{display:inline-block}.form-toggle{display:inline-flex;align-items:center;gap:.75rem;cursor:pointer;font:1rem/1.5 var(--font-base)}.form-toggle input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.form-toggle-track{display:inline-flex;width:2.75rem;height:1.5rem;align-items:center;border:1px solid var(--border-primary-50);padding:.15rem;background:var(--surface-secondary);transition:background-color .16s ease}.form-toggle-track>span{width:1rem;height:1rem;background:var(--text-primary);transition:transform .16s ease}.form-toggle input:checked+.form-toggle-track{border-color:var(--color-secondary);background:var(--color-secondary)}.form-toggle input:checked+.form-toggle-track>span{background:var(--color-primary);transform:translate(1.2rem)}.form-toggle input:focus-visible+.form-toggle-track{outline:2px solid var(--color-secondary);outline-offset:3px}.form-toggle input:disabled+.form-toggle-track,.form-toggle input:disabled~.form-toggle-label{cursor:not-allowed;opacity:.6}@media(prefers-reduced-motion:reduce){.form-toggle-track,.form-toggle-track>span{transition:none}}\n"]
|
|
412
|
+
});
|
|
413
|
+
};
|
|
414
|
+
i0.ɵɵngDeclareClassMetadata({
|
|
415
|
+
minVersion: "12.0.0",
|
|
416
|
+
version: "22.2.4",
|
|
417
|
+
ngImport: i0,
|
|
418
|
+
type: FormToggleComponent,
|
|
419
|
+
decorators: [{
|
|
420
|
+
type: Component,
|
|
421
|
+
args: [{
|
|
422
|
+
selector: "lib-form-toggle",
|
|
423
|
+
standalone: true,
|
|
424
|
+
providers: [{
|
|
425
|
+
provide: NG_VALUE_ACCESSOR,
|
|
426
|
+
useExisting: forwardRef(() => FormToggleComponent),
|
|
427
|
+
multi: true
|
|
428
|
+
}],
|
|
429
|
+
template: "<label class=\"form-toggle\" [for]=\"id\">\n <input\n [id]=\"id\"\n type=\"checkbox\"\n role=\"switch\"\n [checked]=\"checked\"\n [attr.aria-describedby]=\"describedBy || null\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n />\n <span class=\"form-toggle-track\" aria-hidden=\"true\"><span></span></span>\n <span class=\"form-toggle-label\"><ng-content /></span>\n</label>\n",
|
|
430
|
+
styles: [":host{display:inline-block}.form-toggle{display:inline-flex;align-items:center;gap:.75rem;cursor:pointer;font:1rem/1.5 var(--font-base)}.form-toggle input{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.form-toggle-track{display:inline-flex;width:2.75rem;height:1.5rem;align-items:center;border:1px solid var(--border-primary-50);padding:.15rem;background:var(--surface-secondary);transition:background-color .16s ease}.form-toggle-track>span{width:1rem;height:1rem;background:var(--text-primary);transition:transform .16s ease}.form-toggle input:checked+.form-toggle-track{border-color:var(--color-secondary);background:var(--color-secondary)}.form-toggle input:checked+.form-toggle-track>span{background:var(--color-primary);transform:translate(1.2rem)}.form-toggle input:focus-visible+.form-toggle-track{outline:2px solid var(--color-secondary);outline-offset:3px}.form-toggle input:disabled+.form-toggle-track,.form-toggle input:disabled~.form-toggle-label{cursor:not-allowed;opacity:.6}@media(prefers-reduced-motion:reduce){.form-toggle-track,.form-toggle-track>span{transition:none}}\n"]
|
|
431
|
+
}]
|
|
432
|
+
}],
|
|
433
|
+
propDecorators: {
|
|
434
|
+
id: [{
|
|
435
|
+
type: Input,
|
|
436
|
+
args: [{ required: true }]
|
|
437
|
+
}],
|
|
438
|
+
describedBy: [{ type: Input }]
|
|
439
|
+
}
|
|
440
|
+
});
|
|
441
|
+
export { FormFieldComponent, FormInputComponent, FormSelectComponent, FormTextareaComponent, FormToggleComponent };
|
|
442
|
+
|
|
443
|
+
//# sourceMappingURL=lluc_llull-ui-lib-forms.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"lluc_llull-ui-lib-forms.mjs","names":[],"sources":["../../../projects/ui-lib/forms/form-field/form-field.component.ts","../../../projects/ui-lib/forms/form-field/form-field.component.html","../../../projects/ui-lib/forms/form-input/form-input.component.ts","../../../projects/ui-lib/forms/form-input/form-input.component.html","../../../projects/ui-lib/forms/form-select/form-select.component.ts","../../../projects/ui-lib/forms/form-select/form-select.component.html","../../../projects/ui-lib/forms/form-textarea/form-textarea.component.ts","../../../projects/ui-lib/forms/form-textarea/form-textarea.component.html","../../../projects/ui-lib/forms/form-toggle/form-toggle.component.ts","../../../projects/ui-lib/forms/form-toggle/form-toggle.component.html"],"sourcesContent":["import { Component, Input } from '@angular/core';\n\n@Component({\n selector: 'lib-form-field',\n standalone: true,\n templateUrl: './form-field.component.html',\n styleUrl: './form-field.component.scss',\n host: {\n class: 'form-field',\n },\n})\nexport class FormFieldComponent {\n @Input({ required: true }) controlId = '';\n @Input() label = '';\n @Input() required = false;\n @Input() hint = '';\n @Input() error = '';\n\n get errorId(): string {\n return `${this.controlId}-error`;\n }\n\n get hintId(): string {\n return `${this.controlId}-hint`;\n }\n}\n","@if (label) {\n <label [for]=\"controlId\">\n {{ label }}\n @if (required) {\n <span class=\"form-field-required\" aria-hidden=\"true\">*</span>\n }\n </label>\n}\n<ng-content />\n@if (hint && !error) {\n <span class=\"form-field-hint\" [id]=\"hintId\">{{ hint }}</span>\n}\n@if (error) {\n <span class=\"form-field-error\" [id]=\"errorId\" role=\"alert\">{{ error }}</span>\n}\n","import { Component, forwardRef, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nexport type UiLibInputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password';\n\n@Component({\n selector: 'lib-form-input',\n standalone: true,\n templateUrl: './form-input.component.html',\n styleUrl: './form-input.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => FormInputComponent),\n multi: true,\n },\n ],\n})\nexport class FormInputComponent implements ControlValueAccessor {\n @Input({ required: true }) id = '';\n @Input() type: UiLibInputType = 'text';\n @Input() placeholder = '';\n @Input() autocomplete = '';\n @Input() describedBy = '';\n @Input() maxLength: number | null = null;\n @Input() required = false;\n @Input() invalid = false;\n\n value = '';\n disabled = false;\n private onChange: (value: string) => void = () => {};\n private onTouched: () => void = () => {};\n\n writeValue(value: string | null): void {\n this.value = value ?? '';\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n handleInput(event: Event): void {\n this.value = (event.target as HTMLInputElement).value;\n this.onChange(this.value);\n }\n\n handleBlur(): void {\n this.onTouched();\n }\n}\n","<input\n [id]=\"id\"\n [type]=\"type\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [attr.autocomplete]=\"autocomplete || null\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n/>\n","import { Component, forwardRef, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\nexport interface UiLibSelectOptionI {\n label: string;\n value: string;\n disabled?: boolean;\n}\n\n@Component({\n selector: 'lib-form-select',\n standalone: true,\n templateUrl: './form-select.component.html',\n styleUrl: './form-select.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => FormSelectComponent),\n multi: true,\n },\n ],\n})\nexport class FormSelectComponent implements ControlValueAccessor {\n @Input({ required: true }) id = '';\n @Input() options: UiLibSelectOptionI[] = [];\n @Input() placeholder = '';\n @Input() describedBy = '';\n @Input() required = false;\n @Input() invalid = false;\n\n value = '';\n disabled = false;\n private onChange: (value: string) => void = () => {};\n private onTouched: () => void = () => {};\n\n writeValue(value: string | null): void {\n this.value = value ?? '';\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n handleChange(event: Event): void {\n this.value = (event.target as HTMLSelectElement).value;\n this.onChange(this.value);\n }\n\n handleBlur(): void {\n this.onTouched();\n }\n}\n","<select\n [id]=\"id\"\n [value]=\"value\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n>\n @if (placeholder) {\n <option value=\"\" disabled>{{ placeholder }}</option>\n }\n @for (option of options; track option.value) {\n <option [value]=\"option.value\" [disabled]=\"option.disabled ?? false\">\n {{ option.label }}\n </option>\n }\n</select>\n","import { Component, forwardRef, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'lib-form-textarea',\n standalone: true,\n templateUrl: './form-textarea.component.html',\n styleUrl: './form-textarea.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => FormTextareaComponent),\n multi: true,\n },\n ],\n})\nexport class FormTextareaComponent implements ControlValueAccessor {\n @Input({ required: true }) id = '';\n @Input() placeholder = '';\n @Input() describedBy = '';\n @Input() rows = 6;\n @Input() maxLength: number | null = null;\n @Input() required = false;\n @Input() invalid = false;\n @Input() showCounter = false;\n\n value = '';\n disabled = false;\n private onChange: (value: string) => void = () => {};\n private onTouched: () => void = () => {};\n\n writeValue(value: string | null): void {\n this.value = value ?? '';\n }\n\n registerOnChange(fn: (value: string) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n handleInput(event: Event): void {\n this.value = (event.target as HTMLTextAreaElement).value;\n this.onChange(this.value);\n }\n\n handleBlur(): void {\n this.onTouched();\n }\n}\n","<textarea\n [id]=\"id\"\n [value]=\"value\"\n [placeholder]=\"placeholder\"\n [rows]=\"rows\"\n [attr.maxlength]=\"maxLength ?? null\"\n [attr.aria-describedby]=\"describedBy || null\"\n [attr.aria-invalid]=\"invalid ? 'true' : null\"\n [required]=\"required\"\n [disabled]=\"disabled\"\n (input)=\"handleInput($event)\"\n (blur)=\"handleBlur()\"\n></textarea>\n@if (showCounter && maxLength) {\n <span class=\"form-textarea-counter\" aria-live=\"polite\">\n {{ value.length }} / {{ maxLength }}\n </span>\n}\n","import { Component, forwardRef, Input } from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\n\n@Component({\n selector: 'lib-form-toggle',\n standalone: true,\n templateUrl: './form-toggle.component.html',\n styleUrl: './form-toggle.component.scss',\n providers: [\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: forwardRef(() => FormToggleComponent),\n multi: true,\n },\n ],\n})\nexport class FormToggleComponent implements ControlValueAccessor {\n @Input({ required: true }) id = '';\n @Input() describedBy = '';\n\n checked = false;\n disabled = false;\n private onChange: (value: boolean) => void = () => {};\n private onTouched: () => void = () => {};\n\n writeValue(value: boolean | null): void {\n this.checked = value ?? false;\n }\n\n registerOnChange(fn: (value: boolean) => void): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n setDisabledState(disabled: boolean): void {\n this.disabled = disabled;\n }\n\n handleChange(event: Event): void {\n this.checked = (event.target as HTMLInputElement).checked;\n this.onChange(this.checked);\n }\n\n handleBlur(): void {\n this.onTouched();\n }\n}\n","<label class=\"form-toggle\" [for]=\"id\">\n <input\n [id]=\"id\"\n type=\"checkbox\"\n role=\"switch\"\n [checked]=\"checked\"\n [attr.aria-describedby]=\"describedBy || null\"\n [disabled]=\"disabled\"\n (change)=\"handleChange($event)\"\n (blur)=\"handleBlur()\"\n />\n <span class=\"form-toggle-track\" aria-hidden=\"true\"><span></span></span>\n <span class=\"form-toggle-label\"><ng-content /></span>\n</label>\n"],"mappings":"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"}
|
|
@@ -25,6 +25,10 @@ const mapContactMinimal = (props, cdn) => ({
|
|
|
25
25
|
socials: mapButtons(props?.items?.[1]?.buttons),
|
|
26
26
|
img: mapImage(props?.multimedia?.image, cdn)
|
|
27
27
|
});
|
|
28
|
+
const mapContactForm = (props, cdn) => ({
|
|
29
|
+
...props,
|
|
30
|
+
img: mapImage(props?.multimedia?.image, cdn)
|
|
31
|
+
});
|
|
28
32
|
const mapNavModal = (navigation, lang) => {
|
|
29
33
|
if (!navigation?.items || !Array.isArray(navigation.items)) return [];
|
|
30
34
|
return navigation.items.map((item) => {
|
|
@@ -207,6 +211,7 @@ const componentMappers = {
|
|
|
207
211
|
"not-found": map404,
|
|
208
212
|
"split-previewer": mapSplitPreviewer,
|
|
209
213
|
"contact-minimal": mapContactMinimal,
|
|
214
|
+
"contact-form": mapContactForm,
|
|
210
215
|
"media-split": mapMediaSplit,
|
|
211
216
|
"stacked-rows": mapStackedRows,
|
|
212
217
|
"mosaic-parallax": mapMosaicParallax,
|
|
@@ -285,6 +290,6 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
285
290
|
}]
|
|
286
291
|
});
|
|
287
292
|
const CLOUDINARY_CLOUD_NAME = new InjectionToken("CLOUDINARY_CLOUD_NAME");
|
|
288
|
-
export { CDN_BASE_URL, CLOUDINARY_CLOUD_NAME, MapperService, componentMappers, map404, mapAsymmetricMedia, mapCategoryProgress, mapColumnsFooter, mapColumnsMediaStacked, mapContactMinimal, mapContentDocument, mapHeaderClear, mapHeroSection, mapLangModal, mapLegalFooter, mapLinksFooter, mapMediaIntro, mapMediaSplit, mapMosaicGrid, mapMosaicParallax, mapNavModal, mapSectionIntro, mapSocialFooter, mapSocialLinks, mapSplitPreviewer, mapSplitShowcase, mapStackedRows, mapVisualFooter };
|
|
293
|
+
export { CDN_BASE_URL, CLOUDINARY_CLOUD_NAME, MapperService, componentMappers, map404, mapAsymmetricMedia, mapCategoryProgress, mapColumnsFooter, mapColumnsMediaStacked, mapContactForm, mapContactMinimal, mapContentDocument, mapHeaderClear, mapHeroSection, mapLangModal, mapLegalFooter, mapLinksFooter, mapMediaIntro, mapMediaSplit, mapMosaicGrid, mapMosaicParallax, mapNavModal, mapSectionIntro, mapSocialFooter, mapSocialLinks, mapSplitPreviewer, mapSplitShowcase, mapStackedRows, mapVisualFooter };
|
|
289
294
|
|
|
290
295
|
//# sourceMappingURL=lluc_llull-ui-lib-mapper.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"lluc_llull-ui-lib-mapper.mjs","names":[],"sources":["../../../projects/ui-lib/mapper/component-mappers/404.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/category-progress.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/contact-minimal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/nav-modal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/header-clear.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/hero-section.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/lang-modal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/legal-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/links-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/section-intro.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/social-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/split-previewer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/visual-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/media-split.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/stacked-rows.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/mosaic-parallax.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/content-document.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/columns-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/split-showcase.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/asymmetric-media.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/media-intro.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/columns-media-stacked.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/mosaic-grid.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/index.ts","../../../projects/ui-lib/mapper/cdn.token.ts","../../../projects/ui-lib/mapper/mapper.service.ts","../../../projects/ui-lib/mapper/cloudinary.token.ts"],"sourcesContent":["import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const map404: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n highlight: props?.texts?.highlight,\n button: mapButtons(props?.buttons)[0],\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapCategoryProgress: ComponentMapperFn = (props) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n categories: props?.items?.map((item: any) => ({\n title: item.title,\n items: item.items?.map((subItem: any) => ({\n label: subItem.name,\n value: subItem.progress,\n })),\n })),\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapContactMinimal: ComponentMapperFn = (props, cdn) => ({\n contactsTitle: props?.texts?.contactsTitle,\n socialsTitle: props?.texts?.socialsTitle,\n contacts: mapButtons(props?.items?.[0]?.buttons),\n socials: mapButtons(props?.items?.[1]?.buttons),\n img: mapImage(props?.multimedia?.image, cdn),\n});\n","import { UiLibNavItemsI, UiLibSocialItemsI } from '@lluc_llull/ui-lib/interfaces';\n\nexport const mapNavModal = (navigation: any, lang: string): UiLibNavItemsI[] => {\n if (!navigation?.items || !Array.isArray(navigation.items)) return [];\n\n return navigation.items.map((item: any) => {\n const slug = item.slug;\n\n const url = slug === 'home' || slug === '' ? `/${lang}` : `/${lang}/${slug}`;\n\n return {\n label: item.label?.[lang] ?? item.label?.['es'] ?? slug,\n url,\n linkType: 'internal',\n name: slug,\n active: true,\n children: [],\n };\n });\n};\n\nexport const mapSocialLinks = (navigation: any): UiLibSocialItemsI[] => {\n if (!navigation?.social || !Array.isArray(navigation.social)) return [];\n\n return navigation.social.map((item: any, index: number) => ({\n label: item.label ?? '',\n url: item.url ?? '',\n linkType: item.linkType ?? 'external',\n icon: item.icon ?? '',\n order: item.order ?? index,\n }));\n};\n","import { mapImage, mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { mapSocialLinks } from './nav-modal.mapper';\nimport { ComponentMapperFn } from './types';\n\nexport const mapHeaderClear: ComponentMapperFn = (props, cdn) => {\n return {\n logo: mapImage(props?.logo, cdn),\n logoDark: mapImage(props?.logoDark, cdn),\n lang: props?.lang || 'es',\n navigation: props?.navigation,\n socialItems: mapSocialLinks(props?.navigation),\n homeLink: mapButtons(props?.buttons)[0],\n };\n};\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapHeroSection: ComponentMapperFn = (props, cdn) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n text: props?.texts?.text,\n buttons: mapButtons(props?.buttons),\n highlight: props?.texts?.highlight,\n variant: props?.variant,\n image: mapImage(props?.multimedia?.image, cdn),\n});\n","import { UiLibLangItemI } from '@lluc_llull/ui-lib/interfaces';\n\nexport const mapLangModal = (langs: any[], currentLang: string = 'es'): UiLibLangItemI[] => {\n if (!Array.isArray(langs)) return [];\n\n return langs.map((lang, index) => {\n const label = lang.labels?.[currentLang] || lang.labels?.[lang.code] || lang.code;\n\n return {\n id: lang.id ?? index,\n code: lang.code,\n label,\n };\n });\n};\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapLegalFooter: ComponentMapperFn = (props) => ({\n year: props?.texts?.year,\n brand: props?.texts?.brand,\n credits: props?.texts?.credits,\n links: mapButtons(props?.footer_links),\n //variant\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapLinksFooter: ComponentMapperFn = (props) => ({\n links: mapButtons(props?.footer_links),\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSectionIntro: ComponentMapperFn = (props) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n text: props?.texts?.text,\n button: mapButtons(props?.buttons)[0],\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSocialFooter: ComponentMapperFn = (props) => ({\n images: mapImage(props?.multimedia),\n socials: mapButtons(props?.social_links),\n hashtag: props?.texts?.hashtag,\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSplitPreviewer: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n items: props?.items?.map((item: any) => ({\n title: item.title,\n description: item.description,\n tags: item.tags,\n link: mapButtons(item?.buttons)[0],\n image: mapImage(item?.multimedia?.image, cdn),\n })),\n imageDefault: mapImage(props?.multimedia?.image, cdn),\n direction: props?.direction ?? 'left',\n});\n","import { UiLibAddressI } from '@lluc_llull/ui-lib/interfaces';\nimport { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapVisualFooter: ComponentMapperFn = (props) => ({\n contactTitle: props?.texts?.contactTitle,\n contactPhone: mapButtons(props?.contactPhone),\n contactEmail: mapButtons(props?.contactEmail),\n addressTitle: props?.texts?.addressTitle,\n address: {\n address: props?.address?.address,\n city: props?.address?.city,\n country: props?.address?.country,\n cp: props?.address?.cp,\n province: props?.address?.province,\n } as UiLibAddressI,\n socialsTitle: props?.texts?.socialsTitle,\n socials: mapButtons(props?.social_links),\n image: mapImage(props?.multimedia),\n});\n","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMediaSplit: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapStackedRows: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n items: props?.items?.map((item: any) => ({\n title: item?.title,\n text: item?.text,\n })),\n});\n","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMosaicParallax: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapContentDocument: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n items: props?.items?.map((item: any) => ({\n title: item?.title,\n text: item?.text,\n })),\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapColumnsFooter: ComponentMapperFn = (props) => ({\n columns: props?.columns?.map((col: any) => ({\n title: col?.texts?.title,\n items: mapButtons(col?.buttons),\n })),\n copyright: {\n year: props?.copyright?.texts?.year,\n name: props?.copyright?.texts?.name,\n rights: props?.copyright?.texts?.rights,\n },\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSplitShowcase: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n description: props?.texts?.description,\n metas: props?.meta?.map((item: any) => ({\n label: item?.label,\n value: item?.value,\n })),\n buttons: mapButtons(props?.buttons)\n});","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapAsymmetricMedia: ComponentMapperFn = (props, cdn) => ({\n media: mapImageOrGallery(props?.multimedia?.images, cdn),\n direction: props?.direction ?? 'left',\n});","import { mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMediaIntro: ComponentMapperFn = (props, cdn) => ({\n highlightedText: props?.texts?.highlightedText,\n secondaryText: props?.texts?.secondaryText,\n direction: props?.direction ?? 'left',\n media: mapImage(props?.multimedia?.image, cdn),\n});","import { mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapColumnsMediaStacked: ComponentMapperFn = (props, cdn) => ({\n leftColumn: props?.texts?.leftColumn,\n rightColumn: props?.texts?.rightColumn,\n direction: props?.direction ?? 'left',\n image: mapImage(props?.multimedia?.image, cdn),\n});","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMosaicGrid: ComponentMapperFn = (props, cdn) => ({\n text: props?.texts?.editorialText,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","export * from './404.mapper';\nexport * from './category-progress.mapper';\nexport * from './contact-minimal.mapper';\nexport * from './header-clear.mapper';\nexport * from './hero-section.mapper';\nexport * from './lang-modal.mapper';\nexport * from './legal-footer.mapper';\nexport * from './links-footer.mapper';\nexport * from './nav-modal.mapper';\nexport * from './section-intro.mapper';\nexport * from './social-footer.mapper';\nexport * from './split-previewer.mapper';\nexport * from './visual-footer.mapper';\nexport * from './media-split.mapper';\nexport * from './stacked-rows.mapper';\nexport * from './mosaic-parallax.mapper';\nexport * from './content-document.mapper';\nexport * from './columns-footer.mapper';\nexport * from './split-showcase.mapper';\nexport * from './asymmetric-media.mapper';\nexport * from './media-intro.mapper';\nexport * from './columns-media-stacked.mapper';\nexport * from './mosaic-grid.mapper';\n\nimport { map404 } from './404.mapper';\nimport { mapCategoryProgress } from './category-progress.mapper';\nimport { mapContactMinimal } from './contact-minimal.mapper';\nimport { mapHeaderClear } from './header-clear.mapper';\nimport { mapHeroSection } from './hero-section.mapper';\nimport { mapLangModal } from './lang-modal.mapper';\nimport { mapLegalFooter } from './legal-footer.mapper';\nimport { mapLinksFooter } from './links-footer.mapper';\nimport { mapMediaSplit } from './media-split.mapper';\nimport { mapSectionIntro } from './section-intro.mapper';\nimport { mapSocialFooter } from './social-footer.mapper';\nimport { mapSplitPreviewer } from './split-previewer.mapper';\nimport { mapStackedRows } from './stacked-rows.mapper';\nimport { mapVisualFooter } from './visual-footer.mapper';\nimport { mapMosaicParallax } from './mosaic-parallax.mapper';\nimport { mapContentDocument } from './content-document.mapper';\nimport { mapColumnsFooter } from './columns-footer.mapper';\nimport { mapSplitShowcase } from './split-showcase.mapper';\nimport { mapAsymmetricMedia } from './asymmetric-media.mapper';\nimport { mapMediaIntro } from './media-intro.mapper';\nimport { mapColumnsMediaStacked } from './columns-media-stacked.mapper';\nimport { mapMosaicGrid } from './mosaic-grid.mapper';\n\nexport const componentMappers: Record<string, (props: any, cdn?: string) => any> = {\n 'hero-section': mapHeroSection,\n 'header-clear': mapHeaderClear,\n 'lang-modal': mapLangModal,\n 'section-intro': mapSectionIntro,\n 'category-progress': mapCategoryProgress,\n 'links-footer': mapLinksFooter,\n 'legal-footer': mapLegalFooter,\n 'social-footer': mapSocialFooter,\n 'visual-footer': mapVisualFooter,\n 'not-found': map404,\n 'split-previewer': mapSplitPreviewer,\n 'contact-minimal': mapContactMinimal,\n 'media-split': mapMediaSplit,\n 'stacked-rows': mapStackedRows,\n 'mosaic-parallax': mapMosaicParallax,\n 'content-document': mapContentDocument,\n 'columns-footer': mapColumnsFooter,\n 'split-showcase': mapSplitShowcase,\n 'asymmetric-media': mapAsymmetricMedia,\n 'media-intro': mapMediaIntro,\n 'columns-media-stacked': mapColumnsMediaStacked,\n 'mosaic-grid': mapMosaicGrid,\n};\n","import { InjectionToken } from '@angular/core';\n\nexport const CDN_BASE_URL = new InjectionToken<string>('CDN_BASE_URL');","import { Inject, Injectable, PLATFORM_ID } from '@angular/core';\nimport { BodyComponent } from '@lluc_llull/ui-lib/interfaces';\nimport { CDN_BASE_URL } from './cdn.token';\nimport { componentMappers } from './component-mappers';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class MapperService {\n\n constructor(@Inject(PLATFORM_ID) private readonly platformId: Object, @Inject(CDN_BASE_URL) private readonly cdn: string) {}\n\n mapComponents<T>(body: any[]): BodyComponent<T>[] {\n if (!body || body.length === 0) {\n return [];\n }\n\n return body\n .filter((component) => component && component.name && component.props)\n .map((component) => {\n const name = component.name.toLowerCase();\n const mapper = componentMappers[name];\n\n const mapped: BodyComponent<T> = {\n name,\n order: component.order,\n props: {} as T,\n };\n\n if (mapper) {\n try {\n mapped.props = mapper(component.props, this.cdn) as T;\n } catch (e) {\n console.error(`Error mapping props for component \"${name}\"`, e);\n }\n } else {\n console.warn(`No mapper found for component \"${name}\"`);\n }\n\n return mapped;\n });\n }\n}\n","import { InjectionToken } from '@angular/core';\n\nexport const CLOUDINARY_CLOUD_NAME = new InjectionToken<string>('CLOUDINARY_CLOUD_NAME');\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"lluc_llull-ui-lib-mapper.mjs","names":[],"sources":["../../../projects/ui-lib/mapper/component-mappers/404.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/category-progress.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/contact-minimal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/contact-form.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/nav-modal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/header-clear.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/hero-section.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/lang-modal.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/legal-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/links-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/section-intro.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/social-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/split-previewer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/visual-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/media-split.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/stacked-rows.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/mosaic-parallax.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/content-document.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/columns-footer.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/split-showcase.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/asymmetric-media.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/media-intro.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/columns-media-stacked.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/mosaic-grid.mapper.ts","../../../projects/ui-lib/mapper/component-mappers/index.ts","../../../projects/ui-lib/mapper/cdn.token.ts","../../../projects/ui-lib/mapper/mapper.service.ts","../../../projects/ui-lib/mapper/cloudinary.token.ts"],"sourcesContent":["import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const map404: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n highlight: props?.texts?.highlight,\n button: mapButtons(props?.buttons)[0],\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapCategoryProgress: ComponentMapperFn = (props) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n categories: props?.items?.map((item: any) => ({\n title: item.title,\n items: item.items?.map((subItem: any) => ({\n label: subItem.name,\n value: subItem.progress,\n })),\n })),\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapContactMinimal: ComponentMapperFn = (props, cdn) => ({\n contactsTitle: props?.texts?.contactsTitle,\n socialsTitle: props?.texts?.socialsTitle,\n contacts: mapButtons(props?.items?.[0]?.buttons),\n socials: mapButtons(props?.items?.[1]?.buttons),\n img: mapImage(props?.multimedia?.image, cdn),\n});\n","import { mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapContactForm: ComponentMapperFn = (props, cdn) => ({\n ...props,\n img: mapImage(props?.multimedia?.image, cdn),\n});\n","import { UiLibNavItemsI, UiLibSocialItemsI } from '@lluc_llull/ui-lib/interfaces';\n\nexport const mapNavModal = (navigation: any, lang: string): UiLibNavItemsI[] => {\n if (!navigation?.items || !Array.isArray(navigation.items)) return [];\n\n return navigation.items.map((item: any) => {\n const slug = item.slug;\n\n const url = slug === 'home' || slug === '' ? `/${lang}` : `/${lang}/${slug}`;\n\n return {\n label: item.label?.[lang] ?? item.label?.['es'] ?? slug,\n url,\n linkType: 'internal',\n name: slug,\n active: true,\n children: [],\n };\n });\n};\n\nexport const mapSocialLinks = (navigation: any): UiLibSocialItemsI[] => {\n if (!navigation?.social || !Array.isArray(navigation.social)) return [];\n\n return navigation.social.map((item: any, index: number) => ({\n label: item.label ?? '',\n url: item.url ?? '',\n linkType: item.linkType ?? 'external',\n icon: item.icon ?? '',\n order: item.order ?? index,\n }));\n};\n","import { mapImage, mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { mapSocialLinks } from './nav-modal.mapper';\nimport { ComponentMapperFn } from './types';\n\nexport const mapHeaderClear: ComponentMapperFn = (props, cdn) => {\n return {\n logo: mapImage(props?.logo, cdn),\n logoDark: mapImage(props?.logoDark, cdn),\n lang: props?.lang || 'es',\n navigation: props?.navigation,\n socialItems: mapSocialLinks(props?.navigation),\n homeLink: mapButtons(props?.buttons)[0],\n };\n};\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapHeroSection: ComponentMapperFn = (props, cdn) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n text: props?.texts?.text,\n buttons: mapButtons(props?.buttons),\n highlight: props?.texts?.highlight,\n variant: props?.variant,\n image: mapImage(props?.multimedia?.image, cdn),\n});\n","import { UiLibLangItemI } from '@lluc_llull/ui-lib/interfaces';\n\nexport const mapLangModal = (langs: any[], currentLang: string = 'es'): UiLibLangItemI[] => {\n if (!Array.isArray(langs)) return [];\n\n return langs.map((lang, index) => {\n const label = lang.labels?.[currentLang] || lang.labels?.[lang.code] || lang.code;\n\n return {\n id: lang.id ?? index,\n code: lang.code,\n label,\n };\n });\n};\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapLegalFooter: ComponentMapperFn = (props) => ({\n year: props?.texts?.year,\n brand: props?.texts?.brand,\n credits: props?.texts?.credits,\n links: mapButtons(props?.footer_links),\n //variant\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapLinksFooter: ComponentMapperFn = (props) => ({\n links: mapButtons(props?.footer_links),\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSectionIntro: ComponentMapperFn = (props) => ({\n pretitle: props?.texts?.pretitle,\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n text: props?.texts?.text,\n button: mapButtons(props?.buttons)[0],\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSocialFooter: ComponentMapperFn = (props) => ({\n images: mapImage(props?.multimedia),\n socials: mapButtons(props?.social_links),\n hashtag: props?.texts?.hashtag,\n});\n","import { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSplitPreviewer: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n items: props?.items?.map((item: any) => ({\n title: item.title,\n description: item.description,\n tags: item.tags,\n link: mapButtons(item?.buttons)[0],\n image: mapImage(item?.multimedia?.image, cdn),\n })),\n imageDefault: mapImage(props?.multimedia?.image, cdn),\n direction: props?.direction ?? 'left',\n});\n","import { UiLibAddressI } from '@lluc_llull/ui-lib/interfaces';\nimport { mapButtons, mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapVisualFooter: ComponentMapperFn = (props) => ({\n contactTitle: props?.texts?.contactTitle,\n contactPhone: mapButtons(props?.contactPhone),\n contactEmail: mapButtons(props?.contactEmail),\n addressTitle: props?.texts?.addressTitle,\n address: {\n address: props?.address?.address,\n city: props?.address?.city,\n country: props?.address?.country,\n cp: props?.address?.cp,\n province: props?.address?.province,\n } as UiLibAddressI,\n socialsTitle: props?.texts?.socialsTitle,\n socials: mapButtons(props?.social_links),\n image: mapImage(props?.multimedia),\n});\n","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMediaSplit: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapStackedRows: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n items: props?.items?.map((item: any) => ({\n title: item?.title,\n text: item?.text,\n })),\n});\n","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMosaicParallax: ComponentMapperFn = (props, cdn) => ({\n title: props?.texts?.title,\n text: props?.texts?.text,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","import { ComponentMapperFn } from './types';\n\nexport const mapContentDocument: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n items: props?.items?.map((item: any) => ({\n title: item?.title,\n text: item?.text,\n })),\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapColumnsFooter: ComponentMapperFn = (props) => ({\n columns: props?.columns?.map((col: any) => ({\n title: col?.texts?.title,\n items: mapButtons(col?.buttons),\n })),\n copyright: {\n year: props?.copyright?.texts?.year,\n name: props?.copyright?.texts?.name,\n rights: props?.copyright?.texts?.rights,\n },\n});\n","import { mapButtons } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapSplitShowcase: ComponentMapperFn = (props) => ({\n title: props?.texts?.title,\n subtitle: props?.texts?.subtitle,\n description: props?.texts?.description,\n metas: props?.meta?.map((item: any) => ({\n label: item?.label,\n value: item?.value,\n })),\n buttons: mapButtons(props?.buttons)\n});","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapAsymmetricMedia: ComponentMapperFn = (props, cdn) => ({\n media: mapImageOrGallery(props?.multimedia?.images, cdn),\n direction: props?.direction ?? 'left',\n});","import { mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMediaIntro: ComponentMapperFn = (props, cdn) => ({\n highlightedText: props?.texts?.highlightedText,\n secondaryText: props?.texts?.secondaryText,\n direction: props?.direction ?? 'left',\n media: mapImage(props?.multimedia?.image, cdn),\n});","import { mapImage } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapColumnsMediaStacked: ComponentMapperFn = (props, cdn) => ({\n leftColumn: props?.texts?.leftColumn,\n rightColumn: props?.texts?.rightColumn,\n direction: props?.direction ?? 'left',\n image: mapImage(props?.multimedia?.image, cdn),\n});","import { mapImageOrGallery } from '@lluc_llull/ui-lib/utils';\nimport { ComponentMapperFn } from './types';\n\nexport const mapMosaicGrid: ComponentMapperFn = (props, cdn) => ({\n text: props?.texts?.editorialText,\n images: mapImageOrGallery(props?.multimedia?.images, cdn),\n});\n","export * from './404.mapper';\nexport * from './category-progress.mapper';\nexport * from './contact-minimal.mapper';\nexport * from './contact-form.mapper';\nexport * from './header-clear.mapper';\nexport * from './hero-section.mapper';\nexport * from './lang-modal.mapper';\nexport * from './legal-footer.mapper';\nexport * from './links-footer.mapper';\nexport * from './nav-modal.mapper';\nexport * from './section-intro.mapper';\nexport * from './social-footer.mapper';\nexport * from './split-previewer.mapper';\nexport * from './visual-footer.mapper';\nexport * from './media-split.mapper';\nexport * from './stacked-rows.mapper';\nexport * from './mosaic-parallax.mapper';\nexport * from './content-document.mapper';\nexport * from './columns-footer.mapper';\nexport * from './split-showcase.mapper';\nexport * from './asymmetric-media.mapper';\nexport * from './media-intro.mapper';\nexport * from './columns-media-stacked.mapper';\nexport * from './mosaic-grid.mapper';\n\nimport { map404 } from './404.mapper';\nimport { mapCategoryProgress } from './category-progress.mapper';\nimport { mapContactMinimal } from './contact-minimal.mapper';\nimport { mapContactForm } from './contact-form.mapper';\nimport { mapHeaderClear } from './header-clear.mapper';\nimport { mapHeroSection } from './hero-section.mapper';\nimport { mapLangModal } from './lang-modal.mapper';\nimport { mapLegalFooter } from './legal-footer.mapper';\nimport { mapLinksFooter } from './links-footer.mapper';\nimport { mapMediaSplit } from './media-split.mapper';\nimport { mapSectionIntro } from './section-intro.mapper';\nimport { mapSocialFooter } from './social-footer.mapper';\nimport { mapSplitPreviewer } from './split-previewer.mapper';\nimport { mapStackedRows } from './stacked-rows.mapper';\nimport { mapVisualFooter } from './visual-footer.mapper';\nimport { mapMosaicParallax } from './mosaic-parallax.mapper';\nimport { mapContentDocument } from './content-document.mapper';\nimport { mapColumnsFooter } from './columns-footer.mapper';\nimport { mapSplitShowcase } from './split-showcase.mapper';\nimport { mapAsymmetricMedia } from './asymmetric-media.mapper';\nimport { mapMediaIntro } from './media-intro.mapper';\nimport { mapColumnsMediaStacked } from './columns-media-stacked.mapper';\nimport { mapMosaicGrid } from './mosaic-grid.mapper';\n\nexport const componentMappers: Record<string, (props: any, cdn?: string) => any> = {\n 'hero-section': mapHeroSection,\n 'header-clear': mapHeaderClear,\n 'lang-modal': mapLangModal,\n 'section-intro': mapSectionIntro,\n 'category-progress': mapCategoryProgress,\n 'links-footer': mapLinksFooter,\n 'legal-footer': mapLegalFooter,\n 'social-footer': mapSocialFooter,\n 'visual-footer': mapVisualFooter,\n 'not-found': map404,\n 'split-previewer': mapSplitPreviewer,\n 'contact-minimal': mapContactMinimal,\n 'contact-form': mapContactForm,\n 'media-split': mapMediaSplit,\n 'stacked-rows': mapStackedRows,\n 'mosaic-parallax': mapMosaicParallax,\n 'content-document': mapContentDocument,\n 'columns-footer': mapColumnsFooter,\n 'split-showcase': mapSplitShowcase,\n 'asymmetric-media': mapAsymmetricMedia,\n 'media-intro': mapMediaIntro,\n 'columns-media-stacked': mapColumnsMediaStacked,\n 'mosaic-grid': mapMosaicGrid,\n};\n","import { InjectionToken } from '@angular/core';\n\nexport const CDN_BASE_URL = new InjectionToken<string>('CDN_BASE_URL');","import { Inject, Injectable, PLATFORM_ID } from '@angular/core';\nimport { BodyComponent } from '@lluc_llull/ui-lib/interfaces';\nimport { CDN_BASE_URL } from './cdn.token';\nimport { componentMappers } from './component-mappers';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class MapperService {\n\n constructor(@Inject(PLATFORM_ID) private readonly platformId: Object, @Inject(CDN_BASE_URL) private readonly cdn: string) {}\n\n mapComponents<T>(body: any[]): BodyComponent<T>[] {\n if (!body || body.length === 0) {\n return [];\n }\n\n return body\n .filter((component) => component && component.name && component.props)\n .map((component) => {\n const name = component.name.toLowerCase();\n const mapper = componentMappers[name];\n\n const mapped: BodyComponent<T> = {\n name,\n order: component.order,\n props: {} as T,\n };\n\n if (mapper) {\n try {\n mapped.props = mapper(component.props, this.cdn) as T;\n } catch (e) {\n console.error(`Error mapping props for component \"${name}\"`, e);\n }\n } else {\n console.warn(`No mapper found for component \"${name}\"`);\n }\n\n return mapped;\n });\n }\n}\n","import { InjectionToken } from '@angular/core';\n\nexport const CLOUDINARY_CLOUD_NAME = new InjectionToken<string>('CLOUDINARY_CLOUD_NAME');\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lluc_llull/ui-lib",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.36.0",
|
|
4
4
|
"description": "Angular UI component library",
|
|
5
5
|
"author": "lluc_llull",
|
|
6
6
|
"license": "MIT",
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
"peerDependencies": {
|
|
15
15
|
"@angular/common": "^22.0.0",
|
|
16
16
|
"@angular/core": "^22.0.0",
|
|
17
|
+
"@angular/forms": "^22.0.0",
|
|
17
18
|
"lucide-angular": "^0.577.0",
|
|
18
19
|
"swiper": "^12.0.0",
|
|
19
20
|
"three": "^0.183.0",
|
|
@@ -147,6 +148,14 @@
|
|
|
147
148
|
"types": "./types/lluc_llull-ui-lib-footers-visual-footer.d.ts",
|
|
148
149
|
"default": "./fesm2022/lluc_llull-ui-lib-footers-visual-footer.mjs"
|
|
149
150
|
},
|
|
151
|
+
"./forms": {
|
|
152
|
+
"types": "./types/lluc_llull-ui-lib-forms.d.ts",
|
|
153
|
+
"default": "./fesm2022/lluc_llull-ui-lib-forms.mjs"
|
|
154
|
+
},
|
|
155
|
+
"./forms/contact-form": {
|
|
156
|
+
"types": "./types/lluc_llull-ui-lib-forms-contact-form.d.ts",
|
|
157
|
+
"default": "./fesm2022/lluc_llull-ui-lib-forms-contact-form.mjs"
|
|
158
|
+
},
|
|
150
159
|
"./headers": {
|
|
151
160
|
"types": "./types/lluc_llull-ui-lib-headers.d.ts",
|
|
152
161
|
"default": "./fesm2022/lluc_llull-ui-lib-headers.mjs"
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { EventEmitter } from "@angular/core";
|
|
3
|
+
import { FormControl, FormGroup } from "@angular/forms";
|
|
4
|
+
import { UiLibImageI } from "@lluc_llull/ui-lib/interfaces";
|
|
5
|
+
export interface ContactFormTextsI {
|
|
6
|
+
title: string;
|
|
7
|
+
intro: string;
|
|
8
|
+
requiredHint: string;
|
|
9
|
+
name: string;
|
|
10
|
+
surname: string;
|
|
11
|
+
email: string;
|
|
12
|
+
phone: string;
|
|
13
|
+
message: string;
|
|
14
|
+
namePlaceholder: string;
|
|
15
|
+
surnamePlaceholder: string;
|
|
16
|
+
emailPlaceholder: string;
|
|
17
|
+
phonePlaceholder: string;
|
|
18
|
+
messagePlaceholder: string;
|
|
19
|
+
privacyTitle: string;
|
|
20
|
+
privacyResponsible: string;
|
|
21
|
+
privacyPurpose: string;
|
|
22
|
+
privacyLegalBasis: string;
|
|
23
|
+
privacyRecipients: string;
|
|
24
|
+
privacyRetention: string;
|
|
25
|
+
privacyRights: string;
|
|
26
|
+
privacyLinkLead: string;
|
|
27
|
+
privacyLink: string;
|
|
28
|
+
privacyLinkTail: string;
|
|
29
|
+
send: string;
|
|
30
|
+
sending: string;
|
|
31
|
+
success: string;
|
|
32
|
+
error: string;
|
|
33
|
+
deliveryNotConfigured: string;
|
|
34
|
+
requiredError: string;
|
|
35
|
+
emailError: string;
|
|
36
|
+
lengthError: string;
|
|
37
|
+
invalidError: string;
|
|
38
|
+
}
|
|
39
|
+
export interface ContactFormSubmissionI {
|
|
40
|
+
name: string;
|
|
41
|
+
surname: string;
|
|
42
|
+
email: string;
|
|
43
|
+
phone: string;
|
|
44
|
+
message: string;
|
|
45
|
+
website: string;
|
|
46
|
+
}
|
|
47
|
+
type ContactField = 'name' | 'email' | 'message';
|
|
48
|
+
type ContactFormStatus = 'idle' | 'sending' | 'success' | 'error';
|
|
49
|
+
export declare class ContactFormComponent {
|
|
50
|
+
texts: ContactFormTextsI;
|
|
51
|
+
privacyUrl: string;
|
|
52
|
+
img: UiLibImageI | null;
|
|
53
|
+
readonly messageSubmitted: EventEmitter<ContactFormSubmissionI>;
|
|
54
|
+
readonly status: import("@angular/core").WritableSignal<ContactFormStatus>;
|
|
55
|
+
readonly submissionError: import("@angular/core").WritableSignal<string>;
|
|
56
|
+
submitted: boolean;
|
|
57
|
+
readonly form: FormGroup<{
|
|
58
|
+
name: FormControl<string>;
|
|
59
|
+
surname: FormControl<string>;
|
|
60
|
+
email: FormControl<string>;
|
|
61
|
+
phone: FormControl<string>;
|
|
62
|
+
message: FormControl<string>;
|
|
63
|
+
website: FormControl<string>;
|
|
64
|
+
}>;
|
|
65
|
+
getError(field: ContactField): string;
|
|
66
|
+
submit(): void;
|
|
67
|
+
setSubmissionResult(success: boolean, errorMessage?: string): void;
|
|
68
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ContactFormComponent, never>;
|
|
69
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ContactFormComponent, "lib-contact-form", never, {
|
|
70
|
+
"texts": {
|
|
71
|
+
"alias": "texts";
|
|
72
|
+
"required": true;
|
|
73
|
+
};
|
|
74
|
+
"privacyUrl": {
|
|
75
|
+
"alias": "privacyUrl";
|
|
76
|
+
"required": false;
|
|
77
|
+
};
|
|
78
|
+
"img": {
|
|
79
|
+
"alias": "img";
|
|
80
|
+
"required": false;
|
|
81
|
+
};
|
|
82
|
+
}, {
|
|
83
|
+
"messageSubmitted": "messageSubmitted";
|
|
84
|
+
}, never, never, true, never>;
|
|
85
|
+
}
|
|
86
|
+
export {};
|
|
@@ -0,0 +1,220 @@
|
|
|
1
|
+
import * as i0 from "@angular/core";
|
|
2
|
+
import { ControlValueAccessor } from "@angular/forms";
|
|
3
|
+
export declare class FormFieldComponent {
|
|
4
|
+
controlId: string;
|
|
5
|
+
label: string;
|
|
6
|
+
required: boolean;
|
|
7
|
+
hint: string;
|
|
8
|
+
error: string;
|
|
9
|
+
get errorId(): string;
|
|
10
|
+
get hintId(): string;
|
|
11
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<FormFieldComponent, never>;
|
|
12
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FormFieldComponent, "lib-form-field", never, {
|
|
13
|
+
"controlId": {
|
|
14
|
+
"alias": "controlId";
|
|
15
|
+
"required": true;
|
|
16
|
+
};
|
|
17
|
+
"label": {
|
|
18
|
+
"alias": "label";
|
|
19
|
+
"required": false;
|
|
20
|
+
};
|
|
21
|
+
"required": {
|
|
22
|
+
"alias": "required";
|
|
23
|
+
"required": false;
|
|
24
|
+
};
|
|
25
|
+
"hint": {
|
|
26
|
+
"alias": "hint";
|
|
27
|
+
"required": false;
|
|
28
|
+
};
|
|
29
|
+
"error": {
|
|
30
|
+
"alias": "error";
|
|
31
|
+
"required": false;
|
|
32
|
+
};
|
|
33
|
+
}, {}, never, ["*"], true, never>;
|
|
34
|
+
}
|
|
35
|
+
export type UiLibInputType = 'text' | 'email' | 'tel' | 'url' | 'search' | 'password';
|
|
36
|
+
export declare class FormInputComponent implements ControlValueAccessor {
|
|
37
|
+
id: string;
|
|
38
|
+
type: UiLibInputType;
|
|
39
|
+
placeholder: string;
|
|
40
|
+
autocomplete: string;
|
|
41
|
+
describedBy: string;
|
|
42
|
+
maxLength: number | null;
|
|
43
|
+
required: boolean;
|
|
44
|
+
invalid: boolean;
|
|
45
|
+
value: string;
|
|
46
|
+
disabled: boolean;
|
|
47
|
+
private onChange;
|
|
48
|
+
private onTouched;
|
|
49
|
+
writeValue(value: string | null): void;
|
|
50
|
+
registerOnChange(fn: (value: string) => void): void;
|
|
51
|
+
registerOnTouched(fn: () => void): void;
|
|
52
|
+
setDisabledState(disabled: boolean): void;
|
|
53
|
+
handleInput(event: Event): void;
|
|
54
|
+
handleBlur(): void;
|
|
55
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<FormInputComponent, never>;
|
|
56
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FormInputComponent, "lib-form-input", never, {
|
|
57
|
+
"id": {
|
|
58
|
+
"alias": "id";
|
|
59
|
+
"required": true;
|
|
60
|
+
};
|
|
61
|
+
"type": {
|
|
62
|
+
"alias": "type";
|
|
63
|
+
"required": false;
|
|
64
|
+
};
|
|
65
|
+
"placeholder": {
|
|
66
|
+
"alias": "placeholder";
|
|
67
|
+
"required": false;
|
|
68
|
+
};
|
|
69
|
+
"autocomplete": {
|
|
70
|
+
"alias": "autocomplete";
|
|
71
|
+
"required": false;
|
|
72
|
+
};
|
|
73
|
+
"describedBy": {
|
|
74
|
+
"alias": "describedBy";
|
|
75
|
+
"required": false;
|
|
76
|
+
};
|
|
77
|
+
"maxLength": {
|
|
78
|
+
"alias": "maxLength";
|
|
79
|
+
"required": false;
|
|
80
|
+
};
|
|
81
|
+
"required": {
|
|
82
|
+
"alias": "required";
|
|
83
|
+
"required": false;
|
|
84
|
+
};
|
|
85
|
+
"invalid": {
|
|
86
|
+
"alias": "invalid";
|
|
87
|
+
"required": false;
|
|
88
|
+
};
|
|
89
|
+
}, {}, never, never, true, never>;
|
|
90
|
+
}
|
|
91
|
+
export interface UiLibSelectOptionI {
|
|
92
|
+
label: string;
|
|
93
|
+
value: string;
|
|
94
|
+
disabled?: boolean;
|
|
95
|
+
}
|
|
96
|
+
export declare class FormSelectComponent implements ControlValueAccessor {
|
|
97
|
+
id: string;
|
|
98
|
+
options: UiLibSelectOptionI[];
|
|
99
|
+
placeholder: string;
|
|
100
|
+
describedBy: string;
|
|
101
|
+
required: boolean;
|
|
102
|
+
invalid: boolean;
|
|
103
|
+
value: string;
|
|
104
|
+
disabled: boolean;
|
|
105
|
+
private onChange;
|
|
106
|
+
private onTouched;
|
|
107
|
+
writeValue(value: string | null): void;
|
|
108
|
+
registerOnChange(fn: (value: string) => void): void;
|
|
109
|
+
registerOnTouched(fn: () => void): void;
|
|
110
|
+
setDisabledState(disabled: boolean): void;
|
|
111
|
+
handleChange(event: Event): void;
|
|
112
|
+
handleBlur(): void;
|
|
113
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<FormSelectComponent, never>;
|
|
114
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FormSelectComponent, "lib-form-select", never, {
|
|
115
|
+
"id": {
|
|
116
|
+
"alias": "id";
|
|
117
|
+
"required": true;
|
|
118
|
+
};
|
|
119
|
+
"options": {
|
|
120
|
+
"alias": "options";
|
|
121
|
+
"required": false;
|
|
122
|
+
};
|
|
123
|
+
"placeholder": {
|
|
124
|
+
"alias": "placeholder";
|
|
125
|
+
"required": false;
|
|
126
|
+
};
|
|
127
|
+
"describedBy": {
|
|
128
|
+
"alias": "describedBy";
|
|
129
|
+
"required": false;
|
|
130
|
+
};
|
|
131
|
+
"required": {
|
|
132
|
+
"alias": "required";
|
|
133
|
+
"required": false;
|
|
134
|
+
};
|
|
135
|
+
"invalid": {
|
|
136
|
+
"alias": "invalid";
|
|
137
|
+
"required": false;
|
|
138
|
+
};
|
|
139
|
+
}, {}, never, never, true, never>;
|
|
140
|
+
}
|
|
141
|
+
export declare class FormTextareaComponent implements ControlValueAccessor {
|
|
142
|
+
id: string;
|
|
143
|
+
placeholder: string;
|
|
144
|
+
describedBy: string;
|
|
145
|
+
rows: number;
|
|
146
|
+
maxLength: number | null;
|
|
147
|
+
required: boolean;
|
|
148
|
+
invalid: boolean;
|
|
149
|
+
showCounter: boolean;
|
|
150
|
+
value: string;
|
|
151
|
+
disabled: boolean;
|
|
152
|
+
private onChange;
|
|
153
|
+
private onTouched;
|
|
154
|
+
writeValue(value: string | null): void;
|
|
155
|
+
registerOnChange(fn: (value: string) => void): void;
|
|
156
|
+
registerOnTouched(fn: () => void): void;
|
|
157
|
+
setDisabledState(disabled: boolean): void;
|
|
158
|
+
handleInput(event: Event): void;
|
|
159
|
+
handleBlur(): void;
|
|
160
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<FormTextareaComponent, never>;
|
|
161
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FormTextareaComponent, "lib-form-textarea", never, {
|
|
162
|
+
"id": {
|
|
163
|
+
"alias": "id";
|
|
164
|
+
"required": true;
|
|
165
|
+
};
|
|
166
|
+
"placeholder": {
|
|
167
|
+
"alias": "placeholder";
|
|
168
|
+
"required": false;
|
|
169
|
+
};
|
|
170
|
+
"describedBy": {
|
|
171
|
+
"alias": "describedBy";
|
|
172
|
+
"required": false;
|
|
173
|
+
};
|
|
174
|
+
"rows": {
|
|
175
|
+
"alias": "rows";
|
|
176
|
+
"required": false;
|
|
177
|
+
};
|
|
178
|
+
"maxLength": {
|
|
179
|
+
"alias": "maxLength";
|
|
180
|
+
"required": false;
|
|
181
|
+
};
|
|
182
|
+
"required": {
|
|
183
|
+
"alias": "required";
|
|
184
|
+
"required": false;
|
|
185
|
+
};
|
|
186
|
+
"invalid": {
|
|
187
|
+
"alias": "invalid";
|
|
188
|
+
"required": false;
|
|
189
|
+
};
|
|
190
|
+
"showCounter": {
|
|
191
|
+
"alias": "showCounter";
|
|
192
|
+
"required": false;
|
|
193
|
+
};
|
|
194
|
+
}, {}, never, never, true, never>;
|
|
195
|
+
}
|
|
196
|
+
export declare class FormToggleComponent implements ControlValueAccessor {
|
|
197
|
+
id: string;
|
|
198
|
+
describedBy: string;
|
|
199
|
+
checked: boolean;
|
|
200
|
+
disabled: boolean;
|
|
201
|
+
private onChange;
|
|
202
|
+
private onTouched;
|
|
203
|
+
writeValue(value: boolean | null): void;
|
|
204
|
+
registerOnChange(fn: (value: boolean) => void): void;
|
|
205
|
+
registerOnTouched(fn: () => void): void;
|
|
206
|
+
setDisabledState(disabled: boolean): void;
|
|
207
|
+
handleChange(event: Event): void;
|
|
208
|
+
handleBlur(): void;
|
|
209
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<FormToggleComponent, never>;
|
|
210
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<FormToggleComponent, "lib-form-toggle", never, {
|
|
211
|
+
"id": {
|
|
212
|
+
"alias": "id";
|
|
213
|
+
"required": true;
|
|
214
|
+
};
|
|
215
|
+
"describedBy": {
|
|
216
|
+
"alias": "describedBy";
|
|
217
|
+
"required": false;
|
|
218
|
+
};
|
|
219
|
+
}, {}, never, ["*"], true, never>;
|
|
220
|
+
}
|
|
@@ -5,6 +5,7 @@ type ComponentMapperFn = (props: any, cdn?: string) => any;
|
|
|
5
5
|
export declare const map404: ComponentMapperFn;
|
|
6
6
|
export declare const mapCategoryProgress: ComponentMapperFn;
|
|
7
7
|
export declare const mapContactMinimal: ComponentMapperFn;
|
|
8
|
+
export declare const mapContactForm: ComponentMapperFn;
|
|
8
9
|
export declare const mapHeaderClear: ComponentMapperFn;
|
|
9
10
|
export declare const mapHeroSection: ComponentMapperFn;
|
|
10
11
|
export declare const mapLangModal: (langs: any[], currentLang?: string) => UiLibLangItemI[];
|