@razaman2/reactive-view 0.0.5 → 0.0.7

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.
package/dist/index.d.mts CHANGED
@@ -1,4 +1,3 @@
1
- import * as vue from 'vue';
2
1
  import { SetupContext, ComponentPublicInstance, UnwrapRef } from 'vue';
3
2
 
4
3
  type SubscriptionItem = {
@@ -29,40 +28,24 @@ declare const setup: {
29
28
  default: (param1?: {}, param2?: {}) => {};
30
29
  };
31
30
  };
32
- declare const _default$1: {
31
+ declare const _default: {
33
32
  props: {
33
+ notifications: ObjectConstructor;
34
+ subscriptions: ObjectConstructor;
34
35
  defaultData: {};
36
+ model: {};
37
+ state: {};
35
38
  getDefaultData: {
36
39
  type: FunctionConstructor;
37
40
  default: (data?: {}) => {};
38
41
  };
39
42
  logging: {
40
- validator: (logging: unknown) => boolean;
43
+ validator: (logging: any) => boolean;
41
44
  };
42
- model: {};
43
45
  modelName: {
44
46
  type: StringConstructor;
45
47
  default: string;
46
48
  };
47
- notifications: {
48
- type: ObjectConstructor;
49
- };
50
- root: {
51
- type: FunctionConstructor;
52
- };
53
- state: {};
54
- subscriptions: {
55
- type: ObjectConstructor;
56
- default: {
57
- addSubscription(name: string, handler?: () => boolean, data?: any): void;
58
- replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
59
- removeSubscriptions(): void;
60
- removeSubscription(name: string): void;
61
- hasSubscription(name: string): boolean;
62
- subscriptions: any[];
63
- subscription: Subscription;
64
- };
65
- };
66
49
  sync: {
67
50
  type: BooleanConstructor;
68
51
  default: boolean;
@@ -75,52 +58,51 @@ declare const _default$1: {
75
58
  setup(props: Record<string, any>, context: SetupContext): ($vue: ComponentPublicInstance & any) => any;
76
59
  };
77
60
 
78
- declare const _default: {
79
- props: {
80
- resolve: {
81
- required: boolean;
82
- };
83
- delay: {
84
- type: NumberConstructor;
85
- default: number;
86
- };
87
- timeout: {
88
- type: NumberConstructor;
89
- default: number;
90
- };
91
- loading: {
92
- default: vue.VNode<vue.RendererNode, vue.RendererElement, {
93
- [key: string]: any;
94
- }>;
95
- };
96
- options: {
97
- type: ObjectConstructor;
98
- };
99
- error: {
100
- required: boolean;
101
- };
102
- setup: {
103
- type: FunctionConstructor;
104
- default: (param1?: {}, param2?: {}) => {};
105
- };
106
- };
107
- setup(): ($vue: any) => vue.VNode<vue.RendererNode, vue.RendererElement, {
108
- [key: string]: any;
109
- }>;
110
- };
111
-
112
61
  /**
113
62
  * uppercase the first character of each word in the input string.
63
+ * @deprecated
114
64
  * @description
115
65
  * (test -> Test), (TEST -> Test), (test test -> Test Test)
116
66
  */
117
67
  declare function ucf(string: string): string;
118
68
  /**
119
69
  * uppercase the first character of each word that follows a specified token
70
+ * @deprecated
120
71
  * @description
121
72
  * (test-test -> test-Test), (TEST-TEST -> TEST-Test), (test/test -> test/Test)
122
73
  */
123
74
  declare function ucfat(string: string, tokens: Array<string>): string;
75
+ /**
76
+ * @deprecated
77
+ */
78
+ declare function getRoot(vue: ComponentPublicInstance): any;
79
+ /**
80
+ * @deprecated
81
+ */
82
+ declare function getRef(component: ComponentPublicInstance, ref: UnwrapRef<any>): ComponentPublicInstance;
83
+ /**
84
+ * @deprecated
85
+ */
86
+ declare function expose(vue: any, props: Record<string, any>): Record<string, any>;
87
+ type Accessible = {
88
+ parent: {
89
+ self: Record<string | symbol, any>;
90
+ };
91
+ self: Record<string | symbol, any>;
92
+ access?: Function;
93
+ value?: {
94
+ parent: {
95
+ self: Record<string | symbol, any>;
96
+ };
97
+ self: Record<string | symbol, any>;
98
+ access?: Function;
99
+ };
100
+ };
101
+ type PropOptions = {
102
+ exclude: string | Array<string>;
103
+ include: Record<string, any>;
104
+ };
105
+ type PropExclusions = Array<string> | string;
124
106
  declare function safeRequest(request: {
125
107
  try: () => Promise<any> | any;
126
108
  catch?: ((error: any) => Promise<any> | any) | false;
@@ -133,12 +115,6 @@ declare function safeRequest(request: {
133
115
  message?: string;
134
116
  alternative?: boolean;
135
117
  }): Promise<any>;
136
- declare function getRoot(vue: ComponentPublicInstance): any;
137
- type PropOptions = {
138
- exclude: string | Array<string>;
139
- include: Record<string, any>;
140
- };
141
- type PropExclusions = Array<string> | string;
142
118
  declare function getProps(props: Record<string, any>, exclude: PropExclusions): Record<string, any>;
143
119
  declare function getProps(props: Record<string, any>, options: PropOptions): Record<string, any>;
144
120
  declare function getDate(timestamp: {
@@ -150,8 +126,6 @@ declare function getDate(timestamp: {
150
126
  format?: string;
151
127
  timezone?: string;
152
128
  }): string;
153
- declare function getRef(component: ComponentPublicInstance, ref: UnwrapRef<any>): ComponentPublicInstance;
154
- declare function expose(vue: any, props: Record<string, any>): Record<string, any>;
155
129
  declare function getSubscription(): {
156
130
  addSubscription(name: string, handler?: () => boolean, data?: any): void;
157
131
  replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
@@ -161,20 +135,6 @@ declare function getSubscription(): {
161
135
  subscriptions: any[];
162
136
  subscription: Subscription;
163
137
  };
164
- type Accessible = {
165
- parent: {
166
- self: Record<string | symbol, any>;
167
- };
168
- self: Record<string | symbol, any>;
169
- access?: Function;
170
- value?: {
171
- parent: {
172
- self: Record<string | symbol, any>;
173
- };
174
- self: Record<string | symbol, any>;
175
- access?: Function;
176
- };
177
- };
178
- declare function access<T extends ComponentPublicInstance & Accessible>($vue?: T): any;
138
+ declare function access<T extends ComponentPublicInstance & Accessible>($vue?: T | UnwrapRef<any>): any;
179
139
 
180
- export { _default as AsyncComponent, access, _default$1 as default, expose, getDate, getProps, getRef, getRoot, getSubscription, safeRequest, setup, ucf, ucfat };
140
+ export { access, _default as default, expose, getDate, getProps, getRef, getRoot, getSubscription, safeRequest, setup, ucf, ucfat };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- import * as vue from 'vue';
2
1
  import { SetupContext, ComponentPublicInstance, UnwrapRef } from 'vue';
3
2
 
4
3
  type SubscriptionItem = {
@@ -29,40 +28,24 @@ declare const setup: {
29
28
  default: (param1?: {}, param2?: {}) => {};
30
29
  };
31
30
  };
32
- declare const _default$1: {
31
+ declare const _default: {
33
32
  props: {
33
+ notifications: ObjectConstructor;
34
+ subscriptions: ObjectConstructor;
34
35
  defaultData: {};
36
+ model: {};
37
+ state: {};
35
38
  getDefaultData: {
36
39
  type: FunctionConstructor;
37
40
  default: (data?: {}) => {};
38
41
  };
39
42
  logging: {
40
- validator: (logging: unknown) => boolean;
43
+ validator: (logging: any) => boolean;
41
44
  };
42
- model: {};
43
45
  modelName: {
44
46
  type: StringConstructor;
45
47
  default: string;
46
48
  };
47
- notifications: {
48
- type: ObjectConstructor;
49
- };
50
- root: {
51
- type: FunctionConstructor;
52
- };
53
- state: {};
54
- subscriptions: {
55
- type: ObjectConstructor;
56
- default: {
57
- addSubscription(name: string, handler?: () => boolean, data?: any): void;
58
- replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
59
- removeSubscriptions(): void;
60
- removeSubscription(name: string): void;
61
- hasSubscription(name: string): boolean;
62
- subscriptions: any[];
63
- subscription: Subscription;
64
- };
65
- };
66
49
  sync: {
67
50
  type: BooleanConstructor;
68
51
  default: boolean;
@@ -75,52 +58,51 @@ declare const _default$1: {
75
58
  setup(props: Record<string, any>, context: SetupContext): ($vue: ComponentPublicInstance & any) => any;
76
59
  };
77
60
 
78
- declare const _default: {
79
- props: {
80
- resolve: {
81
- required: boolean;
82
- };
83
- delay: {
84
- type: NumberConstructor;
85
- default: number;
86
- };
87
- timeout: {
88
- type: NumberConstructor;
89
- default: number;
90
- };
91
- loading: {
92
- default: vue.VNode<vue.RendererNode, vue.RendererElement, {
93
- [key: string]: any;
94
- }>;
95
- };
96
- options: {
97
- type: ObjectConstructor;
98
- };
99
- error: {
100
- required: boolean;
101
- };
102
- setup: {
103
- type: FunctionConstructor;
104
- default: (param1?: {}, param2?: {}) => {};
105
- };
106
- };
107
- setup(): ($vue: any) => vue.VNode<vue.RendererNode, vue.RendererElement, {
108
- [key: string]: any;
109
- }>;
110
- };
111
-
112
61
  /**
113
62
  * uppercase the first character of each word in the input string.
63
+ * @deprecated
114
64
  * @description
115
65
  * (test -> Test), (TEST -> Test), (test test -> Test Test)
116
66
  */
117
67
  declare function ucf(string: string): string;
118
68
  /**
119
69
  * uppercase the first character of each word that follows a specified token
70
+ * @deprecated
120
71
  * @description
121
72
  * (test-test -> test-Test), (TEST-TEST -> TEST-Test), (test/test -> test/Test)
122
73
  */
123
74
  declare function ucfat(string: string, tokens: Array<string>): string;
75
+ /**
76
+ * @deprecated
77
+ */
78
+ declare function getRoot(vue: ComponentPublicInstance): any;
79
+ /**
80
+ * @deprecated
81
+ */
82
+ declare function getRef(component: ComponentPublicInstance, ref: UnwrapRef<any>): ComponentPublicInstance;
83
+ /**
84
+ * @deprecated
85
+ */
86
+ declare function expose(vue: any, props: Record<string, any>): Record<string, any>;
87
+ type Accessible = {
88
+ parent: {
89
+ self: Record<string | symbol, any>;
90
+ };
91
+ self: Record<string | symbol, any>;
92
+ access?: Function;
93
+ value?: {
94
+ parent: {
95
+ self: Record<string | symbol, any>;
96
+ };
97
+ self: Record<string | symbol, any>;
98
+ access?: Function;
99
+ };
100
+ };
101
+ type PropOptions = {
102
+ exclude: string | Array<string>;
103
+ include: Record<string, any>;
104
+ };
105
+ type PropExclusions = Array<string> | string;
124
106
  declare function safeRequest(request: {
125
107
  try: () => Promise<any> | any;
126
108
  catch?: ((error: any) => Promise<any> | any) | false;
@@ -133,12 +115,6 @@ declare function safeRequest(request: {
133
115
  message?: string;
134
116
  alternative?: boolean;
135
117
  }): Promise<any>;
136
- declare function getRoot(vue: ComponentPublicInstance): any;
137
- type PropOptions = {
138
- exclude: string | Array<string>;
139
- include: Record<string, any>;
140
- };
141
- type PropExclusions = Array<string> | string;
142
118
  declare function getProps(props: Record<string, any>, exclude: PropExclusions): Record<string, any>;
143
119
  declare function getProps(props: Record<string, any>, options: PropOptions): Record<string, any>;
144
120
  declare function getDate(timestamp: {
@@ -150,8 +126,6 @@ declare function getDate(timestamp: {
150
126
  format?: string;
151
127
  timezone?: string;
152
128
  }): string;
153
- declare function getRef(component: ComponentPublicInstance, ref: UnwrapRef<any>): ComponentPublicInstance;
154
- declare function expose(vue: any, props: Record<string, any>): Record<string, any>;
155
129
  declare function getSubscription(): {
156
130
  addSubscription(name: string, handler?: () => boolean, data?: any): void;
157
131
  replaceSubscription(name: string, handler?: () => boolean, data?: any): void;
@@ -161,20 +135,6 @@ declare function getSubscription(): {
161
135
  subscriptions: any[];
162
136
  subscription: Subscription;
163
137
  };
164
- type Accessible = {
165
- parent: {
166
- self: Record<string | symbol, any>;
167
- };
168
- self: Record<string | symbol, any>;
169
- access?: Function;
170
- value?: {
171
- parent: {
172
- self: Record<string | symbol, any>;
173
- };
174
- self: Record<string | symbol, any>;
175
- access?: Function;
176
- };
177
- };
178
- declare function access<T extends ComponentPublicInstance & Accessible>($vue?: T): any;
138
+ declare function access<T extends ComponentPublicInstance & Accessible>($vue?: T | UnwrapRef<any>): any;
179
139
 
180
- export { _default as AsyncComponent, access, _default$1 as default, expose, getDate, getProps, getRef, getRoot, getSubscription, safeRequest, setup, ucf, ucfat };
140
+ export { access, _default as default, expose, getDate, getProps, getRef, getRoot, getSubscription, safeRequest, setup, ucf, ucfat };
package/dist/index.js CHANGED
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
2
  var __create = Object.create;
3
3
  var __defProp = Object.defineProperty;
4
- var __defProps = Object.defineProperties;
5
4
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
5
  var __getOwnPropNames = Object.getOwnPropertyNames;
8
6
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
7
  var __getProtoOf = Object.getPrototypeOf;
@@ -21,7 +19,6 @@ var __spreadValues = (a, b) => {
21
19
  }
22
20
  return a;
23
21
  };
24
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
22
  var __objRest = (source, exclude) => {
26
23
  var target = {};
27
24
  for (var prop in source)
@@ -55,31 +52,10 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
55
52
  mod
56
53
  ));
57
54
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
58
- var __async = (__this, __arguments, generator) => {
59
- return new Promise((resolve, reject) => {
60
- var fulfilled = (value) => {
61
- try {
62
- step(generator.next(value));
63
- } catch (e) {
64
- reject(e);
65
- }
66
- };
67
- var rejected = (value) => {
68
- try {
69
- step(generator.throw(value));
70
- } catch (e) {
71
- reject(e);
72
- }
73
- };
74
- var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
75
- step((generator = generator.apply(__this, __arguments)).next());
76
- });
77
- };
78
55
 
79
56
  // src/index.ts
80
57
  var src_exports = {};
81
58
  __export(src_exports, {
82
- AsyncComponent: () => AsyncComponent_default,
83
59
  access: () => access,
84
60
  default: () => src_default,
85
61
  expose: () => expose,
@@ -187,36 +163,32 @@ var Subscriptions = _Subscriptions;
187
163
  // src/ReactiveView.ts
188
164
  var import_object_manager = __toESM(require("@razaman2/object-manager"));
189
165
  var import_data_manager = __toESM(require("@razaman2/data-manager"));
190
- var import_vue = require("vue");
191
166
 
192
167
  // package.json
193
168
  var name = "@razaman2/reactive-view";
194
- var version = "0.0.5";
169
+ var version = "0.0.7";
195
170
 
196
171
  // src/ReactiveView.ts
172
+ var import_vue = require("vue");
197
173
  var props = {
174
+ notifications: Object,
175
+ subscriptions: Object,
198
176
  defaultData: {},
177
+ model: {},
178
+ state: {},
199
179
  getDefaultData: {
200
180
  type: Function,
201
181
  default: (data = {}) => data
202
182
  },
203
183
  logging: {
204
184
  validator: (logging) => {
205
- return typeof logging === "boolean";
185
+ return logging.constructor.name === "Boolean";
206
186
  }
207
187
  },
208
- model: {},
209
188
  modelName: {
210
189
  type: String,
211
190
  default: "ReactiveView"
212
191
  },
213
- notifications: { type: Object },
214
- root: { type: Function },
215
- state: {},
216
- subscriptions: {
217
- type: Object,
218
- default: getSubscription()
219
- },
220
192
  sync: {
221
193
  type: Boolean,
222
194
  default: true
@@ -233,7 +205,7 @@ var setup = {
233
205
  var ReactiveView_default = {
234
206
  props: __spreadValues(__spreadValues({}, setup), props),
235
207
  setup(props2, context) {
236
- var _a, _b, _c, _d, _f;
208
+ var _a, _b, _c, _d, _e;
237
209
  const template = (vue, options2) => {
238
210
  var _a2, _b2, _c2;
239
211
  const vnode = context.slots.default ? (0, import_vue.h)(
@@ -253,27 +225,21 @@ var ReactiveView_default = {
253
225
  Array.isArray(props2.state) ? (_a = props2.defaultData) != null ? _a : [] : (_b = props2.defaultData) != null ? _b : {}
254
226
  );
255
227
  const defaultType = Array.isArray(defaultData) ? [] : {};
256
- const stateRef = (0, import_vue.ref)(import_data_manager.default.transform((_c = props2.state) != null ? _c : defaultType));
228
+ const state = (0, import_vue.reactive)(import_data_manager.default.transform((_c = props2.state) != null ? _c : defaultType));
257
229
  const config = {
258
230
  defaultData,
259
- data: stateRef.value,
231
+ data: state,
260
232
  name: props2.modelName,
261
233
  logging: props2.logging,
262
234
  notifications: props2.notifications
263
235
  };
264
236
  const getState = props2.model ? typeof props2.model === "function" ? props2.model(config) : props2.model : new import_data_manager.default(config);
265
- const options = {
266
- parent: { self: props2 },
267
- self: { template, isValid, getState, stateRef }
268
- };
269
- const setup2 = (_d = props2.setup(options)) != null ? _d : options;
270
- const _e = setup2, { parent = {}, self = {} } = _e, rest = __objRest(_e, ["parent", "self"]);
271
237
  const sync = (0, import_vue.ref)(false);
272
238
  if (context.attrs["onUpdate:modelState"]) {
273
239
  const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
274
- const subscription = (0, import_vue.watch)(() => import_object_manager.default.on(stateRef.value).clone(), (after, before) => {
240
+ (0, import_vue.watch)(() => import_object_manager.default.on(state).clone(), (after, before) => {
275
241
  var _a2;
276
- const transform = (_a2 = config2.transform) != null ? _a2 : access(setup2).$transform;
242
+ const transform = (_a2 = config2.transform) != null ? _a2 : access(setup).$transform;
277
243
  const diff = {
278
244
  before: (before == null ? void 0 : before.hasOwnProperty("")) ? before[""] : before,
279
245
  after: (after == null ? void 0 : after.hasOwnProperty("")) ? after[""] : after
@@ -286,8 +252,8 @@ var ReactiveView_default = {
286
252
  }, config2.options);
287
253
  }
288
254
  if (context.attrs["onUpdate:propsState"] || props2.sync) {
289
- const config2 = (_f = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _f : {};
290
- const subscription = (0, import_vue.watch)(() => props2.state, (after, before) => {
255
+ const config2 = (_d = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _d : {};
256
+ (0, import_vue.watch)(() => props2.state, (after, before) => {
291
257
  if (props2.sync && typeof config2.callback !== "function") {
292
258
  getState.replaceData(after);
293
259
  } else if (typeof config2.callback === "function") {
@@ -296,91 +262,28 @@ var ReactiveView_default = {
296
262
  sync.value = true;
297
263
  }, config2.options);
298
264
  }
265
+ const options = {
266
+ parent: {},
267
+ self: { template, isValid, getState }
268
+ };
269
+ const _f = (_e = props2.setup(options)) != null ? _e : options, { parent = options.parent, self = options.self } = _f, rest = __objRest(_f, ["parent", "self"]);
299
270
  return ($vue) => {
300
- const setup3 = { $vue, options: parent };
301
- while (setup3.options) {
302
- Object.defineProperties(setup3.$vue, Object.assign({
271
+ const setup2 = { $vue, options: Object.assign(parent, { parent: { self: $vue } }) };
272
+ while (setup2.options) {
273
+ Object.defineProperties(setup2.$vue, Object.assign({
303
274
  access: {
304
275
  configurable: true,
305
- value: () => {
306
- return access({ parent, self });
307
- }
276
+ value: () => access({ parent, self })
308
277
  }
309
278
  }, rest));
310
- setup3.options = setup3.options.parent;
311
- setup3.$vue = setup3.$vue.$parent;
279
+ setup2.options = setup2.options.parent;
280
+ setup2.$vue = setup2.$vue.$parent;
312
281
  }
313
282
  return access($vue).template($vue, { parent, self });
314
283
  };
315
284
  }
316
285
  };
317
286
 
318
- // src/AsyncComponent.ts
319
- var import_vue2 = require("vue");
320
- var AsyncComponent_default = {
321
- props: __spreadProps(__spreadValues({}, setup), {
322
- resolve: {
323
- required: true
324
- },
325
- delay: {
326
- type: Number,
327
- default: 200
328
- },
329
- timeout: {
330
- type: Number,
331
- default: 2e3
332
- },
333
- loading: {
334
- default: (0, import_vue2.h)("div")
335
- },
336
- options: {
337
- type: Object
338
- },
339
- error: {
340
- required: false
341
- }
342
- }),
343
- setup() {
344
- return ($vue) => {
345
- return (0, import_vue2.h)(
346
- src_default,
347
- {
348
- setup: (parent) => {
349
- const componentRef = (0, import_vue2.ref)($vue.loading);
350
- const template = () => {
351
- var _a, _b, _c;
352
- const vnode = componentRef.value;
353
- return (_c = (_b = (_a = $vue.$slots).template) == null ? void 0 : _b.call(_a, { $vue, vnode })) != null ? _c : vnode;
354
- };
355
- const self = { template };
356
- (0, import_vue2.onMounted)(() => __async(this, null, function* () {
357
- try {
358
- if ($vue.resolve) {
359
- const target = yield $vue.resolve;
360
- target.hasOwnProperty("property") ? (0, import_vue2.watch)((0, import_vue2.isRef)(target.property) || (0, import_vue2.isReactive)(target.property) ? target.property : () => __async(this, null, function* () {
361
- return (yield $vue.resolve).property;
362
- }), (after, before) => {
363
- setTimeout(() => __async(this, null, function* () {
364
- return componentRef.value = yield target.onChange({ before: yield before, after: yield after });
365
- }), $vue.delay);
366
- }, $vue.options) : setTimeout(() => __async(this, null, function* () {
367
- return componentRef.value = target;
368
- }), $vue.delay);
369
- }
370
- } catch (error) {
371
- if ($vue.error) {
372
- componentRef.value = (0, import_vue2.h)(yield $vue.error, { error });
373
- }
374
- }
375
- }));
376
- return { parent, self };
377
- }
378
- }
379
- );
380
- };
381
- }
382
- };
383
-
384
287
  // src/index.ts
385
288
  var src_default = ReactiveView_default;
386
289
  function ucf(string) {
@@ -392,8 +295,25 @@ function ucfat(string, tokens) {
392
295
  const pattern = RegExp(`(?<=(?:${tokens.join("|")}))(\\w)(\\w*)`, "g");
393
296
  return string.replace(pattern, ($1, $2, $3) => `${$2.toUpperCase()}${$3.toLowerCase()}`);
394
297
  }
298
+ function getRoot(vue) {
299
+ var _a, _b, _c;
300
+ return (_c = (_a = typeof vue.$attrs.root === "function" ? vue.$attrs.root() : vue.$attrs.root) != null ? _a : vue.$root) != null ? _c : (_b = vue.$parent) == null ? void 0 : _b.$root;
301
+ }
302
+ function getRef(component, ref2) {
303
+ safeRequest({
304
+ try: async () => component.$props.ref.value = component,
305
+ alternative: false
306
+ });
307
+ return ref2.value = component;
308
+ }
309
+ function expose(vue, props2) {
310
+ Object.entries(Object.getOwnPropertyDescriptors(props2)).forEach(([key, val]) => {
311
+ Object.defineProperty(vue, key, val);
312
+ });
313
+ return props2;
314
+ }
395
315
  function safeRequest(request) {
396
- return new Promise((resolve) => __async(this, null, function* () {
316
+ return new Promise(async (resolve) => {
397
317
  var _a, _b, _c, _d;
398
318
  const { message } = (_a = request.loading) != null ? _a : {};
399
319
  if (request.loading) {
@@ -403,26 +323,22 @@ function safeRequest(request) {
403
323
  }
404
324
  }
405
325
  try {
406
- resolve(yield request.try());
326
+ resolve(await request.try());
407
327
  } catch (e) {
408
328
  if ((_b = request.alternative) != null ? _b : true) {
409
- resolve(request.catch ? yield request.catch(e) : console.log(e));
329
+ resolve(request.catch ? await request.catch(e) : console.log(e));
410
330
  }
411
331
  } finally {
412
- yield (_c = request.finally) == null ? void 0 : _c.call(request);
332
+ await ((_c = request.finally) == null ? void 0 : _c.call(request));
413
333
  if (request.loading) {
414
334
  request.loading.status = false;
415
335
  }
416
336
  if (request.loading && message) {
417
337
  request.loading.message = message;
418
338
  }
419
- yield (_d = request.complete) == null ? void 0 : _d.call(request);
339
+ await ((_d = request.complete) == null ? void 0 : _d.call(request));
420
340
  }
421
- }));
422
- }
423
- function getRoot(vue) {
424
- var _a, _b, _c;
425
- return (_c = (_a = typeof vue.$attrs.root === "function" ? vue.$attrs.root() : vue.$attrs.root) != null ? _a : vue.$root) != null ? _c : (_b = vue.$parent) == null ? void 0 : _b.$root;
341
+ });
426
342
  }
427
343
  function getProps(props2, param2) {
428
344
  var _a;
@@ -453,21 +369,6 @@ function getDate(param1, param2) {
453
369
  };
454
370
  return (0, import_date_fns_tz.formatInTimeZone)(datetime(), options.timezone, options.format);
455
371
  }
456
- function getRef(component, ref3) {
457
- safeRequest({
458
- try: () => __async(this, null, function* () {
459
- return component.$props.ref.value = component;
460
- }),
461
- alternative: false
462
- });
463
- return ref3.value = component;
464
- }
465
- function expose(vue, props2) {
466
- Object.entries(Object.getOwnPropertyDescriptors(props2)).forEach(([key, val]) => {
467
- Object.defineProperty(vue, key, val);
468
- });
469
- return props2;
470
- }
471
372
  function getSubscription() {
472
373
  const subscriptions = [];
473
374
  const subscription = Subscriptions.get();
@@ -496,8 +397,8 @@ function getSubscription() {
496
397
  };
497
398
  }
498
399
  function access($vue = {}) {
499
- var _a, _b;
500
- const target = typeof $vue.access === "function" ? $vue.access() : (_b = (_a = $vue.value && typeof $vue.value.access === "function" ? $vue.value.access() : $vue.value) != null ? _a : $vue) != null ? _b : {};
400
+ var _a, _b, _c;
401
+ const target = typeof ($vue == null ? void 0 : $vue.access) === "function" ? $vue.access() : (_c = (_b = ($vue == null ? void 0 : $vue.value) && typeof ((_a = $vue.value) == null ? void 0 : _a.access) === "function" ? $vue.value.access() : $vue == null ? void 0 : $vue.value) != null ? _b : $vue) != null ? _c : {};
501
402
  return new Proxy(target, {
502
403
  get(target2, key) {
503
404
  var _a2, _b2;
@@ -516,7 +417,6 @@ function access($vue = {}) {
516
417
  }
517
418
  // Annotate the CommonJS export names for ESM import in node:
518
419
  0 && (module.exports = {
519
- AsyncComponent,
520
420
  access,
521
421
  expose,
522
422
  getDate,
package/dist/index.mjs CHANGED
@@ -1,6 +1,4 @@
1
1
  var __defProp = Object.defineProperty;
2
- var __defProps = Object.defineProperties;
3
- var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
2
  var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
3
  var __hasOwnProp = Object.prototype.hasOwnProperty;
6
4
  var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -16,7 +14,6 @@ var __spreadValues = (a, b) => {
16
14
  }
17
15
  return a;
18
16
  };
19
- var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
17
  var __objRest = (source, exclude) => {
21
18
  var target = {};
22
19
  for (var prop in source)
@@ -29,26 +26,6 @@ var __objRest = (source, exclude) => {
29
26
  }
30
27
  return target;
31
28
  };
32
- var __async = (__this, __arguments, generator) => {
33
- return new Promise((resolve, reject) => {
34
- var fulfilled = (value) => {
35
- try {
36
- step(generator.next(value));
37
- } catch (e) {
38
- reject(e);
39
- }
40
- };
41
- var rejected = (value) => {
42
- try {
43
- step(generator.throw(value));
44
- } catch (e) {
45
- reject(e);
46
- }
47
- };
48
- var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
49
- step((generator = generator.apply(__this, __arguments)).next());
50
- });
51
- };
52
29
 
53
30
  // src/index.ts
54
31
  import { formatInTimeZone } from "date-fns-tz";
@@ -144,36 +121,32 @@ var Subscriptions = _Subscriptions;
144
121
  // src/ReactiveView.ts
145
122
  import ObjectManager from "@razaman2/object-manager";
146
123
  import DataManager from "@razaman2/data-manager";
147
- import { h, ref, watch } from "vue";
148
124
 
149
125
  // package.json
150
126
  var name = "@razaman2/reactive-view";
151
- var version = "0.0.5";
127
+ var version = "0.0.7";
152
128
 
153
129
  // src/ReactiveView.ts
130
+ import { h, ref, reactive, watch } from "vue";
154
131
  var props = {
132
+ notifications: Object,
133
+ subscriptions: Object,
155
134
  defaultData: {},
135
+ model: {},
136
+ state: {},
156
137
  getDefaultData: {
157
138
  type: Function,
158
139
  default: (data = {}) => data
159
140
  },
160
141
  logging: {
161
142
  validator: (logging) => {
162
- return typeof logging === "boolean";
143
+ return logging.constructor.name === "Boolean";
163
144
  }
164
145
  },
165
- model: {},
166
146
  modelName: {
167
147
  type: String,
168
148
  default: "ReactiveView"
169
149
  },
170
- notifications: { type: Object },
171
- root: { type: Function },
172
- state: {},
173
- subscriptions: {
174
- type: Object,
175
- default: getSubscription()
176
- },
177
150
  sync: {
178
151
  type: Boolean,
179
152
  default: true
@@ -190,7 +163,7 @@ var setup = {
190
163
  var ReactiveView_default = {
191
164
  props: __spreadValues(__spreadValues({}, setup), props),
192
165
  setup(props2, context) {
193
- var _a, _b, _c, _d, _f;
166
+ var _a, _b, _c, _d, _e;
194
167
  const template = (vue, options2) => {
195
168
  var _a2, _b2, _c2;
196
169
  const vnode = context.slots.default ? h(
@@ -210,27 +183,21 @@ var ReactiveView_default = {
210
183
  Array.isArray(props2.state) ? (_a = props2.defaultData) != null ? _a : [] : (_b = props2.defaultData) != null ? _b : {}
211
184
  );
212
185
  const defaultType = Array.isArray(defaultData) ? [] : {};
213
- const stateRef = ref(DataManager.transform((_c = props2.state) != null ? _c : defaultType));
186
+ const state = reactive(DataManager.transform((_c = props2.state) != null ? _c : defaultType));
214
187
  const config = {
215
188
  defaultData,
216
- data: stateRef.value,
189
+ data: state,
217
190
  name: props2.modelName,
218
191
  logging: props2.logging,
219
192
  notifications: props2.notifications
220
193
  };
221
194
  const getState = props2.model ? typeof props2.model === "function" ? props2.model(config) : props2.model : new DataManager(config);
222
- const options = {
223
- parent: { self: props2 },
224
- self: { template, isValid, getState, stateRef }
225
- };
226
- const setup2 = (_d = props2.setup(options)) != null ? _d : options;
227
- const _e = setup2, { parent = {}, self = {} } = _e, rest = __objRest(_e, ["parent", "self"]);
228
195
  const sync = ref(false);
229
196
  if (context.attrs["onUpdate:modelState"]) {
230
197
  const config2 = typeof context.attrs["onUpdate:modelState"] === "function" ? { callback: context.attrs["onUpdate:modelState"] } : context.attrs["onUpdate:modelState"];
231
- const subscription = watch(() => ObjectManager.on(stateRef.value).clone(), (after, before) => {
198
+ watch(() => ObjectManager.on(state).clone(), (after, before) => {
232
199
  var _a2;
233
- const transform = (_a2 = config2.transform) != null ? _a2 : access(setup2).$transform;
200
+ const transform = (_a2 = config2.transform) != null ? _a2 : access(setup).$transform;
234
201
  const diff = {
235
202
  before: (before == null ? void 0 : before.hasOwnProperty("")) ? before[""] : before,
236
203
  after: (after == null ? void 0 : after.hasOwnProperty("")) ? after[""] : after
@@ -243,8 +210,8 @@ var ReactiveView_default = {
243
210
  }, config2.options);
244
211
  }
245
212
  if (context.attrs["onUpdate:propsState"] || props2.sync) {
246
- const config2 = (_f = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _f : {};
247
- const subscription = watch(() => props2.state, (after, before) => {
213
+ const config2 = (_d = typeof context.attrs["onUpdate:propsState"] === "function" ? { callback: context.attrs["onUpdate:propsState"] } : context.attrs["onUpdate:propsState"]) != null ? _d : {};
214
+ watch(() => props2.state, (after, before) => {
248
215
  if (props2.sync && typeof config2.callback !== "function") {
249
216
  getState.replaceData(after);
250
217
  } else if (typeof config2.callback === "function") {
@@ -253,91 +220,28 @@ var ReactiveView_default = {
253
220
  sync.value = true;
254
221
  }, config2.options);
255
222
  }
223
+ const options = {
224
+ parent: {},
225
+ self: { template, isValid, getState }
226
+ };
227
+ const _f = (_e = props2.setup(options)) != null ? _e : options, { parent = options.parent, self = options.self } = _f, rest = __objRest(_f, ["parent", "self"]);
256
228
  return ($vue) => {
257
- const setup3 = { $vue, options: parent };
258
- while (setup3.options) {
259
- Object.defineProperties(setup3.$vue, Object.assign({
229
+ const setup2 = { $vue, options: Object.assign(parent, { parent: { self: $vue } }) };
230
+ while (setup2.options) {
231
+ Object.defineProperties(setup2.$vue, Object.assign({
260
232
  access: {
261
233
  configurable: true,
262
- value: () => {
263
- return access({ parent, self });
264
- }
234
+ value: () => access({ parent, self })
265
235
  }
266
236
  }, rest));
267
- setup3.options = setup3.options.parent;
268
- setup3.$vue = setup3.$vue.$parent;
237
+ setup2.options = setup2.options.parent;
238
+ setup2.$vue = setup2.$vue.$parent;
269
239
  }
270
240
  return access($vue).template($vue, { parent, self });
271
241
  };
272
242
  }
273
243
  };
274
244
 
275
- // src/AsyncComponent.ts
276
- import { h as h2, ref as ref2, watch as watch2, isRef, isReactive, onMounted } from "vue";
277
- var AsyncComponent_default = {
278
- props: __spreadProps(__spreadValues({}, setup), {
279
- resolve: {
280
- required: true
281
- },
282
- delay: {
283
- type: Number,
284
- default: 200
285
- },
286
- timeout: {
287
- type: Number,
288
- default: 2e3
289
- },
290
- loading: {
291
- default: h2("div")
292
- },
293
- options: {
294
- type: Object
295
- },
296
- error: {
297
- required: false
298
- }
299
- }),
300
- setup() {
301
- return ($vue) => {
302
- return h2(
303
- src_default,
304
- {
305
- setup: (parent) => {
306
- const componentRef = ref2($vue.loading);
307
- const template = () => {
308
- var _a, _b, _c;
309
- const vnode = componentRef.value;
310
- return (_c = (_b = (_a = $vue.$slots).template) == null ? void 0 : _b.call(_a, { $vue, vnode })) != null ? _c : vnode;
311
- };
312
- const self = { template };
313
- onMounted(() => __async(this, null, function* () {
314
- try {
315
- if ($vue.resolve) {
316
- const target = yield $vue.resolve;
317
- target.hasOwnProperty("property") ? watch2(isRef(target.property) || isReactive(target.property) ? target.property : () => __async(this, null, function* () {
318
- return (yield $vue.resolve).property;
319
- }), (after, before) => {
320
- setTimeout(() => __async(this, null, function* () {
321
- return componentRef.value = yield target.onChange({ before: yield before, after: yield after });
322
- }), $vue.delay);
323
- }, $vue.options) : setTimeout(() => __async(this, null, function* () {
324
- return componentRef.value = target;
325
- }), $vue.delay);
326
- }
327
- } catch (error) {
328
- if ($vue.error) {
329
- componentRef.value = h2(yield $vue.error, { error });
330
- }
331
- }
332
- }));
333
- return { parent, self };
334
- }
335
- }
336
- );
337
- };
338
- }
339
- };
340
-
341
245
  // src/index.ts
342
246
  var src_default = ReactiveView_default;
343
247
  function ucf(string) {
@@ -349,8 +253,25 @@ function ucfat(string, tokens) {
349
253
  const pattern = RegExp(`(?<=(?:${tokens.join("|")}))(\\w)(\\w*)`, "g");
350
254
  return string.replace(pattern, ($1, $2, $3) => `${$2.toUpperCase()}${$3.toLowerCase()}`);
351
255
  }
256
+ function getRoot(vue) {
257
+ var _a, _b, _c;
258
+ return (_c = (_a = typeof vue.$attrs.root === "function" ? vue.$attrs.root() : vue.$attrs.root) != null ? _a : vue.$root) != null ? _c : (_b = vue.$parent) == null ? void 0 : _b.$root;
259
+ }
260
+ function getRef(component, ref2) {
261
+ safeRequest({
262
+ try: async () => component.$props.ref.value = component,
263
+ alternative: false
264
+ });
265
+ return ref2.value = component;
266
+ }
267
+ function expose(vue, props2) {
268
+ Object.entries(Object.getOwnPropertyDescriptors(props2)).forEach(([key, val]) => {
269
+ Object.defineProperty(vue, key, val);
270
+ });
271
+ return props2;
272
+ }
352
273
  function safeRequest(request) {
353
- return new Promise((resolve) => __async(this, null, function* () {
274
+ return new Promise(async (resolve) => {
354
275
  var _a, _b, _c, _d;
355
276
  const { message } = (_a = request.loading) != null ? _a : {};
356
277
  if (request.loading) {
@@ -360,26 +281,22 @@ function safeRequest(request) {
360
281
  }
361
282
  }
362
283
  try {
363
- resolve(yield request.try());
284
+ resolve(await request.try());
364
285
  } catch (e) {
365
286
  if ((_b = request.alternative) != null ? _b : true) {
366
- resolve(request.catch ? yield request.catch(e) : console.log(e));
287
+ resolve(request.catch ? await request.catch(e) : console.log(e));
367
288
  }
368
289
  } finally {
369
- yield (_c = request.finally) == null ? void 0 : _c.call(request);
290
+ await ((_c = request.finally) == null ? void 0 : _c.call(request));
370
291
  if (request.loading) {
371
292
  request.loading.status = false;
372
293
  }
373
294
  if (request.loading && message) {
374
295
  request.loading.message = message;
375
296
  }
376
- yield (_d = request.complete) == null ? void 0 : _d.call(request);
297
+ await ((_d = request.complete) == null ? void 0 : _d.call(request));
377
298
  }
378
- }));
379
- }
380
- function getRoot(vue) {
381
- var _a, _b, _c;
382
- return (_c = (_a = typeof vue.$attrs.root === "function" ? vue.$attrs.root() : vue.$attrs.root) != null ? _a : vue.$root) != null ? _c : (_b = vue.$parent) == null ? void 0 : _b.$root;
299
+ });
383
300
  }
384
301
  function getProps(props2, param2) {
385
302
  var _a;
@@ -410,21 +327,6 @@ function getDate(param1, param2) {
410
327
  };
411
328
  return formatInTimeZone(datetime(), options.timezone, options.format);
412
329
  }
413
- function getRef(component, ref3) {
414
- safeRequest({
415
- try: () => __async(this, null, function* () {
416
- return component.$props.ref.value = component;
417
- }),
418
- alternative: false
419
- });
420
- return ref3.value = component;
421
- }
422
- function expose(vue, props2) {
423
- Object.entries(Object.getOwnPropertyDescriptors(props2)).forEach(([key, val]) => {
424
- Object.defineProperty(vue, key, val);
425
- });
426
- return props2;
427
- }
428
330
  function getSubscription() {
429
331
  const subscriptions = [];
430
332
  const subscription = Subscriptions.get();
@@ -453,8 +355,8 @@ function getSubscription() {
453
355
  };
454
356
  }
455
357
  function access($vue = {}) {
456
- var _a, _b;
457
- const target = typeof $vue.access === "function" ? $vue.access() : (_b = (_a = $vue.value && typeof $vue.value.access === "function" ? $vue.value.access() : $vue.value) != null ? _a : $vue) != null ? _b : {};
358
+ var _a, _b, _c;
359
+ const target = typeof ($vue == null ? void 0 : $vue.access) === "function" ? $vue.access() : (_c = (_b = ($vue == null ? void 0 : $vue.value) && typeof ((_a = $vue.value) == null ? void 0 : _a.access) === "function" ? $vue.value.access() : $vue == null ? void 0 : $vue.value) != null ? _b : $vue) != null ? _c : {};
458
360
  return new Proxy(target, {
459
361
  get(target2, key) {
460
362
  var _a2, _b2;
@@ -472,7 +374,6 @@ function access($vue = {}) {
472
374
  });
473
375
  }
474
376
  export {
475
- AsyncComponent_default as AsyncComponent,
476
377
  access,
477
378
  src_default as default,
478
379
  expose,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@razaman2/reactive-view",
3
- "version": "0.0.5",
3
+ "version": "0.0.7",
4
4
  "description": "This library enables you to build vue apps in an object oriented way. It provides a convenient approach to extend and override ui components. It provides a built in eventing system along with component data management.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",