lib-portal-angular 0.0.78 → 0.0.80
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/esm2022/lib/components/components.module.mjs +44 -39
- package/esm2022/lib/components/dynamic-modal/dynamic-modal.component.mjs +30 -0
- package/esm2022/lib/components/imput/input.component.mjs +76 -48
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/lib-portal-angular.mjs +106 -48
- package/fesm2022/lib-portal-angular.mjs.map +1 -1
- package/lib/components/components.module.d.ts +6 -5
- package/lib/components/dynamic-modal/dynamic-modal.component.d.ts +8 -0
- package/lib/components/imput/input.component.d.ts +10 -4
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
@@ -1742,10 +1742,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
1742
1742
|
class InputComponent {
|
1743
1743
|
constructor(authService) {
|
1744
1744
|
this.authService = authService;
|
1745
|
-
this.label =
|
1746
|
-
this.placeholder =
|
1747
|
-
this.id =
|
1748
|
-
this.type =
|
1745
|
+
this.label = "Default Label";
|
1746
|
+
this.placeholder = "";
|
1747
|
+
this.id = "inputId";
|
1748
|
+
this.type = "text";
|
1749
1749
|
this.disabled = false;
|
1750
1750
|
this.readonly = false;
|
1751
1751
|
this.maxlength = null;
|
@@ -1760,8 +1760,10 @@ class InputComponent {
|
|
1760
1760
|
this.validateInput = false;
|
1761
1761
|
this.labelFontWeight = 400;
|
1762
1762
|
this.useMoneyMask = false; // Para ativar/desativar a máscara de moeda
|
1763
|
-
this.currencyCode =
|
1763
|
+
this.currencyCode = "BRL"; // Código da moeda
|
1764
1764
|
this.displayCurrencySymbol = true; // Exibir ou não o símbolo da moeda
|
1765
|
+
this.prependText = "";
|
1766
|
+
this.buttonText = null;
|
1765
1767
|
this.inputEvent = new EventEmitter();
|
1766
1768
|
this.changeEvent = new EventEmitter();
|
1767
1769
|
this.focusEvent = new EventEmitter();
|
@@ -1769,39 +1771,51 @@ class InputComponent {
|
|
1769
1771
|
this.keyupEvent = new EventEmitter();
|
1770
1772
|
this.keydownEvent = new EventEmitter();
|
1771
1773
|
this.keypressEvent = new EventEmitter();
|
1774
|
+
this.buttonClick = new EventEmitter();
|
1772
1775
|
this.onChangeCallback = () => { };
|
1773
1776
|
this.onTouchedCallback = () => { };
|
1774
|
-
this.
|
1777
|
+
this.ButtonClasses = ButtonClasses;
|
1778
|
+
this.value = "";
|
1775
1779
|
this.showErrorModal = false;
|
1776
|
-
this.errorMessage =
|
1780
|
+
this.errorMessage = "";
|
1777
1781
|
this.subscriptions = [];
|
1778
1782
|
}
|
1779
1783
|
getInputType() {
|
1780
|
-
return this.onlyNumbers ?
|
1784
|
+
return this.onlyNumbers ? "tel" : this.type;
|
1781
1785
|
}
|
1782
1786
|
onInput(event) {
|
1783
1787
|
const inputElement = event.target;
|
1784
1788
|
let inputValue = inputElement.value;
|
1785
1789
|
// Aplica máscara de números se necessário
|
1786
|
-
if (this.onlyNumbers &&
|
1787
|
-
|
1790
|
+
if (this.onlyNumbers &&
|
1791
|
+
!(this.useCpfMask ||
|
1792
|
+
this.useCnpjMask ||
|
1793
|
+
this.useCepMask ||
|
1794
|
+
this.useMoneyMask)) {
|
1795
|
+
inputValue = inputValue.replace(/\D/g, ""); // Remove todos os não numéricos
|
1788
1796
|
}
|
1789
1797
|
// Validação imediata para CPF, CNPJ ou CEP
|
1790
|
-
const numericValue = inputValue.replace(/\D/g,
|
1798
|
+
const numericValue = inputValue.replace(/\D/g, ""); // Remove todos os caracteres não numéricos
|
1791
1799
|
if (this.validateInput) {
|
1792
|
-
if (this.useCpfMask &&
|
1793
|
-
|
1800
|
+
if (this.useCpfMask &&
|
1801
|
+
numericValue.length === 11 &&
|
1802
|
+
!this.validateCpf(numericValue)) {
|
1803
|
+
this.clearAndShowValidationError("CPF inválido. Por favor, insira um CPF correto.");
|
1794
1804
|
}
|
1795
|
-
else if (this.useCnpjMask &&
|
1796
|
-
|
1805
|
+
else if (this.useCnpjMask &&
|
1806
|
+
numericValue.length === 14 &&
|
1807
|
+
!this.validateCnpj(numericValue)) {
|
1808
|
+
this.clearAndShowValidationError("CNPJ inválido. Por favor, insira um CNPJ correto.");
|
1797
1809
|
}
|
1798
|
-
else if (this.useCepMask &&
|
1799
|
-
|
1810
|
+
else if (this.useCepMask &&
|
1811
|
+
numericValue.length === 8 &&
|
1812
|
+
!this.validateCep(numericValue)) {
|
1813
|
+
this.clearAndShowValidationError("CEP inválido. Por favor, insira um CEP correto.");
|
1800
1814
|
}
|
1801
1815
|
}
|
1802
1816
|
// Máscara de moeda
|
1803
1817
|
if (this.useMoneyMask) {
|
1804
|
-
const numericValue = inputValue.replace(/\D/g,
|
1818
|
+
const numericValue = inputValue.replace(/\D/g, ""); // Remove todos os não numéricos
|
1805
1819
|
const formattedValue = this.formatMoney(numericValue); // Formata como dinheiro ou número decimal
|
1806
1820
|
inputElement.value = formattedValue;
|
1807
1821
|
this.value = formattedValue;
|
@@ -1815,42 +1829,46 @@ class InputComponent {
|
|
1815
1829
|
}
|
1816
1830
|
formatMoney(value) {
|
1817
1831
|
if (!value)
|
1818
|
-
return
|
1832
|
+
return ""; // Se o valor estiver vazio, retorna uma string vazia
|
1819
1833
|
const numericValue = parseFloat(value) / 100;
|
1820
1834
|
// Verifica se deve exibir o símbolo da moeda ou não
|
1821
1835
|
if (this.displayCurrencySymbol) {
|
1822
1836
|
// Formata como moeda
|
1823
|
-
return new Intl.NumberFormat(
|
1824
|
-
style:
|
1825
|
-
currency: this.currencyCode
|
1837
|
+
return new Intl.NumberFormat("pt-BR", {
|
1838
|
+
style: "currency",
|
1839
|
+
currency: this.currencyCode,
|
1826
1840
|
}).format(numericValue);
|
1827
1841
|
}
|
1828
1842
|
else {
|
1829
1843
|
// Formata como número decimal, sem o símbolo da moeda
|
1830
|
-
return new Intl.NumberFormat(
|
1831
|
-
style:
|
1844
|
+
return new Intl.NumberFormat("pt-BR", {
|
1845
|
+
style: "decimal",
|
1832
1846
|
minimumFractionDigits: 2,
|
1833
|
-
maximumFractionDigits: 2
|
1847
|
+
maximumFractionDigits: 2,
|
1834
1848
|
}).format(numericValue);
|
1835
1849
|
}
|
1836
1850
|
}
|
1837
1851
|
onKeyDown(event) {
|
1838
|
-
if (this.onlyNumbers &&
|
1852
|
+
if (this.onlyNumbers &&
|
1853
|
+
!/^\d$/.test(event.key) &&
|
1854
|
+
event.key !== "Backspace" &&
|
1855
|
+
event.key !== "ArrowLeft" &&
|
1856
|
+
event.key !== "ArrowRight") {
|
1839
1857
|
event.preventDefault();
|
1840
1858
|
}
|
1841
1859
|
}
|
1842
1860
|
onChange(event) {
|
1843
|
-
const numericValue = this.value.replace(/\D/g,
|
1861
|
+
const numericValue = this.value.replace(/\D/g, ""); // Remove todos os caracteres não numéricos
|
1844
1862
|
// Validação também ocorre no blur para casos onde o input não está completo
|
1845
1863
|
if (this.validateInput) {
|
1846
1864
|
if (this.useCpfMask && !this.validateCpf(numericValue)) {
|
1847
|
-
this.clearAndShowValidationError(
|
1865
|
+
this.clearAndShowValidationError("CPF inválido. Por favor, insira um CPF correto.");
|
1848
1866
|
}
|
1849
1867
|
else if (this.useCnpjMask && !this.validateCnpj(numericValue)) {
|
1850
|
-
this.clearAndShowValidationError(
|
1868
|
+
this.clearAndShowValidationError("CNPJ inválido. Por favor, insira um CNPJ correto.");
|
1851
1869
|
}
|
1852
1870
|
else if (this.useCepMask && !this.validateCep(numericValue)) {
|
1853
|
-
this.clearAndShowValidationError(
|
1871
|
+
this.clearAndShowValidationError("CEP inválido. Por favor, insira um CEP correto.");
|
1854
1872
|
}
|
1855
1873
|
}
|
1856
1874
|
this.changeEvent.emit(event);
|
@@ -1886,7 +1904,7 @@ class InputComponent {
|
|
1886
1904
|
if (pos < 2)
|
1887
1905
|
pos = 9;
|
1888
1906
|
}
|
1889
|
-
let result = sum % 11 < 2 ? 0 : 11 - sum % 11;
|
1907
|
+
let result = sum % 11 < 2 ? 0 : 11 - (sum % 11);
|
1890
1908
|
if (result !== parseInt(digits.charAt(0)))
|
1891
1909
|
return false;
|
1892
1910
|
length = length + 1;
|
@@ -1898,21 +1916,21 @@ class InputComponent {
|
|
1898
1916
|
if (pos < 2)
|
1899
1917
|
pos = 9;
|
1900
1918
|
}
|
1901
|
-
result = sum % 11 < 2 ? 0 : 11 - sum % 11;
|
1919
|
+
result = sum % 11 < 2 ? 0 : 11 - (sum % 11);
|
1902
1920
|
return result === parseInt(digits.charAt(1));
|
1903
1921
|
}
|
1904
1922
|
validateCep(cep) {
|
1905
1923
|
return /^\d{8}$/.test(cep); // Valida apenas números, sem considerar a máscara
|
1906
1924
|
}
|
1907
1925
|
clearAndShowValidationError(message) {
|
1908
|
-
this.value =
|
1926
|
+
this.value = ""; // Limpa o valor do ngModel
|
1909
1927
|
this.onChangeCallback(this.value); // Atualiza o ngModel com o valor limpo
|
1910
1928
|
this.errorMessage = message;
|
1911
1929
|
this.showErrorModal = true;
|
1912
1930
|
}
|
1913
1931
|
closeModal() {
|
1914
1932
|
this.showErrorModal = false;
|
1915
|
-
this.errorMessage =
|
1933
|
+
this.errorMessage = "";
|
1916
1934
|
}
|
1917
1935
|
onFocus(event) {
|
1918
1936
|
this.focusEvent.emit(event);
|
@@ -1942,35 +1960,38 @@ class InputComponent {
|
|
1942
1960
|
}
|
1943
1961
|
catch (error) {
|
1944
1962
|
if (error instanceof Error) {
|
1945
|
-
console.error(
|
1963
|
+
console.error("Permission error:", error.message);
|
1946
1964
|
}
|
1947
1965
|
else {
|
1948
|
-
console.error(
|
1966
|
+
console.error("Unknown error occurred during permission check");
|
1949
1967
|
}
|
1950
1968
|
return true;
|
1951
1969
|
}
|
1952
1970
|
}
|
1971
|
+
onButtonClick() {
|
1972
|
+
this.buttonClick.emit();
|
1973
|
+
}
|
1953
1974
|
ngOnDestroy() {
|
1954
|
-
this.subscriptions.forEach(sub => sub.unsubscribe());
|
1975
|
+
this.subscriptions.forEach((sub) => sub.unsubscribe());
|
1955
1976
|
}
|
1956
1977
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InputComponent, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
|
1957
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: InputComponent, selector: "argenta-custom-input", inputs: { label: "label", placeholder: "placeholder", id: "id", type: "type", disabled: "disabled", readonly: "readonly", maxlength: "maxlength", minlength: "minlength", required: "required", pattern: "pattern", autofocus: "autofocus", useCpfMask: "useCpfMask", useCnpjMask: "useCnpjMask", useCepMask: "useCepMask", onlyNumbers: "onlyNumbers", validateInput: "validateInput", labelFontWeight: "labelFontWeight", permissions: "permissions", useMoneyMask: "useMoneyMask", currencyCode: "currencyCode", displayCurrencySymbol: "displayCurrencySymbol" }, outputs: { inputEvent: "inputEvent", changeEvent: "changeEvent", focusEvent: "focusEvent", blurEvent: "blurEvent", keyupEvent: "keyupEvent", keydownEvent: "keydownEvent", keypressEvent: "keypressEvent" }, providers: [
|
1978
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: InputComponent, selector: "argenta-custom-input", inputs: { label: "label", placeholder: "placeholder", id: "id", type: "type", disabled: "disabled", readonly: "readonly", maxlength: "maxlength", minlength: "minlength", required: "required", pattern: "pattern", autofocus: "autofocus", useCpfMask: "useCpfMask", useCnpjMask: "useCnpjMask", useCepMask: "useCepMask", onlyNumbers: "onlyNumbers", validateInput: "validateInput", labelFontWeight: "labelFontWeight", permissions: "permissions", useMoneyMask: "useMoneyMask", currencyCode: "currencyCode", displayCurrencySymbol: "displayCurrencySymbol", prependText: "prependText", buttonText: "buttonText" }, outputs: { inputEvent: "inputEvent", changeEvent: "changeEvent", focusEvent: "focusEvent", blurEvent: "blurEvent", keyupEvent: "keyupEvent", keydownEvent: "keydownEvent", keypressEvent: "keypressEvent", buttonClick: "buttonClick" }, providers: [
|
1958
1979
|
{
|
1959
1980
|
provide: NG_VALUE_ACCESSOR,
|
1960
1981
|
useExisting: forwardRef(() => InputComponent),
|
1961
|
-
multi: true
|
1962
|
-
}
|
1963
|
-
], ngImport: i0, template: "<div *ngIf=\"hasPermission()\" class=\"form-group\">\n <label [for]=\"id\" [ngClass]=\"'label-styles'\">{{ label }}</label>\n <input [type]=\"getInputType()\"\n
|
1982
|
+
multi: true,
|
1983
|
+
},
|
1984
|
+
], ngImport: i0, template: "<div *ngIf=\"hasPermission()\" class=\"form-group\">\n <label [for]=\"id\" [ngClass]=\"'label-styles'\">{{ label }}</label>\n <div class=\"input-group\">\n <div *ngIf=\"prependText\" class=\"input-group-prepend\">\n <span\n class=\"input-group-text custom-input-group-text\"\n id=\"basic-addon3\"\n >{{ prependText }}</span\n >\n </div>\n <input\n [type]=\"getInputType()\"\n class=\"form-control custom-input\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [(ngModel)]=\"value\"\n (input)=\"onInput($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"keyupEvent.emit($event)\"\n (keydown)=\"onKeyDown($event)\"\n (keypress)=\"keypressEvent.emit($event)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [required]=\"required\"\n [attr.pattern]=\"pattern\"\n [autofocus]=\"autofocus\"\n [cpfMask]=\"useCpfMask\"\n [cnpjMask]=\"useCnpjMask\"\n [cepMask]=\"useCepMask\"\n />\n\n <div class=\"input-group-append\" *ngIf=\"buttonText\">\n <button type=\"button\" class=\"btn-group-append\" (click)=\"onButtonClick()\">\n {{ buttonText }}\n </button>\n </div>\n\n <!-- Modal para exibir mensagens de erro -->\n <div class=\"modal-overlay\" *ngIf=\"showErrorModal\">\n <div class=\"modal-content\">\n <span class=\"close\" (click)=\"closeModal()\">×</span>\n <p>{{ errorMessage }}</p>\n <button class=\"btn-ok\" (click)=\"closeModal()\">OK</button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.form-group{font-family:var(--font-family);font-size:1rem;font-weight:700}.form-check-input{font-family:var(--font-family);color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:var(--font-family);font-size:16px;line-height:19.36px;text-align:left}.custom-input{font-family:var(--font-family);color:#333;font-size:.9rem;height:46px}.custom-input::placeholder{font-size:14px;color:#d3d3d3}.form-label{font-family:var(--font-family);color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:var(--font-family);font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;padding:25px 30px;border-radius:8px;width:360px;text-align:center;position:relative;box-shadow:0 4px 12px #0003}.close{position:absolute;top:10px;right:15px;cursor:pointer;font-size:20px;color:#555;transition:color .3s}.close:hover{color:#f44336}.btn-ok{margin-top:20px;padding:8px 20px;border:none;background-color:#00444c;color:#fff;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .3s,transform .2s}.btn-ok:hover{background-color:#00363d;transform:scale(1.05)}.btn-ok:active{transform:scale(.98)}.input-group-text{padding:.64rem .75rem;font-family:var(--font-family);color:#6e6e6e;font-size:14px}.btn-group-append{padding:.69rem;font-family:var(--font-family);background-color:var(--secondary-color);border:0rem solid;color:var(--text-color);transition:border-width .2s,transform .1s;font-size:1rem;border-top-right-radius:6px;border-bottom-right-radius:6px}.btn-group-append:hover{background-color:var(--primary-color)}.custom-input-group-text{border-top-right-radius:0;border-bottom-right-radius:0;padding:.71rem .75rem;background-color:#e7e7e7;border:1px solid #dbdbdb}.btn-group-append:active{animation:blink .3s}@keyframes blink{0%{background-color:var(--primary-color);border-color:var(--primary-color)}50%{background-color:var(--secondary-color);border-color:var(--secondary-color)}to{background-color:var(--primary-color);border-color:var(--primary-color)}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CepMaskDirective, selector: "[cepMask]", inputs: ["cepMask"] }, { kind: "directive", type: CnpjMaskDirective, selector: "[cnpjMask]", inputs: ["cnpjMask"] }, { kind: "directive", type: CpfMaskDirective, selector: "[cpfMask]", inputs: ["cpfMask"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
1964
1985
|
}
|
1965
1986
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: InputComponent, decorators: [{
|
1966
1987
|
type: Component,
|
1967
|
-
args: [{ selector:
|
1988
|
+
args: [{ selector: "argenta-custom-input", providers: [
|
1968
1989
|
{
|
1969
1990
|
provide: NG_VALUE_ACCESSOR,
|
1970
1991
|
useExisting: forwardRef(() => InputComponent),
|
1971
|
-
multi: true
|
1972
|
-
}
|
1973
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"hasPermission()\" class=\"form-group\">\n <label [for]=\"id\" [ngClass]=\"'label-styles'\">{{ label }}</label>\n <input [type]=\"getInputType()\"\n
|
1992
|
+
multi: true,
|
1993
|
+
},
|
1994
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"hasPermission()\" class=\"form-group\">\n <label [for]=\"id\" [ngClass]=\"'label-styles'\">{{ label }}</label>\n <div class=\"input-group\">\n <div *ngIf=\"prependText\" class=\"input-group-prepend\">\n <span\n class=\"input-group-text custom-input-group-text\"\n id=\"basic-addon3\"\n >{{ prependText }}</span\n >\n </div>\n <input\n [type]=\"getInputType()\"\n class=\"form-control custom-input\"\n [id]=\"id\"\n [placeholder]=\"placeholder\"\n [(ngModel)]=\"value\"\n (input)=\"onInput($event)\"\n (change)=\"onChange($event)\"\n (focus)=\"onFocus($event)\"\n (blur)=\"onBlur($event)\"\n (keyup)=\"keyupEvent.emit($event)\"\n (keydown)=\"onKeyDown($event)\"\n (keypress)=\"keypressEvent.emit($event)\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [attr.maxlength]=\"maxlength\"\n [attr.minlength]=\"minlength\"\n [required]=\"required\"\n [attr.pattern]=\"pattern\"\n [autofocus]=\"autofocus\"\n [cpfMask]=\"useCpfMask\"\n [cnpjMask]=\"useCnpjMask\"\n [cepMask]=\"useCepMask\"\n />\n\n <div class=\"input-group-append\" *ngIf=\"buttonText\">\n <button type=\"button\" class=\"btn-group-append\" (click)=\"onButtonClick()\">\n {{ buttonText }}\n </button>\n </div>\n\n <!-- Modal para exibir mensagens de erro -->\n <div class=\"modal-overlay\" *ngIf=\"showErrorModal\">\n <div class=\"modal-content\">\n <span class=\"close\" (click)=\"closeModal()\">×</span>\n <p>{{ errorMessage }}</p>\n <button class=\"btn-ok\" (click)=\"closeModal()\">OK</button>\n </div>\n </div>\n </div>\n</div>\n", styles: ["@charset \"UTF-8\";.form-group{font-family:var(--font-family);font-size:1rem;font-weight:700}.form-check-input{font-family:var(--font-family);color:#333;font-size:.9rem}.form-check-label{width:623px;height:19px;top:1608px;left:133px;gap:0px;opacity:0px;font-family:var(--font-family);font-size:16px;line-height:19.36px;text-align:left}.custom-input{font-family:var(--font-family);color:#333;font-size:.9rem;height:46px}.custom-input::placeholder{font-size:14px;color:#d3d3d3}.form-label{font-family:var(--font-family);color:#333;font-size:1rem;font-weight:700}.label-styles{font-weight:400;font-family:var(--font-family);font-size:16px;line-height:19.36px;text-align:left;margin-top:1rem;margin-bottom:.5rem}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;padding:25px 30px;border-radius:8px;width:360px;text-align:center;position:relative;box-shadow:0 4px 12px #0003}.close{position:absolute;top:10px;right:15px;cursor:pointer;font-size:20px;color:#555;transition:color .3s}.close:hover{color:#f44336}.btn-ok{margin-top:20px;padding:8px 20px;border:none;background-color:#00444c;color:#fff;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .3s,transform .2s}.btn-ok:hover{background-color:#00363d;transform:scale(1.05)}.btn-ok:active{transform:scale(.98)}.input-group-text{padding:.64rem .75rem;font-family:var(--font-family);color:#6e6e6e;font-size:14px}.btn-group-append{padding:.69rem;font-family:var(--font-family);background-color:var(--secondary-color);border:0rem solid;color:var(--text-color);transition:border-width .2s,transform .1s;font-size:1rem;border-top-right-radius:6px;border-bottom-right-radius:6px}.btn-group-append:hover{background-color:var(--primary-color)}.custom-input-group-text{border-top-right-radius:0;border-bottom-right-radius:0;padding:.71rem .75rem;background-color:#e7e7e7;border:1px solid #dbdbdb}.btn-group-append:active{animation:blink .3s}@keyframes blink{0%{background-color:var(--primary-color);border-color:var(--primary-color)}50%{background-color:var(--secondary-color);border-color:var(--secondary-color)}to{background-color:var(--primary-color);border-color:var(--primary-color)}}\n"] }]
|
1974
1995
|
}], ctorParameters: function () { return [{ type: AuthService }]; }, propDecorators: { label: [{
|
1975
1996
|
type: Input
|
1976
1997
|
}], placeholder: [{
|
@@ -2013,6 +2034,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2013
2034
|
type: Input
|
2014
2035
|
}], displayCurrencySymbol: [{
|
2015
2036
|
type: Input
|
2037
|
+
}], prependText: [{
|
2038
|
+
type: Input
|
2039
|
+
}], buttonText: [{
|
2040
|
+
type: Input
|
2016
2041
|
}], inputEvent: [{
|
2017
2042
|
type: Output
|
2018
2043
|
}], changeEvent: [{
|
@@ -2027,6 +2052,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
2027
2052
|
type: Output
|
2028
2053
|
}], keypressEvent: [{
|
2029
2054
|
type: Output
|
2055
|
+
}], buttonClick: [{
|
2056
|
+
type: Output
|
2030
2057
|
}] } });
|
2031
2058
|
|
2032
2059
|
class MultiSelectComponent {
|
@@ -3372,6 +3399,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
3372
3399
|
args: ['dynamicComponent', { read: ViewContainerRef, static: true }]
|
3373
3400
|
}] } });
|
3374
3401
|
|
3402
|
+
class DynamicModalComponent {
|
3403
|
+
constructor() {
|
3404
|
+
this.modalTitle = "Modal Title";
|
3405
|
+
this.modalSizeClass = "";
|
3406
|
+
}
|
3407
|
+
closeModal() {
|
3408
|
+
const modalElement = document.getElementById("dynamicModal");
|
3409
|
+
if (modalElement) {
|
3410
|
+
modalElement.classList.remove("show");
|
3411
|
+
modalElement.setAttribute("aria-hidden", "true");
|
3412
|
+
modalElement.style.display = "none";
|
3413
|
+
document.body.classList.remove("modal-open");
|
3414
|
+
document.querySelector(".modal-backdrop")?.remove();
|
3415
|
+
}
|
3416
|
+
}
|
3417
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
3418
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DynamicModalComponent, selector: "argenta-dynamic-modal", inputs: { modalTitle: "modalTitle", modalSizeClass: "modalSizeClass" }, ngImport: i0, template: "<div\n class=\"modal fade\"\n id=\"dynamicModal\"\n tabindex=\"-1\"\n aria-labelledby=\"dynamicModalLabel\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" id=\"dynamicModalLabel\">{{ modalTitle }}</h5>\n <!-- Bot\u00E3o de fechar personalizado -->\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <!-- Proje\u00E7\u00E3o de conte\u00FAdo para o corpo da modal -->\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <!-- Proje\u00E7\u00E3o de conte\u00FAdo para o rodap\u00E9 da modal -->\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color);color:var(--text-color);font-size:1.25rem;font-family:var(--font-family);padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
3419
|
+
}
|
3420
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DynamicModalComponent, decorators: [{
|
3421
|
+
type: Component,
|
3422
|
+
args: [{ selector: "argenta-dynamic-modal", template: "<div\n class=\"modal fade\"\n id=\"dynamicModal\"\n tabindex=\"-1\"\n aria-labelledby=\"dynamicModalLabel\"\n aria-hidden=\"true\"\n>\n <div class=\"modal-dialog\" [ngClass]=\"modalSizeClass\">\n <div class=\"modal-content\">\n <div class=\"modal-header custom-header\">\n <h5 class=\"modal-title\" id=\"dynamicModalLabel\">{{ modalTitle }}</h5>\n <!-- Bot\u00E3o de fechar personalizado -->\n <button\n type=\"button\"\n class=\"custom-close-button\"\n (click)=\"closeModal()\"\n aria-label=\"Close\"\n >\n ×\n </button>\n </div>\n <div class=\"modal-body custom-body\">\n <!-- Proje\u00E7\u00E3o de conte\u00FAdo para o corpo da modal -->\n <ng-content select=\"[modal-body]\"></ng-content>\n </div>\n <div class=\"modal-footer custom-footer\">\n <!-- Proje\u00E7\u00E3o de conte\u00FAdo para o rodap\u00E9 da modal -->\n <ng-content select=\"[modal-footer]\"></ng-content>\n </div>\n </div>\n </div>\n</div>\n", styles: [".custom-header{background-color:var(--primary-color);color:var(--text-color);font-size:1.25rem;font-family:var(--font-family);padding:1rem;position:relative}.custom-header .custom-close-button{position:absolute;right:1rem;background:none;border:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}.custom-header .custom-close-button:hover{color:var(--danger-color)}.custom-body{background-color:#fff;padding:1rem}.custom-footer{background-color:#fff;padding:.75rem;display:flex;justify-content:flex-end;gap:.5rem}\n"] }]
|
3423
|
+
}], propDecorators: { modalTitle: [{
|
3424
|
+
type: Input
|
3425
|
+
}], modalSizeClass: [{
|
3426
|
+
type: Input
|
3427
|
+
}] } });
|
3428
|
+
|
3375
3429
|
// Select some icons (use an object, not an array)
|
3376
3430
|
class LucideIconsModule {
|
3377
3431
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LucideIconsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
@@ -3418,7 +3472,8 @@ class ComponentsModule {
|
|
3418
3472
|
CalendarArgentaComponent,
|
3419
3473
|
AccordionArgentaComponent,
|
3420
3474
|
JsonViewerComponent,
|
3421
|
-
ModalComponent
|
3475
|
+
ModalComponent,
|
3476
|
+
DynamicModalComponent], imports: [CommonModule,
|
3422
3477
|
FormsModule,
|
3423
3478
|
ReactiveFormsModule,
|
3424
3479
|
NgSelectModule,
|
@@ -3456,7 +3511,8 @@ class ComponentsModule {
|
|
3456
3511
|
CalendarArgentaComponent,
|
3457
3512
|
AccordionArgentaComponent,
|
3458
3513
|
JsonViewerComponent,
|
3459
|
-
ModalComponent
|
3514
|
+
ModalComponent,
|
3515
|
+
DynamicModalComponent] }); }
|
3460
3516
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ComponentsModule, imports: [CommonModule,
|
3461
3517
|
FormsModule,
|
3462
3518
|
ReactiveFormsModule,
|
@@ -3501,6 +3557,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
3501
3557
|
AccordionArgentaComponent,
|
3502
3558
|
JsonViewerComponent,
|
3503
3559
|
ModalComponent,
|
3560
|
+
DynamicModalComponent,
|
3504
3561
|
],
|
3505
3562
|
imports: [
|
3506
3563
|
CommonModule,
|
@@ -3545,6 +3602,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
3545
3602
|
AccordionArgentaComponent,
|
3546
3603
|
JsonViewerComponent,
|
3547
3604
|
ModalComponent,
|
3605
|
+
DynamicModalComponent,
|
3548
3606
|
],
|
3549
3607
|
}]
|
3550
3608
|
}] });
|
@@ -3754,5 +3812,5 @@ function convertToSnakeCase(input) {
|
|
3754
3812
|
* Generated bundle index. Do not edit.
|
3755
3813
|
*/
|
3756
3814
|
|
3757
|
-
export { AccordionArgentaComponent, AlertComponent, AppBackgroundComponent, AutofocusDirective, BadgeComponent, BasicRegistrationComponent, ButtonClasses, ButtonComponent, CalendarArgentaComponent, CardComponent, CepMaskDirective, CheckboxComponent, CnpjMaskDirective, CodeHighlightComponent, ComponentsModule, ConfirmationComponent, ConfirmationService, CpfMaskDirective, CustomPaginationComponent, CustomSwitchComponent, DataPaginateService, DataTableComponent, FileUploadComponent, InputComponent, JsonViewerComponent, LibPortalAngularModule, LucideIconsModule, ModalComponent, MultiSelectCategoryComponent, MultiSelectComponent, NotificationService, RadioComponent, RefreshService, RouterParameterService, SearchCustomerComponent, SearchInputComponent, SelectComponent, TabComponent, TextareaComponent, TreeNodeComponent, convertToSnakeCase, setThemeColors };
|
3815
|
+
export { AccordionArgentaComponent, AlertComponent, AppBackgroundComponent, AutofocusDirective, BadgeComponent, BasicRegistrationComponent, ButtonClasses, ButtonComponent, CalendarArgentaComponent, CardComponent, CepMaskDirective, CheckboxComponent, CnpjMaskDirective, CodeHighlightComponent, ComponentsModule, ConfirmationComponent, ConfirmationService, CpfMaskDirective, CustomPaginationComponent, CustomSwitchComponent, DataPaginateService, DataTableComponent, DynamicModalComponent, FileUploadComponent, InputComponent, JsonViewerComponent, LibPortalAngularModule, LucideIconsModule, ModalComponent, MultiSelectCategoryComponent, MultiSelectComponent, NotificationService, RadioComponent, RefreshService, RouterParameterService, SearchCustomerComponent, SearchInputComponent, SelectComponent, TabComponent, TextareaComponent, TreeNodeComponent, convertToSnakeCase, setThemeColors };
|
3758
3816
|
//# sourceMappingURL=lib-portal-angular.mjs.map
|