refactor: make EffectRef private #

Author: xidedix

projects/coreui-angular/src/lib/accordion/accordion-item/accordion-item.component.ts

@@ -41,7 +41,7 @@ export class AccordionItemComponent implements OnInit, OnDestroy {
 
   readonly itemVisible = signal(false);
 
-  visibleInputChange = effect(() => {
+  readonly #visibleInputChange = effect(() => {
     setTimeout(() => {
       this.itemVisible.set(this.visibleInput());
     });

projects/coreui-angular/src/lib/button/button-close.directive.spec.ts

@@ -1,13 +1,13 @@
-import { ButtonCloseDirective } from './button-close.directive';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { Component, DebugElement, ElementRef } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
+import { ButtonCloseDirective } from './button-close.directive';
 
 class MockElementRef extends ElementRef {}
 
 @Component({
-    template: '<button cButtonClose></button>',
-    imports: [ButtonCloseDirective]
+  template: '<button cButtonClose></button>',
+  imports: [ButtonCloseDirective]
 })
 class TestComponent {}
 

projects/coreui-angular/src/lib/modal/modal/modal.component.ts

@@ -153,7 +153,7 @@ export class ModalComponent implements OnInit, OnDestroy, AfterViewInit {
    */
   readonly visibleInput = input(false, { transform: booleanAttribute, alias: 'visible' });
 
-  readonly visibleEffect = effect(() => {
+  readonly #visibleInputEffect = effect(() => {
     const visible = this.visibleInput();
     untracked(() => {
       this.visible = visible;

projects/coreui-angular/src/lib/nav/nav-link.directive.ts

@@ -39,7 +39,7 @@ export class NavLinkDirective {
   attrTabindex: '-1' | null = null;
   styleCursor: 'pointer' | null = null;
 
-  readonly disabledEffect = effect(() => {
+  readonly #disabledEffect = effect(() => {
     const disabled = this.disabled();
     this.ariaDisabled = disabled || null;
     this.attrDisabled = disabled ? '' : null;

projects/coreui-angular/src/lib/popover/popover.directive.ts

@@ -48,19 +48,19 @@ export class PopoverDirective implements OnDestroy, OnInit, AfterViewInit {
    */
   readonly content = input<string | TemplateRef<any> | undefined>(undefined, { alias: 'cPopover' });
 
-  readonly contentEffect = effect(() => {
+  readonly #contentEffect = effect(() => {
     if (this.content()) {
       this.destroyTooltipElement();
     }
   });
 
   /**
    * Optional popper Options object, takes precedence over cPopoverPlacement prop
-   * @type Partial<Options>
+   * @return Partial<Options>
    */
   readonly popperOptions = input<Partial<Options>>({}, { alias: 'cPopoverOptions' });
 
-  readonly popperOptionsEffect = effect(() => {
+  readonly #popperOptionsEffect = effect(() => {
     this._popperOptions = {
       ...this._popperOptions,
       placement: this.placement(),
@@ -100,7 +100,7 @@ export class PopoverDirective implements OnDestroy, OnInit, AfterViewInit {
    */
   readonly visible = model(false, { alias: 'cPopoverVisible' });
 
-  readonly visibleEffect = effect(() => {
+  readonly #visibleEffect = effect(() => {
     this.visible() ? this.addTooltipElement() : this.removeTooltipElement();
   });
 

projects/coreui-angular/src/lib/popover/popover/popover.component.ts

@@ -14,15 +14,15 @@ import {
 import { NgClass } from '@angular/common';
 
 @Component({
-    selector: 'c-popover',
-    templateUrl: './popover.component.html',
-    imports: [NgClass],
-    host: {
-        class: 'popover fade bs-popover-auto',
-        '[class]': 'hostClasses()',
-        '[attr.role]': 'role()',
-        '[attr.id]': 'id()'
-    }
+  selector: 'c-popover',
+  templateUrl: './popover.component.html',
+  imports: [NgClass],
+  host: {
+    class: 'popover fade bs-popover-auto',
+    '[class]': 'hostClasses()',
+    '[attr.role]': 'role()',
+    '[attr.id]': 'id()'
+  }
 })
 export class PopoverComponent implements OnDestroy {
   readonly renderer = inject(Renderer2);
@@ -33,7 +33,7 @@ export class PopoverComponent implements OnDestroy {
    */
   readonly content = input<string | TemplateRef<any>>('');
 
-  readonly contentEffect = effect(() => {
+  readonly #contentEffect = effect(() => {
     this.updateView(this.content());
   });
 

projects/coreui-angular/src/lib/services/color-mode.service.ts

@@ -19,7 +19,7 @@ export class ColorModeService {
   readonly localStorageItemName$ = toObservable(this.localStorageItemName);
   readonly colorMode: WritableSignal<ColorMode> = signal(undefined);
 
-  readonly colorModeEffect = effect(() => {
+  readonly #colorModeEffect = effect(() => {
     const colorMode = this.colorMode();
     if (colorMode) {
       const localStorageItemName = this.localStorageItemName();

projects/coreui-angular/src/lib/shared/html-attr.directive.ts

@@ -10,7 +10,7 @@ export class HtmlAttributesDirective {
   readonly #renderer = inject(Renderer2);
   readonly #elementRef = inject(ElementRef);
 
-  readonly attrEffect = effect(() => {
+  readonly #attrEffect = effect(() => {
     const attribs = this.cHtmlAttr();
     for (const attr in attribs) {
       if (attr === 'style' && typeof attribs[attr] === 'object') {

projects/coreui-angular/src/lib/sidebar/sidebar-nav/sidebar-nav.component.ts

@@ -194,7 +194,7 @@ export class SidebarNavGroupComponent implements OnInit, OnDestroy {
     SidebarNavLabelComponent,
     SidebarNavTitleComponent,
     SidebarNavDividerComponent,
-    SidebarNavGroupComponent,
+    forwardRef(() => SidebarNavGroupComponent),
     SidebarNavItemClassPipe,
     RouterModule
   ]

projects/coreui-angular/src/lib/tabs-2/tabs-list/tabs-list.component.ts

@@ -59,7 +59,7 @@ export class TabsListComponent {
   readonly tabs = contentChildren(TabDirective);
   #focusKeyManager!: FocusKeyManager<TabDirective>;
 
-  readonly tabsEffect = effect(() => {
+  readonly #tabsEffect = effect(() => {
     const tabs = this.tabs();
     if (tabs.length === 0) {
       return;
@@ -91,7 +91,7 @@ export class TabsListComponent {
     });
   });
 
-  readonly tabsServiceEffect = effect(() => {
+  readonly #tabsServiceEffect = effect(() => {
     const activeItemIndex = this.tabs().findIndex(
       (tab) => untracked(tab.isActive) && untracked(tab.itemKey) === this.tabsService.activeItemKey()
     );