juxscript 1.1.293 → 1.1.295
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.
|
@@ -14,6 +14,7 @@ interface StoreOptions {
|
|
|
14
14
|
declare class Store {
|
|
15
15
|
id: string;
|
|
16
16
|
options: StoreOptions;
|
|
17
|
+
_element: HTMLElement;
|
|
17
18
|
private _db;
|
|
18
19
|
private _value;
|
|
19
20
|
private _loading;
|
|
@@ -25,6 +26,7 @@ declare class Store {
|
|
|
25
26
|
private _tx;
|
|
26
27
|
private _notifyChange;
|
|
27
28
|
onChange(fn: (value: any[]) => void): this;
|
|
29
|
+
getElement(): HTMLElement;
|
|
28
30
|
getValue(): any[];
|
|
29
31
|
getLoading(): boolean;
|
|
30
32
|
getError(): string | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../lib/components/store.ts"],"names":[],"mappings":"AAGA,UAAU,YAAY;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QAAC,MAAM,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAChF,IAAI,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,cAAM,KAAK;IACP,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,YAAY,CAAC;IACtB,OAAO,CAAC,GAAG,CAA4B;IACvC,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,SAAS,CAAyC;IAC1D,OAAO,CAAC,MAAM,CAAgB;gBAElB,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY;
|
|
1
|
+
{"version":3,"file":"store.d.ts","sourceRoot":"","sources":["../../../lib/components/store.ts"],"names":[],"mappings":"AAGA,UAAU,YAAY;IAClB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QAAC,MAAM,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IAChF,IAAI,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,cAAM,KAAK;IACP,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,YAAY,CAAC;IACtB,QAAQ,EAAE,WAAW,CAAC;IACtB,OAAO,CAAC,GAAG,CAA4B;IACvC,OAAO,CAAC,MAAM,CAAa;IAC3B,OAAO,CAAC,QAAQ,CAAkB;IAClC,OAAO,CAAC,MAAM,CAAuB;IACrC,OAAO,CAAC,SAAS,CAAyC;IAC1D,OAAO,CAAC,MAAM,CAAgB;gBAElB,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY;IA0B7C,OAAO,CAAC,KAAK;IAgCb,OAAO,CAAC,GAAG;IAOX,OAAO,CAAC,aAAa;IAoBrB,QAAQ,CAAC,EAAE,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,IAAI,GAAG,IAAI;IAK1C,UAAU,IAAI,WAAW;IACzB,QAAQ,IAAI,GAAG,EAAE;IACjB,UAAU,IAAI,OAAO;IACrB,QAAQ,IAAI,MAAM,GAAG,IAAI;IACzB,QAAQ,IAAI,MAAM;IAElB,QAAQ,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI;IAUpB,MAAM,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC;IAwBxB,GAAG,CAAC,GAAG,EAAE,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC;IAWnC,KAAK,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC;IAiB5D,GAAG,CAAC,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,WAAW,CAAC;IActC,GAAG,CAAC,MAAM,EAAE,GAAG,GAAG,OAAO,CAAC,WAAW,CAAC;IActC,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC;IAuBtC,MAAM,CAAC,GAAG,EAAE,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;IAcvC,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC;IAoBtB,OAAO,IAAI,OAAO,CAAC,GAAG,EAAE,CAAC;CAGlC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,wBAAsB,KAAK,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,YAAY,GAAG,OAAO,CAAC,KAAK,CAAC,CAU7E;AAED,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -15,6 +15,14 @@ class Store {
|
|
|
15
15
|
auto: true,
|
|
16
16
|
...options
|
|
17
17
|
};
|
|
18
|
+
// Create a hidden DOM element so pageState can wire events
|
|
19
|
+
this._element = document.createElement('div');
|
|
20
|
+
this._element.id = this.id;
|
|
21
|
+
this._element.setAttribute('data-jux-store', this.options.table);
|
|
22
|
+
this._element.setAttribute('data-count', '0');
|
|
23
|
+
this._element.setAttribute('data-loading', 'false');
|
|
24
|
+
this._element.style.display = 'none';
|
|
25
|
+
(document.getElementById('app') || document.body).appendChild(this._element);
|
|
18
26
|
this._ready = this._open();
|
|
19
27
|
}
|
|
20
28
|
// ═══════════════════════════════════════════════════════════
|
|
@@ -56,12 +64,19 @@ class Store {
|
|
|
56
64
|
.objectStore(this.options.table);
|
|
57
65
|
}
|
|
58
66
|
_notifyChange() {
|
|
67
|
+
// Update DOM element metadata
|
|
68
|
+
this._element.setAttribute('data-count', String(this._value.length));
|
|
69
|
+
this._element.setAttribute('data-loading', String(this._loading));
|
|
70
|
+
if (this._error) {
|
|
71
|
+
this._element.setAttribute('data-error', this._error);
|
|
72
|
+
}
|
|
73
|
+
else {
|
|
74
|
+
this._element.removeAttribute('data-error');
|
|
75
|
+
}
|
|
59
76
|
if (this._onChange)
|
|
60
77
|
this._onChange(this._value);
|
|
61
|
-
pageState.
|
|
62
|
-
|
|
63
|
-
// Fire change event so pageState['id'].change watchers trigger
|
|
64
|
-
pageState.__notify?.(`${this.id}.change`);
|
|
78
|
+
// Dispatch a real DOM change event — pageState._wireEvent picks this up
|
|
79
|
+
this._element.dispatchEvent(new Event('change', { bubbles: false }));
|
|
65
80
|
}
|
|
66
81
|
// ═══════════════════════════════════════════════════════════
|
|
67
82
|
// PAGESTATE INTEGRATION
|
|
@@ -70,6 +85,7 @@ class Store {
|
|
|
70
85
|
this._onChange = fn;
|
|
71
86
|
return this;
|
|
72
87
|
}
|
|
88
|
+
getElement() { return this._element; }
|
|
73
89
|
getValue() { return this._value; }
|
|
74
90
|
getLoading() { return this._loading; }
|
|
75
91
|
getError() { return this._error; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"pageState.d.ts","sourceRoot":"","sources":["../../../lib/state/pageState.ts"],"names":[],"mappings":"AAeA,cAAM,SAAS;IACX,OAAO,CAAC,SAAS,CAA0C;IAC3D,OAAO,CAAC,MAAM,CAAsB;IAEpC,MAAM,CAAC,QAAQ,CAAC,WAAW,mKAQhB;;IA2BX,OAAO,CAAC,qBAAqB;IAsG7B,OAAO,CAAC,SAAS;
|
|
1
|
+
{"version":3,"file":"pageState.d.ts","sourceRoot":"","sources":["../../../lib/state/pageState.ts"],"names":[],"mappings":"AAeA,cAAM,SAAS;IACX,OAAO,CAAC,SAAS,CAA0C;IAC3D,OAAO,CAAC,MAAM,CAAsB;IAEpC,MAAM,CAAC,QAAQ,CAAC,WAAW,mKAQhB;;IA2BX,OAAO,CAAC,qBAAqB;IAsG7B,OAAO,CAAC,SAAS;IA+DjB,OAAO,CAAC,UAAU;IAgClB,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,cAAc;IAuBtB,OAAO,CAAC,WAAW;IAInB,OAAO,CAAC,OAAO;IA2Cf,OAAO,CAAC,MAAM;IAmBd,QAAQ,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC;CAGlC;AAID,eAAO,MAAM,SAAS,qBAAuB,CAAC;AAE9C,OAAO,EAAE,SAAS,EAAE,CAAC"}
|
|
@@ -163,12 +163,6 @@ class PageState {
|
|
|
163
163
|
entry.props.type = opts.type;
|
|
164
164
|
}
|
|
165
165
|
entry.props.id = id;
|
|
166
|
-
// For non-DOM components (Store, Data), seed a change event flag
|
|
167
|
-
// so pageState['id'].change works even without a DOM element
|
|
168
|
-
const el = this._findElement(component);
|
|
169
|
-
if (!el) {
|
|
170
|
-
entry.events['change'] = false;
|
|
171
|
-
}
|
|
172
166
|
this._registry.set(id, entry);
|
|
173
167
|
// Wire onChange — use internal callback pattern, don't replace
|
|
174
168
|
if (typeof component.onChange === 'function') {
|
|
@@ -209,6 +203,13 @@ class PageState {
|
|
|
209
203
|
if ((eventName === 'input' || eventName === 'change') && el instanceof HTMLSelectElement) {
|
|
210
204
|
entry.props.value = el.value;
|
|
211
205
|
}
|
|
206
|
+
// For non-input elements (e.g. Store's hidden div), sync value from component
|
|
207
|
+
if (eventName === 'change' && !(el instanceof HTMLInputElement) && !(el instanceof HTMLSelectElement)) {
|
|
208
|
+
const comp = entry.component;
|
|
209
|
+
if (typeof comp.getValue === 'function') {
|
|
210
|
+
entry.props.value = comp.getValue();
|
|
211
|
+
}
|
|
212
|
+
}
|
|
212
213
|
this._notify(`${id}.${eventName}`);
|
|
213
214
|
queueMicrotask(() => {
|
|
214
215
|
entry.events[eventName] = false;
|
|
@@ -254,24 +255,26 @@ class PageState {
|
|
|
254
255
|
this._registry.delete(id);
|
|
255
256
|
}
|
|
256
257
|
_notify(depKey) {
|
|
257
|
-
// For event-style keys, set the flag before notifying
|
|
258
|
-
const dotIdx = depKey.indexOf('.');
|
|
259
|
-
const eventId = dotIdx > -1 ? depKey.substring(0, dotIdx) : null;
|
|
260
|
-
const eventProp = dotIdx > -1 ? depKey.substring(dotIdx + 1) : null;
|
|
261
|
-
if (eventId && eventProp) {
|
|
262
|
-
const entry = this._registry.get(eventId);
|
|
263
|
-
if (entry && eventProp in entry.events) {
|
|
264
|
-
entry.events[eventProp] = true;
|
|
265
|
-
}
|
|
266
|
-
}
|
|
267
258
|
notifyQueue.push(depKey);
|
|
268
259
|
// Prevent re-entrant notification loops
|
|
269
260
|
if (isNotifying)
|
|
270
261
|
return;
|
|
271
262
|
isNotifying = true;
|
|
263
|
+
const eventKeysToReset = [];
|
|
272
264
|
try {
|
|
273
265
|
while (notifyQueue.length > 0) {
|
|
274
266
|
const key = notifyQueue.shift();
|
|
267
|
+
// For event-style keys, set the flag before firing reactions
|
|
268
|
+
const dotIdx = key.indexOf('.');
|
|
269
|
+
if (dotIdx > -1) {
|
|
270
|
+
const id = key.substring(0, dotIdx);
|
|
271
|
+
const prop = key.substring(dotIdx + 1);
|
|
272
|
+
const entry = this._registry.get(id);
|
|
273
|
+
if (entry && prop in entry.events) {
|
|
274
|
+
entry.events[prop] = true;
|
|
275
|
+
eventKeysToReset.push({ entry, prop });
|
|
276
|
+
}
|
|
277
|
+
}
|
|
275
278
|
for (const [reaction, deps] of reactionDeps.entries()) {
|
|
276
279
|
if (deps.has(key)) {
|
|
277
280
|
reaction();
|
|
@@ -281,14 +284,11 @@ class PageState {
|
|
|
281
284
|
}
|
|
282
285
|
finally {
|
|
283
286
|
isNotifying = false;
|
|
284
|
-
// Reset event
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
entry.events[eventProp] = false;
|
|
290
|
-
});
|
|
291
|
-
}
|
|
287
|
+
// Reset all event flags after all reactions have run
|
|
288
|
+
for (const { entry, prop } of eventKeysToReset) {
|
|
289
|
+
queueMicrotask(() => {
|
|
290
|
+
entry.events[prop] = false;
|
|
291
|
+
});
|
|
292
292
|
}
|
|
293
293
|
}
|
|
294
294
|
}
|