mirror of
https://github.com/kuhyx/utils.git
synced 2026-11-10 22:07:15 +01:00
Krzysztof kuhy Rudnicki
03bf1ed08b
The web counterpart to design_system (Dart): one :root block of frozen tokens plus the components that were duplicated across repos. Extracted from dufs-cloud and awesome-mcp-explorer, which both now consume it. - tokens.css: the frozen palette, spacing/radius/type scales, shadow policy and focus ring, under the canonical variable names from unified-design-system. Also ships the global :focus-visible rule, rather than leaving each consumer to remember it. - RangeSlider: reconciled from the two drifted copies. Takes the accessible DOM from awesome-mcp-explorer (real <button> thumbs with role="slider" and the aria-value* trio) and grab-the-nearer-thumb from dufs-cloud. Keyboard support (arrows/PageUp/PageDown/Home/End) is new: both donors were pointer-only, which the design system rules out, and an arrow-key-deaf role="slider" is an ARIA role that lies. - quantile.ts + fuzzyMatch: the genuinely duplicated helpers. FilterBar is deliberately absent. The two same-named components share no structure -- a horizontal <select> strip over files vs a vertical tri-state chip sidebar over servers, with disjoint FilterState, props and sort keys. It is the name-collision-is-not-a-duplicate trap, so extracting it would ship a widget nobody imports. dist/ is committed (and un-ignored against the root rule) because Vite does not transpile dependencies; consumers stay at zero config. Consumed via pnpm's &path:/web_ui suffix -- npm cannot install from a subdirectory of a git repo. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01U4Rj3s7K2qzrLNgJqqPhno
79 lines
2.9 KiB
JavaScript
79 lines
2.9 KiB
JavaScript
/**
|
|
* Distribution-aware slider maths.
|
|
*
|
|
* A linear min..max track is useless on skewed data, which is the normal case
|
|
* in both consumers: dufs-cloud's file sizes span bytes to gigabytes, and
|
|
* awesome-mcp-explorer's star counts run 0..166,785 with a median of 8, so a
|
|
* linear midpoint sits above 99.9% of all rows. Mapping the track through the
|
|
* actual distribution puts the middle of the track at the median, which makes
|
|
* equal track distance mean roughly equal numbers of items.
|
|
*
|
|
* This was duplicated in dufs-cloud and awesome-mcp-explorer before it moved
|
|
* here; both now import it.
|
|
*/
|
|
/**
|
|
* Bounds-checked array access (callers guarantee the index is valid). Keeps the
|
|
* quantile helpers free of scattered non-null assertions or dead undefined
|
|
* guards while still satisfying `noUncheckedIndexedAccess`.
|
|
*/
|
|
export function nth(values, index) {
|
|
const value = values[index];
|
|
if (value === undefined) {
|
|
throw new RangeError(`index ${index} out of range`);
|
|
}
|
|
return value;
|
|
}
|
|
/** Clamp to the unit interval. */
|
|
export function clamp01(x) {
|
|
return Math.min(1, Math.max(0, x));
|
|
}
|
|
/**
|
|
* The value at quantile `f` (0..1) of an ascending, non-empty array, with linear
|
|
* interpolation between the two straddling samples. This is what makes the
|
|
* sliders distribution-aware: f = 0.5 returns the *median*, so the middle of the
|
|
* track sits where half the items are — not the arithmetic midpoint of the
|
|
* range. Empty input yields 0 (callers hide the slider in that case).
|
|
*/
|
|
export function quantileValue(sorted, f) {
|
|
const n = sorted.length;
|
|
if (n === 0)
|
|
return 0;
|
|
const pos = clamp01(f) * (n - 1);
|
|
const lo = Math.floor(pos);
|
|
const hi = Math.ceil(pos);
|
|
const a = nth(sorted, lo);
|
|
const b = nth(sorted, hi);
|
|
return Math.round(a + (b - a) * (pos - lo));
|
|
}
|
|
/**
|
|
* The quantile (0..1) of `value` within `sorted` — the inverse of
|
|
* {@link quantileValue}, used to place a thumb at the right spot on the track.
|
|
* Values at or beyond the ends map to 0/1.
|
|
*/
|
|
export function valueQuantile(sorted, value) {
|
|
const n = sorted.length;
|
|
if (n <= 1)
|
|
return 0;
|
|
if (value <= nth(sorted, 0))
|
|
return 0;
|
|
if (value >= nth(sorted, n - 1))
|
|
return 1;
|
|
// value strictly inside the range, so there is an index hi >= 1 with
|
|
// sorted[hi] >= value and sorted[hi - 1] < value.
|
|
const hi = sorted.findIndex((v) => v >= value);
|
|
const lo = hi - 1;
|
|
const a = nth(sorted, lo);
|
|
const b = nth(sorted, hi);
|
|
// a < value <= b here, so b - a > 0 (no divide-by-zero).
|
|
return (lo + (value - a) / (b - a)) / (n - 1);
|
|
}
|
|
/**
|
|
* Pointer x to a 0..1 fraction of a track.
|
|
*
|
|
* Extracted as pure geometry so slider behaviour is testable without layout,
|
|
* which jsdom does not implement.
|
|
*/
|
|
export function fractionFromPointer(rect, clientX) {
|
|
return rect.width === 0 ? 0 : clamp01((clientX - rect.left) / rect.width);
|
|
}
|
|
//# sourceMappingURL=quantile.js.map
|