@dev-tcloud/tcloud-ui 0.1.6 → 0.1.8

package/fesm2020/dev-tcloud-tcloud-ui.mjs

@@ -4370,10 +4370,22 @@ class TCloudUiTooltipDirective {
     constructor(el, renderer) {
         this.el = el;
         this.renderer = renderer;
+        this.remove = false;
         this.info_text = '';
         this._direction = 'top';
     }
     onMouseOver(event) {
+        let hoverInCallback = () => {
+            this.remove = false;
+        };
+        let hoverOutCallback = () => {
+            this.remove = true;
+            const customDiv = document.querySelector('.tc-directive-tooltip');
+            if (customDiv) {
+                customDiv.remove();
+            }
+        };
+        hoverOutCallback;
         const scrollTop = window.scrollY || window.pageYOffset;
         const tooltip = this.renderer.createElement('div');
         const rect = this.el.nativeElement?.getBoundingClientRect();
@@ -4396,20 +4408,37 @@ class TCloudUiTooltipDirective {
         this.renderer.addClass(tooltip, `tc-directive-tooltip-${direction}`);
         const id = this.generateID();
         this.renderer.setAttribute(tooltip, 'id', id);
-        const textNode = this.renderer.createText(`${this.info_text}`);
-        this.renderer.appendChild(tooltip, textNode);
-        this.renderer.appendChild(document.body, tooltip);
-        this.start_tooltip(id, height, width, el_position_x, el_position_y, direction);
+        const textNode = this.info_text;
+        if (textNode !== undefined && textNode !== null && textNode !== '') {
+            tooltip.innerHTML = textNode;
+            this.renderer.appendChild(document.body, tooltip);
+            this.start_tooltip(id, height, width, el_position_x, el_position_y, direction);
+            if (tooltip) {
+                tooltip.addEventListener('mouseenter', hoverInCallback);
+                tooltip.addEventListener('mouseleave', hoverOutCallback);
+            }
+        }
     }
     onMouseOut(event) {
-        const customDiv = document.querySelector('.tc-directive-tooltip');
+        this.remove = true;
+        this.remove_tooltip(document.querySelector('.tc-directive-tooltip'));
+    }
+    remove_tooltip(customDiv) {
         if (customDiv) {
-            customDiv.remove();
+            setTimeout(() => {
+                if (this.remove) {
+                    customDiv.remove();
+                }
+            }, 30);
         }
     }
     set TCtooltip(tooltip) {
         if (tooltip) {
-            this.info_text = tooltip;
+            if (typeof tooltip === 'object') {
+            }
+            else {
+                this.info_text = tooltip;
+            }
         }
     }
     set TCdirection(direction) {
@@ -4477,14 +4506,65 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                 type: Input
             }] } });
 
+class TCloudUiElCopyDirective {
+    constructor(el, renderer) {
+        this.el = el;
+        this.renderer = renderer;
+        this._isCopy = false;
+    }
+    ngOnInit() {
+        console.log('el', this.el.nativeElement);
+        this.setItemFuncCopy();
+    }
+    setItemFuncCopy() {
+        const btn_copy = this.renderer.createElement('i');
+        var copyText = () => {
+            const elementWithCopyAttribute = document.querySelector(`[data-el-copy="${id}"]`);
+            const copyText = elementWithCopyAttribute?.textContent;
+            navigator.clipboard.writeText(copyText);
+            this.renderer.removeClass(btn_copy, 'fa-copy');
+            this.renderer.addClass(btn_copy, 'fa-check');
+            setTimeout(() => {
+                this.renderer.removeClass(btn_copy, 'fa-check');
+                this.renderer.addClass(btn_copy, 'fa-copy');
+            }, 3000);
+        };
+        const id = this.generateID();
+        this.renderer.setAttribute(this.el.nativeElement, 'data-el-copy', `${id}`);
+        this.renderer.setStyle(btn_copy, 'cursor', 'pointer');
+        this.renderer.setStyle(btn_copy, 'margin-left', '3px');
+        this.renderer.addClass(btn_copy, 'fas');
+        this.renderer.addClass(btn_copy, 'fa-copy');
+        this.renderer.addClass(btn_copy, 'tcloud-ui-el-copy');
+        this.renderer.setAttribute(btn_copy, 'id', id);
+        this.renderer.setAttribute(btn_copy, 'title', 'Copy');
+        this.renderer.listen(btn_copy, 'click', () => { copyText(); });
+        this.renderer.appendChild(this.el.nativeElement, btn_copy);
+    }
+    generateID(target) {
+        const ref = (target) ? `-${target}` : '';
+        return `tc-el-copy-${Math.floor(Math.random() * Math.floor(Math.random() * Date.now()))}${ref}`;
+    }
+}
+TCloudUiElCopyDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiElCopyDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+TCloudUiElCopyDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.12", type: TCloudUiElCopyDirective, selector: "[TCCopy]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiElCopyDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[TCCopy]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; } });
+
 class TCloudUiDirectiveModule {
 }
 TCloudUiDirectiveModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiDirectiveModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
 TCloudUiDirectiveModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiDirectiveModule, declarations: [TCloudUiTooltipDirective,
         TCloudUiAlignDirective,
-        TCloudUiHoverParentDirective], exports: [TCloudUiTooltipDirective,
+        TCloudUiHoverParentDirective,
+        TCloudUiElCopyDirective], exports: [TCloudUiTooltipDirective,
         TCloudUiAlignDirective,
-        TCloudUiHoverParentDirective] });
+        TCloudUiHoverParentDirective,
+        TCloudUiElCopyDirective] });
 TCloudUiDirectiveModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiDirectiveModule });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: TCloudUiDirectiveModule, decorators: [{
             type: NgModule,
@@ -4492,12 +4572,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
                     declarations: [
                         TCloudUiTooltipDirective,
                         TCloudUiAlignDirective,
-                        TCloudUiHoverParentDirective
+                        TCloudUiHoverParentDirective,
+                        TCloudUiElCopyDirective
                     ],
                     exports: [
                         TCloudUiTooltipDirective,
                         TCloudUiAlignDirective,
-                        TCloudUiHoverParentDirective
+                        TCloudUiHoverParentDirective,
+                        TCloudUiElCopyDirective
                     ],
                 }]
         }] });
