@selectwin/kit 0.1.184 → 0.1.186
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/SelectHeatmap.d.ts +3 -0
- package/dist/index.js +17 -17
- package/dist/style.css +1 -1
- package/package.json +1 -1
package/dist/SelectHeatmap.d.ts
CHANGED
|
@@ -28,6 +28,9 @@ type SelectHeatmapOwnProps = {
|
|
|
28
28
|
* print money/percent INSIDE the cell read better at 40+ — from 40 up the value font
|
|
29
29
|
* scales up automatically. */
|
|
30
30
|
cellHeight?: number;
|
|
31
|
+
/** Print a column header only every N columns (the first, then every Nth). For dense axes like 24 hours, where
|
|
32
|
+
* every label side by side runs together ("10h11h12h"). The cell tooltip keeps the full column label. Default 1. */
|
|
33
|
+
columnLabelEvery?: number;
|
|
31
34
|
};
|
|
32
35
|
export type SelectHeatmapProps = SelectHeatmapOwnProps & Omit<ComponentPropsWithoutRef<'div'>, keyof SelectHeatmapOwnProps>;
|
|
33
36
|
export declare const SelectHeatmap: import('react').ForwardRefExoticComponent<SelectHeatmapOwnProps & Omit<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, keyof SelectHeatmapOwnProps> & import('react').RefAttributes<HTMLDivElement>>;
|
package/dist/index.js
CHANGED
|
@@ -15290,29 +15290,29 @@ var Xd = (e) => `${e.toLocaleString("pt-BR", { maximumFractionDigits: +(e < 10)
|
|
|
15290
15290
|
children: n
|
|
15291
15291
|
})]
|
|
15292
15292
|
});
|
|
15293
|
-
}), Qd = r(function({ columns: e, rows: n, format: r = Z, formatValue: i, color: a = "var(--select-chart-1)", showValues: o = !0, min: s, max: c, cellSize: l = 40, maxCellSize: u = 96, cellHeight: d = 30,
|
|
15294
|
-
let
|
|
15293
|
+
}), Qd = r(function({ columns: e, rows: n, format: r = Z, formatValue: i, color: a = "var(--select-chart-1)", showValues: o = !0, min: s, max: c, cellSize: l = 40, maxCellSize: u = 96, cellHeight: d = 30, columnLabelEvery: f = 1, className: p, ...m }, h) {
|
|
15294
|
+
let g = Q(), y = n.flatMap((e) => e.values).filter((e) => e != null && Number.isFinite(e)), b = s ?? (y.length ? Math.min(...y) : 0), x = (c ?? (y.length ? Math.max(...y) : 1)) - b || 1, S = { "--heat-color": a }, C = {
|
|
15295
15295
|
gridTemplateColumns: `minmax(56px, max-content) repeat(${e.length}, minmax(${l}px, ${Math.max(l, u)}px))`,
|
|
15296
15296
|
width: "fit-content",
|
|
15297
15297
|
maxWidth: "100%",
|
|
15298
15298
|
minWidth: 0
|
|
15299
|
-
},
|
|
15299
|
+
}, w = {
|
|
15300
15300
|
minHeight: d,
|
|
15301
15301
|
...d >= 40 ? { fontSize: "0.8125rem" } : null
|
|
15302
15302
|
};
|
|
15303
15303
|
return /* @__PURE__ */ v("div", {
|
|
15304
|
-
ref:
|
|
15305
|
-
...
|
|
15306
|
-
className: `select-chart-wrap select-heatmap${
|
|
15307
|
-
style:
|
|
15304
|
+
ref: h,
|
|
15305
|
+
...m,
|
|
15306
|
+
className: `select-chart-wrap select-heatmap${p ? " " + p : ""}`,
|
|
15307
|
+
style: S,
|
|
15308
15308
|
children: [/* @__PURE__ */ v("div", {
|
|
15309
15309
|
className: "select-heatmap__grid",
|
|
15310
|
-
style:
|
|
15310
|
+
style: C,
|
|
15311
15311
|
children: [
|
|
15312
15312
|
/* @__PURE__ */ _("div", { className: "select-heatmap__corner" }),
|
|
15313
|
-
e.map((e) => /* @__PURE__ */ _("div", {
|
|
15313
|
+
e.map((e, t) => /* @__PURE__ */ _("div", {
|
|
15314
15314
|
className: "select-heatmap__colhead",
|
|
15315
|
-
children: e
|
|
15315
|
+
children: t % Math.max(1, Math.floor(f)) === 0 ? e : null
|
|
15316
15316
|
}, e)),
|
|
15317
15317
|
n.map((n) => /* @__PURE__ */ v(t, { children: [/* @__PURE__ */ _("div", {
|
|
15318
15318
|
className: "select-heatmap__rowhead",
|
|
@@ -15321,19 +15321,19 @@ var Xd = (e) => `${e.toLocaleString("pt-BR", { maximumFractionDigits: +(e < 10)
|
|
|
15321
15321
|
let c = `${n.label}-${e[s] ?? s}`;
|
|
15322
15322
|
if (t == null || !Number.isFinite(t)) return /* @__PURE__ */ _("div", {
|
|
15323
15323
|
className: "select-heatmap__cell select-heatmap__cell--empty",
|
|
15324
|
-
style:
|
|
15324
|
+
style: w
|
|
15325
15325
|
}, c);
|
|
15326
|
-
let l = Math.max(0, Math.min(1, (t -
|
|
15326
|
+
let l = Math.max(0, Math.min(1, (t - b) / x)), u = Math.round((.14 + l * .86) * 100), d = Math.max(6, u - 16);
|
|
15327
15327
|
return /* @__PURE__ */ _("div", {
|
|
15328
15328
|
className: "select-heatmap__cell",
|
|
15329
15329
|
style: {
|
|
15330
|
-
...
|
|
15330
|
+
...w,
|
|
15331
15331
|
background: `linear-gradient(150deg, color-mix(in srgb, ${a} ${d}%, transparent), color-mix(in srgb, ${a} ${u}%, transparent))`,
|
|
15332
15332
|
color: l > .55 ? "#fff" : "var(--select-text)"
|
|
15333
15333
|
},
|
|
15334
15334
|
onMouseEnter: (o) => {
|
|
15335
15335
|
let c = o.currentTarget.getBoundingClientRect(), l = c.top < 72 ? "bottom" : "top";
|
|
15336
|
-
|
|
15336
|
+
g.show({
|
|
15337
15337
|
x: c.left + c.width / 2,
|
|
15338
15338
|
y: l === "bottom" ? c.bottom : c.top,
|
|
15339
15339
|
place: l,
|
|
@@ -15345,14 +15345,14 @@ var Xd = (e) => `${e.toLocaleString("pt-BR", { maximumFractionDigits: +(e < 10)
|
|
|
15345
15345
|
}]
|
|
15346
15346
|
});
|
|
15347
15347
|
},
|
|
15348
|
-
onMouseLeave:
|
|
15348
|
+
onMouseLeave: g.hide,
|
|
15349
15349
|
children: o ? r(t) : ""
|
|
15350
15350
|
}, c);
|
|
15351
15351
|
})] }, n.label))
|
|
15352
15352
|
]
|
|
15353
15353
|
}), /* @__PURE__ */ _(wd, {
|
|
15354
|
-
tip:
|
|
15355
|
-
onDismiss:
|
|
15354
|
+
tip: g.tip,
|
|
15355
|
+
onDismiss: g.hide
|
|
15356
15356
|
})]
|
|
15357
15357
|
});
|
|
15358
15358
|
}), $d = r(function({ tiles: e, color: t = "var(--select-chart-1)", tileSize: n = 36, gap: r = 5, format: i = (e) => String(e), legend: a = !0, className: o, style: s, ...c }, l) {
|