@aerogel/core 0.0.0-next.c2e6acc000e97a1020c2e232678563c53884dd0e → 0.0.0-next.c3236837f7f8fc319a4a56022accb32757b3db89

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 (134) hide show
  1. package/dist/aerogel-core.css +1 -0
  2. package/dist/aerogel-core.d.ts +1267 -599
  3. package/dist/aerogel-core.js +2560 -1859
  4. package/dist/aerogel-core.js.map +1 -1
  5. package/package.json +7 -2
  6. package/src/components/AppLayout.vue +1 -3
  7. package/src/components/AppModals.vue +1 -1
  8. package/src/components/AppOverlays.vue +2 -34
  9. package/src/components/AppToasts.vue +16 -0
  10. package/src/components/contracts/AlertModal.ts +15 -0
  11. package/src/components/contracts/Button.ts +1 -0
  12. package/src/components/contracts/ConfirmModal.ts +12 -5
  13. package/src/components/contracts/DropdownMenu.ts +25 -0
  14. package/src/components/contracts/ErrorReportModal.ts +8 -4
  15. package/src/components/contracts/Input.ts +9 -9
  16. package/src/components/contracts/LoadingModal.ts +12 -4
  17. package/src/components/contracts/Modal.ts +14 -2
  18. package/src/components/contracts/PromptModal.ts +8 -2
  19. package/src/components/contracts/Select.ts +45 -0
  20. package/src/components/contracts/Toast.ts +15 -0
  21. package/src/components/contracts/index.ts +5 -1
  22. package/src/components/headless/HeadlessButton.vue +9 -3
  23. package/src/components/headless/HeadlessInput.vue +3 -3
  24. package/src/components/headless/HeadlessInputDescription.vue +1 -1
  25. package/src/components/headless/HeadlessInputInput.vue +21 -10
  26. package/src/components/headless/HeadlessInputTextArea.vue +6 -6
  27. package/src/components/headless/HeadlessModal.vue +23 -50
  28. package/src/components/headless/HeadlessModalContent.vue +11 -5
  29. package/src/components/headless/HeadlessModalDescription.vue +12 -0
  30. package/src/components/headless/HeadlessModalOverlay.vue +2 -2
  31. package/src/components/headless/HeadlessModalTitle.vue +2 -2
  32. package/src/components/headless/HeadlessSelect.vue +120 -0
  33. package/src/components/headless/{forms/AGHeadlessSelectError.vue → HeadlessSelectError.vue} +3 -4
  34. package/src/components/headless/HeadlessSelectLabel.vue +25 -0
  35. package/src/components/headless/HeadlessSelectOption.vue +34 -0
  36. package/src/components/headless/HeadlessSelectOptions.vue +42 -0
  37. package/src/components/headless/HeadlessSelectTrigger.vue +22 -0
  38. package/src/components/headless/HeadlessSelectValue.vue +18 -0
  39. package/src/components/headless/HeadlessSwitch.vue +96 -0
  40. package/src/components/headless/HeadlessToast.vue +18 -0
  41. package/src/components/headless/HeadlessToastAction.vue +13 -0
  42. package/src/components/headless/index.ts +9 -3
  43. package/src/components/index.ts +4 -9
  44. package/src/components/ui/AdvancedOptions.vue +18 -0
  45. package/src/components/ui/AlertModal.vue +7 -3
  46. package/src/components/ui/Button.vue +74 -17
  47. package/src/components/ui/Checkbox.vue +21 -14
  48. package/src/components/ui/ConfirmModal.vue +14 -6
  49. package/src/components/ui/DropdownMenu.vue +32 -0
  50. package/src/components/ui/DropdownMenuOption.vue +22 -0
  51. package/src/components/ui/DropdownMenuOptions.vue +44 -0
  52. package/src/components/ui/EditableContent.vue +82 -0
  53. package/src/components/ui/ErrorLogs.vue +19 -0
  54. package/src/components/ui/ErrorLogsModal.vue +48 -0
  55. package/src/components/{lib/AGErrorMessage.vue → ui/ErrorMessage.vue} +2 -3
  56. package/src/components/ui/ErrorReportModal.vue +18 -7
  57. package/src/components/ui/ErrorReportModalButtons.vue +6 -8
  58. package/src/components/ui/ErrorReportModalTitle.vue +1 -1
  59. package/src/components/ui/Input.vue +11 -7
  60. package/src/components/ui/Link.vue +2 -2
  61. package/src/components/ui/LoadingModal.vue +8 -6
  62. package/src/components/ui/Markdown.vue +41 -6
  63. package/src/components/ui/Modal.vue +95 -19
  64. package/src/components/ui/ModalContext.vue +2 -1
  65. package/src/components/ui/ProgressBar.vue +9 -8
  66. package/src/components/ui/PromptModal.vue +11 -8
  67. package/src/components/ui/Select.vue +27 -0
  68. package/src/components/ui/SelectLabel.vue +21 -0
  69. package/src/components/ui/SelectOption.vue +29 -0
  70. package/src/components/ui/SelectOptions.vue +35 -0
  71. package/src/components/ui/SelectTrigger.vue +29 -0
  72. package/src/components/ui/Setting.vue +31 -0
  73. package/src/components/ui/SettingsModal.vue +15 -0
  74. package/src/components/ui/Switch.vue +11 -0
  75. package/src/components/ui/TextArea.vue +56 -0
  76. package/src/components/ui/Toast.vue +46 -0
  77. package/src/components/ui/index.ts +19 -0
  78. package/src/directives/measure.ts +11 -5
  79. package/src/errors/Errors.ts +21 -19
  80. package/src/errors/index.ts +6 -2
  81. package/src/errors/settings/Debug.vue +32 -0
  82. package/src/errors/settings/index.ts +10 -0
  83. package/src/forms/FormController.test.ts +32 -9
  84. package/src/forms/FormController.ts +27 -22
  85. package/src/forms/index.ts +0 -1
  86. package/src/forms/utils.ts +34 -34
  87. package/src/index.css +70 -3
  88. package/src/lang/index.ts +5 -1
  89. package/src/lang/settings/Language.vue +48 -0
  90. package/src/lang/settings/index.ts +10 -0
  91. package/src/services/App.state.ts +11 -1
  92. package/src/services/App.ts +9 -1
  93. package/src/services/Events.test.ts +8 -8
  94. package/src/services/Events.ts +2 -8
  95. package/src/services/index.ts +5 -2
  96. package/src/testing/index.ts +4 -0
  97. package/src/ui/UI.state.ts +5 -15
  98. package/src/ui/UI.ts +115 -99
  99. package/src/ui/index.ts +18 -19
  100. package/src/utils/classes.ts +41 -0
  101. package/src/utils/composition/events.ts +2 -4
  102. package/src/utils/composition/forms.ts +16 -1
  103. package/src/utils/composition/state.ts +11 -2
  104. package/src/utils/index.ts +3 -1
  105. package/src/utils/markdown.ts +35 -1
  106. package/src/utils/types.ts +3 -0
  107. package/src/utils/vue.ts +28 -129
  108. package/src/components/AppSnackbars.vue +0 -13
  109. package/src/components/composition.ts +0 -23
  110. package/src/components/constants.ts +0 -8
  111. package/src/components/contracts/shared.ts +0 -9
  112. package/src/components/forms/AGSelect.story.vue +0 -46
  113. package/src/components/forms/AGSelect.vue +0 -54
  114. package/src/components/forms/index.ts +0 -1
  115. package/src/components/headless/forms/AGHeadlessSelect.ts +0 -42
  116. package/src/components/headless/forms/AGHeadlessSelect.vue +0 -77
  117. package/src/components/headless/forms/AGHeadlessSelectOption.ts +0 -4
  118. package/src/components/headless/forms/AGHeadlessSelectOption.vue +0 -31
  119. package/src/components/headless/forms/AGHeadlessSelectOptions.vue +0 -19
  120. package/src/components/headless/forms/AGHeadlessSelectTrigger.vue +0 -25
  121. package/src/components/headless/forms/composition.ts +0 -10
  122. package/src/components/headless/forms/index.ts +0 -8
  123. package/src/components/headless/snackbars/AGHeadlessSnackbar.vue +0 -10
  124. package/src/components/headless/snackbars/index.ts +0 -40
  125. package/src/components/lib/AGMeasured.vue +0 -16
  126. package/src/components/lib/index.ts +0 -3
  127. package/src/components/snackbars/AGSnackbar.vue +0 -38
  128. package/src/components/snackbars/index.ts +0 -3
  129. package/src/components/utils.ts +0 -107
  130. package/src/forms/composition.ts +0 -6
  131. package/src/utils/tailwindcss.test.ts +0 -26
  132. package/src/utils/tailwindcss.ts +0 -7
  133. package/src/utils/vdom.ts +0 -31
  134. /package/src/components/{lib/AGStartupCrash.vue → ui/StartupCrash.vue} +0 -0
