@aerogel/core 0.0.0-next.b243de4e2590f02709edeebd8c13b74087592c04 → 0.0.0-next.b3caf219a503ce9b8c65ef1463132c9507f56c0a

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 (162) hide show
  1. package/dist/aerogel-core.d.ts +1346 -1647
  2. package/dist/aerogel-core.js +2960 -0
  3. package/dist/aerogel-core.js.map +1 -0
  4. package/package.json +27 -37
  5. package/src/bootstrap/bootstrap.test.ts +4 -7
  6. package/src/bootstrap/index.ts +25 -16
  7. package/src/bootstrap/options.ts +1 -1
  8. package/src/components/{AGAppLayout.vue → AppLayout.vue} +4 -4
  9. package/src/components/{AGAppModals.vue → AppModals.vue} +3 -4
  10. package/src/components/{AGAppOverlays.vue → AppOverlays.vue} +5 -5
  11. package/src/components/composition.ts +1 -1
  12. package/src/components/contracts/AlertModal.ts +4 -0
  13. package/src/components/contracts/Button.ts +15 -0
  14. package/src/components/contracts/ConfirmModal.ts +41 -0
  15. package/src/components/contracts/ErrorReportModal.ts +29 -0
  16. package/src/components/contracts/Input.ts +26 -0
  17. package/src/components/contracts/LoadingModal.ts +18 -0
  18. package/src/components/contracts/Modal.ts +9 -0
  19. package/src/components/contracts/PromptModal.ts +28 -0
  20. package/src/components/contracts/index.ts +7 -0
  21. package/src/components/contracts/shared.ts +9 -0
  22. package/src/components/forms/AGSelect.vue +11 -17
  23. package/src/components/forms/index.ts +0 -4
  24. package/src/components/headless/HeadlessButton.vue +45 -0
  25. package/src/components/headless/HeadlessInput.vue +59 -0
  26. package/src/components/headless/{forms/AGHeadlessInputDescription.vue → HeadlessInputDescription.vue} +5 -6
  27. package/src/components/headless/{forms/AGHeadlessInputError.vue → HeadlessInputError.vue} +4 -8
  28. package/src/components/headless/{forms/AGHeadlessInputInput.vue → HeadlessInputInput.vue} +10 -19
  29. package/src/components/headless/{forms/AGHeadlessInputLabel.vue → HeadlessInputLabel.vue} +3 -7
  30. package/src/components/headless/{forms/AGHeadlessInputTextArea.vue → HeadlessInputTextArea.vue} +6 -9
  31. package/src/components/headless/{modals/AGHeadlessModal.vue → HeadlessModal.vue} +16 -18
  32. package/src/components/headless/HeadlessModalContent.vue +24 -0
  33. package/src/components/headless/HeadlessModalOverlay.vue +12 -0
  34. package/src/components/headless/HeadlessModalTitle.vue +12 -0
  35. package/src/components/headless/forms/AGHeadlessSelect.ts +3 -3
  36. package/src/components/headless/forms/AGHeadlessSelect.vue +16 -16
  37. package/src/components/headless/forms/AGHeadlessSelectError.vue +2 -2
  38. package/src/components/headless/forms/AGHeadlessSelectOption.vue +10 -18
  39. package/src/components/headless/forms/AGHeadlessSelectOptions.vue +19 -0
  40. package/src/components/headless/forms/AGHeadlessSelectTrigger.vue +25 -0
  41. package/src/components/headless/forms/composition.ts +2 -2
  42. package/src/components/headless/forms/index.ts +2 -12
  43. package/src/components/headless/index.ts +12 -1
  44. package/src/components/headless/snackbars/index.ts +3 -3
  45. package/src/components/index.ts +5 -5
  46. package/src/components/lib/AGErrorMessage.vue +3 -3
  47. package/src/components/lib/AGMarkdown.vue +16 -3
  48. package/src/components/lib/AGMeasured.vue +2 -2
  49. package/src/components/lib/AGStartupCrash.vue +6 -6
  50. package/src/components/lib/index.ts +0 -1
  51. package/src/components/snackbars/AGSnackbar.vue +8 -6
  52. package/src/components/ui/AlertModal.vue +13 -0
  53. package/src/components/ui/Button.vue +58 -0
  54. package/src/components/ui/Checkbox.vue +49 -0
  55. package/src/components/ui/ConfirmModal.vue +42 -0
  56. package/src/components/ui/ErrorReportModal.vue +62 -0
  57. package/src/components/{modals/AGErrorReportModalButtons.vue → ui/ErrorReportModalButtons.vue} +29 -20
  58. package/src/components/ui/ErrorReportModalTitle.vue +24 -0
  59. package/src/components/{forms/AGForm.vue → ui/Form.vue} +4 -5
  60. package/src/components/ui/Input.vue +52 -0
  61. package/src/components/ui/Link.vue +12 -0
  62. package/src/components/ui/LoadingModal.vue +32 -0
  63. package/src/components/ui/Modal.vue +55 -0
  64. package/src/components/ui/ModalContext.vue +30 -0
  65. package/src/components/ui/ProgressBar.vue +50 -0
  66. package/src/components/ui/PromptModal.vue +35 -0
  67. package/src/components/ui/index.ts +15 -0
  68. package/src/components/utils.ts +106 -9
  69. package/src/directives/index.ts +9 -5
  70. package/src/directives/measure.ts +1 -1
  71. package/src/errors/Errors.state.ts +1 -1
  72. package/src/errors/Errors.ts +14 -14
  73. package/src/errors/JobCancelledError.ts +3 -0
  74. package/src/errors/index.ts +9 -6
  75. package/src/errors/utils.ts +17 -1
  76. package/src/forms/{Form.test.ts → FormController.test.ts} +5 -4
  77. package/src/forms/{Form.ts → FormController.ts} +22 -19
  78. package/src/forms/composition.ts +4 -4
  79. package/src/forms/index.ts +2 -2
  80. package/src/forms/utils.ts +2 -2
  81. package/src/index.css +8 -0
  82. package/src/jobs/Job.ts +144 -2
  83. package/src/jobs/index.ts +4 -1
  84. package/src/jobs/listeners.ts +3 -0
  85. package/src/jobs/status.ts +4 -0
  86. package/src/lang/DefaultLangProvider.ts +7 -4
  87. package/src/lang/Lang.state.ts +1 -1
  88. package/src/lang/Lang.ts +1 -1
  89. package/src/lang/index.ts +8 -6
  90. package/src/plugins/Plugin.ts +1 -1
  91. package/src/plugins/index.ts +10 -7
  92. package/src/services/App.state.ts +13 -4
  93. package/src/services/App.ts +8 -3
  94. package/src/services/Cache.ts +1 -1
  95. package/src/services/Events.ts +15 -5
  96. package/src/services/Service.ts +116 -53
  97. package/src/services/Storage.ts +20 -0
  98. package/src/services/index.ts +11 -5
  99. package/src/services/utils.ts +18 -0
  100. package/src/testing/index.ts +4 -3
  101. package/src/testing/setup.ts +5 -13
  102. package/src/ui/UI.state.ts +10 -5
  103. package/src/ui/UI.ts +145 -59
  104. package/src/ui/index.ts +16 -16
  105. package/src/utils/composition/events.ts +2 -2
  106. package/src/utils/composition/forms.ts +4 -3
  107. package/src/utils/composition/persistent.test.ts +33 -0
  108. package/src/utils/composition/persistent.ts +11 -0
  109. package/src/utils/composition/state.test.ts +47 -0
  110. package/src/utils/composition/state.ts +24 -0
  111. package/src/utils/index.ts +2 -0
  112. package/src/utils/markdown.test.ts +50 -0
  113. package/src/utils/markdown.ts +19 -6
  114. package/src/utils/vue.ts +11 -13
  115. package/dist/aerogel-core.cjs.js +0 -2
  116. package/dist/aerogel-core.cjs.js.map +0 -1
  117. package/dist/aerogel-core.esm.js +0 -2
  118. package/dist/aerogel-core.esm.js.map +0 -1
  119. package/histoire.config.ts +0 -7
  120. package/noeldemartin.config.js +0 -5
  121. package/postcss.config.js +0 -6
  122. package/src/assets/histoire.css +0 -3
  123. package/src/components/forms/AGButton.vue +0 -44
  124. package/src/components/forms/AGCheckbox.vue +0 -41
  125. package/src/components/forms/AGInput.vue +0 -40
  126. package/src/components/headless/forms/AGHeadlessButton.ts +0 -3
  127. package/src/components/headless/forms/AGHeadlessButton.vue +0 -62
  128. package/src/components/headless/forms/AGHeadlessInput.ts +0 -34
  129. package/src/components/headless/forms/AGHeadlessInput.vue +0 -70
  130. package/src/components/headless/forms/AGHeadlessSelectButton.vue +0 -24
  131. package/src/components/headless/forms/AGHeadlessSelectLabel.vue +0 -24
  132. package/src/components/headless/forms/AGHeadlessSelectOptions.ts +0 -3
  133. package/src/components/headless/modals/AGHeadlessModal.ts +0 -34
  134. package/src/components/headless/modals/AGHeadlessModalPanel.vue +0 -28
  135. package/src/components/headless/modals/AGHeadlessModalTitle.vue +0 -13
  136. package/src/components/headless/modals/index.ts +0 -4
  137. package/src/components/interfaces.ts +0 -24
  138. package/src/components/lib/AGLink.vue +0 -9
  139. package/src/components/modals/AGAlertModal.ts +0 -15
  140. package/src/components/modals/AGAlertModal.vue +0 -14
  141. package/src/components/modals/AGConfirmModal.ts +0 -33
  142. package/src/components/modals/AGConfirmModal.vue +0 -26
  143. package/src/components/modals/AGErrorReportModal.ts +0 -46
  144. package/src/components/modals/AGErrorReportModal.vue +0 -54
  145. package/src/components/modals/AGErrorReportModalTitle.vue +0 -25
  146. package/src/components/modals/AGLoadingModal.ts +0 -23
  147. package/src/components/modals/AGLoadingModal.vue +0 -15
  148. package/src/components/modals/AGModal.ts +0 -10
  149. package/src/components/modals/AGModal.vue +0 -39
  150. package/src/components/modals/AGModalContext.ts +0 -8
  151. package/src/components/modals/AGModalContext.vue +0 -22
  152. package/src/components/modals/AGModalTitle.vue +0 -9
  153. package/src/components/modals/AGPromptModal.ts +0 -36
  154. package/src/components/modals/AGPromptModal.vue +0 -34
  155. package/src/components/modals/index.ts +0 -17
  156. package/src/directives/initial-focus.ts +0 -11
  157. package/src/main.histoire.ts +0 -1
  158. package/tailwind.config.js +0 -4
  159. package/tsconfig.json +0 -11
  160. package/vite.config.ts +0 -17
  161. /package/src/components/{AGAppSnackbars.vue → AppSnackbars.vue} +0 -0
  162. /package/src/{main.ts → index.ts} +0 -0
