ngx-opalbytes-components 1.0.2 → 1.1.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.
|
@@ -2,6 +2,8 @@ import * as i0 from '@angular/core';
|
|
|
2
2
|
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
|
+
import * as i2 from '@angular/material/tooltip';
|
|
6
|
+
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
5
7
|
|
|
6
8
|
class NgxOpalbytesComponents {
|
|
7
9
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: NgxOpalbytesComponents, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -36,6 +38,9 @@ class BaseButton {
|
|
|
36
38
|
if (!this.dataCy) {
|
|
37
39
|
this.dataCy = `btn-${this.buttonText.replace(/\s+/g, '-').toLowerCase()}`;
|
|
38
40
|
}
|
|
41
|
+
if (!this.tooltip && this.buttonText.length >= 20) {
|
|
42
|
+
this.tooltip = this.buttonText;
|
|
43
|
+
}
|
|
39
44
|
}
|
|
40
45
|
onClick() {
|
|
41
46
|
if (!this.isDisabled && !this.isLoading) {
|
|
@@ -43,11 +48,11 @@ class BaseButton {
|
|
|
43
48
|
}
|
|
44
49
|
}
|
|
45
50
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: BaseButton, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
46
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: BaseButton, isStandalone: true, selector: "lib-base-button", inputs: { buttonText: "buttonText", isDarkMode: "isDarkMode", isDisabled: "isDisabled", isLoading: "isLoading", useMaterialIcons: "useMaterialIcons", btnClass: "btnClass", tooltip: "tooltip", trailingIcon: "trailingIcon", leadingIcon: "leadingIcon", dataCy: "dataCy" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<button\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n", styles: ["button:hover{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
51
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: BaseButton, isStandalone: true, selector: "lib-base-button", inputs: { buttonText: "buttonText", isDarkMode: "isDarkMode", isDisabled: "isDisabled", isLoading: "isLoading", useMaterialIcons: "useMaterialIcons", btnClass: "btnClass", tooltip: "tooltip", trailingIcon: "trailingIcon", leadingIcon: "leadingIcon", dataCy: "dataCy" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<button\n [matTooltip]=\"tooltip\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"custom-arrow-tooltip\"\n [matTooltipDisabled]=\"!tooltip\"\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n", styles: ["button:hover{cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] });
|
|
47
52
|
}
|
|
48
53
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: BaseButton, decorators: [{
|
|
49
54
|
type: Component,
|
|
50
|
-
args: [{ selector: 'lib-base-button', imports: [CommonModule], template: "<button\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n", styles: ["button:hover{cursor:pointer}\n"] }]
|
|
55
|
+
args: [{ selector: 'lib-base-button', imports: [CommonModule, MatTooltipModule], template: "<button\n [matTooltip]=\"tooltip\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"custom-arrow-tooltip\"\n [matTooltipDisabled]=\"!tooltip\"\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n", styles: ["button:hover{cursor:pointer}\n"] }]
|
|
51
56
|
}], propDecorators: { buttonClick: [{
|
|
52
57
|
type: Output
|
|
53
58
|
}], buttonText: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngx-opalbytes-components.mjs","sources":["../../../projects/ngx-opalbytes-components/src/lib/ngx-opalbytes-components.ts","../../../projects/ngx-opalbytes-components/src/lib/shared/components/base-button/base-button.ts","../../../projects/ngx-opalbytes-components/src/lib/shared/components/base-button/base-button.html","../../../projects/ngx-opalbytes-components/src/public-api.ts","../../../projects/ngx-opalbytes-components/src/ngx-opalbytes-components.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-ngx-opalbytes-components',\n imports: [],\n template: `\n <p>\n ngx-opalbytes-components works!\n </p>\n `,\n styles: ``,\n})\nexport class NgxOpalbytesComponents {\n\n}\n","import { CommonModule } from '@angular/common';\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'lib-base-button',\n imports: [CommonModule],\n templateUrl: './base-button.html',\n styleUrl: './base-button.css',\n})\nexport class BaseButton implements OnInit {\n @Output() readonly buttonClick = new EventEmitter<void>();\n\n @Input() buttonText = \"Clique!\";\n @Input() isDarkMode = false;\n @Input() isDisabled = false;\n @Input() isLoading = false;\n @Input() useMaterialIcons = false;\n @Input() btnClass = \"\";\n\n @Input() tooltip?:string;\n @Input() trailingIcon?: string;\n @Input() leadingIcon?: string;\n @Input() dataCy?: string;\n\n ngOnInit(): void {\n if (!this.dataCy) {\n this.dataCy = `btn-${this.buttonText.replace(/\\s+/g, '-').toLowerCase()}`;\n }\n }\n\n onClick(): void {\n if (!this.isDisabled && !this.isLoading) {\n this.buttonClick.emit();\n }\n }\n}\n","<button\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n","/*\n * Public API Surface of ngx-opalbytes-components\n */\n\nexport * from './lib/ngx-opalbytes-components';\nexport * from './lib/shared/components/base-button/base-button'\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ngx-opalbytes-components.mjs","sources":["../../../projects/ngx-opalbytes-components/src/lib/ngx-opalbytes-components.ts","../../../projects/ngx-opalbytes-components/src/lib/shared/components/base-button/base-button.ts","../../../projects/ngx-opalbytes-components/src/lib/shared/components/base-button/base-button.html","../../../projects/ngx-opalbytes-components/src/public-api.ts","../../../projects/ngx-opalbytes-components/src/ngx-opalbytes-components.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'lib-ngx-opalbytes-components',\n imports: [],\n template: `\n <p>\n ngx-opalbytes-components works!\n </p>\n `,\n styles: ``,\n})\nexport class NgxOpalbytesComponents {\n\n}\n","import { CommonModule } from '@angular/common';\nimport { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n@Component({\n selector: 'lib-base-button',\n imports: [CommonModule, MatTooltipModule],\n templateUrl: './base-button.html',\n styleUrl: './base-button.css',\n})\nexport class BaseButton implements OnInit {\n @Output() readonly buttonClick = new EventEmitter<void>();\n\n @Input() buttonText = \"Clique!\";\n @Input() isDarkMode = false;\n @Input() isDisabled = false;\n @Input() isLoading = false;\n @Input() useMaterialIcons = false;\n @Input() btnClass = \"\";\n\n @Input() tooltip?:string;\n @Input() trailingIcon?: string;\n @Input() leadingIcon?: string;\n @Input() dataCy?: string;\n\n ngOnInit(): void {\n if (!this.dataCy) {\n this.dataCy = `btn-${this.buttonText.replace(/\\s+/g, '-').toLowerCase()}`;\n }\n\n if(!this.tooltip && this.buttonText.length >= 20){\n this.tooltip = this.buttonText\n }\n }\n\n onClick(): void {\n if (!this.isDisabled && !this.isLoading) {\n this.buttonClick.emit();\n }\n }\n}\n","<button\n [matTooltip]=\"tooltip\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"custom-arrow-tooltip\"\n [matTooltipDisabled]=\"!tooltip\"\n [disabled]=\"isDisabled || isLoading\"\n [class.darkMode]=\"isDarkMode\"\n [class.disabled]=\"isDisabled\"\n [class.loading]=\"isLoading\"\n [ngClass]=\"btnClass\"\n [attr.data-cy]=\"dataCy\"\n (click)=\"onClick()\">\n @if (leadingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons leading-icon' : 'leading-icon'\">\n @if(useMaterialIcons) { {{ leadingIcon }} } @else {\n <img [src]=\"leadingIcon\" alt=\"icon\" />\n }\n </span>\n } {{ buttonText }} @if (trailingIcon) {\n <span [class]=\"useMaterialIcons ? 'material-icons trailing-icon' : 'trailing-icon'\">\n @if(useMaterialIcons){ {{ trailingIcon }} } @else {\n <img [src]=\"trailingIcon\" alt=\"icon\" />\n }\n </span>\n } @if (isLoading) {\n <span class=\"loader\"></span>\n }\n</button>\n","/*\n * Public API Surface of ngx-opalbytes-components\n */\n\nexport * from './lib/ngx-opalbytes-components';\nexport * from './lib/shared/components/base-button/base-button'\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|