-
{{ errorPattern }}
+
+ {{ errorPattern }}
+
+
{{ help }}
diff --git a/projects/ui/src/lib/components/po-field/po-field-container/po-field-container-bottom/po-field-container-bottom.component.ts b/projects/ui/src/lib/components/po-field/po-field-container/po-field-container-bottom/po-field-container-bottom.component.ts
index 6c0328bbb0..aca94096d9 100644
--- a/projects/ui/src/lib/components/po-field/po-field-container/po-field-container-bottom/po-field-container-bottom.component.ts
+++ b/projects/ui/src/lib/components/po-field/po-field-container/po-field-container-bottom/po-field-container-bottom.component.ts
@@ -1,4 +1,5 @@
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
+import { convertToBoolean } from '../../../../utils/util';
/**
* @docsPrivate
@@ -20,7 +21,14 @@ export class PoFieldContainerBottomComponent {
*/
@Input('p-error-pattern') errorPattern?: string = '';
+ /**
+ * Limita a exibição da mensagem de erro a duas linhas e exibe um tooltip com o texto completo.
+ */
+ @Input('p-error-limit') errorLimit: boolean = false;
+
@Input('p-disabled') disabled: boolean = false;
@Input('p-help') help?: string;
+
+ @Input({ alias: 'p-append-in-body', transform: convertToBoolean }) appendBox?: boolean = false;
}
diff --git a/projects/ui/src/lib/components/po-field/po-field-container/po-field-container.module.ts b/projects/ui/src/lib/components/po-field/po-field-container/po-field-container.module.ts
index 4db71ecd5c..2bbf99c797 100644
--- a/projects/ui/src/lib/components/po-field/po-field-container/po-field-container.module.ts
+++ b/projects/ui/src/lib/components/po-field/po-field-container/po-field-container.module.ts
@@ -2,6 +2,7 @@ import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { PoIconModule } from '../../po-icon';
import { PoLabelModule } from '../../po-label';
+import { PoTooltipModule } from '../../../directives/po-tooltip/index';
import { PoFieldContainerBottomComponent } from './po-field-container-bottom/po-field-container-bottom.component';
import { PoFieldContainerComponent } from './po-field-container.component';
@@ -12,7 +13,7 @@ import { PoFieldContainerComponent } from './po-field-container.component';
* Módulo do componente `po-field-container`.
*/
@NgModule({
- imports: [CommonModule, PoLabelModule, PoIconModule],
+ imports: [CommonModule, PoLabelModule, PoIconModule, PoTooltipModule],
exports: [PoFieldContainerBottomComponent, PoFieldContainerComponent],
declarations: [PoFieldContainerBottomComponent, PoFieldContainerComponent]
})
diff --git a/projects/ui/src/lib/components/po-field/po-field-validate.model.ts b/projects/ui/src/lib/components/po-field/po-field-validate.model.ts
index b25bf0e6e9..7afae74671 100644
--- a/projects/ui/src/lib/components/po-field/po-field-validate.model.ts
+++ b/projects/ui/src/lib/components/po-field/po-field-validate.model.ts
@@ -49,6 +49,22 @@ export abstract class PoFieldValidateModel
extends PoFieldModel implements
*/
@Input('p-field-error-message') fieldErrorMessage: string;
+ @Input({ alias: 'p-error-append-in-body', transform: convertToBoolean }) errorAppendBox?: boolean = false;
+
+ /**
+ * @optional
+ *
+ * @description
+ *
+ * Limita a exibição da mensagem de erro a duas linhas e exibe um tooltip com o texto completo.
+ *
+ * > Caso essa propriedade seja definida como `true`, a mensagem de erro será limitada a duas linhas
+ * e um tooltip será exibido ao passar o mouse sobre a mensagem para mostrar o conteúdo completo.
+ *
+ * @default `false`
+ */
+ @Input('p-error-limit') errorLimit: boolean = false;
+
/**
* Define se a indicação de campo obrigatório será exibida.
*
diff --git a/projects/ui/src/lib/components/po-field/po-input/po-input-base.component.ts b/projects/ui/src/lib/components/po-field/po-input/po-input-base.component.ts
index 0cf302b3e5..5f7f9e6345 100644
--- a/projects/ui/src/lib/components/po-field/po-input/po-input-base.component.ts
+++ b/projects/ui/src/lib/components/po-field/po-input/po-input-base.component.ts
@@ -137,6 +137,22 @@ export abstract class PoInputBaseComponent implements ControlValueAccessor, Vali
*/
@Input('p-error-pattern') errorPattern?: string = '';
+ /**
+ * @optional
+ *
+ * @description
+ *
+ * Limita a exibição da mensagem de erro a duas linhas e exibe um tooltip com o texto completo.
+ *
+ * > Caso essa propriedade seja definida como `true`, a mensagem de erro será limitada a duas linhas
+ * e um tooltip será exibido ao passar o mouse sobre a mensagem para mostrar o conteúdo completo.
+ *
+ * @default `false`
+ */
+ @Input('p-error-limit') errorLimit: boolean = false;
+
+ @Input({ alias: 'p-error-append-in-body', transform: convertToBoolean }) errorAppendBox?: boolean = false;
+
/**
* @optional
*
diff --git a/projects/ui/src/lib/components/po-field/po-input/po-input.component.html b/projects/ui/src/lib/components/po-field/po-input/po-input.component.html
index b29e18b001..e42a3844f1 100644
--- a/projects/ui/src/lib/components/po-field/po-input/po-input.component.html
+++ b/projects/ui/src/lib/components/po-field/po-input/po-input.component.html
@@ -49,5 +49,7 @@
[p-help]="help"
[p-disabled]="disabled"
[p-error-pattern]="getErrorPattern()"
+ [p-error-limit]="errorLimit"
+ [p-append-in-body]="errorAppendBox"
>
diff --git a/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.html b/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.html
index 34c9888fc5..e255e5d85b 100644
--- a/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.html
+++ b/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.html
@@ -25,6 +25,7 @@
(p-change)="changeEvent('p-change')"
(p-change-model)="changeEvent('p-change-model')"
(p-enter)="changeEvent('p-enter')"
+ [p-error-limit]="properties?.includes('errorLimit')"
>
diff --git a/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.ts b/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.ts
index 501a2651f9..9ae35e070b 100644
--- a/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.ts
+++ b/projects/ui/src/lib/components/po-field/po-input/samples/sample-po-input-labs/sample-po-input-labs.component.ts
@@ -37,7 +37,8 @@ export class SamplePoInputLabsComponent implements OnInit {
{ value: 'requiredFieldErrorMessage', label: 'Required Field Error Message' },
{ value: 'uppercase', label: 'Upper Case' },
{ value: 'showRequired', label: 'Show Required' },
- { value: 'maskNoLengthValidation', label: 'Mask No Length Validation' }
+ { value: 'maskNoLengthValidation', label: 'Mask No Length Validation' },
+ { value: 'errorLimit', label: 'Limit Error Message' }
];
ngOnInit() {
diff --git a/projects/ui/src/lib/components/po-field/po-login/po-login.component.html b/projects/ui/src/lib/components/po-field/po-login/po-login.component.html
index e2b84ab4a4..2f30650a48 100644
--- a/projects/ui/src/lib/components/po-field/po-login/po-login.component.html
+++ b/projects/ui/src/lib/components/po-field/po-login/po-login.component.html
@@ -44,6 +44,11 @@