@@ -1,10 +1,13 @@
1
- import App from '@/services/App';
1
+ import { isDevelopment } from '@noeldemartin/utils';
2
2
 
3
3
  import type { LangProvider } from './Lang';
4
4
 
5
5
  export default class DefaultLangProvider implements LangProvider {
6
6
 
7
- constructor(private locale: string, private fallbackLocale: string) {}
7
+ constructor(
8
+ private locale: string,
9
+ private fallbackLocale: string,
10
+ ) {}
8
11
 
9
12
  public getLocale(): string {
10
13
  return this.locale;
@@ -28,14 +31,14 @@ export default class DefaultLangProvider implements LangProvider {
28
31
 
29
32
  public translate(key: string): string {
30
33
  // eslint-disable-next-line no-console
31
- App.development && console.warn('Lang provider is missing');
34
+ isDevelopment() && console.warn('Lang provider is missing');
32
35
 
33
36
  return key;
34
37
  }
35
38
 
36
39
  public translateWithDefault(_: string, defaultMessage: string): string {
37
40
  // eslint-disable-next-line no-console
38
- App.development && console.warn('Lang provider is missing');
41
+ isDevelopment() && console.warn('Lang provider is missing');
39
42
 
40
43
  return defaultMessage;
41
44
  }
@@ -1,4 +1,4 @@
1
- import { defineServiceState } from '@/services/Service';
1
+ import { defineServiceState } from '@aerogel/core/services/Service';
2
2
 
3
3
  export default defineServiceState({
4
4
  name: 'lang',
package/src/lang/Lang.ts CHANGED
@@ -52,7 +52,7 @@ export class LangService extends Service {
52
52
  return navigator.languages.find((locale) => locales.includes(locale)) ?? 'en';
53
53
  }
54
54
 
55
- protected async boot(): Promise<void> {
55
+ protected override async boot(): Promise<void> {
56
56
  if (!globalThis.document) {
57
57
  return;
58
58
  }
package/src/lang/index.ts CHANGED
@@ -1,10 +1,12 @@
1
- import { bootServices } from '@/services';
2
- import { definePlugin } from '@/plugins';
1
+ import { bootServices } from '@aerogel/core/services';
2
+ import { definePlugin } from '@aerogel/core/plugins';
3
3
 
4
- import Lang, { LangProvider } from './Lang';
4
+ import Lang from './Lang';
5
+ import type { LangProvider } from './Lang';
5
6
  import { translate, translateWithDefault } from './utils';
6
7
 
7
- export { Lang, LangProvider, translate, translateWithDefault };
8
+ export { Lang, translate, translateWithDefault };
9
+ export type { LangProvider };
8
10
 
9
11
  const services = { $lang: Lang };
10
12
 
@@ -19,11 +21,11 @@ export default definePlugin({
19
21
  },
20
22
  });
21
23
 
22
- declare module '@/services' {
24
+ declare module '@aerogel/core/services' {
23
25
  export interface Services extends LangServices {}
24
26
  }
25
27
 
26
- declare module '@vue/runtime-core' {
28
+ declare module 'vue' {
27
29
  interface ComponentCustomProperties {
28
30
  $td: typeof translateWithDefault;
29
31
  }
@@ -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,30 +1,39 @@
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 } from 'vue';
5
+
6
+ import { defineServiceState } from '@aerogel/core/services/Service';
7
+ import type { Plugin } from '@aerogel/core/plugins/Plugin';
5
8
 
6
9
  export default defineServiceState({
7
10
  name: 'app',
8
11
  initialState: {
9
12
  plugins: {} as Record<string, Plugin>,
10
- environment: Aerogel.environment,
13
+ instance: null as App | null,
14
+ environment: getEnv() ?? 'development',
11
15
  version: Aerogel.version,
12
16
  sourceUrl: Aerogel.sourceUrl,
13
17
  },
14
18
  computed: {
15
19
  development: (state) => state.environment === 'development',
20
+ staging: (state) => state.environment === 'staging',
16
21
  testing: (state) => state.environment === 'test' || state.environment === 'testing',
17
22
  versionName(state): string {
18
23
  if (this.development) {
19
24
  return 'dev.' + Aerogel.sourceHash.toString().substring(0, 7);
20
25
  }
21
26
 
27
+ if (this.staging) {
28
+ return 'staging.' + Aerogel.sourceHash.toString().substring(0, 7);
29
+ }
30
+
22
31
  return `v${state.version}`;
23
32
  },
24
33
  versionUrl(state): string {
25
34
  return (
26
35
  state.sourceUrl +
27
- (this.development ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
36
+ (this.development || this.staging ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
28
37
  );
29
38
  },
30
39
  },
@@ -2,8 +2,9 @@ import Aerogel from 'virtual:aerogel';
2
2
 
3
3
  import { PromisedValue, facade, forever, updateLocationQueryParameters } from '@noeldemartin/utils';
4
4
 
5
- import Events from '@/services/Events';
6
- import type { Plugin } from '@/plugins';
5
+ import Events from '@aerogel/core/services/Events';
6
+ import type { Plugin } from '@aerogel/core/plugins';
7
+ import type { Services } from '@aerogel/core/services';
7
8
 
8
9
  import Service from './App.state';
9
10
 
@@ -40,7 +41,11 @@ export class AppService extends Service {
40
41
  return (this.plugins[name] as T) ?? null;
41
42
  }
42
43
 
43
- protected async boot(): Promise<void> {
44
+ public service<T extends keyof Services>(name: T): Services[T] | null {
45
+ return this.instance?.config.globalProperties[name] ?? null;
46
+ }
47
+
48
+ protected override async boot(): Promise<void> {
44
49
  Events.once('application-ready', () => this.ready.resolve());
45
50
  Events.once('application-mounted', () => this.mounted.resolve());
46
51
  }
@@ -1,6 +1,6 @@
1
1
  import { PromisedValue, facade, 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 class CacheService extends Service {
6
6
 
@@ -1,10 +1,10 @@
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]> }>;
@@ -26,11 +26,13 @@ export const EventListenerPriorities = {
26
26
  High: 256,
27
27
  } as const;
28
28
 
29
+ export type EventListenerPriority = (typeof EventListenerPriorities)[keyof typeof EventListenerPriorities];
30
+
29
31
  export class EventsService extends Service {
30
32
 
31
33
  private listeners: Record<string, { priorities: number[]; handlers: Record<number, EventListener[]> }> = {};
32
34
 
33
- protected async boot(): Promise<void> {
35
+ protected override async boot(): Promise<void> {
34
36
  Object.entries(globalThis.__aerogelEvents__ ?? {}).forEach(([event, listener]) =>
35
37
  this.on(event as string, listener as EventListener));
36
38
  }
@@ -48,19 +50,27 @@ export class EventsService extends Service {
48
50
 
49
51
  /* eslint-disable max-len */
50
52
  public on<Event extends EventWithoutPayload>(event: Event, listener: () => unknown): () => void;
53
+ public on<Event extends EventWithoutPayload>(event: Event, priority: EventListenerPriority, listener: () => unknown): () => void; // prettier-ignore
51
54
  public on<Event extends EventWithoutPayload>(event: Event, options: Partial<EventListenerOptions>, listener: () => unknown): () => void; // prettier-ignore
52
55
  public on<Event extends EventWithPayload>(event: Event, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
56
+ public on<Event extends EventWithPayload>(event: Event, priority: EventListenerPriority, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
53
57
  public on<Event extends EventWithPayload>(event: Event, options: Partial<EventListenerOptions>, listener: EventListener<EventsPayload[Event]>): () => void | void; // prettier-ignore
54
58
  public on<Event extends string>(event: UnknownEvent<Event>, listener: EventListener): () => void;
59
+ public on<Event extends string>(event: UnknownEvent<Event>, priority: EventListenerPriority, listener: EventListener): () => void; // prettier-ignore
55
60
  public on<Event extends string>(event: UnknownEvent<Event>, options: Partial<EventListenerOptions>, listener: EventListener): () => void; // prettier-ignore
56
61
  /* eslint-enable max-len */
57
62
 
58
63
  public on(
59
64
  event: string,
60
- optionsOrListener: Partial<EventListenerOptions> | EventListener,
65
+ optionsOrListener: Partial<EventListenerOptions> | EventListenerPriority | EventListener,
61
66
  listener?: EventListener,
62
67
  ): () => void {
63
- const options = typeof optionsOrListener === 'function' ? {} : optionsOrListener;
68
+ const options =
69
+ typeof optionsOrListener === 'function'
70
+ ? {}
71
+ : typeof optionsOrListener === 'number'
72
+ ? { priority: optionsOrListener }
73
+ : optionsOrListener;
64
74
  const handler = typeof optionsOrListener === 'function' ? optionsOrListener : (listener as EventListener);
65
75
 
66
76
  this.registerListener(event, options, handler);
@@ -1,49 +1,68 @@
1
- import { MagicObject, PromisedValue, Storage, fail, 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>);
68
87
  }
69
88
 
70
- protected getComputedStateDefinition(): ComputedStateDefinition<UnrefServiceState<State>, ComputedState> {
71
- return (options.computed ?? {}) as ComputedStateDefinition<UnrefServiceState<State>, ComputedState>;
89
+ protected override getComputedStateDefinition(): ComputedStateDefinition<Unref<State>, ComputedState> {
90
+ return (options.computed ?? {}) as ComputedStateDefinition<Unref<State>, ComputedState>;
72
91
  }
73
92
 
74
- protected serializePersistedState(state: Partial<State>): Partial<State> {
75
- return options.serialize?.(state) ?? state;
93
+ protected override getStateWatchers(): StateWatchers<Service, Unref<State>> {
94
+ return (options.watch ?? {}) as StateWatchers<Service, Unref<State>>;
76
95
  }
77
96
 
78
- } as unknown as Constructor<UnrefServiceState<State>> &
79
- Constructor<ComputedState> &
80
- Constructor<Service<UnrefServiceState<State>, ComputedState, Partial<UnrefServiceState<State>>>>;
97
+ protected override serializePersistedState(state: Partial<State>): ServiceStorage {
98
+ return options.serialize?.(state) ?? (state as ServiceStorage);
99
+ }
100
+
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,6 +116,7 @@ export default class Service<
91
116
  protected _name: string;
92
117
  private _booted: PromisedValue<void>;
93
118
  private _computedStateKeys: Set<keyof State>;
119
+ private _watchers: StateWatchers<Service, State>;
94
120
  private _store: Store<string, State, ComputedState, {}> | false;
95
121
 
96
122
  constructor() {
@@ -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));
168
200
 
169
- Object.assign(this._store.$state, state);
201
+ Object.assign(this._store.$state, update);
202
+ this.onStateUpdated(update as Partial<State>, old as Partial<State>);
203
+ }
170
204
 
171
- this.onStateUpdated(state);
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);
214
+
215
+ if (isEmpty(state)) {
216
+ return;
217
+ }
218
+
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>);
193
239
  }
194
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]);
249
+ }
250
+ }
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,39 @@ 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')));
251
314
  }
252
315
 
253
316
  protected requireStore(): Store<string, State, ComputedState, {}> {
@@ -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
+ }
@@ -1,11 +1,13 @@
1
1
  import type { App as VueApp } from 'vue';
2
2
 
3
- import { definePlugin } from '@/plugins';
3
+ import { definePlugin } from '@aerogel/core/plugins';
4
+ import { isDevelopment, isTesting } from '@noeldemartin/utils';
4
5
 
5
6
  import App from './App';
6
7
  import Cache from './Cache';
7
8
  import Events from './Events';
8
9
  import Service from './Service';
10
+ import Storage from './Storage';
9
11
  import { getPiniaStore } from './store';
10
12
 
11
13
  export * from './App';
@@ -13,12 +15,14 @@ export * from './Cache';
13
15
  export * from './Events';
14
16
  export * from './Service';
15
17
  export * from './store';
18
+ export * from './utils';
16
19
 
17
- export { App, Cache, Events, Service };
20
+ export { App, Cache, Events, Storage, Service };
18
21
 
19
22
  const defaultServices = {
20
23
  $app: App,
21
24
  $events: Events,
25
+ $storage: Storage,
22
26
  };
23
27
 
24
28
  export type DefaultServices = typeof defaultServices;
@@ -36,7 +40,9 @@ export async function bootServices(app: VueApp, services: Record<string, Service
36
40
 
37
41
  Object.assign(app.config.globalProperties, services);
38
42
 
39
- App.development && Object.assign(window, services);
43
+ if (isDevelopment() || isTesting()) {
44
+ Object.assign(globalThis, services);
45
+ }
40
46
  }
41
47
 
42
48
  export default definePlugin({
@@ -52,12 +58,12 @@ export default definePlugin({
52
58
  },
53
59
  });
54
60
 
55
- declare module '@/bootstrap/options' {
61
+ declare module '@aerogel/core/bootstrap/options' {
56
62
  export interface AerogelOptions {
57
63
  services?: Record<string, Service>;
58
64
  }
59
65
  }
60
66
 
61
- declare module '@vue/runtime-core' {
67
+ declare module 'vue' {
62
68
  interface ComponentCustomProperties extends Services {}
63
69
  }
@@ -0,0 +1,18 @@
1
+ import { objectOnly } from '@noeldemartin/utils';
2
+
3
+ export type Replace<
4
+ TOriginal extends Record<string, unknown>,
5
+ TReplacements extends Partial<Record<keyof TOriginal, unknown>>,
6
+ > = {
7
+ [K in keyof TOriginal]: TReplacements extends Record<K, infer Replacement> ? Replacement : TOriginal[K];
8
+ };
9
+
10
+ export function replaceExisting<
11
+ TOriginal extends Record<string, unknown>,
12
+ TReplacements extends Partial<Record<keyof TOriginal, unknown>>,
13
+ >(original: TOriginal, replacements: TReplacements): Replace<TOriginal, TReplacements> {
14
+ return {
15
+ ...original,
16
+ ...objectOnly(replacements, Object.keys(original)),
17
+ } as Replace<TOriginal, TReplacements>;
18
+ }