quasar-ui-danx 0.4.27 → 0.4.29

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 (51) hide show
  1. package/README.md +35 -35
  2. package/dist/danx.es.js +24686 -24119
  3. package/dist/danx.es.js.map +1 -1
  4. package/dist/danx.umd.js +109 -109
  5. package/dist/danx.umd.js.map +1 -1
  6. package/dist/style.css +1 -1
  7. package/package.json +1 -1
  8. package/src/components/ActionTable/ActionTable.vue +29 -7
  9. package/src/components/ActionTable/Filters/FilterableField.vue +14 -2
  10. package/src/components/ActionTable/Form/ActionForm.vue +17 -12
  11. package/src/components/ActionTable/Form/Fields/DateField.vue +24 -20
  12. package/src/components/ActionTable/Form/Fields/DateRangeField.vue +57 -53
  13. package/src/components/ActionTable/Form/Fields/EditOnClickTextField.vue +9 -2
  14. package/src/components/ActionTable/Form/Fields/EditableDiv.vue +51 -21
  15. package/src/components/ActionTable/Form/Fields/FieldLabel.vue +1 -1
  16. package/src/components/ActionTable/Form/Fields/SelectField.vue +27 -6
  17. package/src/components/ActionTable/Form/Fields/SelectOrCreateField.vue +56 -0
  18. package/src/components/ActionTable/Form/Fields/TextField.vue +2 -0
  19. package/src/components/ActionTable/Form/Fields/index.ts +1 -0
  20. package/src/components/ActionTable/Form/RenderedForm.vue +7 -20
  21. package/src/components/ActionTable/Form/Utilities/MaxLengthCounter.vue +1 -1
  22. package/src/components/ActionTable/Form/Utilities/SaveStateIndicator.vue +37 -0
  23. package/src/components/ActionTable/Form/Utilities/index.ts +1 -0
  24. package/src/components/ActionTable/Layouts/ActionTableLayout.vue +20 -23
  25. package/src/components/ActionTable/Toolbars/ActionToolbar.vue +44 -36
  26. package/src/components/ActionTable/{listControls.ts → controls.ts} +13 -9
  27. package/src/components/ActionTable/index.ts +1 -1
  28. package/src/components/DragAndDrop/ListItemDraggable.vue +45 -31
  29. package/src/components/DragAndDrop/dragAndDrop.ts +221 -220
  30. package/src/components/DragAndDrop/listDragAndDrop.ts +269 -227
  31. package/src/components/PanelsDrawer/PanelsDrawer.vue +7 -7
  32. package/src/components/PanelsDrawer/PanelsDrawerTabs.vue +3 -3
  33. package/src/components/Utility/Buttons/ShowHideButton.vue +86 -0
  34. package/src/components/Utility/Buttons/index.ts +1 -0
  35. package/src/components/Utility/Dialogs/ActionFormDialog.vue +30 -0
  36. package/src/components/Utility/Dialogs/CreateNewWithNameDialog.vue +26 -0
  37. package/src/components/Utility/Dialogs/RenderedFormDialog.vue +50 -0
  38. package/src/components/Utility/Dialogs/index.ts +3 -0
  39. package/src/helpers/FileUpload.ts +4 -4
  40. package/src/helpers/actions.ts +84 -20
  41. package/src/helpers/files.ts +56 -43
  42. package/src/helpers/formats.ts +23 -20
  43. package/src/helpers/objectStore.ts +24 -12
  44. package/src/types/actions.d.ts +50 -26
  45. package/src/types/controls.d.ts +23 -25
  46. package/src/types/fields.d.ts +1 -0
  47. package/src/types/files.d.ts +2 -2
  48. package/src/types/index.d.ts +5 -0
  49. package/src/types/shared.d.ts +9 -0
  50. package/src/types/tables.d.ts +3 -3
  51. package/types/vue-shims.d.ts +3 -2
@@ -1,24 +1,27 @@
1
+ import { FilterGroup, ListController, ListControlsRoutes } from "src/types/controls";
2
+ import { FormField } from "src/types/forms";
3
+ import { TableColumn } from "src/types/tables";
1
4
  import { VNode } from "vue";
2
- import { TypedObject } from "./shared";
3
-
4
- export interface ActionPanel {
5
- name: string | number;
6
- label: string;
7
- category?: string;
8
- class?: string | object;
9
- enabled?: boolean | ((activeItem: ActionTargetItem) => boolean);
10
- tabVnode?: (activeItem: ActionTargetItem | null | undefined, activePanel: string | number) => VNode | any;
11
- vnode: (activeItem: ActionTargetItem | null | undefined) => VNode | any;
12
- }
5
+ import { AnyObject, ComputedRef, TypedObject } from "./shared";
13
6
 