@@ -1,38 +0,0 @@
1
- <template>
2
- <AGHeadlessSnackbar class="flex flex-row items-center justify-center gap-3 p-4" :class="styleClasses">
3
- <Markdown :text="message" inline />
4
- <Button
5
- v-for="(action, i) of actions"
6
- :key="i"
7
- :variant="colorVariant"
8
- @click="activate(action)"
9
- >
10
- {{ action.text }}
11
- </Button>
12
- </AGHeadlessSnackbar>
13
- </template>
14
-
15
- <script setup lang="ts">
16
- import { computed } from 'vue';
17
-
18
- import { Colors } from '@aerogel/core/components/constants';
19
- import { useSnackbar, useSnackbarProps } from '@aerogel/core/components/headless/snackbars';
20
- import type { ButtonVariant } from '@aerogel/core/components/contracts/Button';
21
-
22
- import Button from '../ui/Button.vue';
23
- import AGHeadlessSnackbar from '../headless/snackbars/AGHeadlessSnackbar.vue';
24
- import Markdown from '../ui/Markdown.vue';
25
-
26
- const props = defineProps(useSnackbarProps());
27
- const { activate } = useSnackbar(props);
28
- const styleClasses = computed(() => {
29
- switch (props.color) {
30
- case Colors.Danger:
31
- return 'bg-red-200 text-red-900';
32
- default:
33
- case Colors.Secondary:
34
- return 'bg-gray-900 text-white';
35
- }
36
- });
37
- const colorVariant = computed(() => props.color as ButtonVariant);
38
- </script>
@@ -1,3 +0,0 @@
1
- import AGSnackbar from './AGSnackbar.vue';
2
-
3
- export { AGSnackbar };
@@ -1,107 +0,0 @@
1
- import clsx from 'clsx';
2
- import { computed, customRef, inject, onUnmounted, unref } from 'vue';
3
- import { cva } from 'class-variance-authority';
4
- import { isObject } from '@noeldemartin/utils';
5
- import { twMerge } from 'tailwind-merge';
6
- import type { ClassValue } from 'clsx';
7
- import type { ComputedRef, ExtractPropTypes, PropType, Ref, UnwrapNestedRefs } from 'vue';
8
- import type { GetClosureArgs, GetClosureResult, Nullable } from '@noeldemartin/utils';
9
-
10
- import type { HasElement } from '@aerogel/core/components/contracts/shared';
11
- import type { FormController } from '@aerogel/core/forms';
12
-
13
- export type CVAConfig<T> = NonNullable<GetClosureArgs<typeof cva<T>>[1]>;
14
- export type CVAProps<T> = NonNullable<GetClosureArgs<GetClosureResult<typeof cva<T>>>[0]>;
15
- export type RefsObject<T> = { [K in keyof T]: Ref<T[K]> | T[K] };
16
- export type Variants<T extends Record<string, string>> = Required<{
17
- [K in keyof T]: {
18
- [key in T[K]]: string;
19
- };
20
- }>;
21
-
22
- export type ComponentPropDefinitions<T> = {
23
- [K in keyof T]: {
24
- type?: PropType<T[K]>;
25
- default: T[K] | (() => T[K]) | null;
26
- };
27
- };
28
-
29
- export type PickComponentProps<TValues, TDefinitions> = {
30
- [K in keyof TValues]: K extends keyof TDefinitions ? TValues[K] : never;
31
- };
32
-
33
- export function computedVariantClasses<T>(
34
- value: RefsObject<{ baseClasses?: string } & CVAProps<T>>,
35
- config: { baseClasses?: string } & CVAConfig<T>,
36
- ): ComputedRef<string> {
37
- return computed(() => {
38
- const { baseClasses: valueBaseClasses, ...valueRefs } = value;
39
- const { baseClasses: configBaseClasses, ...configs } = config;
40
- const variants = cva(configBaseClasses, configs as CVAConfig<T>);
41
- const values = Object.entries(valueRefs).reduce((extractedValues, [name, valueRef]) => {
42
- extractedValues[name as keyof CVAProps<T>] = unref(valueRef);
43
-
44
- return extractedValues;
45
- }, {} as CVAProps<T>);
46
-
47
- return classes(variants(values), unref(valueBaseClasses));
48
- });
49
- }
50
-
51
- export function classes(...inputs: ClassValue[]): string {
52
- return twMerge(clsx(inputs));
53
- }
54
-
55
- export function elementRef(): Ref<HTMLElement | undefined> {
56
- return customRef((track, trigger) => {
57
- let value: HTMLElement | undefined = undefined;
58
-
59
- return {
60
- get() {
61
- track();
62
-
63
- return value;
64
- },
65
- set(newValue) {
66
- value = getElement(newValue);
67
-
68
- trigger();
69
- },
70
- };
71
- });
72
- }
73
-
74
- export function extractComponentProps<TDefinitions extends {}, TValues extends ExtractPropTypes<TDefinitions>>(
75
- values: TValues,
76
- definitions: TDefinitions,
77
- ): PickComponentProps<TValues, TDefinitions> {
78
- return Object.keys(definitions).reduce(
79
- (extracted, prop) => {
80
- extracted[prop] = values[prop as keyof TValues];
81
-
82
- return extracted;
83
- },
84
- {} as Record<string, unknown>,
85
- ) as PickComponentProps<TValues, TDefinitions>;
86
- }
87
-
88
- export function getElement(value: unknown): HTMLElement | undefined {
89
- if (value instanceof HTMLElement) {
90
- return value;
91
- }
92
-
93
- if (hasElement(value)) {
94
- return value.$el;
95
- }
96
- }
97
-
98
- export function hasElement(value: unknown): value is UnwrapNestedRefs<HasElement> {
99
- return isObject(value) && '$el' in value;
100
- }
101
-
102
- export function onFormFocus(input: { name: Nullable<string> }, listener: () => unknown): void {
103
- const form = inject<FormController | null>('form', null);
104
- const stop = form?.on('focus', (name) => input.name === name && listener());
105
-
106
- onUnmounted(() => stop?.());
107
- }
@@ -1,6 +0,0 @@
1
- import FormController from '@aerogel/core/forms/FormController';
2
- import type { FormData, FormFieldDefinitions } from '@aerogel/core/forms/FormController';
3
-
4
- export function useForm<const T extends FormFieldDefinitions>(fields: T): FormController<T> & FormData<T> {
5
- return new FormController(fields) as FormController<T> & FormData<T>;
6
- }
@@ -1,26 +0,0 @@
1
- import { describe, expect, it } from 'vitest';
2
-
3
- import { removeInteractiveClasses } from './tailwindcss';
4
-
5
- describe('TailwindCSS utils', () => {
6
-
7
- it('Removes interactive classes', () => {
8
- const cases: [string, string][] = [
9
- ['text-red hover:text-green', 'text-red'],
10
- ['text-red hover:text-green text-lg', 'text-red text-lg'],
11
- [
12
- `
13
- text-red text-lg
14
- focus:text-yellow
15
- hover:focus:text-black
16
- `,
17
- 'text-red text-lg',
18
- ],
19
- ];
20
-
21
- cases.forEach(([original, expected]) => {
22
- expect(removeInteractiveClasses(original)).toEqual(expected);
23
- });
24
- });
25
-
26
- });
@@ -1,7 +0,0 @@
1
- export function removeInteractiveClasses(classes: string): string {
2
- return classes
3
- .split(/\s+/)
4
- .filter((className) => !/^(hover|focus|focus-visible):/.test(className))
5
- .join(' ')
6
- .trim();
7
- }
package/src/utils/vdom.ts DELETED
@@ -1,31 +0,0 @@
1
- import { Comment, Static, Text } from 'vue';
2
- import { toString } from '@noeldemartin/utils';
3
- import type { VNode } from 'vue';
4
-
5
- function renderAttrs(node: VNode): string {
6
- return Object.entries(node.props ?? {}).reduce((attrs, [name, value]) => {
7
- return attrs + `${name}="${toString(value)}"`;
8
- }, '');
9
- }
10
-
11
- export function renderNode(node: VNode | string): string {
12
- if (typeof node === 'string') {
13
- return node;
14
- }
15
-
16
- if (node.type === Comment) {
17
- return '';
18
- }
19
-
20
- if (node.type === Text || node.type === Static) {
21
- return node.children as string;
22
- }
23
-
24
- if (node.type === 'br') {
25
- return '\n\n';
26
- }
27
-
28
- return `<${node.type} ${renderAttrs(node)}>${Array.from(node.children as Array<VNode | string>)
29
- .map(renderNode)
30
- .join('')}</${node.type}>`;
31
- }