@razaman2/reactive-view 0.0.34-beta.25 → 0.0.34-beta.27

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 (3) hide show
  1. package/dist/index.js +41 -27
  2. package/dist/index.mjs +45 -31
  3. package/package.json +48 -48
package/dist/index.js CHANGED
@@ -174,7 +174,7 @@ var import_vue = require("vue");
174
174
 
175
175
  // package.json
176
176
  var name = "@razaman2/reactive-view";
177
- var version = "0.0.34-beta.25";
177
+ var version = "0.0.34-beta.27";
178
178
 
179
179
  // src/ReactiveView.ts
180
180
  var setup = {
@@ -260,32 +260,23 @@ var ReactiveView_default = {
260
260
  const datatype = Array.isArray(defaultData) ? [] : {};
261
261
  const normalize = (data) => {
262
262
  if (props.debug) {
263
- console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData });
263
+ console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData, ref: (0, import_vue.isRef)(data), reactive: (0, import_vue.isReactive)(data) });
264
264
  }
265
- if ((0, import_vue.isReactive)(data)) {
265
+ if ((0, import_vue.isRef)(data) || (0, import_vue.isReactive)(data)) {
266
266
  return data;
267
- } else if ((0, import_vue.isRef)(data)) {
268
- try {
269
- if (["Array", "Object"].includes((0, import_vue.unref)(data).constructor.name)) {
270
- return (0, import_vue.unref)(data);
271
- } else {
272
- return (0, import_vue.reactive)({ "": (0, import_vue.unref)(data) });
273
- }
274
- } catch (e) {
275
- return (0, import_vue.reactive)({ "": (0, import_vue.unref)(data) });
276
- }
277
267
  } else {
278
268
  if (isFunctionData || isPromiseData) {
279
269
  return (0, import_vue.reactive)(datatype);
280
270
  } else {
271
+ const props2 = "data" in vue.vnode.props;
281
272
  try {
282
273
  if (["Array", "Object"].includes(data.constructor.name)) {
283
- return (0, import_vue.reactive)("data" in vue.vnode.props ? data : defaultData);
274
+ return (0, import_vue.reactive)(props2 ? data : datatype);
284
275
  } else {
285
- return (0, import_vue.reactive)("data" in vue.vnode.props ? { "": data } : defaultData);
276
+ return (0, import_vue.reactive)(props2 ? { "": data } : datatype);
286
277
  }
287
278
  } catch (e) {
288
- return (0, import_vue.reactive)("data" in vue.vnode.props ? { "": data } : defaultData);
279
+ return (0, import_vue.reactive)(props2 ? { "": data } : datatype);
289
280
  }
290
281
  }
291
282
  }
@@ -297,17 +288,17 @@ var ReactiveView_default = {
297
288
  defaultData: import_object_manager.default.on(defaultData).clone(),
298
289
  notifications: props.notifications,
299
290
  subscriptions: props.subscriptions,
300
- logging: props.logging,
301
- name: props.modelName
291
+ name: props.modelName,
292
+ logging: props.logging
302
293
  };
303
294
  const model = new Proxy(props.model ? typeof props.model === "function" ? props.model(config) : props.model : new import_data_manager.default(config), {
304
295
  get(target, key, receiver) {
305
- if (key === "setData" || key === "replaceData") {
296
+ if (["setData", "replaceData"].includes(key.toString())) {
306
297
  return (...params) => {
307
298
  var _a2;
308
299
  const beforeSetData = (_a2 = access(component).beforeSetData) != null ? _a2 : props.beforeSetData;
309
300
  if (typeof beforeSetData === "function") {
310
- const before = import_object_manager.default.on(target.getData()).clone();
301
+ const before = import_object_manager.default.on(target.getData());
311
302
  const after = params.length ? import_object_manager.default.on(datatype).set(...params) : import_object_manager.default.on(datatype).set(defaultData);
312
303
  if (beforeSetData(access(component).diff(before, after), target)) {
313
304
  target[key](...params);
@@ -360,16 +351,38 @@ var ReactiveView_default = {
360
351
  config2.callback(access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after)), { component });
361
352
  }, config2.options);
362
353
  }
363
- if (!props.beta) {
354
+ if (props.beta) {
355
+ if (isFunctionData || isPromiseData) {
356
+ setTimeout(async () => {
357
+ var _a2, _b2;
358
+ const [data] = isPromiseData ? await Promise.all([
359
+ isAsyncFunctionData ? props.data() : props.data,
360
+ (_a2 = defer.value) != null ? _a2 : true
361
+ ]) : [props.data];
362
+ (0, import_vue.watch)(isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
363
+ var _a3;
364
+ const callback = context.attrs["data:callback"];
365
+ if (typeof callback === "function") {
366
+ model.replaceData((_a3 = callback(access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after)), { component })) != null ? _a3 : after);
367
+ } else {
368
+ model.replaceData(after);
369
+ }
370
+ }, {
371
+ immediate: (_b2 = context.attrs["data:immediate"]) != null ? _b2 : true,
372
+ deep: context.attrs["data:deep"],
373
+ once: context.attrs["data:once"]
374
+ });
375
+ });
376
+ }
377
+ } else {
364
378
  setTimeout(async () => {
365
379
  var _a2;
366
- const [data] = await Promise.all([isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
380
+ const [data] = await Promise.all([
381
+ isAsyncFunctionData ? props.data() : props.data,
382
+ (_a2 = defer.value) != null ? _a2 : true
383
+ ]);
367
384
  watchDataProp(data);
368
385
  });
369
- } else if (props.beta && (isFunctionData || isPromiseData)) {
370
- (0, import_vue.watch)(props.data, (data) => {
371
- model.replaceData(data);
372
- });
373
386
  }
374
387
  setTimeout(async () => {
375
388
  var _a2;
@@ -481,6 +494,7 @@ function getDate(param1, param2) {
481
494
  return (0, import_date_fns_tz.formatInTimeZone)(datetime(), options.timezone, options.format);
482
495
  }
483
496
  function access(view = {}, alternative) {
497
+ var _a;
484
498
  const resolve = (target) => {
485
499
  return new Proxy((0, import_vue2.toRaw)(target), {
486
500
  get(target2, key) {
@@ -503,7 +517,7 @@ function access(view = {}, alternative) {
503
517
  });
504
518
  };
505
519
  try {
506
- const component = (0, import_vue2.unref)(typeof view === "function" ? view() : view);
520
+ const component = (_a = (0, import_vue2.unref)(typeof view === "function" ? view() : view)) != null ? _a : {};
507
521
  return resolve("instance" in component ? component.instance : component);
508
522
  } catch (e) {
509
523
  return resolve(view);
package/dist/index.mjs CHANGED
@@ -124,11 +124,11 @@ var Subscriptions = _Subscriptions;
124
124
  // src/ReactiveView.ts
125
125
  import ObjectManager from "@razaman2/object-manager";
126
126
  import DataManager from "@razaman2/data-manager";
127
- import { ref, reactive, watch, unref, isRef, isReactive, createVNode, getCurrentInstance } from "vue";
127
+ import { ref, reactive, watch, isRef, isReactive, createVNode, getCurrentInstance } from "vue";
128
128
 
129
129
  // package.json
130
130
  var name = "@razaman2/reactive-view";
131
- var version = "0.0.34-beta.25";
131
+ var version = "0.0.34-beta.27";
132
132
 
133
133
  // src/ReactiveView.ts
134
134
  var setup = {
@@ -214,32 +214,23 @@ var ReactiveView_default = {
214
214
  const datatype = Array.isArray(defaultData) ? [] : {};
215
215
  const normalize = (data) => {
216
216
  if (props.debug) {
217
- console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData });
217
+ console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData, ref: isRef(data), reactive: isReactive(data) });
218
218
  }
219
- if (isReactive(data)) {
219
+ if (isRef(data) || isReactive(data)) {
220
220
  return data;
221
- } else if (isRef(data)) {
222
- try {
223
- if (["Array", "Object"].includes(unref(data).constructor.name)) {
224
- return unref(data);
225
- } else {
226
- return reactive({ "": unref(data) });
227
- }
228
- } catch (e) {
229
- return reactive({ "": unref(data) });
230
- }
231
221
  } else {
232
222
  if (isFunctionData || isPromiseData) {
233
223
  return reactive(datatype);
234
224
  } else {
225
+ const props2 = "data" in vue.vnode.props;
235
226
  try {
236
227
  if (["Array", "Object"].includes(data.constructor.name)) {
237
- return reactive("data" in vue.vnode.props ? data : defaultData);
228
+ return reactive(props2 ? data : datatype);
238
229
  } else {
239
- return reactive("data" in vue.vnode.props ? { "": data } : defaultData);
230
+ return reactive(props2 ? { "": data } : datatype);
240
231
  }
241
232
  } catch (e) {
242
- return reactive("data" in vue.vnode.props ? { "": data } : defaultData);
233
+ return reactive(props2 ? { "": data } : datatype);
243
234
  }
244
235
  }
245
236
  }
@@ -251,17 +242,17 @@ var ReactiveView_default = {
251
242
  defaultData: ObjectManager.on(defaultData).clone(),
252
243
  notifications: props.notifications,
253
244
  subscriptions: props.subscriptions,
254
- logging: props.logging,
255
- name: props.modelName
245
+ name: props.modelName,
246
+ logging: props.logging
256
247
  };
257
248
  const model = new Proxy(props.model ? typeof props.model === "function" ? props.model(config) : props.model : new DataManager(config), {
258
249
  get(target, key, receiver) {
259
- if (key === "setData" || key === "replaceData") {
250
+ if (["setData", "replaceData"].includes(key.toString())) {
260
251
  return (...params) => {
261
252
  var _a2;
262
253
  const beforeSetData = (_a2 = access(component).beforeSetData) != null ? _a2 : props.beforeSetData;
263
254
  if (typeof beforeSetData === "function") {
264
- const before = ObjectManager.on(target.getData()).clone();
255
+ const before = ObjectManager.on(target.getData());
265
256
  const after = params.length ? ObjectManager.on(datatype).set(...params) : ObjectManager.on(datatype).set(defaultData);
266
257
  if (beforeSetData(access(component).diff(before, after), target)) {
267
258
  target[key](...params);
@@ -314,16 +305,38 @@ var ReactiveView_default = {
314
305
  config2.callback(access(component).diff(ObjectManager.on(before), ObjectManager.on(after)), { component });
315
306
  }, config2.options);
316
307
  }
317
- if (!props.beta) {
308
+ if (props.beta) {
309
+ if (isFunctionData || isPromiseData) {
310
+ setTimeout(async () => {
311
+ var _a2, _b2;
312
+ const [data] = isPromiseData ? await Promise.all([
313
+ isAsyncFunctionData ? props.data() : props.data,
314
+ (_a2 = defer.value) != null ? _a2 : true
315
+ ]) : [props.data];
316
+ watch(isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
317
+ var _a3;
318
+ const callback = context.attrs["data:callback"];
319
+ if (typeof callback === "function") {
320
+ model.replaceData((_a3 = callback(access(component).diff(ObjectManager.on(before), ObjectManager.on(after)), { component })) != null ? _a3 : after);
321
+ } else {
322
+ model.replaceData(after);
323
+ }
324
+ }, {
325
+ immediate: (_b2 = context.attrs["data:immediate"]) != null ? _b2 : true,
326
+ deep: context.attrs["data:deep"],
327
+ once: context.attrs["data:once"]
328
+ });
329
+ });
330
+ }
331
+ } else {
318
332
  setTimeout(async () => {
319
333
  var _a2;
320
- const [data] = await Promise.all([isAsyncFunctionData ? props.data() : props.data, (_a2 = defer.value) != null ? _a2 : true]);
334
+ const [data] = await Promise.all([
335
+ isAsyncFunctionData ? props.data() : props.data,
336
+ (_a2 = defer.value) != null ? _a2 : true
337
+ ]);
321
338
  watchDataProp(data);
322
339
  });
323
- } else if (props.beta && (isFunctionData || isPromiseData)) {
324
- watch(props.data, (data) => {
325
- model.replaceData(data);
326
- });
327
340
  }
328
341
  setTimeout(async () => {
329
342
  var _a2;
@@ -358,7 +371,7 @@ var ReactiveView_default = {
358
371
  };
359
372
 
360
373
  // src/index.ts
361
- import { h, unref as unref2, toRaw as toRaw2, createApp, createVNode as createVNode2, defineComponent } from "vue";
374
+ import { h, unref, toRaw, createApp, createVNode as createVNode2, defineComponent } from "vue";
362
375
  import { formatInTimeZone } from "date-fns-tz";
363
376
  import { twMerge } from "tailwind-merge";
364
377
  console.log(`%c[ReactiveView]: ${version}`, "background-color: red; color: yellow;");
@@ -435,8 +448,9 @@ function getDate(param1, param2) {
435
448
  return formatInTimeZone(datetime(), options.timezone, options.format);
436
449
  }
437
450
  function access(view = {}, alternative) {
451
+ var _a;
438
452
  const resolve = (target) => {
439
- return new Proxy(toRaw2(target), {
453
+ return new Proxy(toRaw(target), {
440
454
  get(target2, key) {
441
455
  const component = { tree: target2 };
442
456
  do {
@@ -457,7 +471,7 @@ function access(view = {}, alternative) {
457
471
  });
458
472
  };
459
473
  try {
460
- const component = unref2(typeof view === "function" ? view() : view);
474
+ const component = (_a = unref(typeof view === "function" ? view() : view)) != null ? _a : {};
461
475
  return resolve("instance" in component ? component.instance : component);
462
476
  } catch (e) {
463
477
  return resolve(view);
@@ -631,7 +645,7 @@ var setData = (component, data, path) => {
631
645
  return "state" in vue ? diff : vue.$emit("update:state", diff);
632
646
  };
633
647
  var componentState = (component) => {
634
- return unref2("state" in component ? component.state : component.$attrs.state);
648
+ return unref("state" in component ? component.state : component.$attrs.state);
635
649
  };
636
650
  var dataPath = (component, path) => {
637
651
  return typeof component.$attrs["data:path"] === "function" ? component.$attrs["data:path"](path) : path;
package/package.json CHANGED
@@ -1,48 +1,48 @@
1
- {
2
- "name": "@razaman2/reactive-view",
3
- "version": "0.0.34-beta.25",
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
- "main": "dist/index.js",
6
- "module": "dist/index.mjs",
7
- "types": "dist/index.d.ts",
8
- "scripts": {
9
- "prepublishOnly": "npm run build",
10
- "build": "tsup src/index.ts --format cjs,esm --dts",
11
- "lint": "tsc",
12
- "test": "cd tests/vue-ts && npm run dev",
13
- "pr": "sh pr.sh"
14
- },
15
- "keywords": [
16
- "vue",
17
- "vue-helper",
18
- "reactive-view",
19
- "vue-class-component",
20
- "reactive-ui"
21
- ],
22
- "author": "razaman2",
23
- "license": "MIT",
24
- "dependencies": {
25
- "@razaman2/data-manager": "^3.2.12",
26
- "@razaman2/event-emitter": "^2.1.1",
27
- "@razaman2/object-manager": "^3.4.5",
28
- "date-fns": "^4.1.0",
29
- "date-fns-tz": "^3.2.0",
30
- "tailwind-merge": "^3.3.1",
31
- "uuid": "^11.1.0"
32
- },
33
- "peerDependencies": {
34
- "vue": "^3.5.20"
35
- },
36
- "devDependencies": {
37
- "@types/uuid": "^10.0.0",
38
- "tsup": "^8.5.0",
39
- "typescript": "^5.9.2",
40
- "vitest": "^3.2.4"
41
- },
42
- "publishConfig": {
43
- "access": "public"
44
- },
45
- "files": [
46
- "dist"
47
- ]
48
- }
1
+ {
2
+ "name": "@razaman2/reactive-view",
3
+ "version": "0.0.34-beta.27",
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
+ "main": "dist/index.js",
6
+ "module": "dist/index.mjs",
7
+ "types": "dist/index.d.ts",
8
+ "scripts": {
9
+ "prepublishOnly": "npm run build",
10
+ "build": "tsup src/index.ts --format cjs,esm --dts",
11
+ "lint": "tsc",
12
+ "test": "cd tests/vue-ts && npm run dev",
13
+ "pr": "sh pr.sh"
14
+ },
15
+ "keywords": [
16
+ "vue",
17
+ "vue-helper",
18
+ "reactive-view",
19
+ "vue-class-component",
20
+ "reactive-ui"
21
+ ],
22
+ "author": "razaman2",
23
+ "license": "MIT",
24
+ "dependencies": {
25
+ "@razaman2/data-manager": "^3.2.12",
26
+ "@razaman2/event-emitter": "^2.1.1",
27
+ "@razaman2/object-manager": "^3.4.7",
28
+ "date-fns": "^4.1.0",
29
+ "date-fns-tz": "^3.2.0",
30
+ "tailwind-merge": "^3.3.1",
31
+ "uuid": "^13.0.0"
32
+ },
33
+ "peerDependencies": {
34
+ "vue": ">=3.0.0"
35
+ },
36
+ "devDependencies": {
37
+ "@types/uuid": "^11.0.0",
38
+ "tsup": "^8.5.0",
39
+ "typescript": "^5.9.3",
40
+ "vitest": "^4.0.5"
41
+ },
42
+ "publishConfig": {
43
+ "access": "public"
44
+ },
45
+ "files": [
46
+ "dist"
47
+ ]
48
+ }