14
7
  export interface ActionTargetItem extends TypedObject {
15
8
  isSaving?: boolean;
16
9
  updated_at?: string;
17
10
  }
18
11
 
19
- export type ActionTarget = ActionTargetItem[] | ActionTargetItem | null;
12
+ export type ActionTarget<T = ActionTargetItem> = T[] | T | null;
13
+
14
+ export interface ActionPanel<T = ActionTargetItem> {
15
+ name: string | number;
16
+ label: string;
17
+ category?: string;
18
+ class?: string | object;
19
+ enabled?: boolean | ((target: T) => boolean);
20
+ tabVnode?: (target: T | null | undefined, activePanel: string | number) => VNode | any;
21
+ vnode: (target: T | null | undefined) => VNode | any;
22
+ }
20
23
 
21
- export interface ActionOptions {
24
+ export interface ActionOptions<T = ActionTargetItem> {
22
25
  name: string;
23
26
  alias?: string;
24
27
  label?: string;
@@ -29,21 +32,42 @@ export interface ActionOptions {
29
32
  category?: string;
30
33
  class?: string;
31
34
  debounce?: number;
32
- optimistic?: boolean | ((action: ActionOptions, target: ActionTargetItem | null, input: any) => void);
33
- vnode?: ((target: ActionTarget) => VNode) | any;
34
- enabled?: (target: object) => boolean;
35
- batchEnabled?: (targets: object[]) => boolean;
36
- onAction?: (action: string | null | undefined, target: ActionTargetItem | null, input: any) => Promise<any> | void;
37
- onBatchAction?: (action: string | null | undefined, targets: ActionTargetItem[], input: any) => Promise<any>;
38
- onStart?: (action: ActionOptions | null, targets: ActionTarget, input: any) => boolean;
39
- onSuccess?: (result: any, targets: ActionTarget, input: any) => any;
40
- onBatchSuccess?: (result: any, targets: ActionTargetItem[], input: any) => any;
41
- onError?: (result: any, targets: ActionTarget, input: any) => any;
42
- onFinish?: (result: any, targets: ActionTarget, input: any) => any;
35
+ optimistic?: boolean | ((action: ActionOptions<T>, target: T | null, input: any) => void);
36
+ vnode?: (target: ActionTarget<T>, data: any) => VNode | any;
37
+ enabled?: (target: ActionTarget<T>) => boolean;
38
+ batchEnabled?: (targets: T[]) => boolean;
39
+ onAction?: (action: string | ResourceAction<T> | ActionOptions<T>, target: T | null, input?: AnyObject | any) => Promise<AnyObject | any> | void;
40
+ onBatchAction?: (action: string | ResourceAction<T> | ActionOptions<T>, targets: T[], input: any) => Promise<AnyObject | any> | void;
41
+ onStart?: (action: ActionOptions<T> | null, targets: ActionTarget<T>, input: any) => boolean;
42
+ onSuccess?: (result: any, targets: ActionTarget<T>, input: any) => any;
43
+ onBatchSuccess?: (result: any, targets: T[], input: any) => any;
44
+ onError?: (result: any, targets: ActionTarget<T>, input: any) => any;
45
+ onFinish?: (result: any, targets: ActionTarget<T>, input: any) => any;
43
46
  }
44
47
 
45
- export interface ResourceAction extends ActionOptions {
48
+ export interface ActionGlobalOptions extends Partial<ActionOptions> {
49
+ routes?: ListControlsRoutes;
50
+ controls?: ListController;
51
+ }
52
+
53
+ export interface ResourceAction<T = ActionTargetItem> extends ActionOptions<T> {
46
54
  isApplying: boolean;
47
- trigger: (target?: ActionTarget, input?: any) => Promise<any>;
55
+ trigger: (target?: ActionTarget<T>, input?: any) => Promise<any>;
48
56
  __type: string;
49
57
  }
58
+
59
+ export interface ActionController<T = ActionTargetItem> {
60
+ // Actions
61
+ action?: (actionName: string, target?: T | null, input?: any) => Promise<any | void>;
62
+ getAction?: (actionName: string, actionOptions?: Partial<ActionOptions>) => ResourceAction;
63
+ getActions?: (names?: string[]) => ResourceAction[];
64
+ extendAction?: (actionName: string, extendedId: string | number, actionOptions: Partial<ActionOptions>) => ResourceAction;
65
+ modifyAction?: (actionName: string, actionOptions: Partial<ActionOptions>) => ResourceAction;
66
+ batchActions?: ResourceAction[];
67
+ menuActions?: ResourceAction[];
68
+ columns?: TableColumn[];
69
+ filters?: ComputedRef<FilterGroup[]>;
70
+ fields?: FormField[];
71
+ panels?: ActionPanel[];
72
+ routes?: ListControlsRoutes;
73
+ }
@@ -1,6 +1,5 @@
1
- import { ComputedRef, Ref, ShallowRef } from "vue";
2
- import { ActionTargetItem } from "./actions";
3
- import { AnyObject, LabelValueItem } from "./shared";
1
+ import { ActionOptions, ActionTargetItem, ResourceAction } from "./actions";
2
+ import { AnyObject, ComputedRef, LabelValueItem, Ref } from "./shared";
4
3
 
5
4
  export interface ListControlsFilter {
6
5
  [key: string]: object | object[] | null | undefined | string | number | boolean;
@@ -20,25 +19,24 @@ export interface FilterGroup {
20
19
  fields: FilterableField[];
21
20
  }
22
21
 
23
-
24
- export interface ListControlsRoutes {
25
- list(pager?: ListControlsPagination): Promise<ActionTargetItem[]>;
22
+ export interface ListControlsRoutes<T = ActionTargetItem> {
23
+ list(pager?: ListControlsPagination): Promise<T[]>;
26
24
 
27
25
  summary?(filter?: ListControlsFilter): Promise<AnyObject>;
28
26
 
29
- details?(target: ActionTargetItem): Promise<ActionTargetItem>;
27
+ details?(target: T): Promise<T>;
30
28
 
31
- detailsAndStore?(target: ActionTargetItem): Promise<ActionTargetItem>;
29
+ detailsAndStore?(target: T): Promise<T>;
32
30
 
33
- relation?(target: ActionTargetItem, relation: string): Promise<ActionTargetItem>;
31
+ relation?(target: T, relation: string): Promise<T>;
34
32
 
35
- more?(pager: ListControlsPagination): Promise<ActionTargetItem[]>;
33
+ more?(pager: ListControlsPagination): Promise<T[]>;
36
34
 
37
35
  fieldOptions?(filter?: AnyObject): Promise<AnyObject>;
38
36
 
39
- applyAction?(action: string, target: ActionTargetItem | null, data?: object): Promise<AnyObject>;
37
+ applyAction?(action: string | ResourceAction | ActionOptions, target: T | null, data?: object): Promise<AnyObject>;
40
38
 
41
- batchAction?(action: string, targets: ActionTargetItem[], data: object): Promise<AnyObject>;
39
+ batchAction?(action: string | ResourceAction | ActionOptions, targets: T[], data: object): Promise<AnyObject>;
42
40
 
43
41
  export?(filter?: ListControlsFilter, name?: string): Promise<void>;
44
42
  }
@@ -62,24 +60,24 @@ export interface ListControlsPagination {
62
60
  filter?: ListControlsFilter;
63
61
  }
64
62
 
65
- export interface PagedItems {
66
- data: ActionTargetItem[] | undefined;
63
+ export interface PagedItems<T = ActionTargetItem> {
64
+ data: T[] | undefined;
67
65
  meta: {
68
66
  total: number;
69
67
  last_page?: number;
70
68
  } | undefined;
71
69
  }
72
70
 
73
- export interface ActionController {
71
+ export interface ListController<T = ActionTargetItem> {
74
72
  name: string;
75
73
  label: string;
76
- pagedItems: Ref<PagedItems | null>;
74
+ pagedItems: Ref<PagedItems<T> | null>;
77
75
  activeFilter: Ref<ListControlsFilter>;
78
76
  globalFilter: Ref<ListControlsFilter>;
79
77
  filterActiveCount: ComputedRef<number>;
80
78
  showFilters: Ref<boolean>;
81
- summary: ShallowRef<object | null>;
82
- selectedRows: ShallowRef<ActionTargetItem[]>;
79
+ summary: Ref<object | null>;
80
+ selectedRows: Ref<T[]>;
83
81
  isLoadingList: Ref<boolean>;
84
82
  isLoadingFilters: Ref<boolean>;
85
83
  isLoadingSummary: Ref<boolean>;
@@ -89,15 +87,15 @@ export interface ActionController {
89
87
  filter: ListControlsFilter;
90
88
  sort: object[] | undefined;
91
89
  }>;
92
- pagination: ShallowRef<ListControlsPagination>;
93
- activeItem: ShallowRef<ActionTargetItem | null>;
94
- activePanel: ShallowRef<string | null>;
90
+ pagination: Ref<ListControlsPagination>;
91
+ activeItem: Ref<T | null>;
92
+ activePanel: Ref<string | null>;
95
93
 
96
- // Actions
94
+ // List Controls
97
95
  initialize: () => void;
98
96
  resetPaging: () => void;
99
97
  setPagination: (updated: Partial<ListControlsPagination>) => void;
100
- setSelectedRows: (selection: ActionTargetItem[]) => void;
98
+ setSelectedRows: (selection: T[]) => void;
101
99
  clearSelectedRows: () => void;
102
100
  loadList: (filter?: ListControlsFilter) => Promise<void>;
103
101
  loadSummary: (filter?: ListControlsFilter) => Promise<void>;
@@ -107,9 +105,9 @@ export interface ActionController {
107
105
  getActiveItemDetails: () => Promise<void>;
108
106
  refreshAll: () => Promise<void[]>;
109
107
  exportList: (filter?: ListControlsFilter) => Promise<void>;
110
- setActiveItem: (item: ActionTargetItem | null) => void;
108
+ setActiveItem: (item: T | null) => void;
111
109
  getNextItem: (offset: number) => Promise<void>;
112
- activatePanel: (item: ActionTargetItem | null, panel: string) => void;
110
+ activatePanel: (item: T | null, panel: string) => void;
113
111
  setActiveFilter: (filter?: ListControlsFilter) => void;
114
112
  applyFilterFromUrl: (url: string, filters?: Ref<FilterGroup[]> | null) => void;
115
113
  getFieldOptions: (field: string) => any[];
@@ -12,6 +12,7 @@ export interface TextFieldProps {
12
12
  inputClass?: string | object;
13
13
  allowOverMax?: boolean;
14
14
  maxLength?: number;
15
+ rows?: number;
15
16
  autogrow?: boolean;
16
17
  noLabel?: boolean;
17
18
  showName?: boolean;
@@ -3,7 +3,7 @@ import { AnyObject, TypedObject } from "src/types/shared";
3
3
  export interface FileUploadOptions {
4
4
  directory?: string,
5
5
  createPresignedUpload?: ((path: string, name: string, mime?: string) => Promise<UploadedFile>) | null;
6
- completePresignedUpload?: ((fileId: string) => Promise<UploadedFile>) | null;
6
+ completePresignedUpload?: ((fileId: string, file: XHRFileUpload) => Promise<UploadedFile>) | null;
7
7
  refreshFile?: ((fileId: string) => Promise<UploadedFile>) | null;
8
8
  }
9
9
 
@@ -25,7 +25,7 @@ export interface UploadedFile extends TypedObject {
25
25
  mimeType?: string;
26
26
  mime?: string;
27
27
  progress?: number;
28
- location?: string;
28
+ location?: string | Partial<GeolocationCoordinates> | null;
29
29
  blobUrl?: string;
30
30
  url?: string;
31
31
  thumb?: UploadedFile;
@@ -1,3 +1,6 @@
1
+ import { ActionController, ActionTargetItem } from "./actions";
2
+ import { ListController } from "./controls";
3
+
1
4
  export * from "./actions";
2
5
  export * from "./config";
3
6
  export * from "./controls";
@@ -9,3 +12,5 @@ export * from "./forms";
9
12
  export * from "./requests";
10
13
  export * from "./shared";
11
14
  export * from "./tables";
15
+
16
+ export type DanxController<T = ActionTargetItem> = ActionController<T> & ListController<T>;
@@ -14,3 +14,12 @@ export interface LabelValueItem {
14
14
  label: string;
15
15
  value: string | number | boolean;
16
16
  }
17
+
18
+ /** Define Vue 3 Types here for better type checking in PHPStorm */
19
+ export interface Ref<T = any> {
20
+ value: T;
21
+ }
22
+
23
+ export interface ComputedRef<T = any> {
24
+ readonly value: T;
25
+ }
@@ -1,8 +1,8 @@
1
1
  import { VNode } from "vue";
2
- import { ActionOptions } from "./actions";
2
+ import { ActionOptions, ActionTargetItem } from "./actions";
3
3
 
4
- export interface TableColumn {
5
- actionMenu?: ActionOptions[];
4
+ export interface TableColumn<T = ActionTargetItem> {
5
+ actionMenu?: ActionOptions<T>[];
6
6
  align?: string;
7
7
  category?: string;
8
8
  class?: string | object;
@@ -1,4 +1,5 @@
1
1
  declare module "*.vue" {
2
- import Vue from 'vue';
3
- export default Vue;
2
+ import type { DefineComponent } from "vue";
3
+ const component: DefineComponent<object, object, any>;
4
+ export default component;
4
5
  }