@aerogel/core 0.0.0-next.bde642c4a8096c5fc3d5e676c2115da23f4bf1d8 → 0.0.0-next.c29ffcd25bffdbed37ecce3aac1ba14cde3e9d39

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 (60) hide show
  1. package/dist/aerogel-core.cjs.js +1 -1
  2. package/dist/aerogel-core.cjs.js.map +1 -1
  3. package/dist/aerogel-core.d.ts +389 -69
  4. package/dist/aerogel-core.esm.js +1 -1
  5. package/dist/aerogel-core.esm.js.map +1 -1
  6. package/package.json +3 -3
  7. package/src/bootstrap/index.ts +12 -2
  8. package/src/components/headless/forms/AGHeadlessInput.ts +1 -0
  9. package/src/components/headless/forms/AGHeadlessInput.vue +7 -0
  10. package/src/components/headless/forms/AGHeadlessInputInput.vue +1 -0
  11. package/src/components/headless/forms/AGHeadlessInputTextArea.vue +1 -0
  12. package/src/components/headless/modals/AGHeadlessModal.ts +3 -1
  13. package/src/components/headless/modals/AGHeadlessModal.vue +10 -4
  14. package/src/components/headless/modals/AGHeadlessModalPanel.vue +10 -6
  15. package/src/components/headless/modals/AGHeadlessModalTitle.vue +14 -4
  16. package/src/components/lib/AGMarkdown.vue +14 -1
  17. package/src/components/lib/AGMeasured.vue +1 -0
  18. package/src/components/lib/AGProgressBar.vue +45 -0
  19. package/src/components/lib/index.ts +1 -0
  20. package/src/components/modals/AGAlertModal.ts +5 -2
  21. package/src/components/modals/AGConfirmModal.ts +14 -5
  22. package/src/components/modals/AGConfirmModal.vue +2 -2
  23. package/src/components/modals/AGErrorReportModal.ts +5 -2
  24. package/src/components/modals/AGLoadingModal.ts +10 -4
  25. package/src/components/modals/AGModal.ts +1 -0
  26. package/src/components/modals/AGModalContext.vue +14 -4
  27. package/src/components/modals/AGPromptModal.ts +9 -4
  28. package/src/directives/measure.ts +24 -5
  29. package/src/errors/JobCancelledError.ts +3 -0
  30. package/src/errors/utils.ts +16 -0
  31. package/src/forms/Form.test.ts +28 -0
  32. package/src/forms/Form.ts +24 -6
  33. package/src/forms/index.ts +2 -1
  34. package/src/forms/utils.ts +20 -4
  35. package/src/forms/validation.ts +19 -0
  36. package/src/jobs/Job.ts +144 -2
  37. package/src/jobs/index.ts +4 -1
  38. package/src/jobs/listeners.ts +3 -0
  39. package/src/jobs/status.ts +4 -0
  40. package/src/lang/Lang.ts +4 -0
  41. package/src/services/App.state.ts +9 -1
  42. package/src/services/App.ts +5 -0
  43. package/src/services/Events.ts +13 -3
  44. package/src/services/Service.ts +107 -44
  45. package/src/services/Storage.ts +20 -0
  46. package/src/services/index.ts +7 -2
  47. package/src/services/utils.ts +18 -0
  48. package/src/testing/setup.ts +11 -3
  49. package/src/ui/UI.state.ts +7 -0
  50. package/src/ui/UI.ts +136 -43
  51. package/src/ui/index.ts +1 -0
  52. package/src/ui/utils.ts +16 -0
  53. package/src/utils/composition/persistent.test.ts +33 -0
  54. package/src/utils/composition/persistent.ts +11 -0
  55. package/src/utils/composition/state.test.ts +47 -0
  56. package/src/utils/composition/state.ts +24 -0
  57. package/src/utils/index.ts +2 -0
  58. package/src/utils/markdown.test.ts +50 -0
  59. package/src/utils/markdown.ts +17 -2
  60. package/src/utils/vue.ts +11 -1
package/src/forms/Form.ts CHANGED
@@ -1,5 +1,6 @@
1
- import { MagicObject, arrayRemove } from '@noeldemartin/utils';
2
1
  import { computed, nextTick, reactive, readonly, ref } from 'vue';
2
+ import { MagicObject, arrayRemove, fail, toString } from '@noeldemartin/utils';
3
+ import { validate } from './validation';
3
4
  import type { ObjectValues } from '@noeldemartin/utils';
4
5
  import type { ComputedRef, DeepReadonly, Ref, UnwrapNestedRefs } from 'vue';
5
6
 
