tailjng 0.0.12 → 0.0.13

package/lib/services/icons.service.d.ts

@@ -0,0 +1,9 @@
+import * as i0 from "@angular/core";
+export declare class JIconsService {
+    icons: {
+        Info: import("lucide-angular").LucideIconData;
+    };
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<JIconsService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<JIconsService>;
+}

package/lib/tailjng.component.d.ts

@@ -0,0 +1,5 @@
+import * as i0 from "@angular/core";
+export declare class TailjngComponent {
+    static ɵfac: i0.ɵɵFactoryDeclaration<TailjngComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<TailjngComponent, "lib-tailjng", never, {}, {}, never, never, true, never>;
+}

package/lib/tailjng.service.d.ts

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class TailjngService {
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<TailjngService, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<TailjngService>;
+}

package/package.json

@@ -1,9 +1,15 @@
 {
   "name": "tailjng",
-  "version": "0.0.12",
+  "version": "0.0.13",
   "peerDependencies": {
     "@angular/common": "^19.2.0",
-    "@angular/core": "^19.2.0"
+    "@angular/core": "^19.2.0",
+    "@ng-icons/lucide": ">=29.0.0",
+    "lucide-angular": ">=0.477.0",
+    "tailwindcss": ">=4.0.9"
+  },
+  "bin": {
+    "tailjng": "./cli/tailjng.js"
   },
   "dependencies": {
     "tslib": "^2.3.0"

package/public-api.d.ts

@@ -1,30 +1,3 @@
-export * from './lib/components/mode-toggle/mode-toggle.component';
-export * from './lib/components/tooltip/tooltip.directive';
-export * from './lib/components/label/label.component';
-export * from './lib/components/input/input.component';
-export * from './lib/components/checkbox/checkbox.component';
-export * from './lib/components/button/button.component';
-export * from './lib/shared/dialog.shared';
-export * from './lib/components/dialog/dialog.component';
-export * from './lib/components/alert-toast/elements/alert-toast.service';
-export * from './lib/components/alert-toast/alert-toast.component';
-export * from './lib/components/alert-dialog/elements/alert-dialog.service';
-export * from './lib/components/alert-dialog/alert-dialog.component';
-export * from './lib/http/api-url';
-export * from './lib/http/converter.service';
-export * from './lib/http/crud-generic.service';
-export * from './lib/http/http-rest.service';
-export * from './lib/http/http-error.service';
-export * from './lib/components/select/select.component';
-export * from './lib/components/toggle-radio/toggle-radio.component';
-export * from './lib/colors/theme/theme.component';
-export * from './lib/components/crud/card-component/card.component';
-export * from './lib/components/crud/filter-component/filter.component';
-export * from './lib/components/crud/filter-component/elements/filter.interface';
-export * from './lib/shared/form.shared';
-export * from './lib/components/crud/form-component/form.component';
-export * from './lib/components/crud/form-component/components/content-form/content-form.component';
-export * from './lib/components/crud/form-component/components/error-message/error-message.component';
-export * from './lib/components/crud/paginator-component/paginator.component';
-export * from './lib/components/crud/table-component/table.component';
-export * from './lib/components/crud/table-component/elements/table.interface';
+export * from './lib/tailjng.service';
+export * from './lib/tailjng.component';
+export * from './lib/services/icons.service';

package/src/lib/components/label/label.component.html

@@ -0,0 +1,25 @@
+<label 
+  [for]="for"
+  [ngClass]="ngClass"
+  [class]="classes"
+  class="flex gap-1 items-center text-black dark:text-white"
+>
+  <ng-content></ng-content>
+
+  @if (isRequired || isConditioned || isAutomated) {
+    <div class="text-[8px]">
+      <span [ngClass]="{
+          'text-red-600 dark:text-red-300': isRequired,
+          'text-blue-600 dark:text-blue-300': !isRequired && isConditioned,
+          'text-purple-600 dark:text-purple-300': !isRequired && !isConditioned && isAutomated
+      }">✱</span>
+    </div>
+  }
+
+  @if (tooltip) {
+  <span [jTooltip]="tooltip" [jTooltipPosition]="tooltipPosition" >
+    <lucide-icon [name]="iconsService.icons.Info" [size]="15" />
+  </span>
+  }
+
+</label>

package/src/lib/components/label/label.component.ts

@@ -0,0 +1,27 @@
+import { NgClass } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { JTooltipDirective } from '../tooltip/tooltip.directive';
+import { JIconsService } from '../../services/icons.service';
+import { LucideAngularModule } from 'lucide-angular';
+
+@Component({
+  selector: 'JLabel',
+  imports: [NgClass, JTooltipDirective, LucideAngularModule],
+  templateUrl: './label.component.html',
+  styleUrl: './label.component.css'
+})
+export class JLabelComponent {
+
+  constructor(public iconsService: JIconsService) { }
+
+  @Input() tooltipPosition: 'top' | 'right' | 'bottom' | 'left' = 'top';
+  @Input() tooltip: string = '';
+  @Input() for: string = '';
+  
+  @Input() classes: string = '';
+  @Input() ngClass: { [key: string]: boolean } = {};
+  
+  @Input() isRequired: boolean = false;
+  @Input() isConditioned: boolean = false;
+  @Input() isAutomated: boolean = false;
+}

package/src/lib/components/tooltip/tooltip.directive.ts

@@ -0,0 +1,341 @@
+import { Directive, ElementRef, Input, OnDestroy, HostListener, NgZone, TemplateRef, ViewContainerRef, } from "@angular/core"
+import { JTooltipService } from "./tooltip.service"
+
+@Directive({
+  selector: '[jTooltip]'
+})
+export class JTooltipDirective implements OnDestroy {
+
+  @Input("jTooltip") content!: string | TemplateRef<any>;
+
+  @Input() jTooltipPosition: "top" | "right" | "bottom" | "left" = "top";
+  @Input() jTooltipShowArrow = true;
+
+  @Input() jTooltipOffsetX = 0;
+  @Input() jTooltipOffsetY = 0;
+
+  private mouseTrackingInterval: any;
+  private touchStartTimer: any;
+  touchStartTime: number = 0;
+  private readonly touchHoldDelay: number = 500;
+
+  private isTooltipVisible: boolean = false;
+  private readonly isTouchDevice: boolean = false;
+  private hasShownTooltip: boolean = false;
+
+  private lastMousePosition: { clientX: number; clientY: number } | null = null
+
+  constructor(
+    private readonly el: ElementRef,
+    private readonly tooltipService: JTooltipService,
+    private readonly zone: NgZone,
+    private readonly viewContainerRef: ViewContainerRef,
+  ) {
+    // Detected tactile devices
+    this.isTouchDevice = "ontouchstart" in window || navigator.maxTouchPoints > 0
+  }
+
+  ngOnDestroy() {
+    this.stopMouseTracking()
+
+    // Clean up touch start timer if it exists
+    if (this.touchStartTimer) {
+      clearTimeout(this.touchStartTimer)
+      this.touchStartTimer = null
+    }
+
+    this.tooltipService.hide()
+  }
+
+
+
+  // ==========================================================
+  // Events desktop (mouse)
+  // ==========================================================
+
+  /**
+   * Show the tooltip on mouse enter.
+   * If the device is touch, it will not show the tooltip.
+   * @returns 
+   */
+  @HostListener("mouseenter")
+  onMouseEnter() {
+    if (this.isTouchDevice) return;
+    this.show();
+  }
+
+
+  /**
+   * Hide the tooltip on mouse leave.
+   * If the device is touch, it will not hide the tooltip.
+   * @returns 
+   */
+  @HostListener("mouseleave")
+  onMouseLeave() {
+    if (this.isTouchDevice) return;
+    this.hide();
+  }
+
+
+
+  // ==========================================================
+  // Events mobile (touch)
+  // ==========================================================
+
+  /**
+   * Show the tooltip on touch start.
+   * If the device is not touch, it will not show the tooltip.
+   * @param event 
+   * @returns 
+   */
+  @HostListener("touchstart", ["$event"])
+  onTouchStart(event: TouchEvent) {
+    if (!this.isTouchDevice) return;
+
+    this.touchStartTime = Date.now()
+    this.hasShownTooltip = false;
+
+    // Init timer to show tooltip after delay
+    this.touchStartTimer = setTimeout(() => {
+      this.hasShownTooltip = true;
+      this.show();
+    }, this.touchHoldDelay)
+  }
+
+
+  /**
+   * Hide the tooltip on touch end.
+   * If the device is not touch, it will not hide the tooltip.
+   * @param event 
+   * @returns 
+   */
+  @HostListener("touchend", ["$event"])
+  onTouchEnd(event: TouchEvent) {
+    if (!this.isTouchDevice) return;
+
+    // Cancel the timer if released before the delay
+    if (this.touchStartTimer) {
+      clearTimeout(this.touchStartTimer)
+      this.touchStartTimer = null;
+    }
+
+    // Hide tooltip if it is visible
+    if (this.isTooltipVisible) {
+      this.hide();
+    }
+
+    // If the tooltip was shown, prevent default action
+    if (this.hasShownTooltip) {
+      event.preventDefault();
+      event.stopPropagation();
+    }
+  }
+
+
+  /**
+   * Hide the tooltip on touch cancel.
+   * If the device is not touch, it will not hide the tooltip.
+   * @param event 
+   * @returns 
+   */
+  @HostListener("touchcancel", ["$event"])
+  onTouchCancel(event: TouchEvent) {
+    if (!this.isTouchDevice) return;
+
+    // Cancel the timer if it exists
+    if (this.touchStartTimer) {
+      clearTimeout(this.touchStartTimer)
+      this.touchStartTimer = null;
+    }
+
+    // Hide the tooltip if it is visible
+    if (this.isTooltipVisible) {
+      this.hide();
+    }
+
+    this.hasShownTooltip = false;
+  }
+
+
+  /**
+   * Handle touch move events.
+   * If the device is not touch, it will not handle the event.
+   * @param event 
+   * @returns 
+   */
+  @HostListener("touchmove", ["$event"])
+  onTouchMove(event: TouchEvent) {
+    if (!this.isTouchDevice) return;
+
+    // If the finger moves too much, cancel the tooltip
+    const touch = event.touches[0]
+    const rect = this.el.nativeElement.getBoundingClientRect()
+
+    // Check if the finger is still inside the element
+    const isInsideElement =
+      touch.clientX >= rect.left &&
+      touch.clientX <= rect.right &&
+      touch.clientY >= rect.top &&
+      touch.clientY <= rect.bottom
+
+    if (!isInsideElement) {
+      // Cancel the timer if the finger leaves the element
+      if (this.touchStartTimer) {
+        clearTimeout(this.touchStartTimer)
+        this.touchStartTimer = null
+      }
+
+      // Hide the tooltip if it is visible
+      if (this.isTooltipVisible) {
+        this.hide()
+      }
+
+      this.hasShownTooltip = false
+    }
+  }
+
+
+
+  // ==========================================================
+  // Functions
+  // ==========================================================
+
+  /**
+   * Show the tooltip with the specified content, target element, position, arrow visibility, and offsets.
+   * This method creates the tooltip element, sets its content, and positions it relative to the target element.
+   * @returns 
+   */
+  private show() {
+    if (!this.content) return;
+
+    this.isTooltipVisible = true;
+
+    // Only start mouse tracking on desktop
+    if (!this.isTouchDevice) {
+      this.startMouseTracking();
+    }
+
+    this.zone.runOutsideAngular(() => {
+      let finalContent: string | HTMLElement = ""
+
+      if (this.content instanceof TemplateRef) {
+        const view = this.content.createEmbeddedView({});
+        this.viewContainerRef.insert(view);
+        view.detectChanges();
+
+        const fragment = document.createElement("div");
+        view.rootNodes.forEach((node) => fragment.appendChild(node.cloneNode(true)));
+        finalContent = fragment;
+
+        view.destroy();
+
+      } else {
+        finalContent = this.content;
+      }
+
+      this.tooltipService.show(
+        finalContent,
+        this.el.nativeElement,
+        this.jTooltipPosition,
+        this.jTooltipShowArrow,
+        this.jTooltipOffsetX,
+        this.jTooltipOffsetY,
+      )
+    })
+  }
+
+
+  /**
+   * Start mouse tracking to update tooltip position.
+   * This method sets an interval to update the tooltip position based on mouse movements.
+   */
+  private hide() {
+    this.isTooltipVisible = false
+    this.stopMouseTracking()
+    this.zone.runOutsideAngular(() => {
+      this.tooltipService.hide()
+    })
+  }
+
+
+  /**
+   * Stop mouse tracking by clearing the interval and removing global event listeners.
+   * This method ensures that no multiple intervals are running and cleans up the event listeners.
+   * @return
+   */
+  private startMouseTracking() {
+    this.stopMouseTracking();
+
+    this.zone.runOutsideAngular(() => {
+      this.mouseTrackingInterval = setInterval(() => {
+        if (!this.isTooltipVisible) return
+
+        // Obtener la posición actual del mouse
+        const mouseEvent = this.getLastMousePosition()
+        if (!mouseEvent) return
+
+        // Verificar si el mouse sigue sobre el elemento
+        const elementUnderMouse = document.elementFromPoint(mouseEvent.clientX, mouseEvent.clientY)
+        const isMouseOverElement =
+          this.el.nativeElement.contains(elementUnderMouse) || this.el.nativeElement === elementUnderMouse
+
+        if (!isMouseOverElement && this.isTooltipVisible) {
+          this.zone.run(() => {
+            this.hide()
+          })
+        }
+      }, 100)
+    })
+
+    // Add listener for global mouse move events
+    document.addEventListener("mousemove", this.onGlobalMouseMove)
+  }
+
+
+  /**
+   * Stop mouse tracking by clearing the interval and removing global event listeners.
+   * This method ensures that no multiple intervals are running and cleans up the event listeners.
+   * @returns
+   */
+  private stopMouseTracking() {
+    if (this.mouseTrackingInterval) {
+      clearInterval(this.mouseTrackingInterval)
+      this.mouseTrackingInterval = null
+    }
+    document.removeEventListener("mousemove", this.onGlobalMouseMove)
+  }
+
+
+  /**
+   * Handle global mouse move events.
+   * @param event The mouse event.
+   * @returns 
+   */
+  private readonly onGlobalMouseMove = (event: MouseEvent) => {
+    this.lastMousePosition = { clientX: event.clientX, clientY: event.clientY }
+
+    if (!this.isTooltipVisible) return
+
+    // Verify if the mouse is still over the element
+    const elementUnderMouse = document.elementFromPoint(event.clientX, event.clientY)
+    const isMouseOverElement =
+      this.el.nativeElement.contains(elementUnderMouse) || this.el.nativeElement === elementUnderMouse
+
+    if (!isMouseOverElement) {
+      this.zone.run(() => {
+        this.hide()
+      })
+    }
+  }
+
+
+  /**
+   * Get the last mouse position.
+   * This method returns the last recorded mouse position.
+   * @returns 
+   */
+  private getLastMousePosition() {
+    return this.lastMousePosition
+  }
+
+}

package/src/lib/components/tooltip/tooltip.service.ts

@@ -0,0 +1,192 @@
+import { Injectable, Renderer2, RendererFactory2 } from "@angular/core"
+
+@Injectable({
+  providedIn: 'root'
+})
+export class JTooltipService {
+
+  private readonly renderer: Renderer2;
+
+  private tooltipElement: HTMLElement | null = null;
+  private arrowElement: HTMLElement | null = null;
+  private showArrow = true;
+
+  private offsetX = 0;
+  private offsetY = 0;
+
+  constructor(rendererFactory: RendererFactory2) {
+    this.renderer = rendererFactory.createRenderer(null, null);
+  }
+
+
+  /**
+   * Show the tooltip with the specified content, target element, position, arrow visibility, and offsets.
+   * @param content The content to display in the tooltip.
+   * @param target The target element to attach the tooltip to.
+   * @param position The position of the tooltip relative to the target element.
+   * @param showArrow Whether to show the arrow pointing to the target element.
+   * @param offsetX The horizontal offset of the tooltip.
+   * @param offsetY The vertical offset of the tooltip.
+   * @returns 
+   */
+  show(
+    content: string | HTMLElement,
+    target: HTMLElement,
+    position = "top",
+    showArrow = true,
+    offsetX = 0,
+    offsetY = 0,
+  ) {
+    if (!content || !target) return
+
+    this.hide()
+    this.showArrow = showArrow
+    this.offsetX = offsetX
+    this.offsetY = offsetY
+
+    if (!this.tooltipElement) {
+      this.tooltipElement = this.renderer.createElement("div")
+      this.renderer.addClass(this.tooltipElement, "j-tooltip")
+      this.renderer.setStyle(this.tooltipElement, "position", "absolute")
+      this.renderer.setStyle(this.tooltipElement, "z-index", "9999")
+      this.renderer.setStyle(this.tooltipElement, "background-color", "#333")
+      this.renderer.setStyle(this.tooltipElement, "color", "white")
+      this.renderer.setStyle(this.tooltipElement, "padding", "0.5rem")
+      this.renderer.setStyle(this.tooltipElement, "border-radius", "0.25rem")
+      this.renderer.setStyle(this.tooltipElement, "font-size", "0.875rem")
+      this.renderer.setStyle(this.tooltipElement, "pointer-events", "none")
+      this.renderer.setStyle(this.tooltipElement, "box-shadow", "0 2px 4px rgba(0,0,0,0.2)")
+      this.renderer.setStyle(this.tooltipElement, "max-width", "230px")
+      this.renderer.setStyle(this.tooltipElement, "word-wrap", "break-word")
+      this.renderer.setStyle(this.tooltipElement, "transition", "opacity 0.2s ease, transform 0.2s ease")
+
+      this.arrowElement = this.renderer.createElement("div")
+      this.renderer.setStyle(this.arrowElement, "position", "absolute")
+      this.renderer.setStyle(this.arrowElement, "width", "0")
+      this.renderer.setStyle(this.arrowElement, "height", "0")
+      this.renderer.setStyle(this.arrowElement, "border-style", "solid")
+    }
+
+    if (this.tooltipElement) {
+      while (this.tooltipElement.firstChild) {
+        this.tooltipElement.removeChild(this.tooltipElement.firstChild)
+      }
+    }
+
+    if (typeof content === "string") {
+      this.tooltipElement!.textContent = content
+    } else if (content instanceof HTMLElement) {
+      this.renderer.appendChild(this.tooltipElement!, content.cloneNode(true))
+    }
+
+    if (this.showArrow) {
+      this.renderer.appendChild(this.tooltipElement!, this.arrowElement!)
+    }
+
+    this.renderer.appendChild(document.body, this.tooltipElement)
+    this.renderer.setStyle(this.tooltipElement, "opacity", "0")
+    this.renderer.setStyle(this.tooltipElement, "transform", "scale(1)")
+    this.renderer.setStyle(this.tooltipElement, "display", "block")
+
+    this.positionAbsolute(target, position)
+
+    requestAnimationFrame(() => {
+      this.renderer.setStyle(this.tooltipElement!, "opacity", "1")
+    })
+  }
+
+
+
+  /**
+   * Hide the tooltip if it is currently displayed.
+   * * This method sets the tooltip's opacity to 0, scales it down, and hides it from view.
+   * @returns
+   */
+  hide() {
+    if (this.tooltipElement) {
+      this.renderer.setStyle(this.tooltipElement, "opacity", "0")
+      this.renderer.setStyle(this.tooltipElement, "transform", "scale(0.95)")
+      this.renderer.setStyle(this.tooltipElement, "display", "none")
+    }
+  }
+
+
+
+  /**
+   * Position the tooltip absolutely relative to the target element.
+   * @param target The target element to position the tooltip against.
+   * @param position The position of the tooltip (top, bottom, left, right).
+   * @returns
+   */
+  positionAbsolute(target: HTMLElement, position: string) {
+    if (!this.tooltipElement) return
+
+    const tooltipRect = this.tooltipElement.getBoundingClientRect()
+    const targetRect = target.getBoundingClientRect()
+
+    const arrowSize = 6
+    let left = 0
+    let top = 0
+
+    if (this.showArrow && this.arrowElement) {
+      this.renderer.setStyle(this.arrowElement, "border-width", `${arrowSize}px`)
+      this.renderer.setStyle(this.arrowElement, "border-color", "transparent")
+      this.renderer.setStyle(this.arrowElement, "top", "")
+      this.renderer.setStyle(this.arrowElement, "bottom", "")
+      this.renderer.setStyle(this.arrowElement, "left", "")
+      this.renderer.setStyle(this.arrowElement, "right", "")
+    }
+
+    switch (position) {
+      case "top":
+        left = targetRect.left + targetRect.width / 2 - tooltipRect.width / 2 + this.offsetX
+        top = targetRect.top - tooltipRect.height - arrowSize + this.offsetY
+        if (this.showArrow && this.arrowElement) {
+          this.renderer.setStyle(this.arrowElement, "bottom", `-5px`)
+          this.renderer.setStyle(this.arrowElement, "left", `calc(50% - ${arrowSize}px)`)
+          this.renderer.setStyle(this.arrowElement, "border-top-color", "#333")
+          this.renderer.setStyle(this.arrowElement, "border-bottom-width", "0")
+        }
+        break
+
+      case "bottom":
+        left = targetRect.left + targetRect.width / 2 - tooltipRect.width / 2 + this.offsetX
+        top = targetRect.bottom + arrowSize + this.offsetY
+        if (this.showArrow && this.arrowElement) {
+          this.renderer.setStyle(this.arrowElement, "top", `-5px`)
+          this.renderer.setStyle(this.arrowElement, "left", `calc(50% - ${arrowSize}px)`)
+          this.renderer.setStyle(this.arrowElement, "border-bottom-color", "#333")
+          this.renderer.setStyle(this.arrowElement, "border-top-width", "0")
+        }
+        break
+
+      case "left":
+        left = targetRect.left - tooltipRect.width - arrowSize + this.offsetX
+        top = targetRect.top + targetRect.height / 2 - tooltipRect.height / 2 + this.offsetY
+        if (this.showArrow && this.arrowElement) {
+          this.renderer.setStyle(this.arrowElement, "right", `-5px`)
+          this.renderer.setStyle(this.arrowElement, "top", `calc(50% - ${arrowSize}px)`)
+          this.renderer.setStyle(this.arrowElement, "border-left-color", "#333")
+          this.renderer.setStyle(this.arrowElement, "border-right-width", "0")
+        }
+        break
+
+      case "right":
+        left = targetRect.right + arrowSize + this.offsetX
+        top = targetRect.top + targetRect.height / 2 - tooltipRect.height / 2 + this.offsetY
+        if (this.showArrow && this.arrowElement) {
+          this.renderer.setStyle(this.arrowElement, "left", `-5px`)
+          this.renderer.setStyle(this.arrowElement, "top", `calc(50% - ${arrowSize}px)`)
+          this.renderer.setStyle(this.arrowElement, "border-right-color", "#333")
+          this.renderer.setStyle(this.arrowElement, "border-left-width", "0")
+        }
+        break
+    }
+
+    this.renderer.setStyle(this.tooltipElement, "left", `${left + window.scrollX}px`)
+    this.renderer.setStyle(this.tooltipElement, "top", `${top + window.scrollY}px`)
+  }
+
+
+
+}

package/lib/colors/colors.service.d.ts

@@ -1,16 +0,0 @@
-import * as i0 from "@angular/core";
-export declare class JColorsService {
-    variants: {
-        [key: string]: string;
-    };
-    getAlertClass(type: string, monocromatic: boolean): "border-green-500 bg-green-50 dark:bg-[#15241f]" | "border-red-500 bg-red-50 dark:bg-[#21181c]" | "border-yellow-500 bg-yellow-50 dark:bg-[#1f1c1a]" | "border-blue-500 bg-blue-50 dark:bg-[#1a1a24]" | "border-purple-500 bg-purple-50 dark:bg-[#241732]" | "border-gray-500 bg-gray-50 dark:bg-[#15181e]" | "border-gray-500" | "bg-white dark:bg-dark-popover border-border dark:border-dark-border";
-    getIconClass(type: string, monocromatic: boolean): "text-green-500" | "text-red-500" | "text-yellow-500" | "text-blue-500" | "text-purple-500" | "text-gray-500" | "text-primary";
-    getButtonClass(type: string, monocromatic: boolean): {
-        [key: string]: boolean;
-    };
-    getButtonSecondaryClass(type: string, monocromatic: boolean): {
-        [key: string]: boolean;
-    };
-    static ɵfac: i0.ɵɵFactoryDeclaration<JColorsService, never>;
-    static ɵprov: i0.ɵɵInjectableDeclaration<JColorsService>;
-}