ngx-dsxlibrary 2.21.48 → 2.21.49
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/ngx-dsxlibrary-src-lib-components.mjs +41 -10
- package/fesm2022/ngx-dsxlibrary-src-lib-components.mjs.map +1 -1
- package/fesm2022/ngx-dsxlibrary-src-lib-primengdsx.mjs +61 -0
- package/fesm2022/ngx-dsxlibrary-src-lib-primengdsx.mjs.map +1 -0
- package/fesm2022/ngx-dsxlibrary.mjs +664 -62
- package/fesm2022/ngx-dsxlibrary.mjs.map +1 -1
- package/ngx-dsxlibrary-2.21.49.tgz +0 -0
- package/package.json +5 -1
- package/src/assets/css/primeng_dsx_fieldset.css +56 -0
- package/src/assets/css/{primeng_dsx.css → primeng_dsx_table.css} +10 -0
- package/types/ngx-dsxlibrary-src-lib-components.d.ts +6 -3
- package/types/ngx-dsxlibrary-src-lib-primengdsx.d.ts +20 -0
- package/types/ngx-dsxlibrary.d.ts +188 -18
- package/ngx-dsxlibrary-2.21.48.tgz +0 -0
|
@@ -127,12 +127,18 @@ class AppMessageErrorComponent {
|
|
|
127
127
|
}
|
|
128
128
|
return this.defaultFloatLabelErrorSpace;
|
|
129
129
|
}
|
|
130
|
+
formatNumber(value) {
|
|
131
|
+
const num = Number(value);
|
|
132
|
+
if (isNaN(num))
|
|
133
|
+
return String(value ?? '');
|
|
134
|
+
return num % 1 === 0 ? String(num) : parseFloat(num.toFixed(2)).toString();
|
|
135
|
+
}
|
|
130
136
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: AppMessageErrorComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
131
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: AppMessageErrorComponent, isStandalone: true, selector: "app-message-error", inputs: { control: "control", form: "form" }, ngImport: i0, template: "<div class=\"dsx-error-slot\" [class.is-visible]=\"isControlErrorVisible()\">\r\n @if (isControlErrorVisible()) {\r\n <div class=\"dsx-error-message\">\r\n <i\r\n class=\"pi pi-exclamation-triangle dsx-error-icon\"\r\n aria-hidden=\"true\"\r\n ></i>\r\n @if (control?.errors?.[\"required\"]) {\r\n El campo <strong>es requerido.</strong>\r\n } @else if (control?.errors?.[\"invalidNIT\"]) {\r\n <strong>{{ control?.errors?.[\"invalidNIT\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidCUI\"]) {\r\n <strong>{{ control?.errors?.[\"invalidCUI\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDateRange\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDateRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"dateNotRange\"]) {\r\n <strong>{{ control?.errors?.[\"dateNotRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDate\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDate\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minimumAge\"]) {\r\n <strong>{{ control?.errors?.[\"minimumAge\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minlength\"]) {\r\n Debe tener al menos\r\n <strong>{{ control?.errors?.[\"minlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"maxlength\"]) {\r\n Debe tener como m\u00E1ximo\r\n <strong>{{ control?.errors?.[\"maxlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"min\"]) {\r\n El valor m\u00EDnimo permitido es\r\n <strong>{{ control?.errors?.[\"min\"]?.min }}</strong>\r\n } @else if (control?.errors?.[\"max\"]) {\r\n El valor m\u00E1ximo permitido es\r\n <strong>{{ control?.errors?.[\"max\"]?.max
|
|
137
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: AppMessageErrorComponent, isStandalone: true, selector: "app-message-error", inputs: { control: "control", form: "form" }, ngImport: i0, template: "<div class=\"dsx-error-slot\" [class.is-visible]=\"isControlErrorVisible()\">\r\n @if (isControlErrorVisible()) {\r\n <div class=\"dsx-error-message\">\r\n <i\r\n class=\"pi pi-exclamation-triangle dsx-error-icon\"\r\n aria-hidden=\"true\"\r\n ></i>\r\n @if (control?.errors?.[\"required\"]) {\r\n El campo <strong>es requerido.</strong>\r\n } @else if (control?.errors?.[\"invalidNIT\"]) {\r\n <strong>{{ control?.errors?.[\"invalidNIT\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidCUI\"]) {\r\n <strong>{{ control?.errors?.[\"invalidCUI\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDateRange\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDateRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"dateNotRange\"]) {\r\n <strong>{{ control?.errors?.[\"dateNotRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDate\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDate\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minimumAge\"]) {\r\n <strong>{{ control?.errors?.[\"minimumAge\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minlength\"]) {\r\n Debe tener al menos\r\n <strong>{{ control?.errors?.[\"minlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"maxlength\"]) {\r\n Debe tener como m\u00E1ximo\r\n <strong>{{ control?.errors?.[\"maxlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"min\"]) {\r\n El valor m\u00EDnimo permitido es\r\n <strong>{{ formatNumber(control?.errors?.[\"min\"]?.min) }}</strong>\r\n } @else if (control?.errors?.[\"max\"]) {\r\n El valor m\u00E1ximo permitido es\r\n <strong>{{ formatNumber(control?.errors?.[\"max\"]?.max) }}</strong>\r\n } @else if (control?.errors?.[\"email\"]) {\r\n Debe ser una direcci\u00F3n de correo v\u00E1lida.\r\n } @else if (control?.errors?.[\"pattern\"]) {\r\n El campo no tiene el formato requerido.\r\n } @else if (control?.errors?.[\"alreadyValueExists\"]) {\r\n <strong>{{ control?.errors?.[\"alreadyValueExists\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidTemplateVariables\"]) {\r\n <div class=\"dsx-template-error\">\r\n <strong>\r\n {{ control?.errors?.[\"invalidTemplateVariables\"]?.message }}\r\n </strong>\r\n @if (control?.errors?.[\"invalidTemplateVariables\"]?.details?.length) {\r\n <span class=\"dsx-template-error-detail\">\r\n {{ control?.errors?.[\"invalidTemplateVariables\"]?.details?.[0] }}\r\n </span>\r\n }\r\n </div>\r\n } @else if (control?.errors?.[\"invalidTemplateStructure\"]) {\r\n <div class=\"dsx-template-error\">\r\n <strong>\r\n {{ control?.errors?.[\"invalidTemplateStructure\"]?.message }}\r\n </strong>\r\n @if (control?.errors?.[\"invalidTemplateStructure\"]?.details?.length) {\r\n <span class=\"dsx-template-error-detail\">\r\n {{ control?.errors?.[\"invalidTemplateStructure\"]?.details?.[0] }}\r\n </span>\r\n }\r\n </div>\r\n } @else {\r\n Existe un error a\u00FAn no identificado.\r\n }\r\n </div>\r\n }\r\n</div>\r\n<!-- mensaje para formulario en general -->\r\n@if (form?.invalid && form?.touched) {\r\n <div class=\"mt-2 mb-2\">\r\n @if (this.form?.errors?.[\"atLeastOneRequired\"]) {\r\n <p-tag severity=\"danger\" [rounded]=\"true\">\r\n {{ form?.getError(\"atLeastOneRequired\")?.message }}</p-tag\r\n >\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:block}.dsx-error-slot{max-height:0;margin-top:0;overflow:hidden;opacity:0;transition:max-height .22s ease,margin-top .22s ease,opacity .18s ease}.dsx-error-slot.is-visible{max-height:7.5rem;margin-top:.3rem;opacity:1}.dsx-error-message{--dsx-error-color: #b42318;--dsx-error-bg: #fff2f0;color:var(--dsx-error-color);font-family:Roboto,Montserrat,sans-serif;font-size:clamp(.75rem,.72rem + .12vw,.8125rem);font-weight:400;line-height:1.35;letter-spacing:.01em;display:flex;align-items:flex-start;gap:.35rem;position:relative;z-index:1;padding:.2rem .45rem;border-left:3px solid var(--dsx-error-color);border-radius:0 6px 6px 0;background:var(--dsx-error-bg);box-shadow:0 1px 2px #00000014;width:100%;max-width:100%;white-space:normal;word-break:break-word;overflow-wrap:anywhere;transform:translateY(-2px);transition:transform .2s ease}.dsx-error-message strong{font-weight:500}.dsx-error-icon{font-style:normal;flex-shrink:0;font-size:.78rem;line-height:1;color:var(--dsx-error-color);margin-top:.08rem}.dsx-error-slot.is-visible .dsx-error-message{transform:translateY(0)}@media(max-width:640px){.dsx-error-slot.is-visible{max-height:9rem}.dsx-error-message{max-width:100%}}:host-context(.p-floatlabel){position:absolute;top:100%;left:0;width:100%;z-index:3;pointer-events:none}:host-context(.p-floatlabel) .dsx-error-slot{max-height:none;margin-top:.25rem;overflow:visible;opacity:0;transform:translateY(-3px);transition:opacity .16s ease,transform .18s ease}:host-context(.p-floatlabel) .dsx-error-slot.is-visible{opacity:1;transform:translateY(0)}:host-context(.p-floatlabel) .dsx-error-message{width:calc(100% - .25rem);max-width:calc(100% - .25rem)}\n"], dependencies: [{ kind: "ngmodule", type: TagModule }, { kind: "component", type: i1.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }] });
|
|
132
138
|
}
|
|
133
139
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: AppMessageErrorComponent, decorators: [{
|
|
134
140
|
type: Component,
|
|
135
|
-
args: [{ selector: 'app-message-error', imports: [TagModule, DecimalPipe], template: "<div class=\"dsx-error-slot\" [class.is-visible]=\"isControlErrorVisible()\">\r\n @if (isControlErrorVisible()) {\r\n <div class=\"dsx-error-message\">\r\n <i\r\n class=\"pi pi-exclamation-triangle dsx-error-icon\"\r\n aria-hidden=\"true\"\r\n ></i>\r\n @if (control?.errors?.[\"required\"]) {\r\n El campo <strong>es requerido.</strong>\r\n } @else if (control?.errors?.[\"invalidNIT\"]) {\r\n <strong>{{ control?.errors?.[\"invalidNIT\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidCUI\"]) {\r\n <strong>{{ control?.errors?.[\"invalidCUI\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDateRange\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDateRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"dateNotRange\"]) {\r\n <strong>{{ control?.errors?.[\"dateNotRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDate\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDate\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minimumAge\"]) {\r\n <strong>{{ control?.errors?.[\"minimumAge\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minlength\"]) {\r\n Debe tener al menos\r\n <strong>{{ control?.errors?.[\"minlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"maxlength\"]) {\r\n Debe tener como m\u00E1ximo\r\n <strong>{{ control?.errors?.[\"maxlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"min\"]) {\r\n El valor m\u00EDnimo permitido es\r\n <strong>{{ control?.errors?.[\"min\"]?.min }}</strong>\r\n } @else if (control?.errors?.[\"max\"]) {\r\n El valor m\u00E1ximo permitido es\r\n <strong>{{ control?.errors?.[\"max\"]?.max
|
|
141
|
+
args: [{ selector: 'app-message-error', imports: [TagModule, DecimalPipe], template: "<div class=\"dsx-error-slot\" [class.is-visible]=\"isControlErrorVisible()\">\r\n @if (isControlErrorVisible()) {\r\n <div class=\"dsx-error-message\">\r\n <i\r\n class=\"pi pi-exclamation-triangle dsx-error-icon\"\r\n aria-hidden=\"true\"\r\n ></i>\r\n @if (control?.errors?.[\"required\"]) {\r\n El campo <strong>es requerido.</strong>\r\n } @else if (control?.errors?.[\"invalidNIT\"]) {\r\n <strong>{{ control?.errors?.[\"invalidNIT\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidCUI\"]) {\r\n <strong>{{ control?.errors?.[\"invalidCUI\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDateRange\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDateRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"dateNotRange\"]) {\r\n <strong>{{ control?.errors?.[\"dateNotRange\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidDate\"]) {\r\n <strong>{{ control?.errors?.[\"invalidDate\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minimumAge\"]) {\r\n <strong>{{ control?.errors?.[\"minimumAge\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"minlength\"]) {\r\n Debe tener al menos\r\n <strong>{{ control?.errors?.[\"minlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"maxlength\"]) {\r\n Debe tener como m\u00E1ximo\r\n <strong>{{ control?.errors?.[\"maxlength\"]?.requiredLength }}</strong>\r\n caracteres.\r\n } @else if (control?.errors?.[\"min\"]) {\r\n El valor m\u00EDnimo permitido es\r\n <strong>{{ formatNumber(control?.errors?.[\"min\"]?.min) }}</strong>\r\n } @else if (control?.errors?.[\"max\"]) {\r\n El valor m\u00E1ximo permitido es\r\n <strong>{{ formatNumber(control?.errors?.[\"max\"]?.max) }}</strong>\r\n } @else if (control?.errors?.[\"email\"]) {\r\n Debe ser una direcci\u00F3n de correo v\u00E1lida.\r\n } @else if (control?.errors?.[\"pattern\"]) {\r\n El campo no tiene el formato requerido.\r\n } @else if (control?.errors?.[\"alreadyValueExists\"]) {\r\n <strong>{{ control?.errors?.[\"alreadyValueExists\"]?.message }}</strong>\r\n } @else if (control?.errors?.[\"invalidTemplateVariables\"]) {\r\n <div class=\"dsx-template-error\">\r\n <strong>\r\n {{ control?.errors?.[\"invalidTemplateVariables\"]?.message }}\r\n </strong>\r\n @if (control?.errors?.[\"invalidTemplateVariables\"]?.details?.length) {\r\n <span class=\"dsx-template-error-detail\">\r\n {{ control?.errors?.[\"invalidTemplateVariables\"]?.details?.[0] }}\r\n </span>\r\n }\r\n </div>\r\n } @else if (control?.errors?.[\"invalidTemplateStructure\"]) {\r\n <div class=\"dsx-template-error\">\r\n <strong>\r\n {{ control?.errors?.[\"invalidTemplateStructure\"]?.message }}\r\n </strong>\r\n @if (control?.errors?.[\"invalidTemplateStructure\"]?.details?.length) {\r\n <span class=\"dsx-template-error-detail\">\r\n {{ control?.errors?.[\"invalidTemplateStructure\"]?.details?.[0] }}\r\n </span>\r\n }\r\n </div>\r\n } @else {\r\n Existe un error a\u00FAn no identificado.\r\n }\r\n </div>\r\n }\r\n</div>\r\n<!-- mensaje para formulario en general -->\r\n@if (form?.invalid && form?.touched) {\r\n <div class=\"mt-2 mb-2\">\r\n @if (this.form?.errors?.[\"atLeastOneRequired\"]) {\r\n <p-tag severity=\"danger\" [rounded]=\"true\">\r\n {{ form?.getError(\"atLeastOneRequired\")?.message }}</p-tag\r\n >\r\n }\r\n </div>\r\n}\r\n", styles: [":host{display:block}.dsx-error-slot{max-height:0;margin-top:0;overflow:hidden;opacity:0;transition:max-height .22s ease,margin-top .22s ease,opacity .18s ease}.dsx-error-slot.is-visible{max-height:7.5rem;margin-top:.3rem;opacity:1}.dsx-error-message{--dsx-error-color: #b42318;--dsx-error-bg: #fff2f0;color:var(--dsx-error-color);font-family:Roboto,Montserrat,sans-serif;font-size:clamp(.75rem,.72rem + .12vw,.8125rem);font-weight:400;line-height:1.35;letter-spacing:.01em;display:flex;align-items:flex-start;gap:.35rem;position:relative;z-index:1;padding:.2rem .45rem;border-left:3px solid var(--dsx-error-color);border-radius:0 6px 6px 0;background:var(--dsx-error-bg);box-shadow:0 1px 2px #00000014;width:100%;max-width:100%;white-space:normal;word-break:break-word;overflow-wrap:anywhere;transform:translateY(-2px);transition:transform .2s ease}.dsx-error-message strong{font-weight:500}.dsx-error-icon{font-style:normal;flex-shrink:0;font-size:.78rem;line-height:1;color:var(--dsx-error-color);margin-top:.08rem}.dsx-error-slot.is-visible .dsx-error-message{transform:translateY(0)}@media(max-width:640px){.dsx-error-slot.is-visible{max-height:9rem}.dsx-error-message{max-width:100%}}:host-context(.p-floatlabel){position:absolute;top:100%;left:0;width:100%;z-index:3;pointer-events:none}:host-context(.p-floatlabel) .dsx-error-slot{max-height:none;margin-top:.25rem;overflow:visible;opacity:0;transform:translateY(-3px);transition:opacity .16s ease,transform .18s ease}:host-context(.p-floatlabel) .dsx-error-slot.is-visible{opacity:1;transform:translateY(0)}:host-context(.p-floatlabel) .dsx-error-message{width:calc(100% - .25rem);max-width:calc(100% - .25rem)}\n"] }]
|
|
136
142
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { control: [{
|
|
137
143
|
type: Input
|
|
138
144
|
}], form: [{
|
|
@@ -180,7 +186,13 @@ class AppMessageHelpComponent {
|
|
|
180
186
|
return null;
|
|
181
187
|
}
|
|
182
188
|
isHelpVisible() {
|
|
183
|
-
if (!this.control
|
|
189
|
+
if (!this.control) {
|
|
190
|
+
return false;
|
|
191
|
+
}
|
|
192
|
+
if (this.control.disabled) {
|
|
193
|
+
return !!this.getHelpMessage();
|
|
194
|
+
}
|
|
195
|
+
if (!this.control.valid) {
|
|
184
196
|
return false;
|
|
185
197
|
}
|
|
186
198
|
return !!this.getHelpMessage();
|
|
@@ -205,7 +217,7 @@ class AppMessageHelpComponent {
|
|
|
205
217
|
this.renderer.removeStyle(this.floatLabelElement, 'margin-bottom');
|
|
206
218
|
}
|
|
207
219
|
buildDateLongMessage() {
|
|
208
|
-
const rawValue = this.
|
|
220
|
+
const rawValue = this.getControlValue();
|
|
209
221
|
if (!rawValue) {
|
|
210
222
|
return null;
|
|
211
223
|
}
|
|
@@ -222,11 +234,29 @@ class AppMessageHelpComponent {
|
|
|
222
234
|
const message = formattedDate.charAt(0).toUpperCase() + formattedDate.slice(1);
|
|
223
235
|
return `${message}`;
|
|
224
236
|
}
|
|
237
|
+
getControlValue() {
|
|
238
|
+
if (!this.control) {
|
|
239
|
+
return null;
|
|
240
|
+
}
|
|
241
|
+
if (this.control.disabled && 'getRawValue' in this.control) {
|
|
242
|
+
const rawControl = this.control;
|
|
243
|
+
return rawControl.getRawValue();
|
|
244
|
+
}
|
|
245
|
+
return this.control.value;
|
|
246
|
+
}
|
|
225
247
|
parseDateInput(value) {
|
|
226
248
|
if (value instanceof Date) {
|
|
227
249
|
return Number.isNaN(value.getTime()) ? null : value;
|
|
228
250
|
}
|
|
229
251
|
if (typeof value === 'string') {
|
|
252
|
+
const ddmmyyyyMatch = value.match(/^(\d{2})-(\d{2})-(\d{4})$/);
|
|
253
|
+
if (ddmmyyyyMatch) {
|
|
254
|
+
const day = Number(ddmmyyyyMatch[1]);
|
|
255
|
+
const month = Number(ddmmyyyyMatch[2]) - 1;
|
|
256
|
+
const year = Number(ddmmyyyyMatch[3]);
|
|
257
|
+
const localDate = new Date(year, month, day);
|
|
258
|
+
return Number.isNaN(localDate.getTime()) ? null : localDate;
|
|
259
|
+
}
|
|
230
260
|
const shortDateMatch = value.match(/^(\d{4})-(\d{2})-(\d{2})$/);
|
|
231
261
|
if (shortDateMatch) {
|
|
232
262
|
const year = Number(shortDateMatch[1]);
|
|
@@ -253,10 +283,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
|
|
|
253
283
|
}] } });
|
|
254
284
|
|
|
255
285
|
class DsxStatusToggle {
|
|
256
|
-
onLabel = input('Activo', ...(ngDevMode ? [{ debugName: "onLabel" }] : /* istanbul ignore next */ []));
|
|
257
|
-
offLabel = input('Inactivo', ...(ngDevMode ? [{ debugName: "offLabel" }] : /* istanbul ignore next */ []));
|
|
258
286
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
259
287
|
formDisabled = false;
|
|
288
|
+
isViewOnly = input(false, ...(ngDevMode ? [{ debugName: "isViewOnly" }] : /* istanbul ignore next */ []));
|
|
289
|
+
offLabel = input('Inactivo', ...(ngDevMode ? [{ debugName: "offLabel" }] : /* istanbul ignore next */ []));
|
|
290
|
+
onLabel = input('Activo', ...(ngDevMode ? [{ debugName: "onLabel" }] : /* istanbul ignore next */ []));
|
|
260
291
|
value = false;
|
|
261
292
|
onChange = (_) => { };
|
|
262
293
|
onTouched = () => { };
|
|
@@ -278,13 +309,13 @@ class DsxStatusToggle {
|
|
|
278
309
|
this.onTouched();
|
|
279
310
|
}
|
|
280
311
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: DsxStatusToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
281
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
312
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.13", type: DsxStatusToggle, isStandalone: true, selector: "dsx-status-toggle", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isViewOnly: { classPropertyName: "isViewOnly", publicName: "isViewOnly", isSignal: true, isRequired: false, transformFunction: null }, offLabel: { classPropertyName: "offLabel", publicName: "offLabel", isSignal: true, isRequired: false, transformFunction: null }, onLabel: { classPropertyName: "onLabel", publicName: "onLabel", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
282
313
|
{
|
|
283
314
|
provide: NG_VALUE_ACCESSOR,
|
|
284
315
|
useExisting: forwardRef(() => DsxStatusToggle),
|
|
285
316
|
multi: true,
|
|
286
317
|
},
|
|
287
|
-
], ngImport: i0, template: "<p-toggleButton\r\n fluid\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"change($event)\"\r\n [onLabel]=\"onLabel()\"\r\n [offLabel]=\"offLabel()\"\r\n [disabled]=\"disabled() || formDisabled\"\r\n [onIcon]=\"'pi pi-check-circle'\"\r\n [offIcon]=\"'pi pi-times-circle'\"\r\n class=\"dsx-status-toggle\"\r\n/>\r\n", styles: [":host ::ng-deep .dsx-status-toggle .p-button-label{font-weight:700!important}:host ::ng-deep .dsx-status-toggle.p-highlight,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked,:host ::ng-deep .dsx-status-toggle[aria-pressed=true],:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-label,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-label,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon:before,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon:before{color:#16a34a!important}:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked),:host ::ng-deep .dsx-status-toggle[aria-pressed=false],:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-label,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon:before{color:#dc2626!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "component", type: i2.ToggleButton, selector: "p-toggleButton, p-togglebutton, p-toggle-button", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabel", "ariaLabelledBy", "styleClass", "inputId", "tabindex", "iconPos", "autofocus", "size", "allowEmpty", "fluid"], outputs: ["onChange"] }] });
|
|
318
|
+
], ngImport: i0, template: "@if(isViewOnly()){\r\n<p-toggleButton\r\n fluid\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"change($event)\"\r\n [onLabel]=\"onLabel()\"\r\n [offLabel]=\"offLabel()\"\r\n [disabled]=\"disabled() || formDisabled\"\r\n [onIcon]=\"'pi pi-check-circle'\"\r\n [offIcon]=\"'pi pi-times-circle'\"\r\n class=\"dsx-status-toggle\"\r\n/>\r\n}\r\n", styles: [":host ::ng-deep .dsx-status-toggle .p-button-label{font-weight:700!important}:host ::ng-deep .dsx-status-toggle.p-highlight,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked,:host ::ng-deep .dsx-status-toggle[aria-pressed=true],:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-label,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-label,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon:before,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon:before{color:#16a34a!important}:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked),:host ::ng-deep .dsx-status-toggle[aria-pressed=false],:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-label,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon:before{color:#dc2626!important}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ToggleButtonModule }, { kind: "component", type: i2.ToggleButton, selector: "p-toggleButton, p-togglebutton, p-toggle-button", inputs: ["onLabel", "offLabel", "onIcon", "offIcon", "ariaLabel", "ariaLabelledBy", "styleClass", "inputId", "tabindex", "iconPos", "autofocus", "size", "allowEmpty", "fluid"], outputs: ["onChange"] }] });
|
|
288
319
|
}
|
|
289
320
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImport: i0, type: DsxStatusToggle, decorators: [{
|
|
290
321
|
type: Component,
|
|
@@ -294,8 +325,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.13", ngImpo
|
|
|
294
325
|
useExisting: forwardRef(() => DsxStatusToggle),
|
|
295
326
|
multi: true,
|
|
296
327
|
},
|
|
297
|
-
], template: "<p-toggleButton\r\n fluid\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"change($event)\"\r\n [onLabel]=\"onLabel()\"\r\n [offLabel]=\"offLabel()\"\r\n [disabled]=\"disabled() || formDisabled\"\r\n [onIcon]=\"'pi pi-check-circle'\"\r\n [offIcon]=\"'pi pi-times-circle'\"\r\n class=\"dsx-status-toggle\"\r\n/>\r\n", styles: [":host ::ng-deep .dsx-status-toggle .p-button-label{font-weight:700!important}:host ::ng-deep .dsx-status-toggle.p-highlight,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked,:host ::ng-deep .dsx-status-toggle[aria-pressed=true],:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-label,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-label,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon:before,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon:before{color:#16a34a!important}:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked),:host ::ng-deep .dsx-status-toggle[aria-pressed=false],:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-label,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon:before{color:#dc2626!important}\n"] }]
|
|
298
|
-
}], propDecorators: {
|
|
328
|
+
], template: "@if(isViewOnly()){\r\n<p-toggleButton\r\n fluid\r\n [ngModel]=\"value\"\r\n (ngModelChange)=\"change($event)\"\r\n [onLabel]=\"onLabel()\"\r\n [offLabel]=\"offLabel()\"\r\n [disabled]=\"disabled() || formDisabled\"\r\n [onIcon]=\"'pi pi-check-circle'\"\r\n [offIcon]=\"'pi pi-times-circle'\"\r\n class=\"dsx-status-toggle\"\r\n/>\r\n}\r\n", styles: [":host ::ng-deep .dsx-status-toggle .p-button-label{font-weight:700!important}:host ::ng-deep .dsx-status-toggle.p-highlight,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked,:host ::ng-deep .dsx-status-toggle[aria-pressed=true],:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-label,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-label,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon,:host ::ng-deep .dsx-status-toggle.p-highlight .p-button-icon:before,:host ::ng-deep .dsx-status-toggle.p-togglebutton-checked .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=true] .p-button-icon:before{color:#16a34a!important}:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked),:host ::ng-deep .dsx-status-toggle[aria-pressed=false],:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-label,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-label,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon,:host ::ng-deep .dsx-status-toggle:not(.p-highlight):not(.p-togglebutton-checked) .p-button-icon:before,:host ::ng-deep .dsx-status-toggle[aria-pressed=false] .p-button-icon:before{color:#dc2626!important}\n"] }]
|
|
329
|
+
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], isViewOnly: [{ type: i0.Input, args: [{ isSignal: true, alias: "isViewOnly", required: false }] }], offLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "offLabel", required: false }] }], onLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "onLabel", required: false }] }] } });
|
|
299
330
|
|
|
300
331
|
class DsxEnableDisable {
|
|
301
332
|
checked = false;
|