@spotlab/hand-matrix 0.3.0 → 0.4.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 +10 -7
- package/dist/editor/cells.d.ts +11 -5
- package/dist/index.js +189 -181
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -95,13 +95,16 @@ goes in as props and changes come out through `on*Change` callbacks.
|
|
|
95
95
|
produces).
|
|
96
96
|
- `cellsToComboWeights(cells, actionIndex): Map<string, number>` — collapse
|
|
97
97
|
one action back to absolute per-combo weights, ready to save as a range.
|
|
98
|
-
- `cellsToRanges(original, seed, cells): HandFrequency[][]` — turn
|
|
99
|
-
edited grid back into one hand-keyed range per action. `original`
|
|
100
|
-
each action's range (or `null`) in editor action order, `seed` the
|
|
101
|
-
the editor opened with, and `cells` the cells after editing.
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
98
|
+
- `cellsToRanges(original, seed, cells, avail?): HandFrequency[][]` — turn
|
|
99
|
+
the edited grid back into one hand-keyed range per action. `original`
|
|
100
|
+
holds each action's range (or `null`) in editor action order, `seed` the
|
|
101
|
+
cells the editor opened with, and `cells` the cells after editing.
|
|
102
|
+
`avail` is the parent range per hand (`null` for unconstrained); leave it
|
|
103
|
+
out when the parent gives every hand of a combo the same weight. Combos
|
|
104
|
+
whose cell still matches its seed keep each action's original hands
|
|
105
|
+
verbatim, and a `null` action takes what's left of each hand there.
|
|
106
|
+
Changed combos are rebuilt from the cells. Either way, each hand's
|
|
107
|
+
actions sum to its parent weight.
|
|
105
108
|
- `comboWeightsToCells(cells, actionWeights, passive): EditorCell[]` — the
|
|
106
109
|
inverse: re-derive the cells' conditional weights from absolute
|
|
107
110
|
per-action ranges, keeping each cell's `avail`.
|
package/dist/editor/cells.d.ts
CHANGED
|
@@ -31,17 +31,23 @@ export declare function comboWeightsToCells(cells: EditorCell[], actionWeights:
|
|
|
31
31
|
* Turn an edited grid back into one hand-keyed range per action, keeping each
|
|
32
32
|
* action's original hands wherever the editor didn't touch them. `original`
|
|
33
33
|
* holds each action's range in editor action order, `seed` the cells the
|
|
34
|
-
* editor opened with, and `cells` the cells after editing.
|
|
34
|
+
* editor opened with, and `cells` the cells after editing. `avail` is the
|
|
35
|
+
* parent range per hand, as passed (collapsed) to `seedCells`: `null` means
|
|
36
|
+
* unconstrained, and leaving it out takes each hand's weight from its cell's
|
|
37
|
+
* `avail`, which is exact whenever the parent gives every hand of a combo the
|
|
38
|
+
* same weight.
|
|
35
39
|
*
|
|
36
40
|
* A combo whose cell still equals its seed cell (same `avail`, same weights)
|
|
37
41
|
* keeps every action's original hands verbatim, so input the whole-percent grid
|
|
38
42
|
* can't represent — a single suit (`AhKh:0.7`) or a fractional weight
|
|
39
|
-
* (`QQ:0.333`) — survives a save.
|
|
40
|
-
*
|
|
41
|
-
*
|
|
43
|
+
* (`QQ:0.333`) — survives a save. An action whose original is `null` (e.g. an
|
|
44
|
+
* implicit fold) takes what's left of each hand there: its parent weight minus
|
|
45
|
+
* the preserved originals, never below 0, split across `null` actions by their
|
|
46
|
+
* cell weights. A changed combo is rebuilt from its cell for every action, each
|
|
47
|
+
* hand getting the action's share of its own parent weight.
|
|
42
48
|
*
|
|
43
49
|
* Each rebuilt combo takes its first original hand's place, and combos the
|
|
44
50
|
* original didn't have follow in matrix order, so an unedited range formats
|
|
45
51
|
* back to the string it came from.
|
|
46
52
|
*/
|
|
47
|
-
export declare function cellsToRanges(original: (HandFrequency[] | null)[], seed: EditorCell[], cells: EditorCell[]): HandFrequency[][];
|
|
53
|
+
export declare function cellsToRanges(original: (HandFrequency[] | null)[], seed: EditorCell[], cells: EditorCell[], avail?: HandFrequency[] | null): HandFrequency[][];
|
package/dist/index.js
CHANGED
|
@@ -1,69 +1,69 @@
|
|
|
1
|
-
import { useCallback as
|
|
2
|
-
import { COMBOS as
|
|
3
|
-
import { jsx as
|
|
4
|
-
var
|
|
1
|
+
import { useCallback as M, useEffect as x, useLayoutEffect as P, useMemo as T, useRef as $ } from "react";
|
|
2
|
+
import { COMBOS as C, comboOf as W, handsOfCombo as D, parseRange as F, toComboWeights as B } from "@spotlab/range";
|
|
3
|
+
import { jsx as g, jsxs as y } from "react/jsx-runtime";
|
|
4
|
+
var X = (t, e) => Array.from({ length: Math.ceil(t.length / e) }, (n, r) => t.slice(r * e, r * e + e)), _ = "to right", L = (t) => t.length === 0 ? "transparent" : `linear-gradient(${_}, ${t.join(", ")})`, j = (t) => {
|
|
5
5
|
const e = t.target;
|
|
6
6
|
e.hasPointerCapture(t.pointerId) && e.releasePointerCapture(t.pointerId);
|
|
7
|
-
},
|
|
7
|
+
}, E = (t, e, n) => {
|
|
8
8
|
const r = t.ownerDocument.elementFromPoint(e, n)?.closest("[data-combo]");
|
|
9
9
|
return !r || !t.contains(r) ? null : r.getAttribute("data-combo");
|
|
10
|
-
},
|
|
10
|
+
}, q = ({ combo: t, onPointerDown: e, comboStyle: n }) => /* @__PURE__ */ g("div", {
|
|
11
11
|
className: "spotlab-hm-cell",
|
|
12
12
|
"data-combo": t,
|
|
13
13
|
style: n?.(t),
|
|
14
14
|
onPointerDown: e && ((r) => {
|
|
15
|
-
|
|
15
|
+
j(r), e(t, r);
|
|
16
16
|
}),
|
|
17
|
-
children: /* @__PURE__ */
|
|
17
|
+
children: /* @__PURE__ */ g("div", {
|
|
18
18
|
className: "spotlab-hm-cell-inner",
|
|
19
|
-
children: /* @__PURE__ */
|
|
19
|
+
children: /* @__PURE__ */ g("div", {
|
|
20
20
|
"data-combo": t,
|
|
21
21
|
children: t
|
|
22
22
|
})
|
|
23
23
|
})
|
|
24
|
-
}),
|
|
24
|
+
}), G = ({ row: t, ...e }) => /* @__PURE__ */ g("div", {
|
|
25
25
|
className: "spotlab-hm-row",
|
|
26
|
-
children: t.map((n, r) => /* @__PURE__ */
|
|
26
|
+
children: t.map((n, r) => /* @__PURE__ */ g(q, {
|
|
27
27
|
combo: n,
|
|
28
28
|
...e
|
|
29
29
|
}, r))
|
|
30
|
-
}),
|
|
30
|
+
}), U = {
|
|
31
31
|
touchAction: "none",
|
|
32
32
|
userSelect: "none",
|
|
33
33
|
WebkitUserSelect: "none",
|
|
34
34
|
WebkitTouchCallout: "none"
|
|
35
|
-
},
|
|
36
|
-
const a =
|
|
37
|
-
const
|
|
38
|
-
|
|
35
|
+
}, S = ({ className: t, onPointerDown: e, onPointerEnter: n, ...r }) => {
|
|
36
|
+
const a = $(null), o = (c) => {
|
|
37
|
+
const s = E(c.currentTarget, c.clientX, c.clientY);
|
|
38
|
+
s !== a.current && (a.current = s, s && n?.(s, c));
|
|
39
39
|
};
|
|
40
|
-
return /* @__PURE__ */
|
|
40
|
+
return /* @__PURE__ */ g("div", {
|
|
41
41
|
className: ["spotlab-hm-root", t].filter(Boolean).join(" "),
|
|
42
|
-
style: e ?
|
|
43
|
-
onPointerDown: n && ((
|
|
44
|
-
a.current =
|
|
42
|
+
style: e ? U : void 0,
|
|
43
|
+
onPointerDown: n && ((c) => {
|
|
44
|
+
a.current = E(c.currentTarget, c.clientX, c.clientY);
|
|
45
45
|
}),
|
|
46
46
|
onPointerMove: n && o,
|
|
47
47
|
onPointerLeave: n && (() => a.current = null),
|
|
48
|
-
children:
|
|
49
|
-
row:
|
|
48
|
+
children: X(C, 13).map((c, s) => /* @__PURE__ */ g(G, {
|
|
49
|
+
row: c,
|
|
50
50
|
onPointerDown: e,
|
|
51
51
|
...r
|
|
52
|
-
},
|
|
52
|
+
}, s))
|
|
53
53
|
});
|
|
54
|
-
},
|
|
55
|
-
const r =
|
|
56
|
-
const a = typeof t == "string" ?
|
|
57
|
-
return
|
|
54
|
+
}, Y = (t, e) => ({ background: L([`${t} 0 ${e * 100}%`, `transparent ${e * 100}% 100%`]) }), ot = ({ range: t, fill: e = "var(--spotlab-hm-fill)", className: n }) => {
|
|
55
|
+
const r = T(() => {
|
|
56
|
+
const a = typeof t == "string" ? F(t) : t;
|
|
57
|
+
return B(a);
|
|
58
58
|
}, [t]);
|
|
59
|
-
return /* @__PURE__ */
|
|
59
|
+
return /* @__PURE__ */ g(S, {
|
|
60
60
|
className: n,
|
|
61
61
|
comboStyle: (a) => {
|
|
62
62
|
const o = r.get(a);
|
|
63
|
-
return o ?
|
|
63
|
+
return o ? Y(e, o) : {};
|
|
64
64
|
}
|
|
65
65
|
});
|
|
66
|
-
},
|
|
66
|
+
}, H = (t) => Math.max(0, Math.min(100, Math.round(t))), Q = (t, e) => {
|
|
67
67
|
const n = t.map(Math.round);
|
|
68
68
|
let r = 100 - n.reduce((a, o) => a + o, 0);
|
|
69
69
|
if (r !== 0) {
|
|
@@ -80,58 +80,58 @@ var D = (t, e) => Array.from({ length: Math.ceil(t.length / e) }, (n, r) => t.sl
|
|
|
80
80
|
}
|
|
81
81
|
}
|
|
82
82
|
return n;
|
|
83
|
-
},
|
|
84
|
-
const a =
|
|
83
|
+
}, J = (t, e, n, r) => {
|
|
84
|
+
const a = H(n), o = t.slice();
|
|
85
85
|
o[e] = a;
|
|
86
|
-
const
|
|
87
|
-
for (let
|
|
88
|
-
const
|
|
89
|
-
if (
|
|
90
|
-
|
|
91
|
-
const
|
|
92
|
-
|
|
93
|
-
} else
|
|
94
|
-
return
|
|
95
|
-
},
|
|
86
|
+
const c = 100 - a, s = [];
|
|
87
|
+
for (let h = 0; h < t.length; h++) h !== e && s.push(h);
|
|
88
|
+
const d = s.reduce((h, p) => h + t[p], 0);
|
|
89
|
+
if (d <= 0) {
|
|
90
|
+
s.forEach((p) => o[p] = 0);
|
|
91
|
+
const h = e === r ? s[0] : r;
|
|
92
|
+
h != null && (o[h] = c);
|
|
93
|
+
} else s.forEach((h) => o[h] = Math.round(t[h] / d * c));
|
|
94
|
+
return Q(o, e);
|
|
95
|
+
}, N = (t, e) => t.reduce((n, r, a) => a === e ? n : n + r, 0), k = new Map(C.map((t, e) => [t, e])), K = (t, e, n) => {
|
|
96
96
|
const r = t.slice();
|
|
97
|
-
return r[
|
|
98
|
-
},
|
|
97
|
+
return r[k.get(e)] = n, r;
|
|
98
|
+
}, I = (t, e) => {
|
|
99
99
|
const n = t.slice();
|
|
100
|
-
let r =
|
|
100
|
+
let r = N(n, e);
|
|
101
101
|
if (r > 100) {
|
|
102
102
|
const a = 100 / r;
|
|
103
103
|
for (let o = 0; o < n.length; o++) o !== e && (n[o] = Math.round(n[o] * a));
|
|
104
|
-
r =
|
|
104
|
+
r = N(n, e);
|
|
105
105
|
}
|
|
106
106
|
return n[e] = Math.max(0, 100 - r), n;
|
|
107
107
|
};
|
|
108
|
-
function
|
|
109
|
-
return
|
|
108
|
+
function lt(t, e, n) {
|
|
109
|
+
return C.map((r) => {
|
|
110
110
|
const a = t ? t.get(r) ?? 0 : 1, o = e.map(() => 0);
|
|
111
111
|
return a <= 0 ? (o[n] = 100, {
|
|
112
112
|
avail: 0,
|
|
113
113
|
weights: o
|
|
114
|
-
}) : (e.forEach((
|
|
115
|
-
const
|
|
116
|
-
o[
|
|
114
|
+
}) : (e.forEach((c, s) => {
|
|
115
|
+
const d = c?.get(r) ?? 0;
|
|
116
|
+
o[s] = Math.round(d / a * 100);
|
|
117
117
|
}), {
|
|
118
118
|
avail: a,
|
|
119
|
-
weights:
|
|
119
|
+
weights: I(o, n)
|
|
120
120
|
});
|
|
121
121
|
});
|
|
122
122
|
}
|
|
123
|
-
var
|
|
124
|
-
function
|
|
123
|
+
var A = 8;
|
|
124
|
+
function st(t, e) {
|
|
125
125
|
const n = /* @__PURE__ */ new Map();
|
|
126
126
|
return t.forEach((r, a) => {
|
|
127
127
|
if (r.avail <= 0) return;
|
|
128
|
-
const o = r.weights.reduce((
|
|
128
|
+
const o = r.weights.reduce((s, d) => s + d, 0);
|
|
129
129
|
if (!o) return;
|
|
130
|
-
const
|
|
131
|
-
|
|
130
|
+
const c = Number((r.weights[e] / o * r.avail).toFixed(A));
|
|
131
|
+
c && n.set(C[a], c);
|
|
132
132
|
}), n;
|
|
133
133
|
}
|
|
134
|
-
function
|
|
134
|
+
function ct(t, e, n) {
|
|
135
135
|
return t.map((r, a) => {
|
|
136
136
|
const o = e.map(() => 0);
|
|
137
137
|
if (r.avail <= 0)
|
|
@@ -139,145 +139,153 @@ function at(t, e, n) {
|
|
|
139
139
|
avail: r.avail,
|
|
140
140
|
weights: o
|
|
141
141
|
};
|
|
142
|
-
const
|
|
143
|
-
return e.forEach((
|
|
144
|
-
const
|
|
145
|
-
o[
|
|
142
|
+
const c = C[a];
|
|
143
|
+
return e.forEach((s, d) => {
|
|
144
|
+
const h = s?.get(c) ?? 0;
|
|
145
|
+
o[d] = Math.round(h / r.avail * 100);
|
|
146
146
|
}), {
|
|
147
147
|
avail: r.avail,
|
|
148
|
-
weights:
|
|
148
|
+
weights: I(o, n)
|
|
149
149
|
};
|
|
150
150
|
});
|
|
151
151
|
}
|
|
152
|
-
var
|
|
153
|
-
function
|
|
154
|
-
const
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
152
|
+
var V = (t, e) => t.avail !== e.avail || t.weights.length !== e.weights.length || t.weights.some((n, r) => n !== e.weights[r]);
|
|
153
|
+
function it(t, e, n, r) {
|
|
154
|
+
const a = r && new Map(r.map(({ hand: l, frequency: i }) => [l, i])), o = (l, i) => r === void 0 ? i.avail : a ? a.get(l) ?? 0 : 1, c = t.map((l) => l && new Map(l.map(({ hand: i, frequency: f }) => [i, f]))), s = (l) => c.reduce((i, f) => i + (f?.get(l) ?? 0), 0), d = t.flatMap((l, i) => l ? [] : [i]), h = (l, i) => D(l).flatMap((f) => {
|
|
155
|
+
const b = Number(i(f).toFixed(A));
|
|
156
|
+
return b > 0 ? [{
|
|
157
|
+
hand: f,
|
|
158
|
+
frequency: b
|
|
159
|
+
}] : [];
|
|
160
|
+
}), p = (l, i) => {
|
|
161
|
+
const f = n[k.get(l)], b = f.weights.reduce((v, w) => v + w, 0);
|
|
162
|
+
return f.avail <= 0 || !b ? [] : h(l, (v) => f.weights[i] / b * o(v, f));
|
|
163
|
+
}, m = (l, i) => {
|
|
164
|
+
const f = n[k.get(l)], b = d.reduce((w, O) => w + f.weights[O], 0), v = b ? f.weights[i] / b : 1 / d.length;
|
|
165
|
+
return h(l, (w) => Math.max(0, o(w, f) - s(w)) * v);
|
|
166
|
+
}, u = new Set(C.filter((l, i) => V(e[i], n[i])));
|
|
167
|
+
return t.map((l, i) => {
|
|
168
|
+
if (l === null) return C.flatMap((v) => u.has(v) ? p(v, i) : m(v, i));
|
|
169
|
+
const f = [], b = /* @__PURE__ */ new Set();
|
|
170
|
+
for (const v of l) {
|
|
171
|
+
const w = W(v.hand);
|
|
172
|
+
u.has(w) ? b.has(w) || (b.add(w), f.push(...p(w, i))) : f.push(v);
|
|
165
173
|
}
|
|
166
|
-
for (const
|
|
167
|
-
return
|
|
174
|
+
for (const v of u) b.has(v) || f.push(...p(v, i));
|
|
175
|
+
return f;
|
|
168
176
|
});
|
|
169
177
|
}
|
|
170
|
-
function
|
|
171
|
-
const { cells: e, brush: n, tool: r, onCellsChange: a, onBrushChange: o, onToolChange:
|
|
172
|
-
|
|
178
|
+
function Z(t) {
|
|
179
|
+
const { cells: e, brush: n, tool: r, onCellsChange: a, onBrushChange: o, onToolChange: c } = t, s = $(null), d = M(() => {
|
|
180
|
+
s.current?.abort(), s.current = null;
|
|
173
181
|
}, []);
|
|
174
|
-
|
|
175
|
-
const
|
|
176
|
-
|
|
177
|
-
|
|
182
|
+
x(() => d, [d]);
|
|
183
|
+
const h = $(e);
|
|
184
|
+
P(() => {
|
|
185
|
+
h.current = e;
|
|
178
186
|
}, [e]);
|
|
179
|
-
const
|
|
180
|
-
const
|
|
181
|
-
if (
|
|
182
|
-
const
|
|
183
|
-
avail:
|
|
187
|
+
const p = M((u) => {
|
|
188
|
+
const l = h.current, { avail: i } = l[k.get(u)];
|
|
189
|
+
if (i <= 0) return;
|
|
190
|
+
const f = K(l, u, {
|
|
191
|
+
avail: i,
|
|
184
192
|
weights: [...n]
|
|
185
193
|
});
|
|
186
|
-
|
|
187
|
-
}, [n, a]),
|
|
188
|
-
const
|
|
189
|
-
e[
|
|
194
|
+
h.current = f, a(f);
|
|
195
|
+
}, [n, a]), m = M((u) => {
|
|
196
|
+
const l = k.get(u);
|
|
197
|
+
e[l].avail <= 0 || (o([...e[l].weights]), c("brush"));
|
|
190
198
|
}, [
|
|
191
199
|
e,
|
|
192
200
|
o,
|
|
193
|
-
|
|
201
|
+
c
|
|
194
202
|
]);
|
|
195
203
|
return {
|
|
196
|
-
onCellDown:
|
|
204
|
+
onCellDown: M((u) => {
|
|
197
205
|
if (r === "eyedropper") {
|
|
198
|
-
|
|
206
|
+
m(u);
|
|
199
207
|
return;
|
|
200
208
|
}
|
|
201
|
-
|
|
202
|
-
const
|
|
203
|
-
|
|
209
|
+
d();
|
|
210
|
+
const l = new AbortController();
|
|
211
|
+
s.current = l, window.addEventListener("pointerup", d, { signal: l.signal }), window.addEventListener("pointercancel", d, { signal: l.signal }), p(u);
|
|
204
212
|
}, [
|
|
205
213
|
r,
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
214
|
+
m,
|
|
215
|
+
p,
|
|
216
|
+
d
|
|
209
217
|
]),
|
|
210
|
-
onCellEnter:
|
|
211
|
-
|
|
212
|
-
}, [r,
|
|
218
|
+
onCellEnter: M((u) => {
|
|
219
|
+
s.current && r === "brush" && p(u);
|
|
220
|
+
}, [r, p])
|
|
213
221
|
};
|
|
214
222
|
}
|
|
215
|
-
var
|
|
223
|
+
var R = (t, e, n) => {
|
|
216
224
|
const r = [];
|
|
217
225
|
let a = 0;
|
|
218
226
|
return n.forEach((o) => {
|
|
219
|
-
const
|
|
220
|
-
if (
|
|
221
|
-
const
|
|
222
|
-
r.push(`${
|
|
223
|
-
}), r.length > 0 && a < 1 - 1e-9 && r.push(`transparent ${a * 100}% 100%`),
|
|
224
|
-
},
|
|
225
|
-
const { onCellDown:
|
|
227
|
+
const c = (t.weights[o] || 0) / 100;
|
|
228
|
+
if (c <= 0) return;
|
|
229
|
+
const s = e[o].color;
|
|
230
|
+
r.push(`${s} ${a * 100}%`), r.push(`${s} ${(a + c) * 100}%`), a += c;
|
|
231
|
+
}), r.length > 0 && a < 1 - 1e-9 && r.push(`transparent ${a * 100}% 100%`), L(r);
|
|
232
|
+
}, ut = ({ cells: t, actions: e, order: n, brush: r, tool: a, onCellsChange: o, onBrushChange: c, onToolChange: s, className: d }) => {
|
|
233
|
+
const { onCellDown: h, onCellEnter: p } = Z({
|
|
226
234
|
cells: t,
|
|
227
235
|
brush: r,
|
|
228
236
|
tool: a,
|
|
229
237
|
onCellsChange: o,
|
|
230
|
-
onBrushChange:
|
|
231
|
-
onToolChange:
|
|
238
|
+
onBrushChange: c,
|
|
239
|
+
onToolChange: s
|
|
232
240
|
});
|
|
233
|
-
return /* @__PURE__ */
|
|
234
|
-
className:
|
|
235
|
-
comboStyle: (
|
|
236
|
-
const u = t[
|
|
241
|
+
return /* @__PURE__ */ g(S, {
|
|
242
|
+
className: d,
|
|
243
|
+
comboStyle: (m) => {
|
|
244
|
+
const u = t[k.get(m)];
|
|
237
245
|
if (u.avail <= 0) return {
|
|
238
246
|
background: "var(--spotlab-hm-dead-hatch)",
|
|
239
247
|
backgroundColor: "var(--spotlab-hm-muted-bg)",
|
|
240
248
|
cursor: "not-allowed",
|
|
241
249
|
color: "var(--spotlab-hm-muted-fg)"
|
|
242
250
|
};
|
|
243
|
-
const
|
|
251
|
+
const l = a === "eyedropper" ? "copy" : "pointer";
|
|
244
252
|
if (u.avail < 1) {
|
|
245
|
-
const
|
|
253
|
+
const i = `${u.avail * 100}%`;
|
|
246
254
|
return {
|
|
247
|
-
background: `repeating-linear-gradient(180deg, var(--spotlab-hm-muted-fg) 0 4px, transparent 4px 8px), var(--spotlab-hm-dead-hatch), ${
|
|
255
|
+
background: `repeating-linear-gradient(180deg, var(--spotlab-hm-muted-fg) 0 4px, transparent 4px 8px), var(--spotlab-hm-dead-hatch), ${R(u, e, n)}`,
|
|
248
256
|
backgroundSize: `1px 100%, ${(1 - u.avail) * 100}% 100%, ${u.avail * 100}% 100%`,
|
|
249
|
-
backgroundPosition: `${
|
|
257
|
+
backgroundPosition: `${i} center, right center, left center`,
|
|
250
258
|
backgroundRepeat: "no-repeat, no-repeat, no-repeat",
|
|
251
|
-
cursor:
|
|
259
|
+
cursor: l
|
|
252
260
|
};
|
|
253
261
|
}
|
|
254
262
|
return {
|
|
255
|
-
background:
|
|
256
|
-
cursor:
|
|
263
|
+
background: R(u, e, n),
|
|
264
|
+
cursor: l
|
|
257
265
|
};
|
|
258
266
|
},
|
|
259
|
-
onPointerDown:
|
|
260
|
-
onPointerEnter:
|
|
267
|
+
onPointerDown: h,
|
|
268
|
+
onPointerEnter: p
|
|
261
269
|
});
|
|
262
|
-
},
|
|
270
|
+
}, z = (t) => /* @__PURE__ */ g("input", {
|
|
263
271
|
type: "number",
|
|
264
272
|
className: "spotlab-hm-weight-input",
|
|
265
273
|
...t
|
|
266
|
-
}),
|
|
267
|
-
const a =
|
|
268
|
-
const
|
|
269
|
-
if (!
|
|
270
|
-
const
|
|
271
|
-
r((
|
|
274
|
+
}), tt = ({ value: t, color: e, passive: n, onChange: r }) => {
|
|
275
|
+
const a = $(null), o = $(!1), c = M((s) => {
|
|
276
|
+
const d = a.current;
|
|
277
|
+
if (!d) return;
|
|
278
|
+
const h = d.getBoundingClientRect();
|
|
279
|
+
r((s - h.left) / h.width * 100);
|
|
272
280
|
}, [r]);
|
|
273
|
-
return
|
|
274
|
-
const
|
|
275
|
-
o.current &&
|
|
276
|
-
},
|
|
277
|
-
return window.addEventListener("pointermove",
|
|
278
|
-
window.removeEventListener("pointermove",
|
|
281
|
+
return x(() => {
|
|
282
|
+
const s = (h) => {
|
|
283
|
+
o.current && c(h.clientX);
|
|
284
|
+
}, d = () => o.current = !1;
|
|
285
|
+
return window.addEventListener("pointermove", s), window.addEventListener("pointerup", d), () => {
|
|
286
|
+
window.removeEventListener("pointermove", s), window.removeEventListener("pointerup", d);
|
|
279
287
|
};
|
|
280
|
-
}, [
|
|
288
|
+
}, [c]), /* @__PURE__ */ g("div", {
|
|
281
289
|
ref: a,
|
|
282
290
|
role: "slider",
|
|
283
291
|
"aria-valuenow": t,
|
|
@@ -285,10 +293,10 @@ var y = (t, e, n) => {
|
|
|
285
293
|
"aria-valuemax": 100,
|
|
286
294
|
className: "spotlab-hm-slider-track",
|
|
287
295
|
style: { background: `linear-gradient(to right, ${e} 0 ${t}%, var(--spotlab-hm-track-bg) ${t}% 100%)` },
|
|
288
|
-
onPointerDown: (
|
|
289
|
-
o.current = !0, s
|
|
296
|
+
onPointerDown: (s) => {
|
|
297
|
+
o.current = !0, c(s.clientX);
|
|
290
298
|
},
|
|
291
|
-
children: /* @__PURE__ */
|
|
299
|
+
children: /* @__PURE__ */ g("div", {
|
|
292
300
|
className: "spotlab-hm-slider-thumb",
|
|
293
301
|
style: {
|
|
294
302
|
left: `${t}%`,
|
|
@@ -296,44 +304,44 @@ var y = (t, e, n) => {
|
|
|
296
304
|
}
|
|
297
305
|
})
|
|
298
306
|
});
|
|
299
|
-
},
|
|
307
|
+
}, et = (t, e) => /* @__PURE__ */ y("span", {
|
|
300
308
|
className: "spotlab-hm-slider-label",
|
|
301
|
-
children: [t.label, e && /* @__PURE__ */
|
|
309
|
+
children: [t.label, e && /* @__PURE__ */ g("span", {
|
|
302
310
|
className: "spotlab-hm-slider-remainder",
|
|
303
311
|
children: " · remainder"
|
|
304
312
|
})]
|
|
305
|
-
}),
|
|
306
|
-
const
|
|
307
|
-
a(
|
|
313
|
+
}), ht = ({ actions: t, order: e, weights: n, passive: r, onWeightsChange: a, renderActionLabel: o, renderActionExtra: c, components: s, className: d }) => {
|
|
314
|
+
const h = s?.WeightInput ?? z, p = (m, u) => {
|
|
315
|
+
a(J(n, m, u, r));
|
|
308
316
|
};
|
|
309
|
-
return /* @__PURE__ */
|
|
310
|
-
className: ["spotlab-hm-root spotlab-hm-sliders",
|
|
311
|
-
children: e.map((
|
|
312
|
-
const u = t[
|
|
313
|
-
return /* @__PURE__ */
|
|
317
|
+
return /* @__PURE__ */ g("div", {
|
|
318
|
+
className: ["spotlab-hm-root spotlab-hm-sliders", d].filter(Boolean).join(" "),
|
|
319
|
+
children: e.map((m) => {
|
|
320
|
+
const u = t[m], l = m === r;
|
|
321
|
+
return /* @__PURE__ */ y("div", {
|
|
314
322
|
className: "spotlab-hm-slider-row",
|
|
315
|
-
"data-passive":
|
|
316
|
-
children: [/* @__PURE__ */
|
|
323
|
+
"data-passive": l,
|
|
324
|
+
children: [/* @__PURE__ */ y("div", {
|
|
317
325
|
className: "spotlab-hm-slider-header",
|
|
318
326
|
children: [
|
|
319
|
-
/* @__PURE__ */
|
|
327
|
+
/* @__PURE__ */ g("span", {
|
|
320
328
|
className: "spotlab-hm-slider-swatch",
|
|
321
329
|
style: { background: u.color }
|
|
322
330
|
}),
|
|
323
|
-
o?.(u,
|
|
324
|
-
|
|
331
|
+
o?.(u, m, l) ?? et(u, l),
|
|
332
|
+
c?.(u, m)
|
|
325
333
|
]
|
|
326
|
-
}), /* @__PURE__ */
|
|
334
|
+
}), /* @__PURE__ */ y("div", {
|
|
327
335
|
className: "spotlab-hm-slider-track-row",
|
|
328
|
-
children: [/* @__PURE__ */
|
|
329
|
-
value: n[
|
|
336
|
+
children: [/* @__PURE__ */ g(tt, {
|
|
337
|
+
value: n[m],
|
|
330
338
|
color: u.color,
|
|
331
|
-
passive:
|
|
332
|
-
onChange: (
|
|
333
|
-
}), /* @__PURE__ */
|
|
334
|
-
value: n[
|
|
339
|
+
passive: l,
|
|
340
|
+
onChange: (i) => p(m, i)
|
|
341
|
+
}), /* @__PURE__ */ g(h, {
|
|
342
|
+
value: n[m],
|
|
335
343
|
"aria-label": `${u.label} weight`,
|
|
336
|
-
onChange: (
|
|
344
|
+
onChange: (i) => p(m, parseInt(i.target.value || "0", 10))
|
|
337
345
|
})]
|
|
338
346
|
})]
|
|
339
347
|
}, u.id);
|
|
@@ -341,16 +349,16 @@ var y = (t, e, n) => {
|
|
|
341
349
|
});
|
|
342
350
|
};
|
|
343
351
|
export {
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
352
|
+
ht as ActionWeightSliders,
|
|
353
|
+
_ as CELL_FILL_DIRECTION,
|
|
354
|
+
S as HandMatrix,
|
|
355
|
+
ot as RangeGrid,
|
|
356
|
+
ut as RangeMatrixEditor,
|
|
357
|
+
L as cellFillGradient,
|
|
358
|
+
st as cellsToComboWeights,
|
|
359
|
+
it as cellsToRanges,
|
|
360
|
+
ct as comboWeightsToCells,
|
|
361
|
+
J as rebalance,
|
|
362
|
+
lt as seedCells,
|
|
363
|
+
Z as useRangePainting
|
|
356
364
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@spotlab/hand-matrix",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.4.0",
|
|
4
4
|
"description": "A 13x13 poker hand-matrix React component: the read-only grid primitive and a range-string-aware display component, themed through CSS custom properties.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"license": "MIT",
|