@aerogel/core 0.0.0-next.a3194a101ceda87a7033fa5e283e046bad6f4bfc → 0.0.0-next.a3d64a2a6fe8f788cc0fdd63d5ad52404d5058d4

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.
Files changed (212) hide show
  1. package/dist/aerogel-core.css +1 -0
  2. package/dist/aerogel-core.d.ts +2283 -1657
  3. package/dist/aerogel-core.js +3712 -0
  4. package/dist/aerogel-core.js.map +1 -0
  5. package/package.json +32 -37
  6. package/src/bootstrap/bootstrap.test.ts +4 -8
  7. package/src/bootstrap/index.ts +25 -16
  8. package/src/bootstrap/options.ts +1 -1
  9. package/src/components/AppLayout.vue +14 -0
  10. package/src/components/{AGAppModals.vue → AppModals.vue} +3 -4
  11. package/src/components/AppOverlays.vue +9 -0
  12. package/src/components/AppToasts.vue +16 -0
  13. package/src/components/contracts/AlertModal.ts +19 -0
  14. package/src/components/contracts/Button.ts +16 -0
  15. package/src/components/contracts/ConfirmModal.ts +48 -0
  16. package/src/components/contracts/DropdownMenu.ts +25 -0
  17. package/src/components/contracts/ErrorReportModal.ts +33 -0
  18. package/src/components/contracts/Input.ts +26 -0
  19. package/src/components/contracts/LoadingModal.ts +26 -0
  20. package/src/components/contracts/Modal.ts +21 -0
  21. package/src/components/contracts/PromptModal.ts +34 -0
  22. package/src/components/contracts/Select.ts +45 -0
  23. package/src/components/contracts/Toast.ts +15 -0
  24. package/src/components/contracts/index.ts +11 -0
  25. package/src/components/headless/HeadlessButton.vue +51 -0
  26. package/src/components/headless/HeadlessInput.vue +59 -0
  27. package/src/components/headless/{forms/AGHeadlessInputDescription.vue → HeadlessInputDescription.vue} +7 -8
  28. package/src/components/headless/{forms/AGHeadlessInputError.vue → HeadlessInputError.vue} +4 -8
  29. package/src/components/headless/HeadlessInputInput.vue +86 -0
  30. package/src/components/headless/{forms/AGHeadlessInputLabel.vue → HeadlessInputLabel.vue} +3 -7
  31. package/src/components/headless/HeadlessInputTextArea.vue +40 -0
  32. package/src/components/headless/HeadlessModal.vue +57 -0
  33. package/src/components/headless/HeadlessModalContent.vue +30 -0
  34. package/src/components/headless/HeadlessModalDescription.vue +12 -0
  35. package/src/components/headless/HeadlessModalOverlay.vue +12 -0
  36. package/src/components/headless/HeadlessModalTitle.vue +12 -0
  37. package/src/components/headless/HeadlessSelect.vue +120 -0
  38. package/src/components/headless/{forms/AGHeadlessSelectError.vue → HeadlessSelectError.vue} +5 -6
  39. package/src/components/headless/HeadlessSelectLabel.vue +25 -0
  40. package/src/components/headless/HeadlessSelectOption.vue +34 -0
  41. package/src/components/headless/HeadlessSelectOptions.vue +42 -0
  42. package/src/components/headless/HeadlessSelectTrigger.vue +22 -0
  43. package/src/components/headless/HeadlessSelectValue.vue +18 -0
  44. package/src/components/headless/HeadlessSwitch.vue +96 -0
  45. package/src/components/headless/HeadlessToast.vue +18 -0
  46. package/src/components/headless/HeadlessToastAction.vue +13 -0
  47. package/src/components/headless/index.ts +20 -3
  48. package/src/components/index.ts +6 -9
  49. package/src/components/ui/AdvancedOptions.vue +18 -0
  50. package/src/components/ui/AlertModal.vue +17 -0
  51. package/src/components/ui/Button.vue +115 -0
  52. package/src/components/ui/Checkbox.vue +56 -0
  53. package/src/components/ui/ConfirmModal.vue +50 -0
  54. package/src/components/ui/DropdownMenu.vue +32 -0
  55. package/src/components/ui/DropdownMenuOption.vue +22 -0
  56. package/src/components/ui/DropdownMenuOptions.vue +44 -0
  57. package/src/components/ui/EditableContent.vue +82 -0
  58. package/src/components/ui/ErrorLogs.vue +19 -0
  59. package/src/components/ui/ErrorLogsModal.vue +48 -0
  60. package/src/components/ui/ErrorMessage.vue +15 -0
  61. package/src/components/ui/ErrorReportModal.vue +73 -0
  62. package/src/components/{modals/AGErrorReportModalButtons.vue → ui/ErrorReportModalButtons.vue} +34 -27
  63. package/src/components/ui/ErrorReportModalTitle.vue +24 -0
  64. package/src/components/ui/Form.vue +24 -0
  65. package/src/components/ui/Input.vue +56 -0
  66. package/src/components/ui/Link.vue +12 -0
  67. package/src/components/ui/LoadingModal.vue +34 -0
  68. package/src/components/ui/Markdown.vue +97 -0
  69. package/src/components/ui/Modal.vue +131 -0
  70. package/src/components/ui/ModalContext.vue +31 -0
  71. package/src/components/ui/ProgressBar.vue +51 -0
  72. package/src/components/ui/PromptModal.vue +38 -0
  73. package/src/components/ui/Select.vue +27 -0
  74. package/src/components/ui/SelectLabel.vue +21 -0
  75. package/src/components/ui/SelectOption.vue +29 -0
  76. package/src/components/ui/SelectOptions.vue +35 -0
  77. package/src/components/ui/SelectTrigger.vue +29 -0
  78. package/src/components/ui/Setting.vue +31 -0
  79. package/src/components/ui/SettingsModal.vue +15 -0
  80. package/src/components/{lib/AGStartupCrash.vue → ui/StartupCrash.vue} +8 -8
  81. package/src/components/ui/Switch.vue +11 -0
  82. package/src/components/ui/TextArea.vue +56 -0
  83. package/src/components/ui/Toast.vue +46 -0
  84. package/src/components/ui/index.ts +35 -0
  85. package/src/directives/index.ts +9 -5
  86. package/src/directives/measure.ts +33 -8
  87. package/src/errors/Errors.state.ts +1 -1
  88. package/src/errors/Errors.ts +29 -27
  89. package/src/errors/JobCancelledError.ts +3 -0
  90. package/src/errors/index.ts +15 -8
  91. package/src/errors/settings/Debug.vue +32 -0
  92. package/src/errors/settings/index.ts +10 -0
  93. package/src/errors/utils.ts +17 -1
  94. package/src/forms/FormController.test.ts +113 -0
  95. package/src/forms/FormController.ts +255 -0
  96. package/src/forms/index.ts +3 -2
  97. package/src/forms/utils.ts +76 -20
  98. package/src/forms/validation.ts +50 -0
  99. package/src/index.css +76 -0
  100. package/src/jobs/Job.ts +144 -2
  101. package/src/jobs/index.ts +4 -1
  102. package/src/jobs/listeners.ts +3 -0
  103. package/src/jobs/status.ts +4 -0
  104. package/src/lang/DefaultLangProvider.ts +46 -0
  105. package/src/lang/Lang.state.ts +11 -0
  106. package/src/lang/Lang.ts +48 -21
  107. package/src/lang/index.ts +12 -6
  108. package/src/lang/settings/Language.vue +48 -0
  109. package/src/lang/settings/index.ts +10 -0
  110. package/src/plugins/Plugin.ts +1 -1
  111. package/src/plugins/index.ts +10 -7
  112. package/src/services/App.state.ts +36 -3
  113. package/src/services/App.ts +19 -3
  114. package/src/services/Cache.ts +43 -0
  115. package/src/services/Events.test.ts +8 -8
  116. package/src/services/Events.ts +16 -12
  117. package/src/services/Service.ts +125 -54
  118. package/src/services/Storage.ts +20 -0
  119. package/src/services/index.ts +18 -7
  120. package/src/services/utils.ts +18 -0
  121. package/src/testing/index.ts +8 -3
  122. package/src/testing/setup.ts +11 -0
  123. package/src/ui/UI.state.ts +14 -12
  124. package/src/ui/UI.ts +252 -122
  125. package/src/ui/index.ts +28 -28
  126. package/src/ui/utils.ts +16 -0
  127. package/src/utils/classes.ts +41 -0
  128. package/src/utils/composition/events.ts +4 -6
  129. package/src/utils/composition/forms.ts +20 -4
  130. package/src/utils/composition/persistent.test.ts +33 -0
  131. package/src/utils/composition/persistent.ts +11 -0
  132. package/src/utils/composition/state.test.ts +47 -0
  133. package/src/utils/composition/state.ts +33 -0
  134. package/src/utils/index.ts +5 -1
  135. package/src/utils/markdown.test.ts +50 -0
  136. package/src/utils/markdown.ts +53 -6
  137. package/src/utils/types.ts +3 -0
  138. package/src/utils/vue.ts +38 -132
  139. package/dist/aerogel-core.cjs.js +0 -2
  140. package/dist/aerogel-core.cjs.js.map +0 -1
  141. package/dist/aerogel-core.esm.js +0 -2
  142. package/dist/aerogel-core.esm.js.map +0 -1
  143. package/histoire.config.ts +0 -7
  144. package/noeldemartin.config.js +0 -5
  145. package/postcss.config.js +0 -6
  146. package/src/assets/histoire.css +0 -3
  147. package/src/components/AGAppLayout.vue +0 -16
  148. package/src/components/AGAppOverlays.vue +0 -41
  149. package/src/components/AGAppSnackbars.vue +0 -13
  150. package/src/components/constants.ts +0 -8
  151. package/src/components/forms/AGButton.vue +0 -44
  152. package/src/components/forms/AGCheckbox.vue +0 -41
  153. package/src/components/forms/AGForm.vue +0 -26
  154. package/src/components/forms/AGInput.vue +0 -40
  155. package/src/components/forms/AGSelect.story.vue +0 -46
  156. package/src/components/forms/AGSelect.vue +0 -60
  157. package/src/components/forms/index.ts +0 -5
  158. package/src/components/headless/forms/AGHeadlessButton.vue +0 -51
  159. package/src/components/headless/forms/AGHeadlessInput.ts +0 -30
  160. package/src/components/headless/forms/AGHeadlessInput.vue +0 -58
  161. package/src/components/headless/forms/AGHeadlessInputInput.vue +0 -49
  162. package/src/components/headless/forms/AGHeadlessSelect.ts +0 -42
  163. package/src/components/headless/forms/AGHeadlessSelect.vue +0 -77
  164. package/src/components/headless/forms/AGHeadlessSelectButton.vue +0 -24
  165. package/src/components/headless/forms/AGHeadlessSelectLabel.vue +0 -24
  166. package/src/components/headless/forms/AGHeadlessSelectOption.ts +0 -4
  167. package/src/components/headless/forms/AGHeadlessSelectOption.vue +0 -39
  168. package/src/components/headless/forms/AGHeadlessSelectOptions.ts +0 -3
  169. package/src/components/headless/forms/index.ts +0 -15
  170. package/src/components/headless/modals/AGHeadlessModal.ts +0 -34
  171. package/src/components/headless/modals/AGHeadlessModal.vue +0 -86
  172. package/src/components/headless/modals/AGHeadlessModalPanel.vue +0 -28
  173. package/src/components/headless/modals/AGHeadlessModalTitle.vue +0 -13
  174. package/src/components/headless/modals/index.ts +0 -4
  175. package/src/components/headless/snackbars/AGHeadlessSnackbar.vue +0 -10
  176. package/src/components/headless/snackbars/index.ts +0 -40
  177. package/src/components/lib/AGErrorMessage.vue +0 -16
  178. package/src/components/lib/AGLink.vue +0 -9
  179. package/src/components/lib/AGMarkdown.vue +0 -41
  180. package/src/components/lib/AGMeasured.vue +0 -15
  181. package/src/components/lib/index.ts +0 -5
  182. package/src/components/modals/AGAlertModal.ts +0 -15
  183. package/src/components/modals/AGAlertModal.vue +0 -14
  184. package/src/components/modals/AGConfirmModal.ts +0 -27
  185. package/src/components/modals/AGConfirmModal.vue +0 -26
  186. package/src/components/modals/AGErrorReportModal.ts +0 -46
  187. package/src/components/modals/AGErrorReportModal.vue +0 -54
  188. package/src/components/modals/AGErrorReportModalTitle.vue +0 -25
  189. package/src/components/modals/AGLoadingModal.ts +0 -23
  190. package/src/components/modals/AGLoadingModal.vue +0 -15
  191. package/src/components/modals/AGModal.ts +0 -10
  192. package/src/components/modals/AGModal.vue +0 -39
  193. package/src/components/modals/AGModalContext.ts +0 -8
  194. package/src/components/modals/AGModalContext.vue +0 -22
  195. package/src/components/modals/AGModalTitle.vue +0 -9
  196. package/src/components/modals/AGPromptModal.ts +0 -30
  197. package/src/components/modals/AGPromptModal.vue +0 -34
  198. package/src/components/modals/index.ts +0 -17
  199. package/src/components/snackbars/AGSnackbar.vue +0 -36
  200. package/src/components/snackbars/index.ts +0 -3
  201. package/src/components/utils.ts +0 -10
  202. package/src/directives/initial-focus.ts +0 -11
  203. package/src/forms/Form.test.ts +0 -58
  204. package/src/forms/Form.ts +0 -185
  205. package/src/forms/composition.ts +0 -6
  206. package/src/main.histoire.ts +0 -1
  207. package/src/utils/tailwindcss.test.ts +0 -26
  208. package/src/utils/tailwindcss.ts +0 -7
  209. package/tailwind.config.js +0 -4
  210. package/tsconfig.json +0 -11
  211. package/vite.config.ts +0 -14
  212. /package/src/{main.ts → index.ts} +0 -0
