@ngstarter-ui/components 1.0.48 → 21.0.1
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.
package/README.md
CHANGED
|
@@ -89,124 +89,124 @@ The same values can be controlled with document attributes:
|
|
|
89
89
|
|
|
90
90
|
The documentation site includes live demos and API examples for each component:
|
|
91
91
|
|
|
92
|
-
- [Documentation](https://ngstarter.com)
|
|
93
|
-
- [Installation](https://ngstarter.com/installation)
|
|
94
|
-
- [AI component registry](https://ngstarter.com/ai/component-registry.json)
|
|
92
|
+
- [Documentation](https://docs.ngstarter.com)
|
|
93
|
+
- [Installation](https://docs.ngstarter.com/installation)
|
|
94
|
+
- [AI component registry](https://docs.ngstarter.com/ai/component-registry.json)
|
|
95
95
|
|
|
96
96
|
### Forms
|
|
97
97
|
|
|
98
|
-
- [Autocomplete](https://ngstarter.com/forms/autocomplete)
|
|
99
|
-
- [Button](https://ngstarter.com/forms/buttons)
|
|
100
|
-
- [Button Toggle](https://ngstarter.com/forms/button-toggle)
|
|
101
|
-
- [Checkbox](https://ngstarter.com/forms/checkbox)
|
|
102
|
-
- [Country Select](https://ngstarter.com/forms/country)
|
|
103
|
-
- [Currency Select](https://ngstarter.com/forms/currency-select)
|
|
104
|
-
- [Date Format Select](https://ngstarter.com/forms/date-format-select)
|
|
105
|
-
- [Form Renderer](https://ngstarter.com/forms/form-renderer)
|
|
106
|
-
- [Inline Text Edit](https://ngstarter.com/forms/inline-text-edit)
|
|
107
|
-
- [Input](https://ngstarter.com/forms/input)
|
|
108
|
-
- [Input Mask](https://ngstarter.com/forms/input-mask)
|
|
109
|
-
- [Input Validator](https://ngstarter.com/forms/input-validator)
|
|
110
|
-
- [Number Input](https://ngstarter.com/forms/number-input)
|
|
111
|
-
- [Password Strength](https://ngstarter.com/forms/password-strength)
|
|
112
|
-
- [Phone Input](https://ngstarter.com/forms/phone-input)
|
|
113
|
-
- [Pin Input](https://ngstarter.com/forms/pin-input)
|
|
114
|
-
- [Radio](https://ngstarter.com/forms/radio)
|
|
115
|
-
- [Segmented](https://ngstarter.com/forms/segmented)
|
|
116
|
-
- [Select](https://ngstarter.com/forms/select)
|
|
117
|
-
- [Slide Toggle](https://ngstarter.com/forms/slide-toggle)
|
|
118
|
-
- [Timezone Select](https://ngstarter.com/forms/timezone)
|
|
98
|
+
- [Autocomplete](https://docs.ngstarter.com/forms/autocomplete)
|
|
99
|
+
- [Button](https://docs.ngstarter.com/forms/buttons)
|
|
100
|
+
- [Button Toggle](https://docs.ngstarter.com/forms/button-toggle)
|
|
101
|
+
- [Checkbox](https://docs.ngstarter.com/forms/checkbox)
|
|
102
|
+
- [Country Select](https://docs.ngstarter.com/forms/country)
|
|
103
|
+
- [Currency Select](https://docs.ngstarter.com/forms/currency-select)
|
|
104
|
+
- [Date Format Select](https://docs.ngstarter.com/forms/date-format-select)
|
|
105
|
+
- [Form Renderer](https://docs.ngstarter.com/forms/form-renderer)
|
|
106
|
+
- [Inline Text Edit](https://docs.ngstarter.com/forms/inline-text-edit)
|
|
107
|
+
- [Input](https://docs.ngstarter.com/forms/input)
|
|
108
|
+
- [Input Mask](https://docs.ngstarter.com/forms/input-mask)
|
|
109
|
+
- [Input Validator](https://docs.ngstarter.com/forms/input-validator)
|
|
110
|
+
- [Number Input](https://docs.ngstarter.com/forms/number-input)
|
|
111
|
+
- [Password Strength](https://docs.ngstarter.com/forms/password-strength)
|
|
112
|
+
- [Phone Input](https://docs.ngstarter.com/forms/phone-input)
|
|
113
|
+
- [Pin Input](https://docs.ngstarter.com/forms/pin-input)
|
|
114
|
+
- [Radio](https://docs.ngstarter.com/forms/radio)
|
|
115
|
+
- [Segmented](https://docs.ngstarter.com/forms/segmented)
|
|
116
|
+
- [Select](https://docs.ngstarter.com/forms/select)
|
|
117
|
+
- [Slide Toggle](https://docs.ngstarter.com/forms/slide-toggle)
|
|
118
|
+
- [Timezone Select](https://docs.ngstarter.com/forms/timezone)
|
|
119
119
|
|
|
120
120
|
### Navigation
|
|
121
121
|
|
|
122
|
-
- [Breadcrumbs](https://ngstarter.com/navigation/breadcrumbs)
|
|
123
|
-
- [Navigation](https://ngstarter.com/navigation/navigation)
|
|
124
|
-
- [Rail Navigation](https://ngstarter.com/navigation/rail-nav)
|
|
125
|
-
- [Sidebar](https://ngstarter.com/navigation/sidebar)
|
|
126
|
-
- [Side Panel](https://ngstarter.com/navigation/side-panel)
|
|
127
|
-
- [Tab Panel](https://ngstarter.com/navigation/tab-panel)
|
|
122
|
+
- [Breadcrumbs](https://docs.ngstarter.com/navigation/breadcrumbs)
|
|
123
|
+
- [Navigation](https://docs.ngstarter.com/navigation/navigation)
|
|
124
|
+
- [Rail Navigation](https://docs.ngstarter.com/navigation/rail-nav)
|
|
125
|
+
- [Sidebar](https://docs.ngstarter.com/navigation/sidebar)
|
|
126
|
+
- [Side Panel](https://docs.ngstarter.com/navigation/side-panel)
|
|
127
|
+
- [Tab Panel](https://docs.ngstarter.com/navigation/tab-panel)
|
|
128
128
|
|
|
129
129
|
### Data, Layout, And Libraries
|
|
130
130
|
|
|
131
|
-
- [Content Editor](https://ngstarter.com/libraries/content-editor)
|
|
132
|
-
- [Data View](https://ngstarter.com/libraries/data-view)
|
|
133
|
-
- [Image Designer](https://ngstarter.com/libraries/image-designer)
|
|
134
|
-
- [Kanban Board](https://ngstarter.com/libraries/kanban-board)
|
|
135
|
-
- [Micro Charts](https://ngstarter.com/micro-charts)
|
|
136
|
-
- [Video Player](https://ngstarter.com/libraries/video-player)
|
|
137
|
-
- [Visual Builder](https://ngstarter.com/libraries/visual-builder)
|
|
131
|
+
- [Content Editor](https://docs.ngstarter.com/libraries/content-editor)
|
|
132
|
+
- [Data View](https://docs.ngstarter.com/libraries/data-view)
|
|
133
|
+
- [Image Designer](https://docs.ngstarter.com/libraries/image-designer)
|
|
134
|
+
- [Kanban Board](https://docs.ngstarter.com/libraries/kanban-board)
|
|
135
|
+
- [Micro Charts](https://docs.ngstarter.com/micro-charts)
|
|
136
|
+
- [Video Player](https://docs.ngstarter.com/libraries/video-player)
|
|
137
|
+
- [Visual Builder](https://docs.ngstarter.com/libraries/visual-builder)
|
|
138
138
|
|
|
139
139
|
### Components
|
|
140
140
|
|
|
141
|
-
- [Action Required](https://ngstarter.com/components/action-required)
|
|
142
|
-
- [Alert](https://ngstarter.com/components/alert)
|
|
143
|
-
- [Announcement](https://ngstarter.com/components/announcement)
|
|
144
|
-
- [Avatar](https://ngstarter.com/components/avatar)
|
|
145
|
-
- [Badge](https://ngstarter.com/components/badge)
|
|
146
|
-
- [Block Loader](https://ngstarter.com/components/block-loader)
|
|
147
|
-
- [Bottom Sheet](https://ngstarter.com/components/bottom-sheet)
|
|
148
|
-
- [Card](https://ngstarter.com/components/card)
|
|
149
|
-
- [Card Overlay](https://ngstarter.com/components/card-overlay)
|
|
150
|
-
- [Carousel](https://ngstarter.com/components/carousel)
|
|
151
|
-
- [Chips](https://ngstarter.com/components/chips)
|
|
152
|
-
- [Code Highlighter](https://ngstarter.com/components/code-highlighter)
|
|
153
|
-
- [Color Picker](https://ngstarter.com/components/color-picker)
|
|
154
|
-
- [Color Switcher](https://ngstarter.com/components/color-switcher)
|
|
155
|
-
- [Command Bar](https://ngstarter.com/components/command-bar)
|
|
156
|
-
- [Comment Editor](https://ngstarter.com/components/comment-editor)
|
|
157
|
-
- [Comparison Slider](https://ngstarter.com/components/comparison-slider)
|
|
158
|
-
- [Confirm](https://ngstarter.com/components/confirm)
|
|
159
|
-
- [Content Fade](https://ngstarter.com/components/content-fade)
|
|
160
|
-
- [Cookie Popup](https://ngstarter.com/components/cookie-popup)
|
|
161
|
-
- [Crop](https://ngstarter.com/components/crop)
|
|
162
|
-
- [Datepicker](https://ngstarter.com/components/datepicker)
|
|
163
|
-
- [Dialog](https://ngstarter.com/components/dialog)
|
|
164
|
-
- [Divider](https://ngstarter.com/components/divider)
|
|
165
|
-
- [Drawer](https://ngstarter.com/components/drawer)
|
|
166
|
-
- [Emoji Picker](https://ngstarter.com/components/emoji-picker)
|
|
167
|
-
- [Empty State](https://ngstarter.com/components/empty-state)
|
|
168
|
-
- [Expand](https://ngstarter.com/components/expand)
|
|
169
|
-
- [Expansion Panel](https://ngstarter.com/components/expansion-panel)
|
|
170
|
-
- [Filter Builder](https://ngstarter.com/components/filter-builder)
|
|
171
|
-
- [Gauge](https://ngstarter.com/components/gauge)
|
|
172
|
-
- [Grid](https://ngstarter.com/components/grid)
|
|
173
|
-
- [Guided Tour](https://ngstarter.com/components/guided-tour)
|
|
174
|
-
- [Icon](https://ngstarter.com/components/icon)
|
|
175
|
-
- [Image Placeholder](https://ngstarter.com/components/image-placeholder)
|
|
176
|
-
- [Image Resizer](https://ngstarter.com/components/image-resizer)
|
|
177
|
-
- [Image Viewer](https://ngstarter.com/components/image-viewer)
|
|
178
|
-
- [Image Zoom Viewer](https://ngstarter.com/components/image-zoom-viewer)
|
|
179
|
-
- [Incidents](https://ngstarter.com/components/incidents)
|
|
180
|
-
- [Kbd](https://ngstarter.com/components/kbd)
|
|
181
|
-
- [Layout](https://ngstarter.com/components/layout)
|
|
182
|
-
- [List](https://ngstarter.com/components/list)
|
|
183
|
-
- [Marquee](https://ngstarter.com/components/marquee)
|
|
184
|
-
- [Menu](https://ngstarter.com/components/menu)
|
|
185
|
-
- [Notifications](https://ngstarter.com/components/notifications)
|
|
186
|
-
- [Paginator](https://ngstarter.com/components/paginator)
|
|
187
|
-
- [Panel](https://ngstarter.com/components/panel)
|
|
188
|
-
- [Popover](https://ngstarter.com/components/popover)
|
|
189
|
-
- [Progress Bar](https://ngstarter.com/components/progress-bar)
|
|
190
|
-
- [Progress Spinner](https://ngstarter.com/components/progress-spinner)
|
|
191
|
-
- [Resizable Container](https://ngstarter.com/components/resizable-container)
|
|
192
|
-
- [Screen Loader](https://ngstarter.com/components/screen-loader)
|
|
193
|
-
- [Sidenav](https://ngstarter.com/components/sidenav)
|
|
194
|
-
- [Signature Pad](https://ngstarter.com/components/signature-pad)
|
|
195
|
-
- [Skeleton](https://ngstarter.com/components/skeleton)
|
|
196
|
-
- [Slider](https://ngstarter.com/components/slider)
|
|
197
|
-
- [Snack Bar](https://ngstarter.com/components/snackbar)
|
|
198
|
-
- [Split Pane](https://ngstarter.com/components/split-pane)
|
|
199
|
-
- [Stepper](https://ngstarter.com/components/stepper)
|
|
200
|
-
- [Suggestions](https://ngstarter.com/components/suggestions)
|
|
201
|
-
- [Table](https://ngstarter.com/components/table)
|
|
202
|
-
- [Tabs](https://ngstarter.com/components/tabs)
|
|
203
|
-
- [Text Editor](https://ngstarter.com/components/text-editor)
|
|
204
|
-
- [Thumbnail Maker](https://ngstarter.com/components/thumbnail-maker)
|
|
205
|
-
- [Tiles](https://ngstarter.com/components/tiles)
|
|
206
|
-
- [Timeline](https://ngstarter.com/components/timeline)
|
|
207
|
-
- [Timepicker](https://ngstarter.com/components/timepicker)
|
|
208
|
-
- [Toolbar](https://ngstarter.com/components/toolbar)
|
|
209
|
-
- [Tooltip](https://ngstarter.com/components/tooltip)
|
|
210
|
-
- [Tree](https://ngstarter.com/components/tree)
|
|
211
|
-
- [Upload](https://ngstarter.com/components/upload)
|
|
212
|
-
- [Video Viewer](https://ngstarter.com/components/video-viewer)
|
|
141
|
+
- [Action Required](https://docs.ngstarter.com/components/action-required)
|
|
142
|
+
- [Alert](https://docs.ngstarter.com/components/alert)
|
|
143
|
+
- [Announcement](https://docs.ngstarter.com/components/announcement)
|
|
144
|
+
- [Avatar](https://docs.ngstarter.com/components/avatar)
|
|
145
|
+
- [Badge](https://docs.ngstarter.com/components/badge)
|
|
146
|
+
- [Block Loader](https://docs.ngstarter.com/components/block-loader)
|
|
147
|
+
- [Bottom Sheet](https://docs.ngstarter.com/components/bottom-sheet)
|
|
148
|
+
- [Card](https://docs.ngstarter.com/components/card)
|
|
149
|
+
- [Card Overlay](https://docs.ngstarter.com/components/card-overlay)
|
|
150
|
+
- [Carousel](https://docs.ngstarter.com/components/carousel)
|
|
151
|
+
- [Chips](https://docs.ngstarter.com/components/chips)
|
|
152
|
+
- [Code Highlighter](https://docs.ngstarter.com/components/code-highlighter)
|
|
153
|
+
- [Color Picker](https://docs.ngstarter.com/components/color-picker)
|
|
154
|
+
- [Color Switcher](https://docs.ngstarter.com/components/color-switcher)
|
|
155
|
+
- [Command Bar](https://docs.ngstarter.com/components/command-bar)
|
|
156
|
+
- [Comment Editor](https://docs.ngstarter.com/components/comment-editor)
|
|
157
|
+
- [Comparison Slider](https://docs.ngstarter.com/components/comparison-slider)
|
|
158
|
+
- [Confirm](https://docs.ngstarter.com/components/confirm)
|
|
159
|
+
- [Content Fade](https://docs.ngstarter.com/components/content-fade)
|
|
160
|
+
- [Cookie Popup](https://docs.ngstarter.com/components/cookie-popup)
|
|
161
|
+
- [Crop](https://docs.ngstarter.com/components/crop)
|
|
162
|
+
- [Datepicker](https://docs.ngstarter.com/components/datepicker)
|
|
163
|
+
- [Dialog](https://docs.ngstarter.com/components/dialog)
|
|
164
|
+
- [Divider](https://docs.ngstarter.com/components/divider)
|
|
165
|
+
- [Drawer](https://docs.ngstarter.com/components/drawer)
|
|
166
|
+
- [Emoji Picker](https://docs.ngstarter.com/components/emoji-picker)
|
|
167
|
+
- [Empty State](https://docs.ngstarter.com/components/empty-state)
|
|
168
|
+
- [Expand](https://docs.ngstarter.com/components/expand)
|
|
169
|
+
- [Expansion Panel](https://docs.ngstarter.com/components/expansion-panel)
|
|
170
|
+
- [Filter Builder](https://docs.ngstarter.com/components/filter-builder)
|
|
171
|
+
- [Gauge](https://docs.ngstarter.com/components/gauge)
|
|
172
|
+
- [Grid](https://docs.ngstarter.com/components/grid)
|
|
173
|
+
- [Guided Tour](https://docs.ngstarter.com/components/guided-tour)
|
|
174
|
+
- [Icon](https://docs.ngstarter.com/components/icon)
|
|
175
|
+
- [Image Placeholder](https://docs.ngstarter.com/components/image-placeholder)
|
|
176
|
+
- [Image Resizer](https://docs.ngstarter.com/components/image-resizer)
|
|
177
|
+
- [Image Viewer](https://docs.ngstarter.com/components/image-viewer)
|
|
178
|
+
- [Image Zoom Viewer](https://docs.ngstarter.com/components/image-zoom-viewer)
|
|
179
|
+
- [Incidents](https://docs.ngstarter.com/components/incidents)
|
|
180
|
+
- [Kbd](https://docs.ngstarter.com/components/kbd)
|
|
181
|
+
- [Layout](https://docs.ngstarter.com/components/layout)
|
|
182
|
+
- [List](https://docs.ngstarter.com/components/list)
|
|
183
|
+
- [Marquee](https://docs.ngstarter.com/components/marquee)
|
|
184
|
+
- [Menu](https://docs.ngstarter.com/components/menu)
|
|
185
|
+
- [Notifications](https://docs.ngstarter.com/components/notifications)
|
|
186
|
+
- [Paginator](https://docs.ngstarter.com/components/paginator)
|
|
187
|
+
- [Panel](https://docs.ngstarter.com/components/panel)
|
|
188
|
+
- [Popover](https://docs.ngstarter.com/components/popover)
|
|
189
|
+
- [Progress Bar](https://docs.ngstarter.com/components/progress-bar)
|
|
190
|
+
- [Progress Spinner](https://docs.ngstarter.com/components/progress-spinner)
|
|
191
|
+
- [Resizable Container](https://docs.ngstarter.com/components/resizable-container)
|
|
192
|
+
- [Screen Loader](https://docs.ngstarter.com/components/screen-loader)
|
|
193
|
+
- [Sidenav](https://docs.ngstarter.com/components/sidenav)
|
|
194
|
+
- [Signature Pad](https://docs.ngstarter.com/components/signature-pad)
|
|
195
|
+
- [Skeleton](https://docs.ngstarter.com/components/skeleton)
|
|
196
|
+
- [Slider](https://docs.ngstarter.com/components/slider)
|
|
197
|
+
- [Snack Bar](https://docs.ngstarter.com/components/snackbar)
|
|
198
|
+
- [Split Pane](https://docs.ngstarter.com/components/split-pane)
|
|
199
|
+
- [Stepper](https://docs.ngstarter.com/components/stepper)
|
|
200
|
+
- [Suggestions](https://docs.ngstarter.com/components/suggestions)
|
|
201
|
+
- [Table](https://docs.ngstarter.com/components/table)
|
|
202
|
+
- [Tabs](https://docs.ngstarter.com/components/tabs)
|
|
203
|
+
- [Text Editor](https://docs.ngstarter.com/components/text-editor)
|
|
204
|
+
- [Thumbnail Maker](https://docs.ngstarter.com/components/thumbnail-maker)
|
|
205
|
+
- [Tiles](https://docs.ngstarter.com/components/tiles)
|
|
206
|
+
- [Timeline](https://docs.ngstarter.com/components/timeline)
|
|
207
|
+
- [Timepicker](https://docs.ngstarter.com/components/timepicker)
|
|
208
|
+
- [Toolbar](https://docs.ngstarter.com/components/toolbar)
|
|
209
|
+
- [Tooltip](https://docs.ngstarter.com/components/tooltip)
|
|
210
|
+
- [Tree](https://docs.ngstarter.com/components/tree)
|
|
211
|
+
- [Upload](https://docs.ngstarter.com/components/upload)
|
|
212
|
+
- [Video Viewer](https://docs.ngstarter.com/components/video-viewer)
|
|
@@ -2,6 +2,7 @@ import * as i0 from '@angular/core';
|
|
|
2
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
|
+
import { ThemeManagerService } from '@ngstarter-ui/components/core';
|
|
5
6
|
import { TemplatePortal, CdkPortalOutlet } from '@angular/cdk/portal';
|
|
6
7
|
import { Button } from '@ngstarter-ui/components/button';
|
|
7
8
|
|
|
@@ -11,9 +12,14 @@ const initialState = {
|
|
|
11
12
|
theme: 'auto',
|
|
12
13
|
resolvedTheme: 'light',
|
|
13
14
|
};
|
|
15
|
+
const COLOR_SCHEMES = ['light', 'dark', 'auto'];
|
|
16
|
+
function isColorScheme(value) {
|
|
17
|
+
return value !== null && COLOR_SCHEMES.includes(value);
|
|
18
|
+
}
|
|
14
19
|
const ColorSchemeStore = signalStore(withState(initialState), withMethods((store) => {
|
|
15
20
|
const platformId = inject(PLATFORM_ID);
|
|
16
21
|
const document = inject(DOCUMENT);
|
|
22
|
+
const themeManager = inject(ThemeManagerService);
|
|
17
23
|
const resolveScheme = (scheme) => {
|
|
18
24
|
if (scheme !== 'auto') {
|
|
19
25
|
return scheme;
|
|
@@ -27,8 +33,14 @@ const ColorSchemeStore = signalStore(withState(initialState), withMethods((store
|
|
|
27
33
|
theme: scheme,
|
|
28
34
|
resolvedTheme: resolveScheme(scheme),
|
|
29
35
|
});
|
|
36
|
+
themeManager.setColorScheme(scheme);
|
|
30
37
|
if (isPlatformBrowser(platformId)) {
|
|
31
|
-
|
|
38
|
+
try {
|
|
39
|
+
localStorage.setItem(COLOR_SCHEME_LOCAL_KEY, scheme);
|
|
40
|
+
}
|
|
41
|
+
catch {
|
|
42
|
+
// Ignore unavailable storage so the switcher still works in memory.
|
|
43
|
+
}
|
|
32
44
|
}
|
|
33
45
|
},
|
|
34
46
|
};
|
|
@@ -38,6 +50,17 @@ const ColorSchemeStore = signalStore(withState(initialState), withMethods((store
|
|
|
38
50
|
const platformId = inject(PLATFORM_ID);
|
|
39
51
|
const destroyRef = inject(DestroyRef);
|
|
40
52
|
const media = document.defaultView?.matchMedia?.('(prefers-color-scheme: dark)');
|
|
53
|
+
if (isPlatformBrowser(platformId)) {
|
|
54
|
+
try {
|
|
55
|
+
const storedScheme = localStorage.getItem(COLOR_SCHEME_LOCAL_KEY);
|
|
56
|
+
if (isColorScheme(storedScheme)) {
|
|
57
|
+
store.setScheme(storedScheme);
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
catch {
|
|
61
|
+
// Ignore unavailable storage so the default auto scheme can be resolved below.
|
|
62
|
+
}
|
|
63
|
+
}
|
|
41
64
|
if (isPlatformBrowser(platformId) && media) {
|
|
42
65
|
const updateResolvedScheme = () => {
|
|
43
66
|
if (store.theme() === 'auto') {
|
|
@@ -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-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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"}
|
|
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 { ThemeManagerService } from '@ngstarter-ui/components/core';\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\nconst COLOR_SCHEMES: readonly ColorScheme[] = ['light', 'dark', 'auto'];\n\nfunction isColorScheme(value: string | null): value is ColorScheme {\n return value !== null && COLOR_SCHEMES.includes(value as ColorScheme);\n}\n\nexport const ColorSchemeStore = signalStore(\n withState(initialState),\n withMethods((store) => {\n const platformId = inject(PLATFORM_ID);\n const document = inject(DOCUMENT);\n const themeManager = inject(ThemeManagerService);\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 themeManager.setColorScheme(scheme);\n\n if (isPlatformBrowser(platformId)) {\n try {\n localStorage.setItem(COLOR_SCHEME_LOCAL_KEY, scheme);\n } catch {\n // Ignore unavailable storage so the switcher still works in memory.\n }\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)) {\n try {\n const storedScheme = localStorage.getItem(COLOR_SCHEME_LOCAL_KEY);\n\n if (isColorScheme(storedScheme)) {\n store.setScheme(storedScheme);\n }\n } catch {\n // Ignore unavailable storage so the default auto scheme can be resolved below.\n }\n }\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": "
|
|
4
|
+
"version": "21.0.1",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
7
7
|
"url": "https://github.com/elementarlabsdev/ngstarter.git"
|
package/styles/_tokens.scss
CHANGED
|
@@ -355,6 +355,12 @@
|
|
|
355
355
|
--ngs-color-muted: var(--ngs-color-surface-container-high);
|
|
356
356
|
--ngs-color-emphasis: color-mix(in srgb, var(--ngs-color-primary), #ffffff 40%);
|
|
357
357
|
--ngs-color-strong: color-mix(in srgb, var(--ngs-color-primary), #ffffff 20%);
|
|
358
|
+
--ngs-nav-item-color: var(--ngs-color-neutral-800);
|
|
359
|
+
--ngs-nav-item-hover-color: var(--ngs-color-neutral-950);
|
|
360
|
+
--ngs-nav-item-active-color: var(--ngs-color-neutral-950);
|
|
361
|
+
--ngs-nav-item-icon-color: var(--ngs-color-neutral-700);
|
|
362
|
+
--ngs-nav-item-hover-icon-color: var(--ngs-color-neutral-950);
|
|
363
|
+
--ngs-nav-item-active-icon-color: var(--ngs-color-primary);
|
|
358
364
|
}
|
|
359
365
|
}
|
|
360
366
|
|
|
@@ -424,6 +430,12 @@
|
|
|
424
430
|
--ngs-color-muted: var(--ngs-color-surface-container-high);
|
|
425
431
|
--ngs-color-emphasis: color-mix(in srgb, var(--ngs-color-primary), #ffffff 40%);
|
|
426
432
|
--ngs-color-strong: color-mix(in srgb, var(--ngs-color-primary), #ffffff 20%);
|
|
433
|
+
--ngs-nav-item-color: var(--ngs-color-neutral-800);
|
|
434
|
+
--ngs-nav-item-hover-color: var(--ngs-color-neutral-950);
|
|
435
|
+
--ngs-nav-item-active-color: var(--ngs-color-neutral-950);
|
|
436
|
+
--ngs-nav-item-icon-color: var(--ngs-color-neutral-700);
|
|
437
|
+
--ngs-nav-item-hover-icon-color: var(--ngs-color-neutral-950);
|
|
438
|
+
--ngs-nav-item-active-icon-color: var(--ngs-color-primary);
|
|
427
439
|
}
|
|
428
440
|
|
|
429
441
|
[data-ngs-theme='modern']:not([data-ngs-color-scheme='dark']):not(.dark) {
|
|
@@ -651,12 +663,12 @@
|
|
|
651
663
|
--ngs-table-header-bg: linear-gradient(135deg, var(--ngs-color-surface-container), var(--ngs-color-secondary-container));
|
|
652
664
|
--ngs-table-row-bg: var(--ngs-color-surface);
|
|
653
665
|
--ngs-table-border-color: var(--ngs-color-border);
|
|
654
|
-
--ngs-nav-item-color: #
|
|
666
|
+
--ngs-nav-item-color: #d5dcf0;
|
|
655
667
|
--ngs-nav-item-hover-color: #eef2ff;
|
|
656
668
|
--ngs-nav-item-active-color: #eef2ff;
|
|
657
669
|
--ngs-nav-item-hover-bg: var(--ngs-state-hover-bg);
|
|
658
670
|
--ngs-nav-item-active-bg: var(--ngs-state-selected-bg);
|
|
659
|
-
--ngs-nav-item-icon-color: #
|
|
671
|
+
--ngs-nav-item-icon-color: #b6c0d6;
|
|
660
672
|
--ngs-nav-item-hover-icon-color: var(--ngs-color-primary);
|
|
661
673
|
--ngs-nav-item-active-icon-color: var(--ngs-color-secondary);
|
|
662
674
|
}
|
|
@@ -233,12 +233,12 @@
|
|
|
233
233
|
--ngs-table-header-bg: linear-gradient(135deg, var(--ngs-color-surface-container), var(--ngs-color-secondary-container));
|
|
234
234
|
--ngs-table-row-bg: var(--ngs-color-surface);
|
|
235
235
|
--ngs-table-border-color: var(--ngs-color-border);
|
|
236
|
-
--ngs-nav-item-color: #
|
|
236
|
+
--ngs-nav-item-color: #d5dcf0;
|
|
237
237
|
--ngs-nav-item-hover-color: #eef2ff;
|
|
238
238
|
--ngs-nav-item-active-color: #eef2ff;
|
|
239
239
|
--ngs-nav-item-hover-bg: var(--ngs-state-hover-bg);
|
|
240
240
|
--ngs-nav-item-active-bg: var(--ngs-state-selected-bg);
|
|
241
|
-
--ngs-nav-item-icon-color: #
|
|
241
|
+
--ngs-nav-item-icon-color: #b6c0d6;
|
|
242
242
|
--ngs-nav-item-hover-icon-color: var(--ngs-color-primary);
|
|
243
243
|
--ngs-nav-item-active-icon-color: var(--ngs-color-secondary);
|
|
244
244
|
}
|
|
@@ -335,12 +335,12 @@
|
|
|
335
335
|
--ngs-table-header-bg: linear-gradient(135deg, var(--ngs-color-surface-container), var(--ngs-color-secondary-container));
|
|
336
336
|
--ngs-table-row-bg: var(--ngs-color-surface);
|
|
337
337
|
--ngs-table-border-color: var(--ngs-color-border);
|
|
338
|
-
--ngs-nav-item-color: #
|
|
338
|
+
--ngs-nav-item-color: #d5dcf0;
|
|
339
339
|
--ngs-nav-item-hover-color: #eef2ff;
|
|
340
340
|
--ngs-nav-item-active-color: #eef2ff;
|
|
341
341
|
--ngs-nav-item-hover-bg: var(--ngs-state-hover-bg);
|
|
342
342
|
--ngs-nav-item-active-bg: var(--ngs-state-selected-bg);
|
|
343
|
-
--ngs-nav-item-icon-color: #
|
|
343
|
+
--ngs-nav-item-icon-color: #b6c0d6;
|
|
344
344
|
--ngs-nav-item-hover-icon-color: var(--ngs-color-primary);
|
|
345
345
|
--ngs-nav-item-active-icon-color: var(--ngs-color-secondary);
|
|
346
346
|
}
|