@@ -13,6 +14,7 @@ export const FormFieldTypes = {
13
14
 
14
15
  export interface FormFieldDefinition<TType extends FormFieldType = FormFieldType, TRules extends string = string> {
15
16
  type: TType;
17
+ trim?: boolean;
16
18
  default?: GetFormFieldValue<TType>;
17
19
  rules?: TRules;
18
20
  }
@@ -85,7 +87,13 @@ export default class Form<Fields extends FormFieldDefinitions = FormFieldDefinit
85
87
  }
86
88
 
87
89
  public setFieldValue<T extends keyof Fields>(field: T, value: FormData<Fields>[T]): void {
88
- this._data[field] = value;
90
+ const definition =
91
+ this._fields[field] ?? fail<FormFieldDefinition>(`Trying to set undefined '${toString(field)}' field`);
92
+
93
+ this._data[field] =
94
+ definition.type === FormFieldTypes.String && (definition.trim ?? true)
95
+ ? (toString(value).trim() as FormData<Fields>[T])
96
+ : value;
89
97
 
90
98
  if (this._submitted.value) {
91
99
  this.validate();
@@ -96,6 +104,10 @@ export default class Form<Fields extends FormFieldDefinitions = FormFieldDefinit
96
104
  return this._data[field] as unknown as GetFormFieldValue<Fields[T]['type']>;
97
105
  }
98
106
 
107
+ public getFieldRules<T extends keyof Fields>(field: T): string[] {
108
+ return this._fields[field]?.rules?.split('|') ?? [];
109
+ }
110
+
99
111
  public data(): FormData<Fields> {
100
112
  return { ...this._data };
101
113
  }
@@ -158,7 +170,7 @@ export default class Form<Fields extends FormFieldDefinitions = FormFieldDefinit
158
170
  return super.__get(property);
159
171
  }
160
172
 
161
- return this._data[property];
173
+ return this.getFieldValue(property);
162
174
  }
163
175
 
164
176
  protected __set(property: string, value: unknown): void {
@@ -168,14 +180,20 @@ export default class Form<Fields extends FormFieldDefinitions = FormFieldDefinit
168
180
  return;
169
181
  }
170
182
 
171
- Object.assign(this._data, { [property]: value });
183
+ this.setFieldValue(property, value as FormData<Fields>[string]);
172
184
  }
173
185
 