@@ -1,6 +1,6 @@
1
1
  import type { App } from 'vue';
2
2
 
3
- import type { AerogelOptions } from '@/bootstrap/options';
3
+ import type { AerogelOptions } from '@aerogel/core/bootstrap/options';
4
4
 
5
5
  export interface Plugin {
6
6
  name?: string;
@@ -1,6 +1,6 @@
1
1
  import type { GetClosureArgs } from '@noeldemartin/utils';
2
2
 
3
- import App from '@/services/App';
3
+ import App from '@aerogel/core/services/App';
4
4
 
5
5
  import type { Plugin } from './Plugin';
6
6
 
@@ -13,13 +13,16 @@ export function definePlugin<T extends Plugin>(plugin: T): T {
13
13
  export async function installPlugins(plugins: Plugin[], ...args: GetClosureArgs<Plugin['install']>): Promise<void> {
14
14
  App.setState(
15
15
  'plugins',
16
- plugins.reduce((pluginsMap, plugin) => {
17
- if (plugin.name) {
18
- pluginsMap[plugin.name] = plugin;
19
- }
16
+ plugins.reduce(
17
+ (pluginsMap, plugin) => {
18
+ if (plugin.name) {
19
+ pluginsMap[plugin.name] = plugin;
20
+ }
20
21
 
21
- return pluginsMap;
22
- }, {} as Record<string, Plugin>),
22
+ return pluginsMap;
23
+ },
24
+ {} as Record<string, Plugin>,
25
+ ),
23
26
  );
24
27
 
25
28
  await Promise.all(plugins.map((plugin) => plugin.install(...args)) ?? []);
@@ -1,17 +1,50 @@
1
1
  import Aerogel from 'virtual:aerogel';
2
2
 
3
- import { defineServiceState } from '@/services/Service';
4
- import type { Plugin } from '@/plugins/Plugin';
3
+ import { getEnv } from '@noeldemartin/utils';
4
+ import type { App, Component } from 'vue';
5
+
6
+ import { defineServiceState } from '@aerogel/core/services/Service';
7
+ import type { Plugin } from '@aerogel/core/plugins/Plugin';
8
+
9
+ export interface AppSetting {
10
+ component: Component;
11
+ priority: number;
12
+ }
13
+
14
+ export function defineSettings<T extends AppSetting[]>(settings: T): T {
15
+ return settings;
16
+ }
5
17
 
6
18
  export default defineServiceState({
7
19
  name: 'app',
8
20
  initialState: {
9
21
  plugins: {} as Record<string, Plugin>,
10
- environment: Aerogel.environment,
22
+ instance: null as App | null,
23
+ environment: getEnv() ?? 'development',
24
+ version: Aerogel.version,
11
25
  sourceUrl: Aerogel.sourceUrl,
26
+ settings: [] as AppSetting[],
12
27
  },
13
28
  computed: {
14
29
  development: (state) => state.environment === 'development',
30
+ staging: (state) => state.environment === 'staging',
15
31
  testing: (state) => state.environment === 'test' || state.environment === 'testing',
32
+ versionName(state): string {
33
+ if (this.development) {
34
+ return 'dev.' + Aerogel.sourceHash.toString().substring(0, 7);
35
+ }
36
+
37
+ if (this.staging) {
38
+ return 'staging.' + Aerogel.sourceHash.toString().substring(0, 7);
39
+ }
40
+
41
+ return `v${state.version}`;
42
+ },
43
+ versionUrl(state): string {
44
+ return (
45
+ state.sourceUrl +
46
+ (this.development || this.staging ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
47
+ );
48
+ },
16
49
  },
17
50
  });
@@ -1,12 +1,20 @@
1
+ import Aerogel from 'virtual:aerogel';
2
+
1
3
  import { PromisedValue, facade, forever, updateLocationQueryParameters } from '@noeldemartin/utils';
4
+ import { markRaw } from 'vue';
2
5
 
3
- import Events from '@/services/Events';
4
- import type { Plugin } from '@/plugins';
6
+ import Events from '@aerogel/core/services/Events';
7
+ import type { Plugin } from '@aerogel/core/plugins';
8
+ import type { AppSetting, Services } from '@aerogel/core/services';
5
9
 
6
10
  import Service from './App.state';
7
11
 
12
+ export { defineSettings } from './App.state';
13
+ export type { AppSetting } from './App.state';
14
+
8
15
  export class AppService extends Service {
9
16
 
17
+ public readonly name = Aerogel.name;
10
18
  public readonly ready = new PromisedValue<void>();
11
19
  public readonly mounted = new PromisedValue<void>();
12
20
 
@@ -18,6 +26,10 @@ export class AppService extends Service {
18
26
  return this.mounted.isResolved();
19
27
  }
20
28
 
29
+ public addSetting(setting: AppSetting): void {
30
+ this.settings.push(markRaw(setting));
31
+ }
32
+
21
33
  public async whenReady<T>(callback: () => T): Promise<T> {
22
34
  const result = await this.ready.then(callback);
23
35
 
@@ -37,7 +49,11 @@ export class AppService extends Service {
37
49
  return (this.plugins[name] as T) ?? null;
38
50
  }
39
51
 
40
- protected async boot(): Promise<void> {
52
+ public service<T extends keyof Services>(name: T): Services[T] | null {
53
+ return this.instance?.config.globalProperties[name] ?? null;
54
+ }
55
+
56
+ protected override async boot(): Promise<void> {
41
57
  Events.once('application-ready', () => this.ready.resolve());
42
58
  Events.once('application-mounted', () => this.mounted.resolve());
43
59
  }
@@ -0,0 +1,43 @@
1
+ import { PromisedValue, facade, tap } from '@noeldemartin/utils';
2
+
3
+ import Service from '@aerogel/core/services/Service';
4
+
5
+ export class CacheService extends Service {
6
+
7
+ private cache?: PromisedValue<Cache> = undefined;
8
+
9
+ public async get(url: string): Promise<Response | null> {
10
+ const cache = await this.open();
11
+ const response = await cache.match(url);
12
+
13
+ return response ?? null;
14
+ }
15
+
16
+ public async store(url: string, response: Response): Promise<void> {
17
+ const cache = await this.open();
18
+
19
+ await cache.put(url, response);
20
+ }
21
+
22
+ public async replace(url: string, response: Response): Promise<void> {
23
+ const cache = await this.open();
24
+ const keys = await cache.keys(url);
25
+
26
+ if (keys.length === 0) {
27
+ return;
28
+ }
29
+
30
+ await cache.put(url, response);
31
+ }
32
+
33
+ protected async open(): Promise<Cache> {
34
+ return (this.cache =
35
+ this.cache ??
36
+ tap(new PromisedValue<Cache>(), (cache) => {
37
+ caches.open('app').then((instance) => cache.resolve(instance));
38
+ }));
39
+ }
40
+
41
+ }
42
+
43
+ export default facade(CacheService);
@@ -10,12 +10,12 @@ describe('Events', () => {
10
10
  // Arrange
11
11
  let counter = 0;
12
12
 
13
- Events.on('trigger', () => counter++);
13
+ Events.on('application-mounted', () => counter++);
14
14
 
15
15
  // Act
16
- await Events.emit('trigger');
17
- await Events.emit('trigger');
18
- await Events.emit('trigger');
16
+ await Events.emit('application-mounted');
17
+ await Events.emit('application-mounted');
18
+ await Events.emit('application-mounted');
19
19
 
20
20
  // Assert
21
21
  expect(counter).toEqual(3);
@@ -25,12 +25,12 @@ describe('Events', () => {
25
25
  // Arrange
26
26
  const storage: string[] = [];
27
27
 
28
- Events.on('trigger', () => storage.push('second'));
29
- Events.on('trigger', { priority: EventListenerPriorities.Low }, () => storage.push('third'));
30
- Events.on('trigger', { priority: EventListenerPriorities.High }, () => storage.push('first'));
28
+ Events.on('application-mounted', () => storage.push('second'));
29
+ Events.on('application-mounted', { priority: EventListenerPriorities.Low }, () => storage.push('third'));
30
+ Events.on('application-mounted', { priority: EventListenerPriorities.High }, () => storage.push('first'));
31
31
 
32
32
  // Act
33
- await Events.emit('trigger');
33
+ await Events.emit('application-mounted');
34
34
 
35
35
  // Assert
36
36
  expect(storage).toEqual(['first', 'second', 'third']);
@@ -1,16 +1,15 @@
1
1
  import { arrayRemove, facade, fail, tap } from '@noeldemartin/utils';
2
2
 
3
- import Service from '@/services/Service';
3
+ import Service from '@aerogel/core/services/Service';
4
4
 
5
5
  export interface EventsPayload {}
6
6
  export interface EventListenerOptions {
7
- priority: number;
7
+ priority: EventListenerPriority;
8
8
  }
9
9
  export type AerogelGlobalEvents = Partial<{ [Event in EventWithoutPayload]: () => unknown }> &
10
10
  Partial<{ [Event in EventWithPayload]: EventListener<EventsPayload[Event]> }>;
11
11
 
12
12
  export type EventListener<T = unknown> = (payload: T) => unknown;
13
- export type UnknownEvent<T> = T extends keyof EventsPayload ? never : T;
14
13
 
15
14
  export type EventWithoutPayload = {
16
15
  [K in keyof EventsPayload]: EventsPayload[K] extends void ? K : never;
@@ -26,18 +25,20 @@ export const EventListenerPriorities = {
26
25
  High: 256,
27
26
  } as const;
28
27
 
28
+ export type EventListenerPriority = (typeof EventListenerPriorities)[keyof typeof EventListenerPriorities];
29
+
29
30
  export class EventsService extends Service {
30
31
 
31
32
  private listeners: Record<string, { priorities: number[]; handlers: Record<number, EventListener[]> }> = {};
32
33
 
33
- protected async boot(): Promise<void> {
34
+ protected override async boot(): Promise<void> {
34
35
  Object.entries(globalThis.__aerogelEvents__ ?? {}).forEach(([event, listener]) =>
35
- this.on(event as string, listener as EventListener));
36
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
37
+ this.on(event as any, listener as EventListener));
36
38
  }
37
39
 
38
40
  public emit<Event extends EventWithoutPayload>(event: Event): Promise<void>;
39
41
  public emit<Event extends EventWithPayload>(event: Event, payload: EventsPayload[Event]): Promise<void>;
40
- public emit<Event extends string>(event: UnknownEvent<Event>, payload?: unknown): Promise<void>;
41
42
  public async emit(event: string, payload?: unknown): Promise<void> {
42
43
  const listeners = this.listeners[event] ?? { priorities: [], handlers: {} };
43
44
 
@@ -48,19 +49,24 @@ export class EventsService extends Service {
48
49
 
49
50
  /* eslint-disable max-len */
50
51
  public on<Event extends EventWithoutPayload>(event: Event, listener: () => unknown): () => void;
52
+ public on<Event extends EventWithoutPayload>(event: Event, priority: EventListenerPriority, listener: () => unknown): () => void; // prettier-ignore
51
53
  public on<Event extends EventWithoutPayload>(event: Event, options: Partial<EventListenerOptions>, listener: () => unknown): () => void; // prettier-ignore
52
54
  public on<Event extends EventWithPayload>(event: Event, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
55
+ public on<Event extends EventWithPayload>(event: Event, priority: EventListenerPriority, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
53
56
  public on<Event extends EventWithPayload>(event: Event, options: Partial<EventListenerOptions>, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
54
- public on<Event extends string>(event: UnknownEvent<Event>, listener: EventListener): () => void;
55
- public on<Event extends string>(event: UnknownEvent<Event>, options: Partial<EventListenerOptions>, listener: EventListener): () => void; // prettier-ignore
56
57
  /* eslint-enable max-len */
57
58
 
58
59
  public on(
59
60
  event: string,
60
- optionsOrListener: Partial<EventListenerOptions> | EventListener,
61
+ optionsOrListener: Partial<EventListenerOptions> | EventListenerPriority | EventListener,
61
62
  listener?: EventListener,
62
63
  ): () => void {
63
- const options = typeof optionsOrListener === 'function' ? {} : optionsOrListener;
64
+ const options =
65
+ typeof optionsOrListener === 'function'
66
+ ? {}
67
+ : typeof optionsOrListener === 'number'
68
+ ? { priority: optionsOrListener }
69
+ : optionsOrListener;
64
70
  const handler = typeof optionsOrListener === 'function' ? optionsOrListener : (listener as EventListener);
65
71
 
66
72
  this.registerListener(event, options, handler);
@@ -73,8 +79,6 @@ export class EventsService extends Service {
73
79
  public once<Event extends EventWithoutPayload>(event: Event, options: Partial<EventListenerOptions>, listener: () => unknown): () => void; // prettier-ignore
74
80
  public once<Event extends EventWithPayload>(event: Event, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
75
81
  public once<Event extends EventWithPayload>(event: Event, options: Partial<EventListenerOptions>, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
76
- public once<Event extends string>(event: UnknownEvent<Event>, listener: EventListener): () => void;
77
- public once<Event extends string>(event: UnknownEvent<Event>, options: Partial<EventListenerOptions>, listener: EventListener): () => void; // prettier-ignore
78
82
  /* eslint-enable max-len */
79
83
 
80
84
  public once(
@@ -1,49 +1,68 @@
1
- import { MagicObject, PromisedValue, Storage, isEmpty, objectDeepClone, objectOnly } from '@noeldemartin/utils';
2
- import type { Constructor } from '@noeldemartin/utils';
3
- import type { MaybeRef } from 'vue';
1
+ import {
2
+ MagicObject,
3
+ PromisedValue,
4
+ Storage,
5
+ arrayFrom,
6
+ fail,
7
+ isEmpty,
8
+ objectDeepClone,
9
+ objectOnly,
10
+ } from '@noeldemartin/utils';
11
+ import type { Constructor, Nullable } from '@noeldemartin/utils';
4
12
  import type { Store } from 'pinia';
5
13
 
6
- import ServiceBootError from '@/errors/ServiceBootError';
7
- import { defineServiceStore } from '@/services/store';
14
+ import ServiceBootError from '@aerogel/core/errors/ServiceBootError';
15
+ import { defineServiceStore } from '@aerogel/core/services/store';
16
+ import type { Unref } from '@aerogel/core/utils/vue';
8
17
 
9
18
  export type ServiceState = Record<string, any>; // eslint-disable-line @typescript-eslint/no-explicit-any
10
19
  export type DefaultServiceState = any; // eslint-disable-line @typescript-eslint/no-explicit-any
11
20
  export type ServiceConstructor<T extends Service = Service> = Constructor<T> & typeof Service;
12
- export type UnrefServiceState<State extends ServiceState> = {
13
- [K in keyof State]: State[K] extends MaybeRef<infer T> ? T : State[K];
14
- };
15
21
 
16
22
  export type ComputedStateDefinition<TState extends ServiceState, TComputedState extends ServiceState> = {
17
- [K in keyof TComputedState]: (state: UnrefServiceState<TState>) => TComputedState[K];
23
+ [K in keyof TComputedState]: (state: Unref<TState>) => TComputedState[K];
18
24
  } & ThisType<{
19
25
  readonly [K in keyof TComputedState]: TComputedState[K];
20
26
  }>;
21
27
 
28
+ export type StateWatchers<TService extends Service, TState extends ServiceState> = {
29
+ [K in keyof TState]?: (this: TService, value: TState[K], oldValue: TState[K]) => unknown;
30
+ };
31
+
32
+ export type ServiceWithState<
33
+ State extends ServiceState = ServiceState,
34
+ ComputedState extends ServiceState = {},
35
+ ServiceStorage = Partial<State>,
36
+ > = Constructor<Unref<State>> &
37
+ Constructor<ComputedState> &
38
+ Constructor<Service<Unref<State>, ComputedState, Unref<ServiceStorage>>>;
39
+
22
40
  export function defineServiceState<
23
41
  State extends ServiceState = ServiceState,
24
- ComputedState extends ServiceState = {}
42
+ ComputedState extends ServiceState = {},
43
+ ServiceStorage = Partial<State>,
25
44
  >(options: {
26
45
  name: string;
27
46
  initialState: State | (() => State);
28
47
  persist?: (keyof State)[];
48
+ watch?: StateWatchers<Service, State>;
29
49
  computed?: ComputedStateDefinition<State, ComputedState>;
30
- serialize?: (state: Partial<State>) => Partial<State>;
31
- }): Constructor<UnrefServiceState<State>> &
32
- Constructor<ComputedState> &
33
- Constructor<Service<UnrefServiceState<State>, ComputedState, Partial<UnrefServiceState<State>>>> {
34
- return class extends Service<UnrefServiceState<State>, ComputedState> {
50
+ serialize?: (state: Partial<State>) => ServiceStorage;
51
+ restore?: (state: ServiceStorage) => Partial<State>;
52
+ }): ServiceWithState<State, ComputedState, ServiceStorage> {
53
+ return class extends Service<Unref<State>, ComputedState, ServiceStorage> {
35
54
 
36
- public static persist = (options.persist as string[]) ?? [];
55
+ public static override persist = (options.persist as string[]) ?? [];
37
56
 
38
- protected usesStore(): boolean {
57
+ protected override usesStore(): boolean {
39
58
  return true;
40
59
  }
41
60
 
42
- protected getName(): string | null {
61
+ protected override getName(): string | null {
43
62
  return options.name ?? null;
44
63
  }
45
64
 
46
- protected getInitialState(): UnrefServiceState<State> {
65
+ protected override getInitialState(): Unref<State> {
47
66
  if (typeof options.initialState === 'function') {
48
67
  return options.initialState();
49
68
  }
@@ -64,26 +83,32 @@ export function defineServiceState<
64
83
  state[key as keyof State] = value;
65
84
 
66
85
  return state;
67
- }, {} as UnrefServiceState<State>);
86
+ }, {} as Unref<State>);
87
+ }
88
+
89
+ protected override getComputedStateDefinition(): ComputedStateDefinition<Unref<State>, ComputedState> {
90
+ return (options.computed ?? {}) as ComputedStateDefinition<Unref<State>, ComputedState>;
68
91
  }
69
92
 
70
- protected getComputedStateDefinition(): ComputedStateDefinition<UnrefServiceState<State>, ComputedState> {
71
- return (options.computed ?? {}) as ComputedStateDefinition<UnrefServiceState<State>, ComputedState>;
93
+ protected override getStateWatchers(): StateWatchers<Service, Unref<State>> {
94
+ return (options.watch ?? {}) as StateWatchers<Service, Unref<State>>;
72
95
  }
73
96
 
74
- protected serializePersistedState(state: Partial<State>): Partial<State> {
75
- return options.serialize?.(state) ?? state;
97
+ protected override serializePersistedState(state: Partial<State>): ServiceStorage {
98
+ return options.serialize?.(state) ?? (state as ServiceStorage);
76
99
  }
77
100
 
78
- } as unknown as Constructor<UnrefServiceState<State>> &
79
- Constructor<ComputedState> &
80
- Constructor<Service<UnrefServiceState<State>, ComputedState, Partial<UnrefServiceState<State>>>>;
101
+ protected override deserializePersistedState(state: ServiceStorage): Partial<State> {
102
+ return options.restore?.(state) ?? (state as Partial<State>);
103
+ }
104
+
105
+ } as unknown as ServiceWithState<State, ComputedState, ServiceStorage>;
81
106
  }
82
107
 
83
108
  export default class Service<
84
109
  State extends ServiceState = DefaultServiceState,
85
110
  ComputedState extends ServiceState = {},
86
- ServiceStorage extends Partial<State> = Partial<State>
111
+ ServiceStorage = Partial<State>,
87
112
  > extends MagicObject {
88
113
 
89
114
  public static persist: string[] = [];
@@ -91,7 +116,8 @@ export default class Service<
91
116
  protected _name: string;
92
117
  private _booted: PromisedValue<void>;
93
118
  private _computedStateKeys: Set<keyof State>;
94
- private _store: Store | false;
119
+ private _watchers: StateWatchers<Service, State>;
120
+ private _store: Store<string, State, ComputedState, {}> | false;
95
121
 
96
122
  constructor() {
97
123
  super();
@@ -101,6 +127,7 @@ export default class Service<
101
127
  this._name = this.getName() ?? new.target.name;
102
128
  this._booted = new PromisedValue();
103
129
  this._computedStateKeys = new Set(Object.keys(getters));
130
+ this._watchers = this.getStateWatchers();
104
131
  this._store =
105
132
  this.usesStore() &&
106
133
  defineServiceStore(this._name, {
@@ -115,6 +142,12 @@ export default class Service<
115
142
  return this._booted;
116
143
  }
117
144
 
145
+ public override static<T extends typeof Service>(): T;
146
+ public override static<T extends typeof Service, K extends keyof T>(property: K): T[K];
147
+ public override static<T extends typeof Service, K extends keyof T>(property?: K): T | T[K] {
148
+ return super.static<T, K>(property as K);
149
+ }
150
+
118
151
  public launch(): Promise<void> {
119
152
  const handleError = (error: unknown) => this._booted.reject(new ServiceBootError(this._name, error));
120
153
 
@@ -149,10 +182,10 @@ export default class Service<
149
182
  const store = this._store as any;
150
183
 
151
184
  if (property) {
152
- return store ? store[property] : undefined;
185
+ return store ? store[property] : (undefined as State[P]);
153
186
  }
154
187
 
155
- return store ? store : {};
188
+ return store ? store : ({} as State);
156
189
  }
157
190
 
158
191
  public setState<P extends keyof State>(property: P, value: State[P]): void;
@@ -162,16 +195,31 @@ export default class Service<
162
195
  return;
163
196
  }
164
197
 
165
- const state = (
166
- typeof stateOrProperty === 'string' ? { [stateOrProperty]: value } : stateOrProperty
167
- ) as Partial<State>;
198
+ const update = typeof stateOrProperty === 'string' ? { [stateOrProperty]: value } : stateOrProperty;
199
+ const old = objectOnly(this._store.$state as State, Object.keys(update));
200
+
201
+ Object.assign(this._store.$state, update);
202
+ this.onStateUpdated(update as Partial<State>, old as Partial<State>);
203
+ }
204
+
205
+ public updatePersistedState<T extends keyof State>(key: T): void;
206
+ public updatePersistedState<T extends keyof State>(keys: T[]): void;
207
+ public updatePersistedState<T extends keyof State>(keyOrKeys: T | T[]): void {
208
+ if (!this._store) {
209
+ return;
210
+ }
211
+
212
+ const keys = arrayFrom(keyOrKeys) as Array<keyof State>;
213
+ const state = objectOnly(this._store.$state as State, keys);
168
214
 
169
- Object.assign(this._store.$state, state);
215
+ if (isEmpty(state)) {
216
+ return;
217
+ }
170
218
 
171
- this.onStateUpdated(state);
219
+ this.onPersistentStateUpdated(state);
172
220
  }
173
221
 
174
- protected __get(property: string): unknown {
222
+ protected override __get(property: string): unknown {
175
223
  if (this.hasState(property)) {
176
224
  return this.getState(property);
177
225
  }
@@ -179,19 +227,29 @@ export default class Service<
179
227
  return super.__get(property);
180
228
  }
181
229
 
182
- protected __set(property: string, value: unknown): void {
230
+ protected override __set(property: string, value: unknown): void {
183
231
  this.setState({ [property]: value } as Partial<State>);
184
232
  }
185
233
 
186
- protected onStateUpdated(state: Partial<State>): void {
187
- // TODO fix this.static()
188
- const persist = (this.constructor as unknown as { persist: string[] }).persist;
189
- const persisted = objectOnly(state, persist);
234
+ protected onStateUpdated(update: Partial<State>, old: Partial<State>): void {
235
+ const persisted = objectOnly(update, this.static('persist'));
190
236
 
191
- if (isEmpty(persisted)) {
192
- return;
237
+ if (!isEmpty(persisted)) {
238
+ this.onPersistentStateUpdated(persisted as Partial<State>);
239
+ }
240
+
241
+ for (const property in update) {
242
+ const watcher = this._watchers[property] as Nullable<(value: unknown, oldValue: unknown) => unknown>;
243
+
244
+ if (!watcher || update[property] === old[property]) {
245
+ continue;
246
+ }
247
+
248
+ watcher.call(this, update[property], old[property]);
193
249
  }
250
+ }
194
251
 
252
+ protected onPersistentStateUpdated(persisted: Partial<State>): void {
195
253
  const storage = Storage.get<ServiceStorage>(this._name);
196
254
 
197
255
  if (!storage) {
@@ -220,34 +278,47 @@ export default class Service<
220
278
  return {} as ComputedStateDefinition<State, ComputedState>;
221
279
  }
222
280
 
223
- protected serializePersistedState(state: Partial<State>): Partial<State> {
224
- return state;
281
+ protected getStateWatchers(): StateWatchers<Service, State> {
282
+ return {};
283
+ }
284
+
285
+ protected serializePersistedState(state: Partial<State>): ServiceStorage {
286
+ return state as ServiceStorage;
287
+ }
288
+
289
+ protected deserializePersistedState(state: ServiceStorage): Partial<State> {
290
+ return state as Partial<State>;
225
291
  }
226
292
 
227
293
  protected async frameworkBoot(): Promise<void> {
228
- this.initializePersistedState();
294
+ this.restorePersistedState();
229
295
  }
230
296
 
231
297
  protected async boot(): Promise<void> {
232
298
  // Placeholder for overrides, don't place any functionality here.
233
299
  }
234
300
 
235
- protected initializePersistedState(): void {
236
- // TODO fix this.static()
237
- const persist = (this.constructor as unknown as { persist: string[] }).persist;
238
-
239
- if (!this.usesStore() || isEmpty(persist)) {
301
+ protected restorePersistedState(): void {
302
+ if (!this.usesStore() || isEmpty(this.static('persist'))) {
240
303
  return;
241
304
  }
242
305
 
243
306
  if (Storage.has(this._name)) {
244
307
  const persisted = Storage.require<ServiceStorage>(this._name);
245
- this.setState(persisted);
308
+ this.setState(this.deserializePersistedState(persisted));
246
309
 
247
310
  return;
248
311
  }
249
312
 
250
- Storage.set(this._name, objectOnly(this.getState(), persist));
313
+ Storage.set(this._name, objectOnly(this.getState(), this.static('persist')));
314
+ }
315
+
316
+ protected requireStore(): Store<string, State, ComputedState, {}> {
317
+ if (!this._store) {
318
+ return fail(`Failed getting '${this._name}' store`);
319
+ }
320
+
321
+ return this._store;
251
322
  }
252
323
 
253
324
  }
@@ -0,0 +1,20 @@
1
+ import { facade } from '@noeldemartin/utils';
2
+
3
+ import Events from '@aerogel/core/services/Events';
4
+ import Service from '@aerogel/core/services/Service';
5
+
6
+ export class StorageService extends Service {
7
+
8
+ public async purge(): Promise<void> {
9
+ await Events.emit('purge-storage');
10
+ }
11
+
12
+ }
13
+
14
+ export default facade(StorageService);
15
+
16
+ declare module '@aerogel/core/services/Events' {
17
+ export interface EventsPayload {
18
+ 'purge-storage': void;
19
+ }
20
+ }