@tachui/core 0.8.5-alpha → 0.8.10-alpha.0
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/README.md +4 -4
- package/dist/assets/index.js +10 -10
- package/dist/{binding-CYpEQquE.js → binding-DCV5PKkK.js} +3 -3
- package/dist/common.js +36 -36
- package/dist/{component-CECyfUOE.js → component-D-O9yq0P.js} +4 -4
- package/dist/{component-base-CJ__jTlr.js → component-base-C41K3NTe.js} +2 -2
- package/dist/{component-context-B6qX_Qsg.js → component-context-B9HI2nZH.js} +1 -1
- package/dist/components/index.js +1 -1
- package/dist/{concatenated-component-_tF1eMvy.js → concatenated-component-CP81AwgI.js} +3 -3
- package/dist/css-classes/dom-integration.d.ts.map +1 -1
- package/dist/css-classes/index.js +2 -2
- package/dist/{effect-DGmdACI2.js → effect-BsW3fy1q.js} +1 -1
- package/dist/{enhanced-renderer-Bwqsh8Ku.js → enhanced-renderer-t9Ni2EEG.js} +17 -15
- package/dist/essential.js +43 -43
- package/dist/{factories-Co2Lv2kJ.js → factories-B3-rmvkB.js} +3 -3
- package/dist/{factory-D7jAY5Kn.js → factory-BgnjJRGE.js} +7 -7
- package/dist/{hooks-DeLasj54.js → hooks-WGmpzYgD.js} +3 -3
- package/dist/{index-X8MVY78C.js → index-ykdS-3xs.js} +7 -7
- package/dist/index.js +36 -36
- package/dist/minimal-prod.js +89 -88
- package/dist/minimal.js +97 -96
- package/dist/modifiers/base.d.ts +1 -0
- package/dist/modifiers/base.d.ts.map +1 -1
- package/dist/modifiers/base.js +213 -93
- package/dist/modifiers/builder.js +1 -1
- package/dist/modifiers/index.js +3 -3
- package/dist/modifiers/proxy.d.ts.map +1 -1
- package/dist/modifiers/reactive-style-bindings.d.ts +22 -0
- package/dist/modifiers/reactive-style-bindings.d.ts.map +1 -0
- package/dist/modifiers/registry.js +1 -1
- package/dist/{observed-object-DepiqSgg.js → observed-object-p1CLdrFm.js} +3 -3
- package/dist/proxy-522Jjabr.js +188 -0
- package/dist/reactive/computed.d.ts +3 -0
- package/dist/reactive/computed.d.ts.map +1 -1
- package/dist/reactive/index.js +18 -18
- package/dist/runtime/dom-bridge.js +4 -4
- package/dist/runtime/index.js +4 -4
- package/dist/runtime/renderer.js +4 -4
- package/dist/{scheduler-DI_8ykMk.js → scheduler-DppMK9mR.js} +1 -1
- package/dist/{signal-list-BdpxSodS.js → signal-list-07gNXGiW.js} +18 -18
- package/dist/state/index.js +8 -8
- package/dist/{theme-BFaKUcjZ.js → theme-CRLPHryV.js} +128 -118
- package/dist/validation/index.js +2 -2
- package/dist/version.js +1 -1
- package/package.json +4 -3
- package/dist/proxy-Cqmbiyx0.js +0 -175
package/dist/modifiers/base.js
CHANGED
|
@@ -1,11 +1,131 @@
|
|
|
1
|
-
import "../scheduler-
|
|
2
|
-
import {
|
|
3
|
-
import { c as
|
|
1
|
+
import { o as R } from "../scheduler-DppMK9mR.js";
|
|
2
|
+
import { p as O, d as m, r as D, i as v, K as B } from "../theme-CRLPHryV.js";
|
|
3
|
+
import { c as b } from "../effect-BsW3fy1q.js";
|
|
4
4
|
import "@tachui/types/reactive";
|
|
5
|
-
import { ModifierPriority as
|
|
6
|
-
import { shouldExpandForInfinity as
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
import { ModifierPriority as S } from "@tachui/types/modifiers";
|
|
6
|
+
import { shouldExpandForInfinity as _, dimensionToCSS as h, isInfinity as g } from "../constants/layout.js";
|
|
7
|
+
const w = /* @__PURE__ */ new WeakMap();
|
|
8
|
+
let p = null;
|
|
9
|
+
function ee(s) {
|
|
10
|
+
if (s === null)
|
|
11
|
+
return p = null, () => {
|
|
12
|
+
};
|
|
13
|
+
const i = p;
|
|
14
|
+
return p = (t, e) => {
|
|
15
|
+
i?.(t, e), s(t, e);
|
|
16
|
+
}, () => {
|
|
17
|
+
p = i;
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
function k(s, i, t) {
|
|
21
|
+
try {
|
|
22
|
+
s(i);
|
|
23
|
+
} catch (e) {
|
|
24
|
+
if (p) {
|
|
25
|
+
p(e, { updaterId: t, value: i });
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
console.error(`Reactive style updater failed (${t}):`, e);
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
const M = 200, u = /* @__PURE__ */ new WeakMap(), T = /* @__PURE__ */ new WeakMap(), y = /* @__PURE__ */ new Set();
|
|
32
|
+
let P = !1, A = !1;
|
|
33
|
+
function z(s) {
|
|
34
|
+
u.get(s)?.forEach((t) => t()), u.delete(s), T.delete(s);
|
|
35
|
+
}
|
|
36
|
+
function H() {
|
|
37
|
+
const s = Date.now();
|
|
38
|
+
for (const i of Array.from(y)) {
|
|
39
|
+
const t = i.deref();
|
|
40
|
+
if (!t) {
|
|
41
|
+
y.delete(i);
|
|
42
|
+
continue;
|
|
43
|
+
}
|
|
44
|
+
const e = T.get(t), n = u.get(t);
|
|
45
|
+
if (!e || !n || n.size === 0) {
|
|
46
|
+
y.delete(i);
|
|
47
|
+
continue;
|
|
48
|
+
}
|
|
49
|
+
if (t.isConnected) {
|
|
50
|
+
e.wasConnected = !0;
|
|
51
|
+
continue;
|
|
52
|
+
}
|
|
53
|
+
(e.wasConnected || s - e.trackedAt >= M) && (z(t), y.delete(i));
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
function F() {
|
|
57
|
+
if (A || typeof setTimeout != "function") return;
|
|
58
|
+
A = !0;
|
|
59
|
+
const s = () => {
|
|
60
|
+
if (H(), y.size === 0) {
|
|
61
|
+
A = !1;
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
setTimeout(s, M);
|
|
65
|
+
};
|
|
66
|
+
setTimeout(s, M);
|
|
67
|
+
}
|
|
68
|
+
function W() {
|
|
69
|
+
if (P || typeof document > "u" || !document.documentElement || typeof MutationObserver > "u")
|
|
70
|
+
return;
|
|
71
|
+
new MutationObserver(() => {
|
|
72
|
+
H();
|
|
73
|
+
}).observe(document.documentElement, { childList: !0, subtree: !0 }), P = !0;
|
|
74
|
+
}
|
|
75
|
+
function U(s, i) {
|
|
76
|
+
W(), F();
|
|
77
|
+
const t = u.get(s) ?? /* @__PURE__ */ new Set(), e = t.size > 0;
|
|
78
|
+
return t.add(i), u.set(s, t), e || (T.set(s, {
|
|
79
|
+
trackedAt: Date.now(),
|
|
80
|
+
wasConnected: s.isConnected
|
|
81
|
+
}), y.add(new WeakRef(s))), () => {
|
|
82
|
+
const n = u.get(s);
|
|
83
|
+
n && (n.delete(i), n.size === 0 && (u.delete(s), T.delete(s)));
|
|
84
|
+
};
|
|
85
|
+
}
|
|
86
|
+
function N({
|
|
87
|
+
element: s,
|
|
88
|
+
accessor: i,
|
|
89
|
+
updater: t,
|
|
90
|
+
updaterId: e
|
|
91
|
+
}) {
|
|
92
|
+
const n = w.get(s) ?? /* @__PURE__ */ new Map();
|
|
93
|
+
w.has(s) || w.set(s, n);
|
|
94
|
+
let r = n.get(i);
|
|
95
|
+
if (!r) {
|
|
96
|
+
const a = /* @__PURE__ */ new Map();
|
|
97
|
+
r = { effect: b(() => {
|
|
98
|
+
const c = i();
|
|
99
|
+
a.forEach(
|
|
100
|
+
(E, L) => k(E, c, L)
|
|
101
|
+
);
|
|
102
|
+
}), updaters: a }, n.set(i, r);
|
|
103
|
+
}
|
|
104
|
+
r.updaters.set(e, t), k(t, i(), e);
|
|
105
|
+
let o = null;
|
|
106
|
+
const l = () => {
|
|
107
|
+
o && (o(), o = null);
|
|
108
|
+
const a = w.get(s), d = a?.get(i);
|
|
109
|
+
d && (d.updaters.delete(e), d.updaters.size === 0 && (d.effect.dispose(), a?.delete(i), m(i) && D(i)), a && a.size === 0 && w.delete(s));
|
|
110
|
+
};
|
|
111
|
+
O() ? R(l) : o = U(s, l);
|
|
112
|
+
}
|
|
113
|
+
var j = Object.defineProperty, K = (s, i, t) => i in s ? j(s, i, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[i] = t, f = (s, i, t) => K(s, typeof i != "symbol" ? i + "" : i, t);
|
|
114
|
+
const I = Symbol.for("tachui.modifier.instanceId"), x = "core";
|
|
115
|
+
let $ = 0;
|
|
116
|
+
function Y(s) {
|
|
117
|
+
const i = s[I];
|
|
118
|
+
if (typeof i == "number") return i;
|
|
119
|
+
$ += 1;
|
|
120
|
+
const t = $;
|
|
121
|
+
return Object.defineProperty(s, I, {
|
|
122
|
+
value: t,
|
|
123
|
+
enumerable: !1,
|
|
124
|
+
configurable: !1,
|
|
125
|
+
writable: !1
|
|
126
|
+
}), t;
|
|
127
|
+
}
|
|
128
|
+
class C {
|
|
9
129
|
constructor(i) {
|
|
10
130
|
this.properties = i;
|
|
11
131
|
}
|
|
@@ -15,7 +135,7 @@ class y {
|
|
|
15
135
|
resolveReactiveProps(i, t) {
|
|
16
136
|
const e = {};
|
|
17
137
|
for (const [n, r] of Object.entries(i))
|
|
18
|
-
|
|
138
|
+
v(r) || m(r), e[n] = r;
|
|
19
139
|
return e;
|
|
20
140
|
}
|
|
21
141
|
/**
|
|
@@ -24,12 +144,12 @@ class y {
|
|
|
24
144
|
applyStyleChange(i, t, e) {
|
|
25
145
|
if (i instanceof HTMLElement) {
|
|
26
146
|
const n = this.toCSSProperty(t);
|
|
27
|
-
if (
|
|
28
|
-
|
|
147
|
+
if (v(e) || m(e))
|
|
148
|
+
b(() => {
|
|
29
149
|
const r = e(), o = String(r);
|
|
30
150
|
if (o.includes("!important")) {
|
|
31
|
-
const
|
|
32
|
-
i.style.setProperty(n,
|
|
151
|
+
const l = o.replace(/\s*!important\s*$/, "").trim();
|
|
152
|
+
i.style.setProperty(n, l, "important");
|
|
33
153
|
} else
|
|
34
154
|
i.style.setProperty(n, o);
|
|
35
155
|
});
|
|
@@ -82,35 +202,33 @@ class y {
|
|
|
82
202
|
*/
|
|
83
203
|
applyStyles(i, t) {
|
|
84
204
|
if (i instanceof HTMLElement || i.style) {
|
|
85
|
-
const e = (i instanceof HTMLElement, i.style)
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
205
|
+
const e = (i instanceof HTMLElement, i.style), n = (r, o) => {
|
|
206
|
+
if (e.setProperty)
|
|
207
|
+
if (typeof o == "string" && o.includes("!important")) {
|
|
208
|
+
const l = o.replace(/\s*!important\s*$/, "").trim();
|
|
209
|
+
e.setProperty(r, l, "important");
|
|
210
|
+
} else
|
|
211
|
+
e.setProperty(r, o);
|
|
212
|
+
else
|
|
213
|
+
e[r] = o;
|
|
214
|
+
};
|
|
215
|
+
for (const [r, o] of Object.entries(t))
|
|
216
|
+
if (o !== void 0) {
|
|
217
|
+
const l = this.toCSSProperty(r);
|
|
218
|
+
if (v(o) || m(o)) {
|
|
219
|
+
const a = o, d = Y(this);
|
|
220
|
+
N({
|
|
221
|
+
element: i,
|
|
222
|
+
accessor: a,
|
|
223
|
+
updaterId: `${x}:${d}:${l}`,
|
|
224
|
+
updater: (c) => {
|
|
225
|
+
const E = this.toCSSValueForProperty(l, c);
|
|
226
|
+
n(l, E);
|
|
227
|
+
}
|
|
103
228
|
});
|
|
104
|
-
else {
|
|
105
|
-
const a = this.toCSSValueForProperty(
|
|
106
|
-
|
|
107
|
-
if (typeof a == "string" && a.includes("!important")) {
|
|
108
|
-
const s = a.replace(/\s*!important\s*$/, "").trim();
|
|
109
|
-
e.setProperty(o, s, "important");
|
|
110
|
-
} else
|
|
111
|
-
e.setProperty(o, a);
|
|
112
|
-
else
|
|
113
|
-
e[o] = a;
|
|
229
|
+
} else {
|
|
230
|
+
const a = this.toCSSValueForProperty(l, o);
|
|
231
|
+
n(l, a);
|
|
114
232
|
}
|
|
115
233
|
}
|
|
116
234
|
}
|
|
@@ -140,9 +258,9 @@ class y {
|
|
|
140
258
|
};
|
|
141
259
|
}
|
|
142
260
|
}
|
|
143
|
-
class
|
|
261
|
+
class te extends C {
|
|
144
262
|
constructor() {
|
|
145
|
-
super(...arguments),
|
|
263
|
+
super(...arguments), f(this, "type", "layout"), f(this, "priority", S.LAYOUT);
|
|
146
264
|
}
|
|
147
265
|
apply(i, t) {
|
|
148
266
|
if (!i.element || !t.element) return;
|
|
@@ -166,31 +284,31 @@ class H extends y {
|
|
|
166
284
|
computeLayoutStyles(i, t) {
|
|
167
285
|
const e = {};
|
|
168
286
|
if (i.frame) {
|
|
169
|
-
const n = i.frame, r =
|
|
287
|
+
const n = i.frame, r = _(n);
|
|
170
288
|
if (Object.assign(e, r.cssProps), n.width !== void 0) {
|
|
171
|
-
const o =
|
|
172
|
-
o !== void 0 && !
|
|
289
|
+
const o = h(n.width);
|
|
290
|
+
o !== void 0 && !g(n.width) && !r.expandWidth && (e.width = o);
|
|
173
291
|
}
|
|
174
292
|
if (n.height !== void 0) {
|
|
175
|
-
const o =
|
|
176
|
-
o !== void 0 && !
|
|
293
|
+
const o = h(n.height);
|
|
294
|
+
o !== void 0 && !g(n.height) && !r.expandHeight && (e.height = o);
|
|
177
295
|
}
|
|
178
296
|
if (n.minWidth !== void 0) {
|
|
179
|
-
const o =
|
|
297
|
+
const o = h(n.minWidth);
|
|
180
298
|
o !== void 0 && (e.minWidth = o);
|
|
181
299
|
}
|
|
182
|
-
if (n.maxWidth !== void 0 && !
|
|
183
|
-
const o =
|
|
300
|
+
if (n.maxWidth !== void 0 && !g(n.maxWidth)) {
|
|
301
|
+
const o = h(n.maxWidth);
|
|
184
302
|
o !== void 0 && (e.maxWidth = o);
|
|
185
|
-
} else
|
|
303
|
+
} else g(n.maxWidth) && (e.maxWidth = "none", e.flexGrow = "1 !important", e.flexShrink = "1 !important", e.flexBasis = "0% !important", e.alignSelf = "stretch !important");
|
|
186
304
|
if (n.minHeight !== void 0) {
|
|
187
|
-
const o =
|
|
305
|
+
const o = h(n.minHeight);
|
|
188
306
|
o !== void 0 && (e.minHeight = o);
|
|
189
307
|
}
|
|
190
|
-
if (n.maxHeight !== void 0 && !
|
|
191
|
-
const o =
|
|
308
|
+
if (n.maxHeight !== void 0 && !g(n.maxHeight)) {
|
|
309
|
+
const o = h(n.maxHeight);
|
|
192
310
|
o !== void 0 && (e.maxHeight = o);
|
|
193
|
-
} else
|
|
311
|
+
} else g(n.maxHeight) && (e.maxHeight = "none", e.flexGrow = "1 !important", e.flexShrink = "1 !important", e.flexBasis = "0% !important", e.alignSelf = "stretch !important");
|
|
194
312
|
}
|
|
195
313
|
if (i.padding !== void 0)
|
|
196
314
|
if (typeof i.padding == "number")
|
|
@@ -239,9 +357,9 @@ class H extends y {
|
|
|
239
357
|
return e;
|
|
240
358
|
}
|
|
241
359
|
}
|
|
242
|
-
class
|
|
360
|
+
class ie extends C {
|
|
243
361
|
constructor() {
|
|
244
|
-
super(...arguments),
|
|
362
|
+
super(...arguments), f(this, "type", "appearance"), f(this, "priority", S.APPEARANCE);
|
|
245
363
|
}
|
|
246
364
|
apply(i, t) {
|
|
247
365
|
if (!i.element || !t.element)
|
|
@@ -262,16 +380,16 @@ class I extends y {
|
|
|
262
380
|
* Apply Asset-based styles with theme reactivity
|
|
263
381
|
*/
|
|
264
382
|
applyAssetBasedStyles(i, t) {
|
|
265
|
-
const e =
|
|
266
|
-
t.foregroundColor && this.isAsset(t.foregroundColor) &&
|
|
383
|
+
const e = B();
|
|
384
|
+
t.foregroundColor && this.isAsset(t.foregroundColor) && b(() => {
|
|
267
385
|
e();
|
|
268
386
|
const n = t.foregroundColor.resolve();
|
|
269
387
|
this.applyStyleChange(i, "color", n);
|
|
270
|
-
}), t.backgroundColor && this.isAsset(t.backgroundColor) &&
|
|
388
|
+
}), t.backgroundColor && this.isAsset(t.backgroundColor) && b(() => {
|
|
271
389
|
e();
|
|
272
390
|
const n = t.backgroundColor.resolve();
|
|
273
391
|
this.applyStyleChange(i, "backgroundColor", n);
|
|
274
|
-
}), t.border?.color && this.isAsset(t.border.color) &&
|
|
392
|
+
}), t.border?.color && this.isAsset(t.border.color) && b(() => {
|
|
275
393
|
e();
|
|
276
394
|
const n = t.border.color.resolve();
|
|
277
395
|
this.applyStyleChange(i, "borderColor", n);
|
|
@@ -293,7 +411,7 @@ class I extends y {
|
|
|
293
411
|
t.fontFamily = r;
|
|
294
412
|
} else
|
|
295
413
|
t.fontFamily = n.family;
|
|
296
|
-
n.size && (t.fontSize = this.toCSSValue(n.size)), n.weight && (t.fontWeight = String(n.weight)), n.style && (t.fontStyle = n.style);
|
|
414
|
+
n.size !== void 0 && (t.fontSize = v(n.size) || m(n.size) ? n.size : this.toCSSValue(n.size)), n.weight !== void 0 && (t.fontWeight = v(n.weight) || m(n.weight) ? n.weight : String(n.weight)), n.style && (t.fontStyle = n.style);
|
|
297
415
|
}
|
|
298
416
|
if (i.cornerRadius !== void 0 && (t.borderRadius = this.toCSSValue(i.cornerRadius)), i.border) {
|
|
299
417
|
const n = i.border;
|
|
@@ -326,9 +444,9 @@ class I extends y {
|
|
|
326
444
|
return i._tachui_component || null;
|
|
327
445
|
}
|
|
328
446
|
}
|
|
329
|
-
class
|
|
447
|
+
class ne extends C {
|
|
330
448
|
constructor() {
|
|
331
|
-
super(...arguments),
|
|
449
|
+
super(...arguments), f(this, "type", "interaction"), f(this, "priority", S.INTERACTION);
|
|
332
450
|
}
|
|
333
451
|
apply(i, t) {
|
|
334
452
|
if (!t.element) return;
|
|
@@ -346,15 +464,15 @@ class R extends y {
|
|
|
346
464
|
t.element.addEventListener(
|
|
347
465
|
"touchstart",
|
|
348
466
|
(o) => {
|
|
349
|
-
const
|
|
350
|
-
n =
|
|
467
|
+
const a = o.touches[0];
|
|
468
|
+
n = a.clientX, r = a.clientY;
|
|
351
469
|
},
|
|
352
470
|
{ passive: !0 }
|
|
353
471
|
), t.element.addEventListener(
|
|
354
472
|
"touchend",
|
|
355
473
|
(o) => {
|
|
356
|
-
const
|
|
357
|
-
Math.abs(
|
|
474
|
+
const a = o.changedTouches[0], d = a.clientX - n, c = a.clientY - r;
|
|
475
|
+
Math.abs(d) > Math.abs(c) && Math.abs(d) > 50 && (d < 0 && e.onSwipeLeft ? e.onSwipeLeft() : d > 0 && e.onSwipeRight && e.onSwipeRight());
|
|
358
476
|
},
|
|
359
477
|
{ passive: !0 }
|
|
360
478
|
);
|
|
@@ -369,16 +487,16 @@ class R extends y {
|
|
|
369
487
|
}), e.onCopy && t.element.addEventListener("copy", e.onCopy), e.onCut && t.element.addEventListener("cut", e.onCut), e.onPaste && t.element.addEventListener("paste", e.onPaste), e.onSelect && t.element.addEventListener("select", e.onSelect), e.disabled !== void 0 && t.element instanceof HTMLElement && (e.disabled ? (t.element.setAttribute("disabled", "true"), t.element.style.pointerEvents = "none", t.element.style.opacity = "0.6") : (t.element.removeAttribute("disabled"), t.element.style.pointerEvents = "", t.element.style.opacity = "")), e.draggable !== void 0 && t.element instanceof HTMLElement && (t.element.draggable = e.draggable), e.accessibilityLabel && t.element.setAttribute("aria-label", e.accessibilityLabel), e.accessibilityHint && t.element.setAttribute("aria-describedby", e.accessibilityHint);
|
|
370
488
|
}
|
|
371
489
|
}
|
|
372
|
-
class
|
|
490
|
+
class re extends C {
|
|
373
491
|
constructor() {
|
|
374
|
-
super(...arguments),
|
|
492
|
+
super(...arguments), f(this, "type", "animation"), f(this, "priority", S.ANIMATION);
|
|
375
493
|
}
|
|
376
494
|
apply(i, t) {
|
|
377
495
|
if (!t.element) return;
|
|
378
496
|
const e = this.properties;
|
|
379
497
|
if (e.transition) {
|
|
380
|
-
const n = e.transition, r = n.property || "all", o = n.duration || 300,
|
|
381
|
-
t.element instanceof HTMLElement && (t.element.style.transition = `${r} ${o}ms ${
|
|
498
|
+
const n = e.transition, r = n.property || "all", o = n.duration || 300, l = n.easing || "ease", a = n.delay || 0;
|
|
499
|
+
t.element instanceof HTMLElement && (t.element.style.transition = `${r} ${o}ms ${l} ${a}ms`);
|
|
382
500
|
}
|
|
383
501
|
if (e.animation && t.element instanceof HTMLElement) {
|
|
384
502
|
const n = e.animation;
|
|
@@ -388,15 +506,15 @@ class D extends y {
|
|
|
388
506
|
n.keyframes
|
|
389
507
|
);
|
|
390
508
|
this.addKeyframesToStylesheet(o);
|
|
391
|
-
const
|
|
392
|
-
t.element.style.animation = `${r} ${
|
|
509
|
+
const l = n.duration || 1e3, a = n.easing || "ease", d = n.iterations || 1, c = n.direction || "normal";
|
|
510
|
+
t.element.style.animation = `${r} ${l}ms ${a} ${d} ${c}`;
|
|
393
511
|
}
|
|
394
512
|
}
|
|
395
|
-
if (e.transform && t.element instanceof HTMLElement && (
|
|
513
|
+
if (e.transform && t.element instanceof HTMLElement && (v(e.transform) || m(e.transform) ? b(() => {
|
|
396
514
|
const n = e.transform();
|
|
397
515
|
t.element instanceof HTMLElement && (t.element.style.transform = n);
|
|
398
516
|
}) : t.element.style.transform = e.transform), e.scaleEffect && t.element instanceof HTMLElement) {
|
|
399
|
-
const { x: n, y: r, anchor: o } = e.scaleEffect,
|
|
517
|
+
const { x: n, y: r, anchor: o } = e.scaleEffect, l = r ?? n, d = {
|
|
400
518
|
center: "50% 50%",
|
|
401
519
|
top: "50% 0%",
|
|
402
520
|
topLeading: "0% 0%",
|
|
@@ -407,9 +525,9 @@ class D extends y {
|
|
|
407
525
|
leading: "0% 50%",
|
|
408
526
|
trailing: "100% 50%"
|
|
409
527
|
}[o || "center"] || "50% 50%";
|
|
410
|
-
t.element.style.transformOrigin =
|
|
411
|
-
const c = `scale(${n}, ${
|
|
412
|
-
t.element.style.transform =
|
|
528
|
+
t.element.style.transformOrigin = d;
|
|
529
|
+
const c = `scale(${n}, ${l})`, L = (t.element.style.transform || "").replace(/\s*scale[XYZ3d]*\([^)]*\)\s*/g, " ").replace(/\s+/g, " ").trim(), V = L ? `${L} ${c}`.trim() : c;
|
|
530
|
+
t.element.style.transform = V;
|
|
413
531
|
}
|
|
414
532
|
}
|
|
415
533
|
createKeyframeRule(i, t) {
|
|
@@ -418,9 +536,9 @@ class D extends y {
|
|
|
418
536
|
for (const [n, r] of Object.entries(t)) {
|
|
419
537
|
e += ` ${n} {
|
|
420
538
|
`;
|
|
421
|
-
for (const [o,
|
|
422
|
-
const
|
|
423
|
-
e += ` ${
|
|
539
|
+
for (const [o, l] of Object.entries(r)) {
|
|
540
|
+
const a = this.toCSSProperty(o);
|
|
541
|
+
e += ` ${a}: ${l};
|
|
424
542
|
`;
|
|
425
543
|
}
|
|
426
544
|
e += ` }
|
|
@@ -435,9 +553,9 @@ class D extends y {
|
|
|
435
553
|
t || (t = document.createElement("style"), t.id = "tachui-animations", document.head.appendChild(t)), t.appendChild(document.createTextNode(i));
|
|
436
554
|
}
|
|
437
555
|
}
|
|
438
|
-
class
|
|
556
|
+
class oe extends C {
|
|
439
557
|
constructor() {
|
|
440
|
-
super(...arguments),
|
|
558
|
+
super(...arguments), f(this, "type", "lifecycle"), f(this, "priority", S.CUSTOM), f(this, "activeAbortController");
|
|
441
559
|
}
|
|
442
560
|
apply(i, t) {
|
|
443
561
|
if (!t.element) return;
|
|
@@ -476,20 +594,22 @@ class O extends y {
|
|
|
476
594
|
this.properties._cleanupFunctions || (this.properties._cleanupFunctions = []), this.properties._cleanupFunctions.push(i);
|
|
477
595
|
}
|
|
478
596
|
}
|
|
479
|
-
class
|
|
597
|
+
class se extends C {
|
|
480
598
|
constructor() {
|
|
481
|
-
super(...arguments),
|
|
599
|
+
super(...arguments), f(this, "type", "resizable"), f(this, "priority", S.APPEARANCE);
|
|
482
600
|
}
|
|
483
601
|
apply(i, t) {
|
|
484
602
|
t.element && t.element instanceof HTMLImageElement && (t.element.style.objectFit = "fill");
|
|
485
603
|
}
|
|
486
604
|
}
|
|
487
605
|
export {
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
606
|
+
re as AnimationModifier,
|
|
607
|
+
ie as AppearanceModifier,
|
|
608
|
+
C as BaseModifier,
|
|
609
|
+
ne as InteractionModifier,
|
|
610
|
+
te as LayoutModifier,
|
|
611
|
+
oe as LifecycleModifier,
|
|
612
|
+
se as ResizableModifier,
|
|
613
|
+
N as bindReactiveStyle,
|
|
614
|
+
ee as setReactiveStyleUpdaterErrorHandler
|
|
495
615
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import "@tachui/registry";
|
|
2
|
-
import { M as s, a, c as o, m as d, s as t } from "../concatenated-component-
|
|
2
|
+
import { M as s, a, c as o, m as d, s as t } from "../concatenated-component-CP81AwgI.js";
|
|
3
3
|
export {
|
|
4
4
|
s as ModifierBuilderImpl,
|
|
5
5
|
a as applyModifiers,
|
package/dist/modifiers/index.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { AnimationModifier as r, AppearanceModifier as o, BaseModifier as a, InteractionModifier as s, LayoutModifier as f, LifecycleModifier as t, ResizableModifier as d } from "./base.js";
|
|
2
2
|
import { ModifierPriority as p } from "@tachui/types/modifiers";
|
|
3
|
-
import { M as n, a as m, b as l, d as y, c as x, e as b, m as u, s as g } from "../concatenated-component-
|
|
4
|
-
import { c as h, r as B } from "../proxy-
|
|
3
|
+
import { M as n, a as m, b as l, d as y, c as x, e as b, m as u, s as g } from "../concatenated-component-CP81AwgI.js";
|
|
4
|
+
import { c as h, r as B } from "../proxy-522Jjabr.js";
|
|
5
5
|
import { a as R, b as v, c as A, i as I, l as L, p as z } from "../presets-B9x94uRn.js";
|
|
6
|
-
import { g as H, e as N, f as S, c as T, a as U, i as W, m as j, r as k, s as q, h as w } from "../factories-
|
|
6
|
+
import { g as H, e as N, f as S, c as T, a as U, i as W, m as j, r as k, s as q, h as w } from "../factories-B3-rmvkB.js";
|
|
7
7
|
import { r as F } from "../registration-utils-CNsN4eoU.js";
|
|
8
8
|
export {
|
|
9
9
|
r as AnimationModifier,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"proxy.d.ts","sourceRoot":"","sources":["../../src/modifiers/proxy.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"proxy.d.ts","sourceRoot":"","sources":["../../src/modifiers/proxy.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAiDzD,wBAAgB,eAAe,SAK9B;AAED,wBAAgB,oBAAoB,CAAC,CAAC,SAAS,iBAAiB,EAC9D,SAAS,EAAE,CAAC,GACX,CAAC,CA+OH"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
type ReactiveAccessor = () => any;
|
|
2
|
+
type ReactiveStyleUpdater = (value: any) => void;
|
|
3
|
+
type CleanupFn = () => void;
|
|
4
|
+
export type ReactiveStyleUpdaterErrorContext = {
|
|
5
|
+
updaterId: string;
|
|
6
|
+
value: any;
|
|
7
|
+
};
|
|
8
|
+
export type ReactiveStyleUpdaterErrorHandler = (error: unknown, context: ReactiveStyleUpdaterErrorContext) => void;
|
|
9
|
+
type ReactiveStyleBindingOptions = {
|
|
10
|
+
element: Element;
|
|
11
|
+
accessor: ReactiveAccessor;
|
|
12
|
+
updater: ReactiveStyleUpdater;
|
|
13
|
+
updaterId: string;
|
|
14
|
+
};
|
|
15
|
+
export declare function setReactiveStyleUpdaterErrorHandler(handler: ReactiveStyleUpdaterErrorHandler | null): CleanupFn;
|
|
16
|
+
/**
|
|
17
|
+
* Register an element-scoped reactive style updater with cross-module deduplication.
|
|
18
|
+
* The same element+accessor pair shares one effect regardless of modifier package.
|
|
19
|
+
*/
|
|
20
|
+
export declare function bindReactiveStyle({ element, accessor, updater, updaterId, }: ReactiveStyleBindingOptions): void;
|
|
21
|
+
export {};
|
|
22
|
+
//# sourceMappingURL=reactive-style-bindings.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"reactive-style-bindings.d.ts","sourceRoot":"","sources":["../../src/modifiers/reactive-style-bindings.ts"],"names":[],"mappings":"AAGA,KAAK,gBAAgB,GAAG,MAAM,GAAG,CAAA;AACjC,KAAK,oBAAoB,GAAG,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;AAChD,KAAK,SAAS,GAAG,MAAM,IAAI,CAAA;AAC3B,MAAM,MAAM,gCAAgC,GAAG;IAC7C,SAAS,EAAE,MAAM,CAAA;IACjB,KAAK,EAAE,GAAG,CAAA;CACX,CAAA;AACD,MAAM,MAAM,gCAAgC,GAAG,CAC7C,KAAK,EAAE,OAAO,EACd,OAAO,EAAE,gCAAgC,KACtC,IAAI,CAAA;AAWT,KAAK,2BAA2B,GAAG;IACjC,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,gBAAgB,CAAA;IAC1B,OAAO,EAAE,oBAAoB,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAKD,wBAAgB,mCAAmC,CACjD,OAAO,EAAE,gCAAgC,GAAG,IAAI,GAC/C,SAAS,CAeX;AAkID;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAChC,OAAO,EACP,QAAQ,EACR,OAAO,EACP,SAAS,GACV,EAAE,2BAA2B,GAAG,IAAI,CAoDpC"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { b as a, d as r, e as s, z as t, B as d, A as p } from "../concatenated-component-
|
|
1
|
+
import { b as a, d as r, e as s, z as t, B as d, A as p } from "../concatenated-component-CP81AwgI.js";
|
|
2
2
|
import "@tachui/registry";
|
|
3
3
|
export {
|
|
4
4
|
a as applyModifiersToNode,
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { c as l } from "./effect-
|
|
2
|
-
import { c as f, l as p } from "./theme-
|
|
3
|
-
import { d as a, g as d, p as g, c as y } from "./component-context-
|
|
1
|
+
import { c as l } from "./effect-BsW3fy1q.js";
|
|
2
|
+
import { c as f, l as p } from "./theme-CRLPHryV.js";
|
|
3
|
+
import { d as a, g as d, p as g, c as y } from "./component-context-B9HI2nZH.js";
|
|
4
4
|
var j = Object.defineProperty, O = (e, t, n) => t in e ? j(e, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[t] = n, s = (e, t, n) => O(e, typeof t != "symbol" ? t + "" : t, n);
|
|
5
5
|
class v {
|
|
6
6
|
constructor(t) {
|