@@ -5331,5 +5413,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, MonthNamePipe, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionModule, TCloudUiAccordionTitleComponent, TCloudUiAlignDirective, TCloudUiChoiceIssuesComponent, TCloudUiChoiceIssuesModule, TCloudUiDataListComponent, TCloudUiDataListModule, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerModule, TCloudUiDatepickerTimeComponent, TCloudUiDatepickerTimeModule, TCloudUiDirectiveModule, TCloudUiFiltersComponent, TCloudUiFiltersModule, TCloudUiHoverParentDirective, TCloudUiInputPasswordComponent, TCloudUiInputPasswordModule, TCloudUiInputSearchComponent, TCloudUiInputSearchModule, TCloudUiLineStepCircleComponent, TCloudUiLineStepCircleModule, TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModalModule, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiInputModule, TCloudUiMultiSelectComponent, TCloudUiMultiSelectModule, TCloudUiMultiplesValuesComponent, TCloudUiMultiplesValuesModule, TCloudUiNotFoundComponent, TCloudUiNotFoundModule, TCloudUiNumberStepComponent, TCloudUiNumberStepModule, TCloudUiPipesModule, TCloudUiRangeDateComponent, TCloudUiScrollBoxComponent, TCloudUiScrollBoxModule, TCloudUiSearchInObjectService, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTableModule, TCloudUiTooltipDirective, TCloudUiWelcomeComponent, TCloudUiWelcomeModule, ToTextPipe };
+export { BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, MonthNamePipe, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionModule, TCloudUiAccordionTitleComponent, TCloudUiAlignDirective, TCloudUiChoiceIssuesComponent, TCloudUiChoiceIssuesModule, TCloudUiDataListComponent, TCloudUiDataListModule, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerModule, TCloudUiDatepickerTimeComponent, TCloudUiDatepickerTimeModule, TCloudUiDirectiveModule, TCloudUiElCopyDirective, TCloudUiFiltersComponent, TCloudUiFiltersModule, TCloudUiHoverParentDirective, TCloudUiInputPasswordComponent, TCloudUiInputPasswordModule, TCloudUiInputSearchComponent, TCloudUiInputSearchModule, TCloudUiLineStepCircleComponent, TCloudUiLineStepCircleModule, TCloudUiLinhaLogoComponent, TCloudUiLinhaLogoModule, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModalModule, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiInputModule, TCloudUiMultiSelectComponent, TCloudUiMultiSelectModule, TCloudUiMultiplesValuesComponent, TCloudUiMultiplesValuesModule, TCloudUiNotFoundComponent, TCloudUiNotFoundModule, TCloudUiNumberStepComponent, TCloudUiNumberStepModule, TCloudUiPipesModule, TCloudUiRangeDateComponent, TCloudUiScrollBoxComponent, TCloudUiScrollBoxModule, TCloudUiSearchInObjectService, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabMenuModule, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTableModule, TCloudUiTooltipDirective, TCloudUiWelcomeComponent, TCloudUiWelcomeModule, ToTextPipe };
 //# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map