@razaman2/reactive-view 0.0.34-beta.28 → 0.0.34-beta.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.
- package/dist/index.js +23 -14
- package/dist/index.mjs +27 -18
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
+
var __defProps = Object.defineProperties;
|
|
4
5
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
5
7
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
8
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
9
|
var __getProtoOf = Object.getPrototypeOf;
|
|
@@ -19,6 +21,7 @@ var __spreadValues = (a, b) => {
|
|
|
19
21
|
}
|
|
20
22
|
return a;
|
|
21
23
|
};
|
|
24
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
22
25
|
var __objRest = (source, exclude) => {
|
|
23
26
|
var target = {};
|
|
24
27
|
for (var prop in source)
|
|
@@ -174,7 +177,7 @@ var import_vue = require("vue");
|
|
|
174
177
|
|
|
175
178
|
// package.json
|
|
176
179
|
var name = "@razaman2/reactive-view";
|
|
177
|
-
var version = "0.0.34-beta.
|
|
180
|
+
var version = "0.0.34-beta.29";
|
|
178
181
|
|
|
179
182
|
// src/ReactiveView.ts
|
|
180
183
|
var setup = {
|
|
@@ -255,12 +258,12 @@ var ReactiveView_default = {
|
|
|
255
258
|
console.error("[ReactiveView]: defaultData is required for promise or async function data.");
|
|
256
259
|
}
|
|
257
260
|
const defaultData = props.getDefaultData(
|
|
258
|
-
"defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
|
|
261
|
+
"defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray((0, import_vue.isRef)(vue.vnode.props.data) ? (0, import_vue.unref)(vue.vnode.props.data) : vue.vnode.props.data) ? [] : {} : {}
|
|
259
262
|
);
|
|
260
263
|
const datatype = Array.isArray(defaultData) ? [] : {};
|
|
261
264
|
const normalize = (data) => {
|
|
262
265
|
if (props.debug) {
|
|
263
|
-
console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData,
|
|
266
|
+
console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData, isRef: (0, import_vue.isRef)(data), isReactive: (0, import_vue.isReactive)(data) });
|
|
264
267
|
}
|
|
265
268
|
if ((0, import_vue.isReactive)(data)) {
|
|
266
269
|
return data;
|
|
@@ -315,7 +318,7 @@ var ReactiveView_default = {
|
|
|
315
318
|
});
|
|
316
319
|
const component = (0, import_vue.ref)({ parent: { self: vue.proxy }, self: { template, model, diff, dataPath: dataPath2, isValid } });
|
|
317
320
|
if (props.debug) {
|
|
318
|
-
console.
|
|
321
|
+
console.warn("[ReactiveView]:", { props, context, vue, defer, config, model, component, datatype, defaultData, isValid, isReady, isFunctionData, isAsyncFunctionData, isPromiseData });
|
|
319
322
|
}
|
|
320
323
|
const watchDataProp = (dataProp) => {
|
|
321
324
|
var _a2, _b2, _c2, _d2;
|
|
@@ -326,7 +329,7 @@ var ReactiveView_default = {
|
|
|
326
329
|
}, context.attrs["data:immediate"] ? { immediate: context.attrs["data:immediate"] } : {}), context.attrs["data:once"] ? { once: context.attrs["data:once"] } : {}), ((_d2 = context.attrs["onUpdate:data"]) != null ? _d2 : {}).options)
|
|
327
330
|
};
|
|
328
331
|
if (context.attrs["data:log"]) {
|
|
329
|
-
console.
|
|
332
|
+
console.warn(`[ReactiveView]:data`, { config: config2, dataProp });
|
|
330
333
|
}
|
|
331
334
|
(0, import_vue.watch)(isFunctionData || (0, import_vue.isRef)(dataProp) || (0, import_vue.isReactive)(dataProp) ? dataProp : () => dataProp, (after, before) => {
|
|
332
335
|
var _a3;
|
|
@@ -345,7 +348,7 @@ var ReactiveView_default = {
|
|
|
345
348
|
}, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_f = context.attrs["onUpdate:model"]) != null ? _f : {}).options)
|
|
346
349
|
} : (_g = context.attrs["onUpdate:model"]) != null ? _g : {};
|
|
347
350
|
if (context.attrs["model:log"]) {
|
|
348
|
-
console.
|
|
351
|
+
console.warn(`[ReactiveView]:model`, { config: config2 });
|
|
349
352
|
}
|
|
350
353
|
(0, import_vue.watch)(() => import_object_manager.default.on(model.getData()).clone(), (after, before) => {
|
|
351
354
|
config2.callback(access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after)), { component });
|
|
@@ -362,11 +365,14 @@ var ReactiveView_default = {
|
|
|
362
365
|
]) : [props.data];
|
|
363
366
|
(0, import_vue.watch)(isRefData ? data : isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
|
|
364
367
|
var _a3;
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
368
|
+
if (before !== void 0 || after !== void 0) {
|
|
369
|
+
const callback = context.attrs["data:callback"];
|
|
370
|
+
if (typeof callback === "function") {
|
|
371
|
+
const diff2 = access(component).diff(import_object_manager.default.on(before), import_object_manager.default.on(after));
|
|
372
|
+
model.replaceData((_a3 = callback(diff2, { component })) != null ? _a3 : after);
|
|
373
|
+
} else {
|
|
374
|
+
model.replaceData(after);
|
|
375
|
+
}
|
|
370
376
|
}
|
|
371
377
|
}, {
|
|
372
378
|
immediate: (_b2 = context.attrs["data:immediate"]) != null ? _b2 : true,
|
|
@@ -623,6 +629,7 @@ var extendVnode = (component, element) => {
|
|
|
623
629
|
});
|
|
624
630
|
};
|
|
625
631
|
function defineReactiveView(param1, param2) {
|
|
632
|
+
const instance = (0, import_vue2.ref)();
|
|
626
633
|
return (0, import_vue2.defineComponent)({
|
|
627
634
|
name: param1 == null ? void 0 : param1.modelName,
|
|
628
635
|
props: __spreadValues({ setup }, param1 ? param1.props : {}),
|
|
@@ -630,12 +637,14 @@ function defineReactiveView(param1, param2) {
|
|
|
630
637
|
const _a = param1 != null ? param1 : {}, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
|
|
631
638
|
return (component) => {
|
|
632
639
|
const props2 = Object.entries(rest).reduce((props3, [key, val]) => {
|
|
633
|
-
return Object.assign(props3, { [key]: typeof val === "function" ? val(component) : val });
|
|
640
|
+
return Object.assign(props3, { [key]: typeof val === "function" ? val(component, instance) : val });
|
|
634
641
|
}, {});
|
|
635
642
|
const slots = typeof (param1 == null ? void 0 : param1.slots) === "function" ? param1.slots(component) : Array.isArray(param1 == null ? void 0 : param1.slots) ? () => param1.slots : param1 == null ? void 0 : param1.slots;
|
|
636
|
-
return (0, import_vue2.createVNode)(param2 != null ? param2 : ReactiveView_default, __spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
|
|
643
|
+
return (0, import_vue2.createVNode)(param2 != null ? param2 : ReactiveView_default, __spreadProps(__spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
|
|
637
644
|
setup: (self, parent) => setup2(self, parent, component)
|
|
638
|
-
} : {})),
|
|
645
|
+
} : {})), {
|
|
646
|
+
instance
|
|
647
|
+
}), slots);
|
|
639
648
|
};
|
|
640
649
|
}
|
|
641
650
|
});
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
2
4
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
3
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
4
6
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
@@ -14,6 +16,7 @@ var __spreadValues = (a, b) => {
|
|
|
14
16
|
}
|
|
15
17
|
return a;
|
|
16
18
|
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
17
20
|
var __objRest = (source, exclude) => {
|
|
18
21
|
var target = {};
|
|
19
22
|
for (var prop in source)
|
|
@@ -124,11 +127,11 @@ var Subscriptions = _Subscriptions;
|
|
|
124
127
|
// src/ReactiveView.ts
|
|
125
128
|
import ObjectManager from "@razaman2/object-manager";
|
|
126
129
|
import DataManager from "@razaman2/data-manager";
|
|
127
|
-
import { ref, reactive, watch, isRef, isReactive, createVNode, getCurrentInstance } from "vue";
|
|
130
|
+
import { ref, reactive, watch, isRef, isReactive, createVNode, getCurrentInstance, unref } from "vue";
|
|
128
131
|
|
|
129
132
|
// package.json
|
|
130
133
|
var name = "@razaman2/reactive-view";
|
|
131
|
-
var version = "0.0.34-beta.
|
|
134
|
+
var version = "0.0.34-beta.29";
|
|
132
135
|
|
|
133
136
|
// src/ReactiveView.ts
|
|
134
137
|
var setup = {
|
|
@@ -209,12 +212,12 @@ var ReactiveView_default = {
|
|
|
209
212
|
console.error("[ReactiveView]: defaultData is required for promise or async function data.");
|
|
210
213
|
}
|
|
211
214
|
const defaultData = props.getDefaultData(
|
|
212
|
-
"defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(vue.vnode.props.data) ? [] : {} : {}
|
|
215
|
+
"defaultData" in vue.vnode.props ? vue.vnode.props.defaultData : "data" in vue.vnode.props ? Array.isArray(isRef(vue.vnode.props.data) ? unref(vue.vnode.props.data) : vue.vnode.props.data) ? [] : {} : {}
|
|
213
216
|
);
|
|
214
217
|
const datatype = Array.isArray(defaultData) ? [] : {};
|
|
215
218
|
const normalize = (data) => {
|
|
216
219
|
if (props.debug) {
|
|
217
|
-
console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData,
|
|
220
|
+
console.warn(`[ReactiveView]: using beta props data in [${props.modelName}] component`, { vue, data, defaultData, isRef: isRef(data), isReactive: isReactive(data) });
|
|
218
221
|
}
|
|
219
222
|
if (isReactive(data)) {
|
|
220
223
|
return data;
|
|
@@ -269,7 +272,7 @@ var ReactiveView_default = {
|
|
|
269
272
|
});
|
|
270
273
|
const component = ref({ parent: { self: vue.proxy }, self: { template, model, diff, dataPath: dataPath2, isValid } });
|
|
271
274
|
if (props.debug) {
|
|
272
|
-
console.
|
|
275
|
+
console.warn("[ReactiveView]:", { props, context, vue, defer, config, model, component, datatype, defaultData, isValid, isReady, isFunctionData, isAsyncFunctionData, isPromiseData });
|
|
273
276
|
}
|
|
274
277
|
const watchDataProp = (dataProp) => {
|
|
275
278
|
var _a2, _b2, _c2, _d2;
|
|
@@ -280,7 +283,7 @@ var ReactiveView_default = {
|
|
|
280
283
|
}, context.attrs["data:immediate"] ? { immediate: context.attrs["data:immediate"] } : {}), context.attrs["data:once"] ? { once: context.attrs["data:once"] } : {}), ((_d2 = context.attrs["onUpdate:data"]) != null ? _d2 : {}).options)
|
|
281
284
|
};
|
|
282
285
|
if (context.attrs["data:log"]) {
|
|
283
|
-
console.
|
|
286
|
+
console.warn(`[ReactiveView]:data`, { config: config2, dataProp });
|
|
284
287
|
}
|
|
285
288
|
watch(isFunctionData || isRef(dataProp) || isReactive(dataProp) ? dataProp : () => dataProp, (after, before) => {
|
|
286
289
|
var _a3;
|
|
@@ -299,7 +302,7 @@ var ReactiveView_default = {
|
|
|
299
302
|
}, context.attrs["model:immediate"] ? { immediate: context.attrs["model:immediate"] } : {}), context.attrs["model:once"] ? { once: context.attrs["model:once"] } : {}), ((_f = context.attrs["onUpdate:model"]) != null ? _f : {}).options)
|
|
300
303
|
} : (_g = context.attrs["onUpdate:model"]) != null ? _g : {};
|
|
301
304
|
if (context.attrs["model:log"]) {
|
|
302
|
-
console.
|
|
305
|
+
console.warn(`[ReactiveView]:model`, { config: config2 });
|
|
303
306
|
}
|
|
304
307
|
watch(() => ObjectManager.on(model.getData()).clone(), (after, before) => {
|
|
305
308
|
config2.callback(access(component).diff(ObjectManager.on(before), ObjectManager.on(after)), { component });
|
|
@@ -316,11 +319,14 @@ var ReactiveView_default = {
|
|
|
316
319
|
]) : [props.data];
|
|
317
320
|
watch(isRefData ? data : isFunctionData ? data : typeof data === "function" ? data : () => data, (after, before) => {
|
|
318
321
|
var _a3;
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
322
|
+
if (before !== void 0 || after !== void 0) {
|
|
323
|
+
const callback = context.attrs["data:callback"];
|
|
324
|
+
if (typeof callback === "function") {
|
|
325
|
+
const diff2 = access(component).diff(ObjectManager.on(before), ObjectManager.on(after));
|
|
326
|
+
model.replaceData((_a3 = callback(diff2, { component })) != null ? _a3 : after);
|
|
327
|
+
} else {
|
|
328
|
+
model.replaceData(after);
|
|
329
|
+
}
|
|
324
330
|
}
|
|
325
331
|
}, {
|
|
326
332
|
immediate: (_b2 = context.attrs["data:immediate"]) != null ? _b2 : true,
|
|
@@ -372,7 +378,7 @@ var ReactiveView_default = {
|
|
|
372
378
|
};
|
|
373
379
|
|
|
374
380
|
// src/index.ts
|
|
375
|
-
import { h, unref, toRaw, createApp, createVNode as createVNode2, defineComponent } from "vue";
|
|
381
|
+
import { h, ref as ref2, unref as unref2, toRaw, createApp, createVNode as createVNode2, defineComponent } from "vue";
|
|
376
382
|
import { formatInTimeZone } from "date-fns-tz";
|
|
377
383
|
import { twMerge } from "tailwind-merge";
|
|
378
384
|
console.log(`%c[ReactiveView]: ${version}`, "background-color: red; color: yellow;");
|
|
@@ -472,7 +478,7 @@ function access(view = {}, alternative) {
|
|
|
472
478
|
});
|
|
473
479
|
};
|
|
474
480
|
try {
|
|
475
|
-
const component = (_a =
|
|
481
|
+
const component = (_a = unref2(typeof view === "function" ? view() : view)) != null ? _a : {};
|
|
476
482
|
return resolve("instance" in component ? component.instance : component);
|
|
477
483
|
} catch (e) {
|
|
478
484
|
return resolve(view);
|
|
@@ -577,6 +583,7 @@ var extendVnode = (component, element) => {
|
|
|
577
583
|
});
|
|
578
584
|
};
|
|
579
585
|
function defineReactiveView(param1, param2) {
|
|
586
|
+
const instance = ref2();
|
|
580
587
|
return defineComponent({
|
|
581
588
|
name: param1 == null ? void 0 : param1.modelName,
|
|
582
589
|
props: __spreadValues({ setup }, param1 ? param1.props : {}),
|
|
@@ -584,12 +591,14 @@ function defineReactiveView(param1, param2) {
|
|
|
584
591
|
const _a = param1 != null ? param1 : {}, { setup: setup2, props } = _a, rest = __objRest(_a, ["setup", "props"]);
|
|
585
592
|
return (component) => {
|
|
586
593
|
const props2 = Object.entries(rest).reduce((props3, [key, val]) => {
|
|
587
|
-
return Object.assign(props3, { [key]: typeof val === "function" ? val(component) : val });
|
|
594
|
+
return Object.assign(props3, { [key]: typeof val === "function" ? val(component, instance) : val });
|
|
588
595
|
}, {});
|
|
589
596
|
const slots = typeof (param1 == null ? void 0 : param1.slots) === "function" ? param1.slots(component) : Array.isArray(param1 == null ? void 0 : param1.slots) ? () => param1.slots : param1 == null ? void 0 : param1.slots;
|
|
590
|
-
return createVNode2(param2 != null ? param2 : ReactiveView_default, __spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
|
|
597
|
+
return createVNode2(param2 != null ? param2 : ReactiveView_default, __spreadProps(__spreadValues(__spreadValues({}, props2), Object.assign({}, props2, typeof setup2 === "function" ? {
|
|
591
598
|
setup: (self, parent) => setup2(self, parent, component)
|
|
592
|
-
} : {})),
|
|
599
|
+
} : {})), {
|
|
600
|
+
instance
|
|
601
|
+
}), slots);
|
|
593
602
|
};
|
|
594
603
|
}
|
|
595
604
|
});
|
|
@@ -652,7 +661,7 @@ var setData = (component, data, path) => {
|
|
|
652
661
|
return "state" in vue ? diff : vue.$emit("update:state", diff);
|
|
653
662
|
};
|
|
654
663
|
var componentState = (component) => {
|
|
655
|
-
return
|
|
664
|
+
return unref2("state" in component ? component.state : component.$attrs.state);
|
|
656
665
|
};
|
|
657
666
|
var dataPath = (component, path) => {
|
|
658
667
|
return typeof component.$attrs["data:path"] === "function" ? component.$attrs["data:path"](path) : path;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@razaman2/reactive-view",
|
|
3
|
-
"version": "0.0.34-beta.
|
|
3
|
+
"version": "0.0.34-beta.29",
|
|
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",
|