@ngstarter-ui/components 1.0.33 → 1.0.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, PLATFORM_ID, DOCUMENT, effect, TemplateRef, Directive, ViewContainerRef, contentChild, computed, output, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
2
|
+
import { inject, PLATFORM_ID, DOCUMENT, DestroyRef, effect, TemplateRef, Directive, ViewContainerRef, contentChild, computed, output, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { isPlatformBrowser } from '@angular/common';
|
|
4
4
|
import { signalStore, withState, withMethods, patchState, withHooks } from '@ngrx/signals';
|
|
5
5
|
import { TemplatePortal, CdkPortalOutlet } from '@angular/cdk/portal';
|
|
@@ -8,13 +8,25 @@ import { Button } from '@ngstarter-ui/components/button';
|
|
|
8
8
|
const COLOR_SCHEME_LOCAL_KEY = 'ngstarter-color-scheme';
|
|
9
9
|
|
|
10
10
|
const initialState = {
|
|
11
|
-
theme: '
|
|
11
|
+
theme: 'auto',
|
|
12
|
+
resolvedTheme: 'light',
|
|
12
13
|
};
|
|
13
14
|
const ColorSchemeStore = signalStore(withState(initialState), withMethods((store) => {
|
|
14
15
|
const platformId = inject(PLATFORM_ID);
|
|
16
|
+
const document = inject(DOCUMENT);
|
|
17
|
+
const resolveScheme = (scheme) => {
|
|
18
|
+
if (scheme !== 'auto') {
|
|
19
|
+
return scheme;
|
|
20
|
+
}
|
|
21
|
+
const media = document.defaultView?.matchMedia?.('(prefers-color-scheme: dark)');
|
|
22
|
+
return media?.matches ? 'dark' : 'light';
|
|
23
|
+
};
|
|
15
24
|
return {
|
|
16
25
|
setScheme(scheme) {
|
|
17
|
-
patchState(store, {
|
|
26
|
+
patchState(store, {
|
|
27
|
+
theme: scheme,
|
|
28
|
+
resolvedTheme: resolveScheme(scheme),
|
|
29
|
+
});
|
|
18
30
|
if (isPlatformBrowser(platformId)) {
|
|
19
31
|
localStorage.setItem(COLOR_SCHEME_LOCAL_KEY, scheme);
|
|
20
32
|
}
|
|
@@ -23,14 +35,30 @@ const ColorSchemeStore = signalStore(withState(initialState), withMethods((store
|
|
|
23
35
|
}), withHooks({
|
|
24
36
|
onInit(store) {
|
|
25
37
|
const document = inject(DOCUMENT);
|
|
38
|
+
const platformId = inject(PLATFORM_ID);
|
|
39
|
+
const destroyRef = inject(DestroyRef);
|
|
40
|
+
const media = document.defaultView?.matchMedia?.('(prefers-color-scheme: dark)');
|
|
41
|
+
if (isPlatformBrowser(platformId) && media) {
|
|
42
|
+
const updateResolvedScheme = () => {
|
|
43
|
+
if (store.theme() === 'auto') {
|
|
44
|
+
patchState(store, { resolvedTheme: media.matches ? 'dark' : 'light' });
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
updateResolvedScheme();
|
|
48
|
+
media.addEventListener('change', updateResolvedScheme);
|
|
49
|
+
destroyRef.onDestroy(() => media.removeEventListener('change', updateResolvedScheme));
|
|
50
|
+
}
|
|
26
51
|
effect(() => {
|
|
27
52
|
const scheme = store.theme();
|
|
28
|
-
|
|
53
|
+
const resolvedScheme = scheme === 'auto' ? store.resolvedTheme() : scheme;
|
|
54
|
+
if (resolvedScheme === 'dark') {
|
|
29
55
|
document.documentElement.classList.add('dark');
|
|
30
56
|
}
|
|
31
|
-
else if (
|
|
57
|
+
else if (resolvedScheme === 'light') {
|
|
32
58
|
document.documentElement.classList.remove('dark');
|
|
33
59
|
}
|
|
60
|
+
document.documentElement.setAttribute('data-ngs-color-scheme', scheme);
|
|
61
|
+
document.documentElement.setAttribute('data-ngs-resolved-color-scheme', resolvedScheme);
|
|
34
62
|
});
|
|
35
63
|
},
|
|
36
64
|
}));
|
|
@@ -59,33 +87,62 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
59
87
|
}]
|
|
60
88
|
}] });
|
|
61
89
|
|
|
90
|
+
class ColorSchemeAutoDirective {
|
|
91
|
+
templateRef = inject(TemplateRef);
|
|
92
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ColorSchemeAutoDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
93
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.4", type: ColorSchemeAutoDirective, isStandalone: true, selector: "[ngsColorSchemeAuto]", ngImport: i0 });
|
|
94
|
+
}
|
|
95
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ColorSchemeAutoDirective, decorators: [{
|
|
96
|
+
type: Directive,
|
|
97
|
+
args: [{
|
|
98
|
+
selector: '[ngsColorSchemeAuto]'
|
|
99
|
+
}]
|
|
100
|
+
}] });
|
|
101
|
+
|
|
62
102
|
class ColorSchemeSwitcher {
|
|
63
103
|
store = inject(ColorSchemeStore);
|
|
64
104
|
viewContainerRef = inject(ViewContainerRef);
|
|
65
|
-
lightRef = contentChild
|
|
66
|
-
darkRef = contentChild
|
|
105
|
+
lightRef = contentChild(ColorSchemeLightDirective, ...(ngDevMode ? [{ debugName: "lightRef" }] : /* istanbul ignore next */ []));
|
|
106
|
+
darkRef = contentChild(ColorSchemeDarkDirective, ...(ngDevMode ? [{ debugName: "darkRef" }] : /* istanbul ignore next */ []));
|
|
107
|
+
autoRef = contentChild(ColorSchemeAutoDirective, ...(ngDevMode ? [{ debugName: "autoRef" }] : /* istanbul ignore next */ []));
|
|
67
108
|
colorScheme = computed(() => this.store.theme(), ...(ngDevMode ? [{ debugName: "colorScheme" }] : /* istanbul ignore next */ []));
|
|
109
|
+
resolvedColorScheme = computed(() => this.store.resolvedTheme(), ...(ngDevMode ? [{ debugName: "resolvedColorScheme" }] : /* istanbul ignore next */ []));
|
|
68
110
|
colorSchemeChanged = output();
|
|
69
|
-
portal;
|
|
70
|
-
|
|
71
|
-
|
|
111
|
+
portal = null;
|
|
112
|
+
constructor() {
|
|
113
|
+
effect(() => {
|
|
114
|
+
this.colorScheme();
|
|
115
|
+
this.resolvedColorScheme();
|
|
116
|
+
this.lightRef();
|
|
117
|
+
this.darkRef();
|
|
118
|
+
this.autoRef();
|
|
119
|
+
this.setPortal();
|
|
120
|
+
});
|
|
72
121
|
}
|
|
73
122
|
toggleScheme() {
|
|
74
|
-
const
|
|
123
|
+
const order = ['light', 'dark', 'auto'];
|
|
124
|
+
const currentIndex = order.indexOf(this.store.theme());
|
|
125
|
+
const newScheme = order[(currentIndex + 1) % order.length];
|
|
75
126
|
this.store.setScheme(newScheme);
|
|
76
127
|
this.setPortal();
|
|
77
128
|
this.colorSchemeChanged.emit(this.store.theme());
|
|
78
129
|
}
|
|
79
130
|
setPortal() {
|
|
80
|
-
|
|
81
|
-
|
|
131
|
+
const lightRef = this.lightRef();
|
|
132
|
+
const darkRef = this.darkRef();
|
|
133
|
+
const autoRef = this.autoRef();
|
|
134
|
+
if (this.colorScheme() === 'auto' && autoRef) {
|
|
135
|
+
this.portal = new TemplatePortal(autoRef.templateRef, this.viewContainerRef);
|
|
136
|
+
}
|
|
137
|
+
else if (this.resolvedColorScheme() === 'light' && lightRef) {
|
|
138
|
+
this.portal = new TemplatePortal(lightRef.templateRef, this.viewContainerRef);
|
|
82
139
|
}
|
|
83
|
-
else if (this.
|
|
84
|
-
this.portal = new TemplatePortal(
|
|
140
|
+
else if (this.resolvedColorScheme() === 'dark' && darkRef) {
|
|
141
|
+
this.portal = new TemplatePortal(darkRef.templateRef, this.viewContainerRef);
|
|
85
142
|
}
|
|
86
143
|
}
|
|
87
144
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ColorSchemeSwitcher, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
88
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.
|
|
145
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: ColorSchemeSwitcher, isStandalone: true, selector: "ngs-color-scheme-switcher", outputs: { colorSchemeChanged: "colorSchemeChanged" }, host: { attributes: { "ngSkipHydration": "true" }, classAttribute: "ngs-color-scheme-switcher" }, queries: [{ propertyName: "lightRef", first: true, predicate: ColorSchemeLightDirective, descendants: true, isSignal: true }, { propertyName: "darkRef", first: true, predicate: ColorSchemeDarkDirective, descendants: true, isSignal: true }, { propertyName: "autoRef", first: true, predicate: ColorSchemeAutoDirective, descendants: true, isSignal: true }], exportAs: ["ngsColorSchemeSwitcher"], ngImport: i0, template: "<button ngsIconButton (click)=\"toggleScheme()\">\n @if (portal) {\n <ng-container [cdkPortalOutlet]=\"portal\"/>\n }\n</button>\n", styles: [":host{display:block;width:max-content}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: Button, selector: " button[ngsButton], button[ngsIconButton], a[ngsButton], a[ngsIconButton] ", inputs: ["ngsButton", "ngsIconButton", "loading", "disabled", "disabledInteractive", "disableRipple", "reverse", "fullWidth", "hideTextOnMobile"], exportAs: ["ngsButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
89
146
|
}
|
|
90
147
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: ColorSchemeSwitcher, decorators: [{
|
|
91
148
|
type: Component,
|
|
@@ -95,12 +152,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
|
|
|
95
152
|
], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
96
153
|
'class': 'ngs-color-scheme-switcher',
|
|
97
154
|
ngSkipHydration: 'true' // important! to prevent double render for icons
|
|
98
|
-
}, template: "<button ngsIconButton (click)=\"toggleScheme()\">\n <ng-container [cdkPortalOutlet]=\"portal\"/>\n</button>\n", styles: [":host{display:block;width:max-content}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
99
|
-
}], propDecorators: { lightRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ColorSchemeLightDirective), { isSignal: true }] }], darkRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ColorSchemeDarkDirective), { isSignal: true }] }], colorSchemeChanged: [{ type: i0.Output, args: ["colorSchemeChanged"] }] } });
|
|
155
|
+
}, template: "<button ngsIconButton (click)=\"toggleScheme()\">\n @if (portal) {\n <ng-container [cdkPortalOutlet]=\"portal\"/>\n }\n</button>\n", styles: [":host{display:block;width:max-content}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
|
|
156
|
+
}], ctorParameters: () => [], propDecorators: { lightRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ColorSchemeLightDirective), { isSignal: true }] }], darkRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ColorSchemeDarkDirective), { isSignal: true }] }], autoRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => ColorSchemeAutoDirective), { isSignal: true }] }], colorSchemeChanged: [{ type: i0.Output, args: ["colorSchemeChanged"] }] } });
|
|
100
157
|
|
|
101
158
|
/**
|
|
102
159
|
* Generated bundle index. Do not edit.
|
|
103
160
|
*/
|
|
104
161
|
|
|
105
|
-
export { COLOR_SCHEME_LOCAL_KEY, ColorSchemeDarkDirective, ColorSchemeLightDirective, ColorSchemeStore, ColorSchemeSwitcher };
|
|
162
|
+
export { COLOR_SCHEME_LOCAL_KEY, ColorSchemeAutoDirective, ColorSchemeDarkDirective, ColorSchemeLightDirective, ColorSchemeStore, ColorSchemeSwitcher };
|
|
106
163
|
//# sourceMappingURL=ngstarter-ui-components-color-scheme.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngstarter-ui-components-color-scheme.mjs","sources":["../../../projects/components/color-scheme/src/color-scheme.model.ts","../../../projects/components/color-scheme/src/color-scheme.store.ts","../../../projects/components/color-scheme/src/color-scheme-light.directive.ts","../../../projects/components/color-scheme/src/color-scheme-dark.directive.ts","../../../projects/components/color-scheme/src/color-scheme-switcher/color-scheme-switcher.ts","../../../projects/components/color-scheme/src/color-scheme-switcher/color-scheme-switcher.html","../../../projects/components/color-scheme/ngstarter-ui-components-color-scheme.ts"],"sourcesContent":["export const COLOR_SCHEME_LOCAL_KEY = 'ngstarter-color-scheme';\nexport type ColorScheme = 'light' | 'dark';\n","import { effect, inject, PLATFORM_ID, DOCUMENT } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport { patchState, signalStore, withHooks, withMethods, withState } from '@ngrx/signals';\nimport { COLOR_SCHEME_LOCAL_KEY, ColorScheme } from './color-scheme.model';\n\ntype ColorSchemeState = {\n theme: ColorScheme;\n};\n\nconst initialState: ColorSchemeState = {\n theme: 'light',\n};\n\nexport const ColorSchemeStore = signalStore(\n withState(initialState),\n withMethods((store) => {\n const platformId = inject(PLATFORM_ID);\n return {\n setScheme(scheme: ColorScheme): void {\n patchState(store, { theme: scheme });\n if (isPlatformBrowser(platformId)) {\n localStorage.setItem(COLOR_SCHEME_LOCAL_KEY, scheme);\n }\n },\n };\n }),\n withHooks({\n onInit(store) {\n const document = inject(DOCUMENT);\n\n effect(() => {\n const scheme = store.theme();\n\n if (scheme === 'dark') {\n document.documentElement.classList.add('dark');\n } else if (scheme === 'light') {\n document.documentElement.classList.remove('dark');\n }\n });\n },\n }),\n);\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsColorSchemeLight]'\n})\nexport class ColorSchemeLightDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsColorSchemeDark]'\n})\nexport class ColorSchemeDarkDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n ChangeDetectionStrategy,\n Component, computed,\n contentChild,\n inject,\n OnInit, output,\n ViewContainerRef\n} from '@angular/core';\nimport { ColorSchemeStore } from '../color-scheme.store';\nimport { CdkPortalOutlet, TemplatePortal } from '@angular/cdk/portal';\nimport { ColorSchemeLightDirective } from '../color-scheme-light.directive';\nimport { ColorSchemeDarkDirective } from '../color-scheme-dark.directive';\nimport { ColorScheme } from '../color-scheme.model';\nimport { Button } from '@ngstarter-ui/components/button';\n\n@Component({\n selector: 'ngs-color-scheme-switcher',\n exportAs: 'ngsColorSchemeSwitcher',\n imports: [\n\n CdkPortalOutlet,\n Button,\n ],\n templateUrl: './color-scheme-switcher.html',\n styleUrl: './color-scheme-switcher.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-color-scheme-switcher',\n ngSkipHydration: 'true' // important! to prevent double render for icons\n }\n})\nexport class ColorSchemeSwitcher implements OnInit {\n private store = inject(ColorSchemeStore);\n private viewContainerRef = inject(ViewContainerRef);\n\n private lightRef = contentChild.required(ColorSchemeLightDirective);\n private darkRef = contentChild.required(ColorSchemeDarkDirective);\n\n readonly colorScheme = computed(() => this.store.theme());\n readonly colorSchemeChanged = output<ColorScheme>();\n\n protected portal!: TemplatePortal<any>;\n\n ngOnInit() {\n this.setPortal();\n }\n\n protected toggleScheme() {\n const newScheme = this.store.theme() === 'dark' ? 'light' : 'dark';\n this.store.setScheme(newScheme);\n this.setPortal();\n this.colorSchemeChanged.emit(this.store.theme());\n }\n\n private setPortal() {\n if (this.colorScheme() === 'light') {\n this.portal = new TemplatePortal(this.lightRef().templateRef, this.viewContainerRef);\n } else if (this.colorScheme() === 'dark') {\n this.portal = new TemplatePortal(this.darkRef().templateRef, this.viewContainerRef);\n }\n }\n}\n","<button ngsIconButton (click)=\"toggleScheme()\">\n <ng-container [cdkPortalOutlet]=\"portal\"/>\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngstarter-ui-components-color-scheme.mjs","sources":["../../../projects/components/color-scheme/src/color-scheme.model.ts","../../../projects/components/color-scheme/src/color-scheme.store.ts","../../../projects/components/color-scheme/src/color-scheme-light.directive.ts","../../../projects/components/color-scheme/src/color-scheme-dark.directive.ts","../../../projects/components/color-scheme/src/color-scheme-auto.directive.ts","../../../projects/components/color-scheme/src/color-scheme-switcher/color-scheme-switcher.ts","../../../projects/components/color-scheme/src/color-scheme-switcher/color-scheme-switcher.html","../../../projects/components/color-scheme/ngstarter-ui-components-color-scheme.ts"],"sourcesContent":["export const COLOR_SCHEME_LOCAL_KEY = 'ngstarter-color-scheme';\nexport type ColorScheme = 'light' | 'dark' | 'auto';\nexport type ResolvedColorScheme = Exclude<ColorScheme, 'auto'>;\n","import { DestroyRef, effect, inject, PLATFORM_ID, DOCUMENT } from '@angular/core';\nimport { isPlatformBrowser } from '@angular/common';\nimport { patchState, signalStore, withHooks, withMethods, withState } from '@ngrx/signals';\nimport { COLOR_SCHEME_LOCAL_KEY, ColorScheme, ResolvedColorScheme } from './color-scheme.model';\n\ntype ColorSchemeState = {\n theme: ColorScheme;\n resolvedTheme: ResolvedColorScheme;\n};\n\nconst initialState: ColorSchemeState = {\n theme: 'auto',\n resolvedTheme: 'light',\n};\n\nexport const ColorSchemeStore = signalStore(\n withState(initialState),\n withMethods((store) => {\n const platformId = inject(PLATFORM_ID);\n const document = inject(DOCUMENT);\n\n const resolveScheme = (scheme: ColorScheme): ResolvedColorScheme => {\n if (scheme !== 'auto') {\n return scheme;\n }\n\n const media = document.defaultView?.matchMedia?.('(prefers-color-scheme: dark)');\n return media?.matches ? 'dark' : 'light';\n };\n\n return {\n setScheme(scheme: ColorScheme): void {\n patchState(store, {\n theme: scheme,\n resolvedTheme: resolveScheme(scheme),\n });\n\n if (isPlatformBrowser(platformId)) {\n localStorage.setItem(COLOR_SCHEME_LOCAL_KEY, scheme);\n }\n },\n };\n }),\n withHooks({\n onInit(store) {\n const document = inject(DOCUMENT);\n const platformId = inject(PLATFORM_ID);\n const destroyRef = inject(DestroyRef);\n const media = document.defaultView?.matchMedia?.('(prefers-color-scheme: dark)');\n\n if (isPlatformBrowser(platformId) && media) {\n const updateResolvedScheme = () => {\n if (store.theme() === 'auto') {\n patchState(store, { resolvedTheme: media.matches ? 'dark' : 'light' });\n }\n };\n\n updateResolvedScheme();\n media.addEventListener('change', updateResolvedScheme);\n destroyRef.onDestroy(() => media.removeEventListener('change', updateResolvedScheme));\n }\n\n effect(() => {\n const scheme = store.theme();\n const resolvedScheme = scheme === 'auto' ? store.resolvedTheme() : scheme;\n\n if (resolvedScheme === 'dark') {\n document.documentElement.classList.add('dark');\n } else if (resolvedScheme === 'light') {\n document.documentElement.classList.remove('dark');\n }\n\n document.documentElement.setAttribute('data-ngs-color-scheme', scheme);\n document.documentElement.setAttribute('data-ngs-resolved-color-scheme', resolvedScheme);\n });\n },\n }),\n);\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsColorSchemeLight]'\n})\nexport class ColorSchemeLightDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsColorSchemeDark]'\n})\nexport class ColorSchemeDarkDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsColorSchemeAuto]'\n})\nexport class ColorSchemeAutoDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n ChangeDetectionStrategy,\n Component,\n computed,\n contentChild,\n effect,\n inject,\n output,\n ViewContainerRef\n} from '@angular/core';\nimport { ColorSchemeStore } from '../color-scheme.store';\nimport { CdkPortalOutlet, TemplatePortal } from '@angular/cdk/portal';\nimport { ColorSchemeLightDirective } from '../color-scheme-light.directive';\nimport { ColorSchemeDarkDirective } from '../color-scheme-dark.directive';\nimport { ColorScheme } from '../color-scheme.model';\nimport { Button } from '@ngstarter-ui/components/button';\nimport { ColorSchemeAutoDirective } from '../color-scheme-auto.directive';\n\n@Component({\n selector: 'ngs-color-scheme-switcher',\n exportAs: 'ngsColorSchemeSwitcher',\n imports: [\n\n CdkPortalOutlet,\n Button,\n ],\n templateUrl: './color-scheme-switcher.html',\n styleUrl: './color-scheme-switcher.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'class': 'ngs-color-scheme-switcher',\n ngSkipHydration: 'true' // important! to prevent double render for icons\n }\n})\nexport class ColorSchemeSwitcher {\n private store = inject(ColorSchemeStore);\n private viewContainerRef = inject(ViewContainerRef);\n\n private lightRef = contentChild(ColorSchemeLightDirective);\n private darkRef = contentChild(ColorSchemeDarkDirective);\n private autoRef = contentChild(ColorSchemeAutoDirective);\n\n readonly colorScheme = computed(() => this.store.theme());\n readonly resolvedColorScheme = computed(() => this.store.resolvedTheme());\n readonly colorSchemeChanged = output<ColorScheme>();\n\n protected portal: TemplatePortal<any> | null = null;\n\n constructor() {\n effect(() => {\n this.colorScheme();\n this.resolvedColorScheme();\n this.lightRef();\n this.darkRef();\n this.autoRef();\n this.setPortal();\n });\n }\n\n protected toggleScheme() {\n const order: ColorScheme[] = ['light', 'dark', 'auto'];\n const currentIndex = order.indexOf(this.store.theme());\n const newScheme = order[(currentIndex + 1) % order.length];\n this.store.setScheme(newScheme);\n this.setPortal();\n this.colorSchemeChanged.emit(this.store.theme());\n }\n\n private setPortal() {\n const lightRef = this.lightRef();\n const darkRef = this.darkRef();\n const autoRef = this.autoRef();\n\n if (this.colorScheme() === 'auto' && autoRef) {\n this.portal = new TemplatePortal(autoRef.templateRef, this.viewContainerRef);\n } else if (this.resolvedColorScheme() === 'light' && lightRef) {\n this.portal = new TemplatePortal(lightRef.templateRef, this.viewContainerRef);\n } else if (this.resolvedColorScheme() === 'dark' && darkRef) {\n this.portal = new TemplatePortal(darkRef.templateRef, this.viewContainerRef);\n }\n }\n}\n","<button ngsIconButton (click)=\"toggleScheme()\">\n @if (portal) {\n <ng-container [cdkPortalOutlet]=\"portal\"/>\n }\n</button>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ngstarter-ui/components",
|
|
3
3
|
"description": "NgStarter - AI-friendly Enterprise Angular UI Components and Admin Panel",
|
|
4
|
-
"version": "1.0.
|
|
4
|
+
"version": "1.0.34",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
7
7
|
"url": "https://github.com/elementarlabsdev/ngstarter.git"
|
|
@@ -56,6 +56,7 @@
|
|
|
56
56
|
"registry": "https://registry.npmjs.org/"
|
|
57
57
|
},
|
|
58
58
|
"exports": {
|
|
59
|
+
"./ai/*": "./ai/*",
|
|
59
60
|
"./styles/*": "./styles/*",
|
|
60
61
|
"./styles/themes/*": "./styles/themes/*",
|
|
61
62
|
"./package.json": {
|
|
@@ -1,24 +1,28 @@
|
|
|
1
|
+
import * as _ngstarter_ui_components_color_scheme from '@ngstarter-ui/components/color-scheme';
|
|
1
2
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
3
|
+
import { TemplateRef } from '@angular/core';
|
|
3
4
|
import { TemplatePortal } from '@angular/cdk/portal';
|
|
4
5
|
import * as _ngrx_signals from '@ngrx/signals';
|
|
5
6
|
|
|
6
7
|
declare const COLOR_SCHEME_LOCAL_KEY = "ngstarter-color-scheme";
|
|
7
|
-
type ColorScheme = 'light' | 'dark';
|
|
8
|
+
type ColorScheme = 'light' | 'dark' | 'auto';
|
|
9
|
+
type ResolvedColorScheme = Exclude<ColorScheme, 'auto'>;
|
|
8
10
|
|
|
9
|
-
declare class ColorSchemeSwitcher
|
|
11
|
+
declare class ColorSchemeSwitcher {
|
|
10
12
|
private store;
|
|
11
13
|
private viewContainerRef;
|
|
12
14
|
private lightRef;
|
|
13
15
|
private darkRef;
|
|
16
|
+
private autoRef;
|
|
14
17
|
readonly colorScheme: i0.Signal<ColorScheme>;
|
|
18
|
+
readonly resolvedColorScheme: i0.Signal<_ngstarter_ui_components_color_scheme.ResolvedColorScheme>;
|
|
15
19
|
readonly colorSchemeChanged: i0.OutputEmitterRef<ColorScheme>;
|
|
16
|
-
protected portal: TemplatePortal<any
|
|
17
|
-
|
|
20
|
+
protected portal: TemplatePortal<any> | null;
|
|
21
|
+
constructor();
|
|
18
22
|
protected toggleScheme(): void;
|
|
19
23
|
private setPortal;
|
|
20
24
|
static ɵfac: i0.ɵɵFactoryDeclaration<ColorSchemeSwitcher, never>;
|
|
21
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<ColorSchemeSwitcher, "ngs-color-scheme-switcher", ["ngsColorSchemeSwitcher"], {}, { "colorSchemeChanged": "colorSchemeChanged"; }, ["lightRef", "darkRef"], never, true, never>;
|
|
25
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<ColorSchemeSwitcher, "ngs-color-scheme-switcher", ["ngsColorSchemeSwitcher"], {}, { "colorSchemeChanged": "colorSchemeChanged"; }, ["lightRef", "darkRef", "autoRef"], never, true, never>;
|
|
22
26
|
}
|
|
23
27
|
|
|
24
28
|
declare class ColorSchemeLightDirective {
|
|
@@ -33,12 +37,20 @@ declare class ColorSchemeDarkDirective {
|
|
|
33
37
|
static ɵdir: i0.ɵɵDirectiveDeclaration<ColorSchemeDarkDirective, "[ngsColorSchemeDark]", never, {}, {}, never, never, true, never>;
|
|
34
38
|
}
|
|
35
39
|
|
|
40
|
+
declare class ColorSchemeAutoDirective {
|
|
41
|
+
readonly templateRef: TemplateRef<any>;
|
|
42
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<ColorSchemeAutoDirective, never>;
|
|
43
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<ColorSchemeAutoDirective, "[ngsColorSchemeAuto]", never, {}, {}, never, never, true, never>;
|
|
44
|
+
}
|
|
45
|
+
|
|
36
46
|
declare const ColorSchemeStore: i0.Type<{
|
|
37
47
|
theme: i0.Signal<ColorScheme>;
|
|
48
|
+
resolvedTheme: i0.Signal<ResolvedColorScheme>;
|
|
38
49
|
setScheme: (scheme: ColorScheme) => void;
|
|
39
50
|
} & _ngrx_signals.StateSource<{
|
|
40
51
|
theme: ColorScheme;
|
|
52
|
+
resolvedTheme: ResolvedColorScheme;
|
|
41
53
|
}>>;
|
|
42
54
|
|
|
43
|
-
export { COLOR_SCHEME_LOCAL_KEY, ColorSchemeDarkDirective, ColorSchemeLightDirective, ColorSchemeStore, ColorSchemeSwitcher };
|
|
44
|
-
export type { ColorScheme };
|
|
55
|
+
export { COLOR_SCHEME_LOCAL_KEY, ColorSchemeAutoDirective, ColorSchemeDarkDirective, ColorSchemeLightDirective, ColorSchemeStore, ColorSchemeSwitcher };
|
|
56
|
+
export type { ColorScheme, ResolvedColorScheme };
|