novo-elements 6.0.5 → 6.1.2

package/novo-elements.scss

@@ -98,13 +98,13 @@
   background-color: var(--background-body, $color-silver);
 }
 .txc-main {
-  color: var(--text-main, $color-dark);
-}
-.txc-bright {
-  color: var(--text-bright, $color-black);
+  color: var(--text-main, $color-charcoal);
 }
 .txc-muted {
-  color: var(--text-muted, $color-slate);
+  color: var(--text-muted, $color-neutral);
+}
+.txc-disabled {
+  color: var(--text-disabled, $color-slate);
 }
 
 @include theme-colors() using ($name, $color, $contrast, $tint, $shade, $pale) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "novo-elements",
-  "version": "6.0.5",
+  "version": "6.1.2",
   "sideEffects": true,
   "peerDependencies": {
     "@angular/animations": ">=10",

package/schematics/package.json

@@ -1,6 +1,6 @@
 {
   "name": "schematics",
-  "version": "6.0.5",
+  "version": "6.1.2",
   "description": "A novo-element schematics",
   "scripts": {
     "build": "tsc -p tsconfig.json",

package/src/elements/aside/aside-ref.d.ts

@@ -1,15 +1,17 @@
 import { OverlayRef } from '@angular/cdk/overlay';
 import { Observable } from 'rxjs';
 import { AsideComponent } from './aside.component';
-export declare class NovoAsideRef<T = any> {
+export declare class NovoAsideRef<T = any, R = any> {
     component: any;
     params: T;
     private overlayRef;
     constructor(component: any, params: T, overlayRef: OverlayRef);
     private _beforeClose;
     private _afterClosed;
+    isClosed: boolean;
     componentInstance: AsideComponent;
-    afterClosed(): Observable<void>;
-    beforeClose(): Observable<void>;
-    close(): void;
+    get onClosed(): Promise<R>;
+    afterClosed(): Observable<R>;
+    beforeClose(): Observable<R>;
+    close(result?: R): void;
 }

package/src/elements/aside/aside.service.d.ts

@@ -1,10 +1,11 @@
-import { Overlay, OverlayRef } from '@angular/cdk/overlay';
+import { Overlay } from '@angular/cdk/overlay';
 import { Injector } from '@angular/core';
+import { NovoAsideRef } from './aside-ref';
 export declare class NovoAsideService {
     private injector;
     private overlay;
     constructor(injector: Injector, overlay: Overlay);
-    open(component: any, params?: {}, config?: {}): OverlayRef;
+    open<R = any>(component: any, params?: {}, config?: {}): NovoAsideRef<{}, R>;
     private createOverlay;
     private attachAsideContainer;
     private createInjector;

package/src/elements/common/directives/accent.directive.d.ts

@@ -1,7 +1,12 @@
-import { ElementRef } from '@angular/core';
+import { ChangeDetectorRef, ElementRef } from '@angular/core';
+import { NovoTheme } from '../theme/theme-options';
 export declare class AccentColorDirective {
     private el;
+    private theme;
+    protected cdr: ChangeDetectorRef;
+    private subscription;
     accent: string;
     get hb_textColor(): string;
-    constructor(el: ElementRef);
+    constructor(el: ElementRef, theme: NovoTheme, cdr: ChangeDetectorRef);
+    onDestroy(): void;
 }

package/src/elements/common/index.d.ts

@@ -12,4 +12,5 @@ export * from './mixins';
 export * from './novo-template';
 export * from './option';
 export * from './selection';
+export * from './theme/theme-options';
 export * from './typography';

package/src/elements/common/theme/theme-options.d.ts

@@ -0,0 +1,29 @@
+import { EventEmitter } from '@angular/core';
+import { Observable } from 'rxjs';
+export declare class NovoThemeOptions {
+    themeName: string;
+}
+export interface ThemeChangeEvent {
+    themeName: string;
+    options?: NovoThemeOptions;
+}
+export declare class NovoTheme {
+    private _defaultTheme;
+    private _currentTheme;
+    onThemeChange: EventEmitter<ThemeChangeEvent>;
+    /** Name of the theme being used. defaults to `modern-light` */
+    get themeName(): string;
+    set themeName(value: string);
+    use(options: NovoThemeOptions): Observable<any>;
+    /**
+     * Changes the current theme
+     */
+    private changeTheme;
+}
+/**
+ getComputedStyle(document.documentElement)
+    .getPropertyValue('--my-variable-name'); // #999999
+ 
+ document.documentElement.style
+    .setProperty('--my-variable-name', 'pink');
+*/

package/src/elements/modal/modal-ref.d.ts

@@ -9,7 +9,7 @@ export interface ModalParams {
 }
 export declare class NovoModalParams implements ModalParams {
 }
-export declare class NovoModalRef<T = any> {
+export declare class NovoModalRef<T = any, R = any> {
     component: any;
     params: T;
     private overlayRef;
@@ -18,8 +18,8 @@ export declare class NovoModalRef<T = any> {
     private _afterClosed;
     componentInstance: NovoModalContainerComponent;
     isClosed: boolean;
-    get onClosed(): Promise<any>;
-    afterClosed(): Observable<any>;
-    beforeClose(): Observable<any>;
-    close(result?: any): void;
+    get onClosed(): Promise<R>;
+    afterClosed(): Observable<R>;
+    beforeClose(): Observable<R>;
+    close(result?: R): void;
 }

package/src/elements/modal/modal.service.d.ts

@@ -7,7 +7,7 @@ export declare class NovoModalService {
     _parentViewContainer: ViewContainerRef;
     set parentViewContainer(view: ViewContainerRef);
     constructor(injector: Injector, overlay: Overlay);
-    open<T extends Record<string, any>>(component: any, params?: Partial<T>): NovoModalRef<Partial<T>>;
+    open<T extends Record<string, any>>(component: any, params?: Partial<T>): NovoModalRef<Partial<T>, any>;
     private createOverlay;
     private attachModalContainer;
     private createInjector;

package/styles/themes/dark.scss

@@ -7,8 +7,8 @@
   --selection: #{$color-ocean}; // #1c76c5;
   --text-selection: #{$color-white};
   --text-main: #{$color-light};
-  --text-bright: #{$color-white};
-  --text-muted: #a9b1ba;
+  --text-muted: #{$color-stone};
+  --text-disabled: #a9b1ba;
   --links: #{$color-sky-blue}; // #41adff;
   --focus: #0096bfab;
   --border: #{$color-onyx};

package/styles/themes/light.scss

@@ -6,19 +6,18 @@
   --background-bright: #{$color-white}; //fff
   --background-dark: #{$color-silver}; //e2e2e2
   --background-muted: #{$color-sand}; //f4f4f4
+  --text-main: #{$color-charcoal}; //#363636;
+  --text-muted: #{$color-neutral}; //#70777f;
+  --text-disabled: #{$color-slate}; //#70777f;
   --selection: #{$color-ocean}; //#9e9e9e;
   --text-selection: #{$color-white};
-  --text-main: #{$color-dark}; //#363636;
-  --text-bright: #{$color-black};
-  --text-muted: #{$color-slate}; //#70777f;
-  // do we need disabled.
   --links: #{$color-ocean};
   --focus: #{$color-ocean};
   --border: #{$color-light}; //#dbdbdb;
   --code: #{$color-job};
   --animation-duration: 0.1s;
   --button-background: #{$light};
-  --button-text: #{$dark};
+  --button-text: #{$color-charcoal};
   --button-hover: #aaa;
   --scrollbar-thumb: #{$color-stone};
   --scrollbar-thumb-hover: #{$color-slate};

package/styles/typography.scss

@@ -56,16 +56,6 @@ p {
   padding: 0.25rem 0 0.55rem;
 }
 
-// h1,
-// h2,
-// h3,
-// h4,
-// h5,
-// h6,
-// strong {
-//   color: var(--text-bright);
-// }
-
 q::before {
   content: none;
 }