matcha-components 1.0.18 → 1.0.21

package/fesm2022/matcha-components.mjs

@@ -260,31 +260,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImpor
                 type: Input
             }] } });
 
-class MyTestComponentComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MyTestComponentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: MyTestComponentComponent, selector: "lib-my-test-component", ngImport: i0, template: "<p>my-test-component works 2!</p>\n", styles: [""] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MyTestComponentComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'lib-my-test-component', template: "<p>my-test-component works 2!</p>\n" }]
-        }] });
-
-class TestComponentModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: TestComponentModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.5", ngImport: i0, type: TestComponentModule, declarations: [MyTestComponentComponent], imports: [CommonModule], exports: [MyTestComponentComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: TestComponentModule, imports: [CommonModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: TestComponentModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [MyTestComponentComponent],
-                    imports: [
-                        CommonModule,
-                    ],
-                    exports: [MyTestComponentComponent]
-                }]
-        }] });
-
 class MatchaCardModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
     static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.5", ngImport: i0, type: MatchaCardModule, declarations: [MatchaCardComponent], imports: [CommonModule], exports: [MatchaCardComponent] }); }
@@ -497,13 +472,48 @@ class MatchaButtonDirective {
         this._renderer = _renderer;
         this.pill = false;
         this.size = null;
+        this.color = null;
+        this.outline = false;
+        this._config = {
+            size: 'md',
+            color: 'primary',
+            pill: false,
+            outline: false,
+        };
     }
     ngOnInit() {
+        this._renderer.addClass(this._elementRef.nativeElement, `matcha-button`);
         this._setConfig();
+        // Adicione o evento de clique apenas a elementos com a classe "matcha-button"
+        const buttons = document.querySelectorAll('.matcha-button');
+        buttons.forEach(button => {
+            button.addEventListener('click', this.addRippleEffect, false);
+        });
     }
     ngOnChanges() {
         this._setConfig();
     }