174
186
  private getFieldErrors(name: keyof Fields, definition: FormFieldDefinition): string[] | null {
175
187
  const errors = [];
188
+ const value = this._data[name];
189
+ const rules = definition.rules?.split('|') ?? [];
190
+
191
+ for (const rule of rules) {
192
+ if (rule !== 'required' && (value === null || value === undefined)) {
193
+ continue;
194
+ }
176
195
 
177
- if (definition.rules?.includes('required') && !this._data[name]) {
178
- errors.push('required');
196
+ errors.push(...validate(value, rule));
179
197
  }
180
198
 
181
199
  return errors.length > 0 ? errors : null;
@@ -1,4 +1,5 @@
1
- export * from './Form';
2
1
  export * from './composition';
2
+ export * from './Form';
3
3
  export * from './utils';
4
+ export * from './validation';
4
5
  export { default as Form } from './Form';
@@ -1,17 +1,25 @@
1
1
  import { FormFieldTypes } from './Form';
2
2
  import type { FormFieldDefinition } from './Form';
3
3
 
4
- export function booleanInput(defaultValue?: boolean): FormFieldDefinition<typeof FormFieldTypes.Boolean> {
4
+ export function booleanInput(
5
+ defaultValue?: boolean,
6
+ options: { rules?: string } = {},
7
+ ): FormFieldDefinition<typeof FormFieldTypes.Boolean> {
5
8
  return {
6
9
  default: defaultValue,
7
10
  type: FormFieldTypes.Boolean,
11
+ rules: options.rules,
8
12
  };
9
13
  }
10
14
 
11
- export function dateInput(defaultValue?: Date): FormFieldDefinition<typeof FormFieldTypes.Date> {
15
+ export function dateInput(
16
+ defaultValue?: Date,
17
+ options: { rules?: string } = {},
18
+ ): FormFieldDefinition<typeof FormFieldTypes.Date> {
12
19
  return {
13
20
  default: defaultValue,
14
21
  type: FormFieldTypes.Date,
22
+ rules: options.rules,
15
23
  };
16
24
  }
17
25
 
@@ -53,16 +61,24 @@ export function requiredStringInput(
53
61
  };
54
62
  }
55
63
 
56
- export function numberInput(defaultValue?: number): FormFieldDefinition<typeof FormFieldTypes.Number> {
64
+ export function numberInput(
65
+ defaultValue?: number,
66
+ options: { rules?: string } = {},
67
+ ): FormFieldDefinition<typeof FormFieldTypes.Number> {
57
68
  return {
58
69
  default: defaultValue,
59
70
  type: FormFieldTypes.Number,
71
+ rules: options.rules,
60
72
  };
61
73
  }
62
74
 
63
- export function stringInput(defaultValue?: string): FormFieldDefinition<typeof FormFieldTypes.String> {
75
+ export function stringInput(
76
+ defaultValue?: string,
77
+ options: { rules?: string } = {},
78
+ ): FormFieldDefinition<typeof FormFieldTypes.String> {
64
79
  return {
65
80
  default: defaultValue,
66
81
  type: FormFieldTypes.String,
82
+ rules: options.rules,
67
83
  };
68
84
  }
@@ -0,0 +1,19 @@
1
+ import { arrayFrom } from '@noeldemartin/utils';
2
+
3
+ const builtInRules: Record<string, FormFieldValidator> = {
4
+ required: (value) => (value ? undefined : 'required'),
5
+ };
6
+
7
+ export type FormFieldValidator<T = unknown> = (value: T) => string | string[] | undefined;
8
+
9
+ export const validators: Record<string, FormFieldValidator> = { ...builtInRules };
10
+
11
+ export function defineFormValidationRule<T>(rule: string, validator: FormFieldValidator<T>): void {
12
+ validators[rule] = validator as FormFieldValidator;
13
+ }
14
+
15
+ export function validate(value: unknown, rule: string): string[] {
16
+ const errors = validators[rule]?.(value);
17
+
18
+ return errors ? arrayFrom(errors) : [];
19
+ }
package/src/jobs/Job.ts CHANGED
@@ -1,5 +1,147 @@
1
- export default abstract class Job {
1
+ import { ListenersManager, PromisedValue, round, tap, toError } from '@noeldemartin/utils';
2
+ import type { Listeners } from '@noeldemartin/utils';
2
3
 
3
- public abstract run(): Promise<void>;
4
+ import JobCancelledError from '@/errors/JobCancelledError';
5
+
6
+ import type { JobListener } from './listeners';
7
+ import type { JobStatus } from './status';
8
+
9
+ export default abstract class Job<
10
+ Listener extends JobListener = JobListener,
11
+ Status extends JobStatus = JobStatus,
12
+ SerializedStatus extends JobStatus = JobStatus
13
+ > {
14
+
15
+ protected status: Status;
16
+ protected _listeners: ListenersManager<JobListener>;
17
+ protected _progress?: number;
18
+ protected _cancelled?: PromisedValue<void>;
19
+ protected _started: PromisedValue<void>;
20
+ protected _completed: PromisedValue<void>;
21
+
22
+ constructor() {
23
+ this.status = this.getInitialStatus();
24
+ this._listeners = new ListenersManager();
25
+ this._started = new PromisedValue();
26
+ this._completed = new PromisedValue();
27
+ }
28
+
29
+ public async start(): Promise<void> {
30
+ this.beforeStart();
31
+ this._started.resolve();
32
+
33
+ try {
34
+ await this.updateProgress();
35
+ await this.run();
36
+ await this.updateProgress();
37
+
38
+ this._completed.resolve();
39
+ } catch (error) {
40
+ if (error instanceof JobCancelledError) {
41
+ return;
42
+ }
43
+
44
+ throw tap(toError(error), (realError) => {
45
+ this._completed.reject(realError);
46
+ });
47
+ }
48
+ }
49
+
50
+ public async cancel(): Promise<void> {
51
+ this._cancelled = new PromisedValue();
52
+
53
+ await this._cancelled;
54
+ }
55
+
56
+ public serialize(): SerializedStatus {
57
+ return this.serializeStatus(this.status);
58
+ }
59
+
60
+ public get listeners(): Listeners<Listener> {
61
+ return this._listeners;
62
+ }
63
+
64
+ public get progress(): number {
65
+ return this._progress ?? 0;
66
+ }
67
+
68
+ public get cancelled(): boolean {
69
+ return !!this._cancelled?.isResolved();
70
+ }
71
+
72
+ public get started(): Promise<void> {
73
+ return this._started;
74
+ }
75
+
76
+ public get completed(): Promise<void> {
77
+ return this._completed;
78
+ }
79
+
80
+ protected abstract run(): Promise<void>;
81
+
82
+ protected getInitialStatus(): Status {
83
+ return { completed: false } as Status;
84
+ }
85
+
86
+ protected beforeStart(): void {
87
+ if (!this._started.isResolved()) {
88
+ return;
89
+ }
90
+
91
+ if (this._cancelled) {
92
+ delete this._progress;
93
+ delete this._cancelled;
94
+
95
+ return;
96
+ }
97
+
98
+ throw new Error('Job already started!');
99
+ }
100
+
101
+ protected assertNotCancelled(): void {
102
+ if (!this._cancelled) {
103
+ return;
104
+ }
105
+
106
+ this._cancelled.resolve();
107
+
108
+ throw new JobCancelledError();
109
+ }
110
+
111
+ protected calculateCurrentProgress(status?: JobStatus): number {
112
+ status ??= this.status;
113
+
114
+ if (status.completed) {
115
+ return 1;
116
+ }
117
+
118
+ if (!status.children) {
119
+ return 0;
120
+ }
121
+
122
+ return round(
123
+ status.children.reduce((total, child) => total + this.calculateCurrentProgress(child), 0) /
124
+ status.children.length,
125
+ 2,
126
+ );
127
+ }
128
+
129
+ protected async updateProgress(update?: (status: Status) => unknown): Promise<void> {
130
+ await update?.(this.status);
131
+
132
+ const progress = this.calculateCurrentProgress();
133
+
134
+ if (progress === this._progress) {
135
+ return;
136
+ }
137
+
138
+ this._progress = progress;
139
+
140
+ await this._listeners.emit('onUpdated', progress);
141
+ }
142
+
143
+ protected serializeStatus(status: Status): SerializedStatus {
144
+ return { ...status } as unknown as SerializedStatus;
145
+ }
4
146
 
5
147
  }
package/src/jobs/index.ts CHANGED
@@ -1,7 +1,10 @@
1
1
  import Job from './Job';
2
2
 
3
3
  export { Job };
4
+ export * from './Job';
5
+ export * from './listeners';
6
+ export * from './status';
4
7
 
5
8
  export async function dispatch(job: Job): Promise<void> {
6
- await job.run();
9
+ await job.start();
7
10
  }
@@ -0,0 +1,3 @@
1
+ export interface JobListener {
2
+ onUpdated?(progress: number): unknown;
3
+ }
@@ -0,0 +1,4 @@
1
+ export interface JobStatus {
2
+ completed: boolean;
3
+ children?: JobStatus[];
4
+ }
package/src/lang/Lang.ts CHANGED
@@ -53,6 +53,10 @@ export class LangService extends Service {
53
53
  }
54
54
 
55
55
  protected async boot(): Promise<void> {
56
+ if (!globalThis.document) {
57
+ return;
58
+ }
59
+
56
60
  this.requireStore().$subscribe(
57
61
  async () => {
58
62
  await this.provider.setLocale(this.locale ?? this.getBrowserLocale());
@@ -1,5 +1,7 @@
1
1
  import Aerogel from 'virtual:aerogel';
2
2
 
3
+ import type { App } from 'vue';
4
+
3
5
  import { defineServiceState } from '@/services/Service';
4
6
  import type { Plugin } from '@/plugins/Plugin';
5
7
 
@@ -7,24 +9,30 @@ export default defineServiceState({
7
9
  name: 'app',
8
10
  initialState: {
9
11
  plugins: {} as Record<string, Plugin>,
12
+ instance: null as App | null,
10
13
  environment: Aerogel.environment,
11
14
  version: Aerogel.version,
12
15
  sourceUrl: Aerogel.sourceUrl,
13
16
  },
14
17
  computed: {
15
18
  development: (state) => state.environment === 'development',
19
+ staging: (state) => state.environment === 'staging',
16
20
  testing: (state) => state.environment === 'test' || state.environment === 'testing',
17
21
  versionName(state): string {
18
22
  if (this.development) {
19
23
  return 'dev.' + Aerogel.sourceHash.toString().substring(0, 7);
20
24
  }
21
25
 
26
+ if (this.staging) {
27
+ return 'staging.' + Aerogel.sourceHash.toString().substring(0, 7);
28
+ }
29
+
22
30
  return `v${state.version}`;
23
31
  },
24
32
  versionUrl(state): string {
25
33
  return (
26
34
  state.sourceUrl +
27
- (this.development ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
35
+ (this.development || this.staging ? `/tree/${Aerogel.sourceHash}` : `/releases/tag/${this.versionName}`)
28
36
  );
29
37
  },
30
38
  },
@@ -4,6 +4,7 @@ import { PromisedValue, facade, forever, updateLocationQueryParameters } from '@
4
4
 
5
5
  import Events from '@/services/Events';
6
6
  import type { Plugin } from '@/plugins';
7
+ import type { Services } from '@/services';
7
8
 
8
9
  import Service from './App.state';
9
10
 
@@ -40,6 +41,10 @@ export class AppService extends Service {
40
41
  return (this.plugins[name] as T) ?? null;
41
42
  }
42
43
 
44
+ public service<T extends keyof Services>(name: T): Services[T] | null {
45
+ return this.instance?.config.globalProperties[name] ?? null;
46
+ }
47
+
43
48
  protected async boot(): Promise<void> {
44
49
  Events.once('application-ready', () => this.ready.resolve());
45
50
  Events.once('application-mounted', () => this.mounted.resolve());
@@ -4,7 +4,7 @@ import Service from '@/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,6 +26,8 @@ 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[]> }> = {};
@@ -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);