+    addRippleEffect(e) {
+        var target = e.target;
+        if (target.tagName.toLowerCase() !== 'button')
+            return false;
+        var rect = target.getBoundingClientRect();
+        var ripple = target.querySelector('.ripple');
+        if (!ripple) {
+            ripple = document.createElement('span');
+            ripple.className = 'ripple';
+            ripple.style.height = ripple.style.width = Math.max(rect.width, rect.height) + 'px';
+            target.appendChild(ripple);
+            console.log(ripple);
+        }
+        ripple.classList.remove('show');
+        var top = e.pageY - rect.top - ripple.offsetHeight / 2 - window.scrollY;
+        var left = e.pageX - rect.left - ripple.offsetWidth / 2 - window.scrollX;
+        ripple.style.top = top + 'px';
+        ripple.style.left = left + 'px';
+        ripple.classList.add('show');
+        return false;
+    }
     _setConfig() {
         // Remove todas as classes relacionadas ao tamanho
         ['xs', 'sm', 'md', 'lg', 'xl'].forEach((size) => {
@@ -513,7 +523,22 @@ class MatchaButtonDirective {
         if (this.size) {
             this._renderer.addClass(this._elementRef.nativeElement, `matcha-button-${this.size}`);
         }
-        if (this.pill) {
+        if (this.color) {
+            this._renderer.removeClass(this._elementRef.nativeElement, `color-${this._config.color}`);
+            this._renderer.removeClass(this._elementRef.nativeElement, `${this._config.color}`);
+            this._renderer.addClass(this._elementRef.nativeElement, `${this.color}`);
+            this._config.color = this.color;
+        }
+        if (this.outline) {
+            this._renderer.addClass(this._elementRef.nativeElement, `color-${this.color}`);
+            this._renderer.addClass(this._elementRef.nativeElement, `matcha-button-outline`);
+        }
+        else {
+            this._renderer.removeClass(this._elementRef.nativeElement, `color-${this.color}`);
+            this._renderer.removeClass(this._elementRef.nativeElement, `color-${this._config.color}`);
+            this._renderer.removeClass(this._elementRef.nativeElement, `matcha-button-outline`);
+        }
+        if (this.pill === true || this.pill === 'true') {
             this._renderer.addClass(this._elementRef.nativeElement, `matcha-button-pill`);
         }
         else {
@@ -521,7 +546,7 @@ class MatchaButtonDirective {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaButtonDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.5", type: MatchaButtonDirective, selector: "[matcha-button]", inputs: { pill: "pill", size: "size" }, usesOnChanges: true, ngImport: i0 }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.0.5", type: MatchaButtonDirective, selector: "[matcha-button]", inputs: { pill: "pill", size: "size", color: "color", outline: "outline" }, usesOnChanges: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaButtonDirective, decorators: [{
             type: Directive,
@@ -535,6 +560,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImpor
             }], size: [{
                 type: Input,
                 args: ['size']
+            }], color: [{
+                type: Input,
+                args: ['color']
+            }], outline: [{
+                type: Input,
+                args: ['outline']
             }] } });
 
 class MatchaButtonModule {
@@ -1429,8 +1460,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImpor
 
 class MatchaComponentsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, declarations: [MatchaOverflowDraggableComponent], imports: [TestComponentModule, MatchaCardModule, MatchaHeadersModule], exports: [TestComponentModule, MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, imports: [TestComponentModule, MatchaCardModule, MatchaHeadersModule, TestComponentModule, MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, declarations: [MatchaOverflowDraggableComponent], imports: [MatchaCardModule, MatchaHeadersModule], exports: [MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, imports: [MatchaCardModule, MatchaHeadersModule, MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: MatchaComponentsModule, decorators: [{
             type: NgModule,
@@ -1438,8 +1469,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImpor
                     declarations: [
                         MatchaOverflowDraggableComponent
                     ],
-                    imports: [TestComponentModule, MatchaCardModule, MatchaHeadersModule],
-                    exports: [TestComponentModule, MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule],
+                    imports: [MatchaCardModule, MatchaHeadersModule],
+                    exports: [MatchaCardModule, MatchaHeadersModule, MatchaAutocompleteModule, MatchaBadgeModule, MatchaTabsModule, MatchaBottomSheetModule, MatchaButtonToggleModule, MatchaButtonModule, MatchaCheckboxModule, MatchaChipsModule, MatchaDatepickerModule, MatchaDialogModule, MatchaDividerModule, MatchaElevationModule, MatchaExpansionModule, MatchaFormsModule, MatchaIconModule, MatchaInputModule, MatchaListModule, MatchaMenuModule, MatchaSidenavModule, MatchaPaginatorModule, MatchaProgressBarModule, MatchaProgressSpinnerModule, MatchaRadioButtonModule, MatchaSelectModule, MatchaSlideToggleModule, MatchaSliderModule, MatchaSnackBarModule, MatchaSortHeaderModule, MatchaStepperModule, MatchaTableModule, MatchaTabsModule, MatchaTooltipModule, MatchaTreeModule],
                 }]
         }] });
 
@@ -1476,5 +1507,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { MatchaAutocompleteDirective, MatchaAutocompleteModule, MatchaAutocompleteOverviewDirective, MatchaBadgeDirective, MatchaBadgeModule, MatchaBottomSheetDirective, MatchaBottomSheetModule, MatchaButtonDirective, MatchaButtonModule, MatchaButtonToggleDirective, MatchaButtonToggleModule, MatchaCardComponent, MatchaCardFooter, MatchaCardModule, MatchaCheckboxDirective, MatchaCheckboxModule, MatchaChipsDirective, MatchaChipsModule, MatchaComponentsModule, MatchaDatepickerDirective, MatchaDatepickerModule, MatchaDialogDirective, MatchaDialogModule, MatchaDividerDirective, MatchaDividerModule, MatchaElevationDirective, MatchaElevationModule, MatchaExpansionDirective, MatchaExpansionModule, MatchaFormFieldDirective, MatchaFormsModule, MatchaGridComponent, MatchaGridModule, MatchaHeadersModule, MatchaHeadlineComponent, MatchaIconComponent, MatchaIconModule, MatchaInputDirective, MatchaInputModule, MatchaListDirective, MatchaListModule, MatchaMenuDirective, MatchaMenuModule, MatchaPaginatorDirective, MatchaPaginatorModule, MatchaProgressBarDirective, MatchaProgressBarModule, MatchaProgressSpinnerDirective, MatchaProgressSpinnerModule, MatchaRadioButtonDirective, MatchaRadioButtonModule, MatchaSelectDirective, MatchaSelectModule, MatchaSidenavDirective, MatchaSidenavModule, MatchaSlideToggleDirective, MatchaSlideToggleModule, MatchaSliderDirective, MatchaSliderModule, MatchaSnackBarDirective, MatchaSnackBarModule, MatchaSortHeaderDirective, MatchaSortHeaderModule, MatchaStepperDirective, MatchaStepperModule, MatchaSubheadComponent, MatchaTableDirective, MatchaTableModule, MatchaTabsDirective, MatchaTabsModule, MatchaTitleComponent, MatchaTooltipDirective, MatchaTooltipModule, MatchaTreeDirective, MatchaTreeModule, MyTestComponentComponent, TestComponentModule };
+export { MatchaAutocompleteDirective, MatchaAutocompleteModule, MatchaAutocompleteOverviewDirective, MatchaBadgeDirective, MatchaBadgeModule, MatchaBottomSheetDirective, MatchaBottomSheetModule, MatchaButtonDirective, MatchaButtonModule, MatchaButtonToggleDirective, MatchaButtonToggleModule, MatchaCardComponent, MatchaCardFooter, MatchaCardModule, MatchaCheckboxDirective, MatchaCheckboxModule, MatchaChipsDirective, MatchaChipsModule, MatchaComponentsModule, MatchaDatepickerDirective, MatchaDatepickerModule, MatchaDialogDirective, MatchaDialogModule, MatchaDividerDirective, MatchaDividerModule, MatchaElevationDirective, MatchaElevationModule, MatchaExpansionDirective, MatchaExpansionModule, MatchaFormFieldDirective, MatchaFormsModule, MatchaGridComponent, MatchaGridModule, MatchaHeadersModule, MatchaHeadlineComponent, MatchaIconComponent, MatchaIconModule, MatchaInputDirective, MatchaInputModule, MatchaListDirective, MatchaListModule, MatchaMenuDirective, MatchaMenuModule, MatchaPaginatorDirective, MatchaPaginatorModule, MatchaProgressBarDirective, MatchaProgressBarModule, MatchaProgressSpinnerDirective, MatchaProgressSpinnerModule, MatchaRadioButtonDirective, MatchaRadioButtonModule, MatchaSelectDirective, MatchaSelectModule, MatchaSidenavDirective, MatchaSidenavModule, MatchaSlideToggleDirective, MatchaSlideToggleModule, MatchaSliderDirective, MatchaSliderModule, MatchaSnackBarDirective, MatchaSnackBarModule, MatchaSortHeaderDirective, MatchaSortHeaderModule, MatchaStepperDirective, MatchaStepperModule, MatchaSubheadComponent, MatchaTableDirective, MatchaTableModule, MatchaTabsDirective, MatchaTabsModule, MatchaTitleComponent, MatchaTooltipDirective, MatchaTooltipModule, MatchaTreeDirective, MatchaTreeModule };
 //# sourceMappingURL=matcha-components.mjs.map