@rcarls/rc-range-slider 0.6.0 → 0.7.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/CHANGELOG.md +109 -0
- package/README.md +8 -0
- package/dist/custom-elements.json +83 -13
- package/dist/rc-range-slider-C_WJWoq9.js +449 -0
- package/dist/rc-range-slider-C_WJWoq9.js.map +1 -0
- package/dist/rc-range-slider-define.js +3 -1
- package/dist/rc-range-slider-define.js.map +1 -1
- package/dist/rc-range-slider.js +3 -2
- package/dist/types/packages/rc-range-slider/src/rc-range-slider.d.ts +51 -7
- package/package.json +2 -2
- package/dist/rc-range-slider-saGA_DoJ.js +0 -610
- package/dist/rc-range-slider-saGA_DoJ.js.map +0 -1
|
@@ -0,0 +1,449 @@
|
|
|
1
|
+
import { LitElement as T, css as z, nothing as u, html as m } from "lit";
|
|
2
|
+
import { property as o, state as k } from "lit/decorators.js";
|
|
3
|
+
import { MessagesController as C, FlowController as P, NativeChildController as A, numberFormat as L, renderedOrientation as $, getDirectChildren as S, snapToStep as _, valueToPercent as b, resolveFlow as I, physicalAxis as N, isReversed as E, arrowKeys as G } from "@rcarls/rc-common";
|
|
4
|
+
var D = Object.defineProperty, H = Object.getOwnPropertyDescriptor, l = (h, e, t, r) => {
|
|
5
|
+
for (var i = r > 1 ? void 0 : r ? H(e, t) : e, s = h.length - 1, a; s >= 0; s--)
|
|
6
|
+
(a = h[s]) && (i = (r ? a(e, t, i) : a(i)) || i);
|
|
7
|
+
return r && i && D(e, t, i), i;
|
|
8
|
+
};
|
|
9
|
+
const F = {
|
|
10
|
+
fromAttribute(h) {
|
|
11
|
+
return h === null ? null : h === "" || h === "float" ? "float" : h === "inline-start" ? "inline-start" : h === "inline-end" ? "inline-end" : null;
|
|
12
|
+
},
|
|
13
|
+
toAttribute(h) {
|
|
14
|
+
return h;
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
function v(h, e) {
|
|
18
|
+
if (h === "")
|
|
19
|
+
return e;
|
|
20
|
+
const t = parseFloat(h);
|
|
21
|
+
return isNaN(t) ? e : t;
|
|
22
|
+
}
|
|
23
|
+
const R = Object.freeze({
|
|
24
|
+
low: "Minimum",
|
|
25
|
+
high: "Maximum"
|
|
26
|
+
}), f = class f extends T {
|
|
27
|
+
constructor() {
|
|
28
|
+
super(...arguments), this.min = 0, this.max = 100, this.step = 1, this._valueInitialized = !1, this.disabled = !1, this.readonly = !1, this._messages = new C(
|
|
29
|
+
this,
|
|
30
|
+
"rc-range-slider",
|
|
31
|
+
R,
|
|
32
|
+
{
|
|
33
|
+
overrides: () => this.messages
|
|
34
|
+
}
|
|
35
|
+
), this.lowValueText = "", this.highValueText = "", this.display = null, this.orientation = "horizontal", this._flow = new P(this), this._lowValue = 0, this._highValue = 100, this._$lowInput = null, this._$highInput = null, this._dragThumb = null, this._dragPointerId = null, this._addedHostRole = !1, this._rangeInputController = new A(this, {
|
|
36
|
+
selector: ':scope > input[type="range"]',
|
|
37
|
+
observe: !0,
|
|
38
|
+
onChange: () => this._resetInputs(),
|
|
39
|
+
onMissing: () => {
|
|
40
|
+
}
|
|
41
|
+
}), this._onDefaultSlotChange = () => {
|
|
42
|
+
this._rangeInputController.sync(), this._resetInputs();
|
|
43
|
+
}, this._onLowInput = (e) => {
|
|
44
|
+
if (this.readonly) {
|
|
45
|
+
this._applyValueToInputs([this._lowValue, this._highValue]);
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
const t = e.currentTarget;
|
|
49
|
+
this._setCurrentValue([t.valueAsNumber, this._highValue]), this._dispatch("rc-range-slider-input", this.value);
|
|
50
|
+
}, this._onLowChange = (e) => {
|
|
51
|
+
if (this.readonly) {
|
|
52
|
+
this._applyValueToInputs([this._lowValue, this._highValue]);
|
|
53
|
+
return;
|
|
54
|
+
}
|
|
55
|
+
const t = e.currentTarget;
|
|
56
|
+
this._setCurrentValue([t.valueAsNumber, this._highValue]), this._dispatch("rc-range-slider-change", this.value);
|
|
57
|
+
}, this._onHighInput = (e) => {
|
|
58
|
+
if (this.readonly) {
|
|
59
|
+
this._applyValueToInputs([this._lowValue, this._highValue]);
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
const t = e.currentTarget;
|
|
63
|
+
this._setCurrentValue([this._lowValue, t.valueAsNumber]), this._dispatch("rc-range-slider-input", this.value);
|
|
64
|
+
}, this._onHighChange = (e) => {
|
|
65
|
+
if (this.readonly) {
|
|
66
|
+
this._applyValueToInputs([this._lowValue, this._highValue]);
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
const t = e.currentTarget;
|
|
70
|
+
this._setCurrentValue([this._lowValue, t.valueAsNumber]), this._dispatch("rc-range-slider-change", this.value);
|
|
71
|
+
}, this._onLowKeydown = (e) => {
|
|
72
|
+
this._handleThumbKeydown(e, "low");
|
|
73
|
+
}, this._onHighKeydown = (e) => {
|
|
74
|
+
this._handleThumbKeydown(e, "high");
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
get value() {
|
|
78
|
+
return this._value ?? this._defaultValue ?? this._nativeInputValue;
|
|
79
|
+
}
|
|
80
|
+
set value(e) {
|
|
81
|
+
const t = this._value;
|
|
82
|
+
this._value = this._normalizeValue(e), this._valueInitialized = !0, this._applyValueToInputs(this._value), this._value !== t && this.requestUpdate("value", t);
|
|
83
|
+
}
|
|
84
|
+
get defaultValue() {
|
|
85
|
+
return this._defaultValue;
|
|
86
|
+
}
|
|
87
|
+
set defaultValue(e) {
|
|
88
|
+
const t = this._defaultValue;
|
|
89
|
+
this._defaultValue = e === void 0 ? void 0 : this._normalizeValue(e), !this._valueInitialized && this._value === void 0 && this._defaultValue !== void 0 && (this._applyValueToInputs(this._defaultValue), this.requestUpdate("value", void 0)), this.requestUpdate("defaultValue", t);
|
|
90
|
+
}
|
|
91
|
+
connectedCallback() {
|
|
92
|
+
super.connectedCallback(), this._syncHostRole();
|
|
93
|
+
}
|
|
94
|
+
disconnectedCallback() {
|
|
95
|
+
this._unwireInputs(), this._restoreInputs(), this._addedHostRole && (this.removeAttribute("role"), this._addedHostRole = !1), super.disconnectedCallback();
|
|
96
|
+
}
|
|
97
|
+
updated() {
|
|
98
|
+
this._syncInputReflectors();
|
|
99
|
+
}
|
|
100
|
+
render() {
|
|
101
|
+
const e = this._$lowInput, t = this._$highInput;
|
|
102
|
+
if (!e || !t)
|
|
103
|
+
return u;
|
|
104
|
+
const r = L(this._messages.locale), i = this.lowValueText || r.format(this._lowValue), s = this.highValueText || r.format(this._highValue), a = m`
|
|
105
|
+
<span class="rc-range-slider-values" aria-hidden="true">
|
|
106
|
+
<span
|
|
107
|
+
part="value-display low-value-display"
|
|
108
|
+
class="rc-range-slider-value"
|
|
109
|
+
style=${this.display === "float" ? this._floatStyle(this._lowValue) : u}
|
|
110
|
+
><slot name="low-value-display">${i}</slot></span
|
|
111
|
+
>
|
|
112
|
+
<span
|
|
113
|
+
part="value-display high-value-display"
|
|
114
|
+
class="rc-range-slider-value"
|
|
115
|
+
style=${this.display === "float" ? this._floatStyle(this._highValue) : u}
|
|
116
|
+
><slot name="high-value-display">${s}</slot></span
|
|
117
|
+
>
|
|
118
|
+
</span>
|
|
119
|
+
`;
|
|
120
|
+
return m`
|
|
121
|
+
<div
|
|
122
|
+
part="root"
|
|
123
|
+
class="rc-range-slider-root"
|
|
124
|
+
data-display=${this.display ?? u}
|
|
125
|
+
data-orientation=${this.orientation}
|
|
126
|
+
>
|
|
127
|
+
${this.display === "inline-start" ? a : u}
|
|
128
|
+
|
|
129
|
+
<div
|
|
130
|
+
part="group"
|
|
131
|
+
class="rc-range-slider-group"
|
|
132
|
+
@pointerdown=${this._onGroupPointerDown}
|
|
133
|
+
@pointermove=${this._onGroupPointerMove}
|
|
134
|
+
@pointerup=${this._onGroupPointerUp}
|
|
135
|
+
@pointercancel=${this._onGroupPointerCancel}
|
|
136
|
+
>
|
|
137
|
+
<span part="track" class="rc-range-slider-track" aria-hidden="true">
|
|
138
|
+
<slot name="track-background"></slot>
|
|
139
|
+
<span part="range" class="rc-range-slider-range" style=${this._rangeStyle()}></span>
|
|
140
|
+
</span>
|
|
141
|
+
|
|
142
|
+
${this._renderThumb("low")} ${this._renderThumb("high")}
|
|
143
|
+
<slot @slotchange=${this._onDefaultSlotChange}></slot>
|
|
144
|
+
${this.display === "float" ? a : u}
|
|
145
|
+
</div>
|
|
146
|
+
|
|
147
|
+
${this.display === "inline-end" ? a : u}
|
|
148
|
+
</div>
|
|
149
|
+
`;
|
|
150
|
+
}
|
|
151
|
+
_renderThumb(e) {
|
|
152
|
+
const t = e === "low", r = t ? this._$lowInput : this._$highInput, i = t ? this._lowValue : this._highValue, s = t ? this.lowValueText : this.highValueText, a = this._thumbLabel(e), d = r?.getAttribute("aria-labelledby");
|
|
153
|
+
return m`
|
|
154
|
+
<span
|
|
155
|
+
part=${t ? "thumb low-thumb" : "thumb high-thumb"}
|
|
156
|
+
class="rc-range-slider-thumb"
|
|
157
|
+
data-thumb=${e}
|
|
158
|
+
role="slider"
|
|
159
|
+
tabindex=${this.disabled ? "-1" : "0"}
|
|
160
|
+
aria-label=${a ?? u}
|
|
161
|
+
aria-labelledby=${d ?? u}
|
|
162
|
+
aria-valuemin=${String(t ? this._min() : this._lowValue)}
|
|
163
|
+
aria-valuemax=${String(t ? this._highValue : this._max())}
|
|
164
|
+
aria-valuenow=${String(i)}
|
|
165
|
+
aria-valuetext=${s || u}
|
|
166
|
+
aria-orientation=${$(this.orientation, this._flow.flow)}
|
|
167
|
+
aria-disabled=${this.disabled ? "true" : u}
|
|
168
|
+
aria-readonly=${this.readonly ? "true" : u}
|
|
169
|
+
style=${this._thumbStyle(i)}
|
|
170
|
+
@keydown=${t ? this._onLowKeydown : this._onHighKeydown}
|
|
171
|
+
></span>
|
|
172
|
+
`;
|
|
173
|
+
}
|
|
174
|
+
/**
|
|
175
|
+
* Finds the first two child `<input type="range">` elements and wires them.
|
|
176
|
+
* Inputs remain in the DOM permanently as form/progressive-enhancement
|
|
177
|
+
* reflectors.
|
|
178
|
+
*/
|
|
179
|
+
_findInputs() {
|
|
180
|
+
const e = S(this, ':scope > input[type="range"]').slice(
|
|
181
|
+
0,
|
|
182
|
+
2
|
|
183
|
+
);
|
|
184
|
+
if (e.length < 2)
|
|
185
|
+
return;
|
|
186
|
+
const [t, r] = e;
|
|
187
|
+
!this.hasAttribute("disabled") && (t.disabled || r.disabled) && (this.disabled = !0), this._$lowInput = t, this._$highInput = r, this._applyInitialValueToInputs(t, r), this._wireInput(t, this._onLowInput, this._onLowChange), this._wireInput(r, this._onHighInput, this._onHighChange), this._syncInputReflectors();
|
|
188
|
+
}
|
|
189
|
+
_resetInputs() {
|
|
190
|
+
this._unwireInputs(), this._restoreInputs(), this._findInputs(), this.requestUpdate();
|
|
191
|
+
}
|
|
192
|
+
get _nativeInputValue() {
|
|
193
|
+
const e = this._$lowInput?.valueAsNumber, t = this._$highInput?.valueAsNumber;
|
|
194
|
+
return [
|
|
195
|
+
e === void 0 || isNaN(e) ? this.min : e,
|
|
196
|
+
t === void 0 || isNaN(t) ? this.max : t
|
|
197
|
+
];
|
|
198
|
+
}
|
|
199
|
+
_applyInitialValueToInputs(e, t) {
|
|
200
|
+
if (this._value !== void 0) {
|
|
201
|
+
this._applyValueToInputs(this._value);
|
|
202
|
+
return;
|
|
203
|
+
}
|
|
204
|
+
if (this._defaultValue !== void 0) {
|
|
205
|
+
this._applyValueToInputs(this._defaultValue);
|
|
206
|
+
return;
|
|
207
|
+
}
|
|
208
|
+
const r = e.valueAsNumber, i = t.valueAsNumber;
|
|
209
|
+
this._lowValue = isNaN(r) ? this._min() : r, this._highValue = isNaN(i) ? this._max() : i, this._defaultValue = this._normalizeValue([this._lowValue, this._highValue]), this._applyValueToInputs(this._defaultValue);
|
|
210
|
+
}
|
|
211
|
+
_applyValueToInputs(e) {
|
|
212
|
+
const [t, r] = this._normalizeValue(e);
|
|
213
|
+
this._lowValue = t, this._highValue = r, this._$lowInput && (this._$lowInput.value = String(t)), this._$highInput && (this._$highInput.value = String(r));
|
|
214
|
+
}
|
|
215
|
+
_setCurrentValue(e) {
|
|
216
|
+
const [t, r] = this._normalizeValue(e);
|
|
217
|
+
this._value = [t, r], this._valueInitialized = !0, this._applyValueToInputs(this._value), this.requestUpdate("value");
|
|
218
|
+
}
|
|
219
|
+
_wireInput(e, t, r) {
|
|
220
|
+
e.addEventListener("input", t), e.addEventListener("change", r);
|
|
221
|
+
}
|
|
222
|
+
_unwireInputs() {
|
|
223
|
+
this._$lowInput?.removeEventListener("input", this._onLowInput), this._$lowInput?.removeEventListener("change", this._onLowChange), this._$highInput?.removeEventListener("input", this._onHighInput), this._$highInput?.removeEventListener("change", this._onHighChange);
|
|
224
|
+
}
|
|
225
|
+
_restoreInputs() {
|
|
226
|
+
for (const e of [this._$lowInput, this._$highInput])
|
|
227
|
+
e?.removeAttribute("aria-hidden"), e?.removeAttribute("tabindex"), e?.removeAttribute("data-rc-range-slider-reflector"), e?.style.removeProperty("display");
|
|
228
|
+
}
|
|
229
|
+
_syncInputReflectors() {
|
|
230
|
+
const e = this._$lowInput, t = this._$highInput;
|
|
231
|
+
if (!(!e || !t))
|
|
232
|
+
for (const r of [e, t])
|
|
233
|
+
r.disabled = this.disabled, r.tabIndex = -1, r.setAttribute("aria-hidden", "true"), r.setAttribute("data-rc-range-slider-reflector", "");
|
|
234
|
+
}
|
|
235
|
+
_syncHostRole() {
|
|
236
|
+
this.hasAttribute("role") || (this.setAttribute("role", "group"), this._addedHostRole = !0);
|
|
237
|
+
}
|
|
238
|
+
_handleThumbKeydown(e, t) {
|
|
239
|
+
if (this.disabled || this.readonly)
|
|
240
|
+
return;
|
|
241
|
+
const r = this._min(), i = this._max(), s = this._step(), a = s * 10, d = this._lowValue, g = this._highValue, p = t === "low" ? d : g, y = t === "low" ? r : d, w = t === "low" ? g : i, V = this._valueKeys();
|
|
242
|
+
let c;
|
|
243
|
+
if (V.increase.includes(e.key))
|
|
244
|
+
c = p + s;
|
|
245
|
+
else if (V.decrease.includes(e.key))
|
|
246
|
+
c = p - s;
|
|
247
|
+
else
|
|
248
|
+
switch (e.key) {
|
|
249
|
+
case "PageUp":
|
|
250
|
+
c = p + a;
|
|
251
|
+
break;
|
|
252
|
+
case "PageDown":
|
|
253
|
+
c = p - a;
|
|
254
|
+
break;
|
|
255
|
+
case "Home":
|
|
256
|
+
c = y;
|
|
257
|
+
break;
|
|
258
|
+
case "End":
|
|
259
|
+
c = w;
|
|
260
|
+
break;
|
|
261
|
+
default:
|
|
262
|
+
return;
|
|
263
|
+
}
|
|
264
|
+
e.preventDefault();
|
|
265
|
+
const x = _(c, y, w, s);
|
|
266
|
+
x !== p && (this._setThumbValue(t, x), this._dispatch("rc-range-slider-input", this.value));
|
|
267
|
+
}
|
|
268
|
+
_onGroupPointerDown(e) {
|
|
269
|
+
if (this.disabled || this.readonly || e.button !== 0)
|
|
270
|
+
return;
|
|
271
|
+
const t = this._nearestThumb(e), r = this._$thumbElement(t);
|
|
272
|
+
this._dragThumb = t, this._dragPointerId = e.pointerId, e.preventDefault();
|
|
273
|
+
try {
|
|
274
|
+
e.currentTarget.setPointerCapture(e.pointerId);
|
|
275
|
+
} catch {
|
|
276
|
+
}
|
|
277
|
+
r?.focus(), this._setThumbValue(t, this._valueFromPointer(e, t)), this._dispatch("rc-range-slider-input", this.value);
|
|
278
|
+
}
|
|
279
|
+
_onGroupPointerMove(e) {
|
|
280
|
+
this._dragPointerId !== e.pointerId || this._dragThumb === null || (e.preventDefault(), this._setThumbValue(this._dragThumb, this._valueFromPointer(e, this._dragThumb)), this._dispatch("rc-range-slider-input", this.value));
|
|
281
|
+
}
|
|
282
|
+
_onGroupPointerUp(e) {
|
|
283
|
+
if (this._dragPointerId !== e.pointerId || this._dragThumb === null)
|
|
284
|
+
return;
|
|
285
|
+
const t = this._dragThumb;
|
|
286
|
+
this._dragThumb = null, this._dragPointerId = null;
|
|
287
|
+
try {
|
|
288
|
+
e.currentTarget.releasePointerCapture(e.pointerId);
|
|
289
|
+
} catch {
|
|
290
|
+
}
|
|
291
|
+
this._dispatch("rc-range-slider-change", this.value), this._$thumbElement(t)?.focus();
|
|
292
|
+
}
|
|
293
|
+
_onGroupPointerCancel(e) {
|
|
294
|
+
this._dragPointerId === e.pointerId && (this._dragThumb = null, this._dragPointerId = null);
|
|
295
|
+
}
|
|
296
|
+
_setThumbValue(e, t) {
|
|
297
|
+
if (e === "low") {
|
|
298
|
+
this._setCurrentValue([t, this._highValue]);
|
|
299
|
+
return;
|
|
300
|
+
}
|
|
301
|
+
this._setCurrentValue([this._lowValue, t]);
|
|
302
|
+
}
|
|
303
|
+
_valueFromPointer(e, t) {
|
|
304
|
+
const r = this._groupRect();
|
|
305
|
+
if (!r)
|
|
306
|
+
return t === "low" ? this._lowValue : this._highValue;
|
|
307
|
+
const i = t === "low" ? this._min() : this._lowValue, s = t === "low" ? this._highValue : this._max(), a = this._max() - this._min();
|
|
308
|
+
if (a <= 0)
|
|
309
|
+
return i;
|
|
310
|
+
const g = this._axisFraction(e, r) * a + this._min();
|
|
311
|
+
return _(g, i, s, this._step());
|
|
312
|
+
}
|
|
313
|
+
_nearestThumb(e) {
|
|
314
|
+
const t = this._valueFromPointer(e, "low"), r = Math.abs(t - this._lowValue), i = Math.abs(t - this._highValue);
|
|
315
|
+
return r === i ? t < this._lowValue ? "low" : "high" : r < i ? "low" : "high";
|
|
316
|
+
}
|
|
317
|
+
_rangeStyle() {
|
|
318
|
+
const e = b(this._lowValue, this._min(), this._max()), t = b(this._highValue, this._min(), this._max()), r = this._thumbCenterStyle(e), i = this._thumbCenterStyle(t);
|
|
319
|
+
return this.orientation === "vertical" ? [
|
|
320
|
+
`inset-block-start:${r}`,
|
|
321
|
+
`block-size:max(0px, calc(${i} - ${r}))`
|
|
322
|
+
].join(";") : [
|
|
323
|
+
`inset-inline-start:${r}`,
|
|
324
|
+
`inline-size:max(0px, calc(${i} - ${r}))`
|
|
325
|
+
].join(";");
|
|
326
|
+
}
|
|
327
|
+
_thumbStyle(e) {
|
|
328
|
+
const t = b(e, this._min(), this._max()), r = this._thumbCenterStyle(t);
|
|
329
|
+
return this.orientation === "vertical" ? `inset-block-start:${r};inset-inline-start:50%` : `inset-inline-start:${r};inset-block-start:50%`;
|
|
330
|
+
}
|
|
331
|
+
_thumbCenterStyle(e) {
|
|
332
|
+
const t = (1 - e * 2).toFixed(4);
|
|
333
|
+
return `calc(${(e * 100).toFixed(3)}% + ${t} * var(--rc-thumb-radius, 9px))`;
|
|
334
|
+
}
|
|
335
|
+
_floatStyle(e) {
|
|
336
|
+
const t = b(e, this._min(), this._max()), r = this._thumbCenterStyle(t);
|
|
337
|
+
return this.orientation === "vertical" ? `inset-block-start:${r}` : `inset-inline-start:${r}`;
|
|
338
|
+
}
|
|
339
|
+
/**
|
|
340
|
+
* How far along the layout axis a pointer is, 0 at its logical start.
|
|
341
|
+
* Horizontal layout uses the inline axis; vertical layout uses block.
|
|
342
|
+
*/
|
|
343
|
+
_axisFraction(e, t) {
|
|
344
|
+
const r = I(this), i = this.orientation === "horizontal" ? "inline" : "block", a = N(i, r) === "x" ? (e.clientX - t.left) / t.width : (e.clientY - t.top) / t.height;
|
|
345
|
+
return E(i, r) ? 1 - a : a;
|
|
346
|
+
}
|
|
347
|
+
/**
|
|
348
|
+
* The arrow keys that raise and lower the value, matching a native range
|
|
349
|
+
* input. The keys along the rendered track move the thumb the way it moves
|
|
350
|
+
* on screen. The cross-axis keys keep the native range convention: Up or
|
|
351
|
+
* Right raises the value.
|
|
352
|
+
*/
|
|
353
|
+
_valueKeys() {
|
|
354
|
+
const e = I(this), t = $(this.orientation, e), { next: r, prev: i } = G(t, e);
|
|
355
|
+
return {
|
|
356
|
+
increase: [r, t === "horizontal" ? "ArrowUp" : "ArrowRight"],
|
|
357
|
+
decrease: [i, t === "horizontal" ? "ArrowDown" : "ArrowLeft"]
|
|
358
|
+
};
|
|
359
|
+
}
|
|
360
|
+
_normalizeValue([e, t]) {
|
|
361
|
+
const r = this._min(), i = this._max(), s = _(e, r, i, this._step()), a = _(t, r, i, this._step());
|
|
362
|
+
return [Math.min(s, a), Math.max(s, a)];
|
|
363
|
+
}
|
|
364
|
+
_min() {
|
|
365
|
+
return v(this._$lowInput?.min ?? "", this.min);
|
|
366
|
+
}
|
|
367
|
+
_max() {
|
|
368
|
+
return v(this._$highInput?.max ?? "", this.max);
|
|
369
|
+
}
|
|
370
|
+
_step() {
|
|
371
|
+
return v(this._$lowInput?.step ?? "", this.step);
|
|
372
|
+
}
|
|
373
|
+
_groupRect() {
|
|
374
|
+
return this.shadowRoot?.querySelector(".rc-range-slider-group")?.getBoundingClientRect() ?? null;
|
|
375
|
+
}
|
|
376
|
+
_$thumbElement(e) {
|
|
377
|
+
return this.shadowRoot?.querySelector(`[data-thumb="${e}"]`) ?? null;
|
|
378
|
+
}
|
|
379
|
+
_thumbLabel(e) {
|
|
380
|
+
const t = e === "low" ? this._$lowInput : this._$highInput, r = this._messages.value, i = e === "low" ? this.lowLabel ?? r.low : this.highLabel ?? r.high, s = t?.getAttribute("aria-label");
|
|
381
|
+
if (s)
|
|
382
|
+
return s;
|
|
383
|
+
const a = t?.labels?.[0]?.textContent?.trim();
|
|
384
|
+
return a || i || null;
|
|
385
|
+
}
|
|
386
|
+
_dispatch(e, t) {
|
|
387
|
+
const r = {
|
|
388
|
+
bubbles: !0,
|
|
389
|
+
composed: !0,
|
|
390
|
+
detail: { value: t }
|
|
391
|
+
};
|
|
392
|
+
e === "rc-range-slider-input" ? this.dispatchEvent(new CustomEvent("rc-range-slider-input", r)) : this.dispatchEvent(new CustomEvent("rc-range-slider-change", r));
|
|
393
|
+
}
|
|
394
|
+
};
|
|
395
|
+
f.styles = z`:host{--rc-range-slider-accent:var(--rc-accent,Highlight);--rc-range-slider-track-background:color-mix(in srgb, CanvasText 25%, Canvas);--rc-range-slider-range-background:var(--rc-range-slider-accent);--rc-range-slider-thumb-background:ButtonFace;--rc-range-slider-thumb-border:var(--rc-range-slider-accent);--rc-range-slider-thumb-hover-background:var(--rc-range-slider-accent);--rc-range-slider-thumb-hover-border:var(--rc-range-slider-accent);--rc-range-slider-thumb-active-background:var(--rc-range-slider-accent);--rc-range-slider-thumb-active-border:var(--rc-range-slider-accent);--rc-range-slider-focus-outline:var(--rc-range-slider-accent);font-family:var(--rc-font-family,inherit);font-size:var(--rc-font-size,inherit);line-height:var(--rc-line-height,normal);display:block}:host([disabled]){--rc-range-slider-accent:GrayText;--rc-range-slider-track-background:color-mix(in srgb, GrayText 35%, Canvas);--rc-range-slider-range-background:GrayText;--rc-range-slider-thumb-border:GrayText;--rc-range-slider-thumb-hover-background:ButtonFace;--rc-range-slider-thumb-hover-border:GrayText;--rc-range-slider-thumb-active-background:ButtonFace;--rc-range-slider-thumb-active-border:GrayText;--rc-range-slider-focus-outline:GrayText}.rc-range-slider-root{gap:var(--rc-range-slider-gap,var(--rc-control-gap,.5rem));align-items:center;display:grid}.rc-range-slider-root[data-display=inline-start]{grid-template-columns:auto minmax(0,1fr)}.rc-range-slider-root[data-display=inline-end]{grid-template-columns:minmax(0,1fr) auto}.rc-range-slider-group{min-width:0;min-height:var(--rc-range-slider-control-size,var(--rc-control-block-size,1.5rem));touch-action:none;display:block;position:relative}.rc-range-slider-track,.rc-range-slider-range{pointer-events:none;position:absolute}.rc-range-slider-track{inset-inline:0;inset-block:calc(50% - var(--rc-range-slider-track-size,.1875rem) / 2);block-size:var(--rc-range-slider-track-size,.1875rem);background:var(--rc-range-slider-track-background);border-radius:var(--rc-range-slider-track-radius,var(--rc-control-radius,0));z-index:0;overflow:hidden}::slotted([slot=track-background]){pointer-events:none;position:absolute;inset:0}.rc-range-slider-range{background:var(--rc-range-slider-range-background);border-radius:inherit;z-index:1;inset-block:0}.rc-range-slider-thumb{z-index:2;inline-size:var(--rc-range-slider-thumb-size,1.125rem);block-size:var(--rc-range-slider-thumb-size,1.125rem);background:var(--rc-range-slider-thumb-background);border:2px solid var(--rc-range-slider-thumb-border);box-sizing:border-box;cursor:grab;transition:background-color .12s ease, border-color .12s ease, box-shadow .12s ease, transform var(--rc-motion-duration,.12s) ease;border-radius:50%;margin-block-start:calc(var(--rc-range-slider-thumb-size,1.125rem) / -2);margin-inline-start:calc(var(--rc-range-slider-thumb-size,1.125rem) / -2);position:absolute}.rc-range-slider-thumb:focus-visible{outline:var(--rc-focus-ring,2px solid var(--rc-range-slider-focus-outline));outline-offset:var(--rc-focus-ring-offset,2px)}:host(:not([disabled]):not([readonly])) .rc-range-slider-thumb:hover{background:var(--rc-range-slider-thumb-hover-background);border-color:var(--rc-range-slider-thumb-hover-border);box-shadow:0 0 0 .25rem color-mix(in srgb, var(--rc-range-slider-accent) 20%, transparent)}:host(:not([disabled]):not([readonly])) .rc-range-slider-thumb:active{background:var(--rc-range-slider-thumb-active-background);border-color:var(--rc-range-slider-thumb-active-border);box-shadow:0 0 0 .35rem color-mix(in srgb, var(--rc-range-slider-accent) 28%, transparent);cursor:grabbing}:host(:not([disabled]):not([readonly])) .rc-range-slider-group:hover .rc-range-slider-track{background:color-mix(in srgb, var(--rc-range-slider-track-background) 70%, CanvasText)}.rc-range-slider-thumb[aria-disabled=true],.rc-range-slider-thumb[aria-readonly=true]{cursor:default}:host([disabled]) .rc-range-slider-root{opacity:.65}::slotted(input[type=range]){clip-path:inset(50%);opacity:0;pointer-events:none;border:0;block-size:1px;inline-size:1px;margin:0;padding:0;position:absolute;overflow:hidden}.rc-range-slider-values{pointer-events:none;font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--rc-range-slider-value-color,var(--rc-text-disabled,GrayText))}.rc-range-slider-root[data-display=float] .rc-range-slider-values{z-index:5;position:absolute;inset:0}.rc-range-slider-root[data-display=float] .rc-range-slider-value{justify-content:center;inline-size:0;display:flex;position:absolute;inset-block-start:var(--rc-range-slider-float-value-block-offset,-1.4em)}.rc-range-slider-root[data-display=inline-start] .rc-range-slider-values,.rc-range-slider-root[data-display=inline-end] .rc-range-slider-values{align-items:center;gap:.25em;display:flex}.rc-range-slider-root[data-display=inline-start] .rc-range-slider-value:first-child:after,.rc-range-slider-root[data-display=inline-end] .rc-range-slider-value:first-child:after{content:" -"}:host([orientation=vertical]){display:inline-block}:host([orientation=vertical]) .rc-range-slider-group{inline-size:var(--rc-range-slider-control-size,var(--rc-control-block-size,1.5rem));block-size:var(--rc-range-slider-vertical-size,12.5rem)}:host([orientation=vertical]) .rc-range-slider-track{inset-block:0;inset-inline:calc(50% - var(--rc-range-slider-track-size,.1875rem) / 2);inline-size:var(--rc-range-slider-track-size,.1875rem);block-size:auto}:host([orientation=vertical]) .rc-range-slider-range{inset-block:auto;inset-inline:0}:host([orientation=vertical]) .rc-range-slider-thumb{inset-inline-start:50%}:host([orientation=vertical]) .rc-range-slider-root[data-display=float] .rc-range-slider-value{flex-direction:column;block-size:0;inline-size:auto;inset-block-start:auto;inset-inline-start:var(--rc-range-slider-float-value-inline-offset,calc(100% + .5rem))}`;
|
|
396
|
+
let n = f;
|
|
397
|
+
l([
|
|
398
|
+
o({ type: Number })
|
|
399
|
+
], n.prototype, "min", 2);
|
|
400
|
+
l([
|
|
401
|
+
o({ type: Number })
|
|
402
|
+
], n.prototype, "max", 2);
|
|
403
|
+
l([
|
|
404
|
+
o({ type: Number })
|
|
405
|
+
], n.prototype, "step", 2);
|
|
406
|
+
l([
|
|
407
|
+
o({ attribute: !1 })
|
|
408
|
+
], n.prototype, "value", 1);
|
|
409
|
+
l([
|
|
410
|
+
o({ attribute: !1 })
|
|
411
|
+
], n.prototype, "defaultValue", 1);
|
|
412
|
+
l([
|
|
413
|
+
o({ type: Boolean, reflect: !0 })
|
|
414
|
+
], n.prototype, "disabled", 2);
|
|
415
|
+
l([
|
|
416
|
+
o({ type: Boolean, reflect: !0 })
|
|
417
|
+
], n.prototype, "readonly", 2);
|
|
418
|
+
l([
|
|
419
|
+
o({ attribute: !1 })
|
|
420
|
+
], n.prototype, "messages", 2);
|
|
421
|
+
l([
|
|
422
|
+
o({ attribute: "low-label" })
|
|
423
|
+
], n.prototype, "lowLabel", 2);
|
|
424
|
+
l([
|
|
425
|
+
o({ attribute: "high-label" })
|
|
426
|
+
], n.prototype, "highLabel", 2);
|
|
427
|
+
l([
|
|
428
|
+
o({ attribute: "low-value-text" })
|
|
429
|
+
], n.prototype, "lowValueText", 2);
|
|
430
|
+
l([
|
|
431
|
+
o({ attribute: "high-value-text" })
|
|
432
|
+
], n.prototype, "highValueText", 2);
|
|
433
|
+
l([
|
|
434
|
+
o({ reflect: !0, converter: F })
|
|
435
|
+
], n.prototype, "display", 2);
|
|
436
|
+
l([
|
|
437
|
+
o({ reflect: !0 })
|
|
438
|
+
], n.prototype, "orientation", 2);
|
|
439
|
+
l([
|
|
440
|
+
k()
|
|
441
|
+
], n.prototype, "_lowValue", 2);
|
|
442
|
+
l([
|
|
443
|
+
k()
|
|
444
|
+
], n.prototype, "_highValue", 2);
|
|
445
|
+
export {
|
|
446
|
+
R as D,
|
|
447
|
+
n as R
|
|
448
|
+
};
|
|
449
|
+
//# sourceMappingURL=rc-range-slider-C_WJWoq9.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"rc-range-slider-C_WJWoq9.js","sources":["../src/rc-range-slider.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport type { ComplexAttributeConverter } from 'lit';\nimport { property, state } from 'lit/decorators.js';\n\nimport {\n FlowController,\n MessagesController,\n NativeChildController,\n arrowKeys,\n getDirectChildren,\n isReversed,\n numberFormat,\n physicalAxis,\n renderedOrientation,\n resolveFlow,\n snapToStep,\n valueToPercent,\n warnMissingDirectChild,\n} from '@rcarls/rc-common';\n\nexport interface RCRangeSliderValueEvent {\n /** Current [low, high] value tuple. */\n value: [number, number];\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-range-slider': RCRangeSlider;\n }\n\n interface HTMLElementEventMap {\n 'rc-range-slider-input': CustomEvent<RCRangeSliderValueEvent>;\n 'rc-range-slider-change': CustomEvent<RCRangeSliderValueEvent>;\n }\n}\n\ntype DisplayValue = 'float' | 'inline-start' | 'inline-end' | null;\ntype RangeThumb = 'low' | 'high';\n\n/**\n * Normalises the `display` attribute.\n * A bare boolean attribute (`display` with no value) maps to `'float'` so\n * the reflected attribute is always an explicit string, never an empty string.\n */\nconst displayConverter: ComplexAttributeConverter<DisplayValue> = {\n fromAttribute(v: string | null): DisplayValue {\n if (v === null) {\n return null;\n }\n\n if (v === '' || v === 'float') {\n return 'float';\n }\n\n if (v === 'inline-start') {\n return 'inline-start';\n }\n\n if (v === 'inline-end') {\n return 'inline-end';\n }\n\n return null;\n },\n toAttribute(v: DisplayValue): string | null {\n return v;\n },\n};\n\n/**\n * Returns the numeric value of a range input's `min`, `max`, or `step`\n * attribute string, falling back to `defaultVal` when the attribute is absent\n * (empty string) or not a valid number.\n */\nfunction parseAttr(s: string, defaultVal: number): number {\n if (s === '') {\n return defaultVal;\n }\n\n const n = parseFloat(s);\n\n return isNaN(n) ? defaultVal : n;\n}\n\n/** Built-in text of `rc-range-slider`. */\nexport interface RCRangeSliderMessages {\n /** Default name of the low thumb, when neither its input nor `low-label` names it. */\n low: string;\n /** Default name of the high thumb, when neither its input nor `high-label` names it. */\n high: string;\n}\n\nexport const DEFAULT_RANGE_SLIDER_MESSAGES: Readonly<RCRangeSliderMessages> = Object.freeze({\n low: 'Minimum',\n high: 'Maximum',\n});\n\ndeclare module '@rcarls/rc-common' {\n interface RcMessageCatalog {\n 'rc-range-slider': RCRangeSliderMessages;\n }\n}\n\n/**\n * Two-thumb range slider backed by native range inputs for min/max values, following the\n * WAI-ARIA Multi-Thumb Slider pattern.\n *\n * Consumers provide two direct child `<input type=\"range\">` elements. Before\n * upgrade, those inputs are the usable progressive-enhancement fallback. After\n * upgrade, the inputs remain in light DOM as hidden form reflectors while the\n * shadow thumbs become the focusable, accessible interaction surface.\n *\n * Form participation is handled natively by each input's `name` attribute.\n *\n * Built-in text (the default thumb names) follows the element's own `lang`, else\n * `<html lang>`: per element through `messages`, or for every instance\n * through `registerMessages()` from `@rcarls/rc-common` under `rc-range-slider`.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-range-slider rc-range-slider docs}\n * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/slider-multithumb/ WAI-ARIA Multi-Thumb Slider pattern}\n *\n * @slot - Consumer-provided native range inputs.\n * @slot track-background - Optional decorative content rendered inside the track before the selected range fill.\n * @slot low-value-display - Optional replacement for the low value text.\n * @slot high-value-display - Optional replacement for the high value text.\n *\n * @fires rc-range-slider-input - Fires while either thumb moves. Detail: `{ value }`.\n * @fires rc-range-slider-change - Fires when a thumb commits a new value. Detail: `{ value }`.\n *\n * @attr min - Minimum slider value.\n * @attr max - Maximum slider value.\n * @attr step - Slider step.\n * @attr disabled - Disables both thumbs and their hidden native input reflectors.\n * @attr readonly - Prevents edits while preserving normal focus and display.\n * @attr low-label - Accessible label for the low (min) thumb when the input does not provide one.\n * Defaults to the `low` message.\n * @attr high-label - Accessible label for the high (max) thumb when the input does not provide\n * one. Defaults to the `high` message.\n * @attr low-value-text - Formatted screen-reader text for the low value. Falls back to the raw\n * number.\n * @attr high-value-text - Formatted screen-reader text for the high value. Falls back to the raw\n * number.\n * @attr display - Controls the live value display: absent (none), `float`, `inline-start`, or\n * `inline-end`.\n * @attr orientation - `horizontal` runs along the inline axis like a native range input: right to\n * left in RTL, and vertical in vertical text, where the thumbs report `aria-orientation` of\n * `vertical`. `vertical` runs along the block axis, so it renders horizontally in vertical text.\n *\n * @cssprop [--rc-range-slider-accent=Highlight] - Accent color for selected range, thumb border, focus, hover, and active states.\n * @cssprop [--rc-range-slider-gap=var(--rc-control-gap)] - Gap between track and inline value display.\n * @cssprop [--rc-range-slider-control-size=var(--rc-control-block-size)] - Track hit-area block size.\n * @cssprop [--rc-range-slider-vertical-size=12.5rem] - Track length when `orientation=\"vertical\"`.\n * @cssprop [--rc-range-slider-track-size=0.1875rem] - Visual track thickness.\n * @cssprop [--rc-range-slider-track-background=color-mix(in srgb, CanvasText 25%, Canvas)] - Unselected track color.\n * @cssprop [--rc-range-slider-track-radius=var(--rc-control-radius)] - Track border radius.\n * @cssprop [--rc-range-slider-range-background] - Filled selected-range color. Defaults to\n * `--rc-range-slider-accent` (`GrayText` when `disabled`).\n * @cssprop [--rc-range-slider-thumb-background=ButtonFace] - Thumb background color.\n * @cssprop [--rc-range-slider-thumb-border=var(--rc-range-slider-accent)] - Thumb border color.\n * @cssprop [--rc-range-slider-thumb-size=1.125rem] - Visual thumb inline/block size.\n * @cssprop [--rc-range-slider-thumb-hover-background] - Thumb background on hover. Defaults to\n * `--rc-range-slider-accent` (`ButtonFace` when `disabled`).\n * @cssprop [--rc-range-slider-thumb-hover-border] - Thumb border color on hover. Defaults to\n * `--rc-range-slider-accent` (`GrayText` when `disabled`).\n * @cssprop [--rc-range-slider-thumb-active-background] - Thumb background while pressed. Defaults\n * to `--rc-range-slider-accent` (`ButtonFace` when `disabled`).\n * @cssprop [--rc-range-slider-thumb-active-border] - Thumb border color while pressed. Defaults to\n * `--rc-range-slider-accent` (`GrayText` when `disabled`).\n * @cssprop [--rc-range-slider-focus-outline] - Thumb focus ring color. Defaults to\n * `--rc-range-slider-accent` (`GrayText` when `disabled`).\n * @cssprop [--rc-range-slider-value-color=var(--rc-text-disabled)] - Value display text color.\n * @cssprop [--rc-thumb-radius=9px] - Half the thumb width; used to align float value displays and range fill.\n * @cssprop [--rc-range-slider-float-value-block-offset=-1.4em] - Block-axis offset for horizontal float value displays.\n * @cssprop [--rc-range-slider-float-value-inline-offset=calc(100% + 0.5rem)] - Inline-axis offset for vertical float value displays.\n *\n * @csspart root - Root layout wrapper.\n * @csspart group - Slider group wrapper.\n * @csspart track - Visual slider track.\n * @csspart range - Filled selected range segment.\n * @csspart thumb - Shared custom slider thumb.\n * @csspart low-thumb - Low-value custom slider thumb.\n * @csspart high-thumb - High-value custom slider thumb.\n * @csspart value-display - Shared rendered value text.\n * @csspart low-value-display - Rendered low value text.\n * @csspart high-value-display - Rendered high value text.\n */\nexport class RCRangeSlider extends LitElement {\n static override styles = css`\n :host {\n --rc-range-slider-accent: var(--rc-accent, Highlight);\n --rc-range-slider-track-background: color-mix(in srgb, CanvasText 25%, Canvas);\n --rc-range-slider-range-background: var(--rc-range-slider-accent);\n --rc-range-slider-thumb-background: ButtonFace;\n --rc-range-slider-thumb-border: var(--rc-range-slider-accent);\n --rc-range-slider-thumb-hover-background: var(--rc-range-slider-accent);\n --rc-range-slider-thumb-hover-border: var(--rc-range-slider-accent);\n --rc-range-slider-thumb-active-background: var(--rc-range-slider-accent);\n --rc-range-slider-thumb-active-border: var(--rc-range-slider-accent);\n --rc-range-slider-focus-outline: var(--rc-range-slider-accent);\n display: block;\n font-family: var(--rc-font-family, inherit);\n font-size: var(--rc-font-size, inherit);\n line-height: var(--rc-line-height, normal);\n }\n\n :host([disabled]) {\n --rc-range-slider-accent: GrayText;\n --rc-range-slider-track-background: color-mix(in srgb, GrayText 35%, Canvas);\n --rc-range-slider-range-background: GrayText;\n --rc-range-slider-thumb-border: GrayText;\n --rc-range-slider-thumb-hover-background: ButtonFace;\n --rc-range-slider-thumb-hover-border: GrayText;\n --rc-range-slider-thumb-active-background: ButtonFace;\n --rc-range-slider-thumb-active-border: GrayText;\n --rc-range-slider-focus-outline: GrayText;\n }\n\n .rc-range-slider-root {\n display: grid;\n gap: var(--rc-range-slider-gap, var(--rc-control-gap, 0.5rem));\n align-items: center;\n }\n\n .rc-range-slider-root[data-display='inline-start'] {\n grid-template-columns: auto minmax(0, 1fr);\n }\n\n .rc-range-slider-root[data-display='inline-end'] {\n grid-template-columns: minmax(0, 1fr) auto;\n }\n\n .rc-range-slider-group {\n position: relative;\n display: block;\n min-width: 0;\n min-height: var(--rc-range-slider-control-size, var(--rc-control-block-size, 1.5rem));\n touch-action: none;\n }\n\n .rc-range-slider-track,\n .rc-range-slider-range {\n position: absolute;\n pointer-events: none;\n }\n\n .rc-range-slider-track {\n inset-inline: 0;\n inset-block: calc(50% - var(--rc-range-slider-track-size, 0.1875rem) / 2);\n block-size: var(--rc-range-slider-track-size, 0.1875rem);\n background: var(--rc-range-slider-track-background);\n border-radius: var(--rc-range-slider-track-radius, var(--rc-control-radius, 0));\n overflow: hidden;\n z-index: 0;\n }\n\n ::slotted([slot='track-background']) {\n position: absolute;\n inset: 0;\n pointer-events: none;\n }\n\n .rc-range-slider-range {\n inset-block: 0;\n background: var(--rc-range-slider-range-background);\n border-radius: inherit;\n z-index: 1;\n }\n\n .rc-range-slider-thumb {\n position: absolute;\n z-index: 2;\n inline-size: var(--rc-range-slider-thumb-size, 1.125rem);\n block-size: var(--rc-range-slider-thumb-size, 1.125rem);\n background: var(--rc-range-slider-thumb-background);\n border: 2px solid var(--rc-range-slider-thumb-border);\n border-radius: 50%;\n box-sizing: border-box;\n cursor: grab;\n /* Centered on its point with logical margins, which follow RTL and\n vertical text where a fixed translate would not. */\n margin-inline-start: calc(var(--rc-range-slider-thumb-size, 1.125rem) / -2);\n margin-block-start: calc(var(--rc-range-slider-thumb-size, 1.125rem) / -2);\n transition:\n background-color 120ms ease,\n border-color 120ms ease,\n box-shadow 120ms ease,\n transform var(--rc-motion-duration, 120ms) ease;\n }\n\n .rc-range-slider-thumb:focus-visible {\n outline: var(--rc-focus-ring, 2px solid var(--rc-range-slider-focus-outline));\n outline-offset: var(--rc-focus-ring-offset, 2px);\n }\n\n :host(:not([disabled]):not([readonly])) .rc-range-slider-thumb:hover {\n background: var(--rc-range-slider-thumb-hover-background);\n border-color: var(--rc-range-slider-thumb-hover-border);\n box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--rc-range-slider-accent) 20%, transparent);\n }\n\n :host(:not([disabled]):not([readonly])) .rc-range-slider-thumb:active {\n background: var(--rc-range-slider-thumb-active-background);\n border-color: var(--rc-range-slider-thumb-active-border);\n box-shadow: 0 0 0 0.35rem color-mix(in srgb, var(--rc-range-slider-accent) 28%, transparent);\n cursor: grabbing;\n }\n\n :host(:not([disabled]):not([readonly])) .rc-range-slider-group:hover .rc-range-slider-track {\n background: color-mix(in srgb, var(--rc-range-slider-track-background) 70%, CanvasText);\n }\n\n .rc-range-slider-thumb[aria-disabled='true'],\n .rc-range-slider-thumb[aria-readonly='true'] {\n cursor: default;\n }\n\n :host([disabled]) .rc-range-slider-root {\n opacity: 0.65;\n }\n\n ::slotted(input[type='range']) {\n position: absolute;\n inline-size: 1px;\n block-size: 1px;\n margin: 0;\n padding: 0;\n border: 0;\n clip-path: inset(50%);\n opacity: 0;\n overflow: hidden;\n pointer-events: none;\n }\n\n .rc-range-slider-values {\n pointer-events: none;\n font-variant-numeric: tabular-nums;\n white-space: nowrap;\n color: var(--rc-range-slider-value-color, var(--rc-text-disabled, GrayText));\n }\n\n .rc-range-slider-root[data-display='float'] .rc-range-slider-values {\n position: absolute;\n inset: 0;\n z-index: 5;\n }\n\n .rc-range-slider-root[data-display='float'] .rc-range-slider-value {\n position: absolute;\n inset-block-start: var(--rc-range-slider-float-value-block-offset, -1.4em);\n display: flex;\n inline-size: 0;\n justify-content: center;\n }\n\n .rc-range-slider-root[data-display='inline-start'] .rc-range-slider-values,\n .rc-range-slider-root[data-display='inline-end'] .rc-range-slider-values {\n display: flex;\n gap: 0.25em;\n align-items: center;\n }\n\n .rc-range-slider-root[data-display='inline-start'] .rc-range-slider-value:first-child::after,\n .rc-range-slider-root[data-display='inline-end'] .rc-range-slider-value:first-child::after {\n content: ' -';\n }\n\n :host([orientation='vertical']) {\n display: inline-block;\n }\n\n :host([orientation='vertical']) .rc-range-slider-group {\n inline-size: var(--rc-range-slider-control-size, var(--rc-control-block-size, 1.5rem));\n block-size: var(--rc-range-slider-vertical-size, 12.5rem);\n }\n\n :host([orientation='vertical']) .rc-range-slider-track {\n inset-block: 0;\n inset-inline: calc(50% - var(--rc-range-slider-track-size, 0.1875rem) / 2);\n inline-size: var(--rc-range-slider-track-size, 0.1875rem);\n block-size: auto;\n }\n\n :host([orientation='vertical']) .rc-range-slider-range {\n inset-inline: 0;\n inset-block: auto;\n }\n\n :host([orientation='vertical']) .rc-range-slider-thumb {\n inset-inline-start: 50%;\n }\n\n :host([orientation='vertical'])\n .rc-range-slider-root[data-display='float']\n .rc-range-slider-value {\n inset-block-start: auto;\n inset-inline-start: var(--rc-range-slider-float-value-inline-offset, calc(100% + 0.5rem));\n flex-direction: column;\n inline-size: auto;\n block-size: 0;\n }\n `;\n\n /** Minimum slider value. */\n @property({ type: Number }) min = 0;\n\n /** Maximum slider value. */\n @property({ type: Number }) max = 100;\n\n /** Slider step. */\n @property({ type: Number }) step = 1;\n\n private _value: [number, number] | undefined;\n private _defaultValue: [number, number] | undefined;\n private _valueInitialized = false;\n\n /** Current [low, high] value. Assign a new tuple reference to trigger a re-render. */\n @property({ attribute: false })\n get value(): [number, number] {\n return this._value ?? this._defaultValue ?? this._nativeInputValue;\n }\n\n set value(v: [number, number]) {\n const old = this._value;\n\n this._value = this._normalizeValue(v);\n this._valueInitialized = true;\n this._applyValueToInputs(this._value);\n\n if (this._value !== old) {\n this.requestUpdate('value', old);\n }\n }\n\n /** Initial uncontrolled [low, high] value. Has no effect after the first user interaction or `value` write. */\n @property({ attribute: false })\n get defaultValue(): [number, number] | undefined {\n return this._defaultValue;\n }\n\n set defaultValue(v: [number, number] | undefined) {\n const old = this._defaultValue;\n\n this._defaultValue = v === undefined ? undefined : this._normalizeValue(v);\n\n if (!this._valueInitialized && this._value === undefined && this._defaultValue !== undefined) {\n this._applyValueToInputs(this._defaultValue);\n this.requestUpdate('value', undefined);\n }\n\n this.requestUpdate('defaultValue', old);\n }\n\n /** Disable both thumbs and their hidden native input reflectors. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Prevents edits while preserving normal focus and display. */\n @property({ type: Boolean, reflect: true }) readonly = false;\n\n /** Built-in text overrides; unset keys fall back to registered text, then English. */\n @property({ attribute: false })\n messages: Partial<RCRangeSliderMessages> | undefined;\n\n private readonly _messages = new MessagesController(\n this,\n 'rc-range-slider',\n DEFAULT_RANGE_SLIDER_MESSAGES,\n {\n overrides: () => this.messages,\n },\n );\n\n /**\n * Accessible label for the low (min) thumb when the input does not provide one.\n * Defaults to the `low` message.\n */\n @property({ attribute: 'low-label' }) lowLabel: string | undefined;\n\n /**\n * Accessible label for the high (max) thumb when the input does not provide one.\n * Defaults to the `high` message.\n */\n @property({ attribute: 'high-label' }) highLabel: string | undefined;\n\n /** Formatted screen-reader text for the low value. Falls back to the raw number. */\n @property({ attribute: 'low-value-text' }) lowValueText = '';\n\n /** Formatted screen-reader text for the high value. Falls back to the raw number. */\n @property({ attribute: 'high-value-text' }) highValueText = '';\n\n /**\n * Controls the live value display.\n *\n * - Absent (default) — no value shown.\n * - `display` or `display=\"float\"` — floats each value above its thumb.\n * - `display=\"inline-start\"` — renders the value container before the track.\n * - `display=\"inline-end\"` — renders the value container after the track.\n */\n @property({ reflect: true, converter: displayConverter })\n display: DisplayValue = null;\n\n /** Orientation; reflected as an attribute and forwarded to custom thumbs. */\n @property({ reflect: true }) orientation: 'horizontal' | 'vertical' = 'horizontal';\n\n /** Keeps the thumbs' aria-orientation on the orientation actually rendered. */\n protected readonly _flow = new FlowController(this);\n\n @state() private _lowValue = 0;\n @state() private _highValue = 100;\n\n private _$lowInput: HTMLInputElement | null = null;\n private _$highInput: HTMLInputElement | null = null;\n private _dragThumb: RangeThumb | null = null;\n private _dragPointerId: number | null = null;\n private _addedHostRole = false;\n private readonly _rangeInputController = new NativeChildController<HTMLInputElement>(this, {\n selector: ':scope > input[type=\"range\"]',\n observe: true,\n onChange: () => this._resetInputs(),\n onMissing: () => {\n if (import.meta.env.DEV) {\n warnMissingDirectChild(this, {\n selector: ':scope > input[type=\"range\"]',\n message: '[rc-range-slider] Requires two child <input type=\"range\"> elements.',\n });\n }\n },\n });\n\n override connectedCallback(): void {\n super.connectedCallback();\n this._syncHostRole();\n }\n\n override disconnectedCallback(): void {\n this._unwireInputs();\n this._restoreInputs();\n\n if (this._addedHostRole) {\n this.removeAttribute('role');\n this._addedHostRole = false;\n }\n\n super.disconnectedCallback();\n }\n\n override updated(): void {\n this._syncInputReflectors();\n }\n\n override render() {\n const $lo = this._$lowInput;\n const $hi = this._$highInput;\n\n if (!$lo || !$hi) {\n return nothing;\n }\n\n const format = numberFormat(this._messages.locale);\n const lowText = this.lowValueText || format.format(this._lowValue);\n const highText = this.highValueText || format.format(this._highValue);\n\n const valuesContainer = html`\n <span class=\"rc-range-slider-values\" aria-hidden=\"true\">\n <span\n part=\"value-display low-value-display\"\n class=\"rc-range-slider-value\"\n style=${this.display === 'float' ? this._floatStyle(this._lowValue) : nothing}\n ><slot name=\"low-value-display\">${lowText}</slot></span\n >\n <span\n part=\"value-display high-value-display\"\n class=\"rc-range-slider-value\"\n style=${this.display === 'float' ? this._floatStyle(this._highValue) : nothing}\n ><slot name=\"high-value-display\">${highText}</slot></span\n >\n </span>\n `;\n\n return html`\n <div\n part=\"root\"\n class=\"rc-range-slider-root\"\n data-display=${this.display ?? nothing}\n data-orientation=${this.orientation}\n >\n ${this.display === 'inline-start' ? valuesContainer : nothing}\n\n <div\n part=\"group\"\n class=\"rc-range-slider-group\"\n @pointerdown=${this._onGroupPointerDown}\n @pointermove=${this._onGroupPointerMove}\n @pointerup=${this._onGroupPointerUp}\n @pointercancel=${this._onGroupPointerCancel}\n >\n <span part=\"track\" class=\"rc-range-slider-track\" aria-hidden=\"true\">\n <slot name=\"track-background\"></slot>\n <span part=\"range\" class=\"rc-range-slider-range\" style=${this._rangeStyle()}></span>\n </span>\n\n ${this._renderThumb('low')} ${this._renderThumb('high')}\n <slot @slotchange=${this._onDefaultSlotChange}></slot>\n ${this.display === 'float' ? valuesContainer : nothing}\n </div>\n\n ${this.display === 'inline-end' ? valuesContainer : nothing}\n </div>\n `;\n }\n\n private _renderThumb(thumb: RangeThumb) {\n const isLow = thumb === 'low';\n const $input = isLow ? this._$lowInput : this._$highInput;\n const value = isLow ? this._lowValue : this._highValue;\n const valueText = isLow ? this.lowValueText : this.highValueText;\n const label = this._thumbLabel(thumb);\n const labelledBy = $input?.getAttribute('aria-labelledby');\n\n return html`\n <span\n part=${isLow ? 'thumb low-thumb' : 'thumb high-thumb'}\n class=\"rc-range-slider-thumb\"\n data-thumb=${thumb}\n role=\"slider\"\n tabindex=${this.disabled ? '-1' : '0'}\n aria-label=${label ?? nothing}\n aria-labelledby=${labelledBy ?? nothing}\n aria-valuemin=${String(isLow ? this._min() : this._lowValue)}\n aria-valuemax=${String(isLow ? this._highValue : this._max())}\n aria-valuenow=${String(value)}\n aria-valuetext=${valueText || nothing}\n aria-orientation=${renderedOrientation(this.orientation, this._flow.flow)}\n aria-disabled=${this.disabled ? 'true' : nothing}\n aria-readonly=${this.readonly ? 'true' : nothing}\n style=${this._thumbStyle(value)}\n @keydown=${isLow ? this._onLowKeydown : this._onHighKeydown}\n ></span>\n `;\n }\n\n /**\n * Finds the first two child `<input type=\"range\">` elements and wires them.\n * Inputs remain in the DOM permanently as form/progressive-enhancement\n * reflectors.\n */\n private _findInputs(): void {\n const $inputs = getDirectChildren<HTMLInputElement>(this, ':scope > input[type=\"range\"]').slice(\n 0,\n 2,\n );\n\n if ($inputs.length < 2) {\n if (import.meta.env.DEV && $inputs.length > 0) {\n warnMissingDirectChild(this, {\n selector: ':scope > input[type=\"range\"]',\n minimum: 2,\n message: '[rc-range-slider] Requires two child <input type=\"range\"> elements.',\n });\n }\n\n return;\n }\n\n const [$lo, $hi] = $inputs as [HTMLInputElement, HTMLInputElement];\n\n if (!this.hasAttribute('disabled') && ($lo.disabled || $hi.disabled)) {\n this.disabled = true;\n }\n\n this._$lowInput = $lo;\n this._$highInput = $hi;\n this._applyInitialValueToInputs($lo, $hi);\n\n this._wireInput($lo, this._onLowInput, this._onLowChange);\n this._wireInput($hi, this._onHighInput, this._onHighChange);\n this._syncInputReflectors();\n }\n\n private _onDefaultSlotChange = (): void => {\n this._rangeInputController.sync();\n this._resetInputs();\n };\n\n private _resetInputs(): void {\n this._unwireInputs();\n this._restoreInputs();\n this._findInputs();\n this.requestUpdate();\n }\n\n private get _nativeInputValue(): [number, number] {\n const low = this._$lowInput?.valueAsNumber;\n const high = this._$highInput?.valueAsNumber;\n\n return [\n low === undefined || isNaN(low) ? this.min : low,\n high === undefined || isNaN(high) ? this.max : high,\n ];\n }\n\n private _applyInitialValueToInputs(\n $lowInput: HTMLInputElement,\n $highInput: HTMLInputElement,\n ): void {\n if (this._value !== undefined) {\n this._applyValueToInputs(this._value);\n\n return;\n }\n\n if (this._defaultValue !== undefined) {\n this._applyValueToInputs(this._defaultValue);\n\n return;\n }\n\n const lowValue = $lowInput.valueAsNumber;\n const highValue = $highInput.valueAsNumber;\n\n this._lowValue = isNaN(lowValue) ? this._min() : lowValue;\n this._highValue = isNaN(highValue) ? this._max() : highValue;\n this._defaultValue = this._normalizeValue([this._lowValue, this._highValue]);\n this._applyValueToInputs(this._defaultValue);\n }\n\n private _applyValueToInputs(value: [number, number]): void {\n const [low, high] = this._normalizeValue(value);\n\n this._lowValue = low;\n this._highValue = high;\n\n if (this._$lowInput) {\n this._$lowInput.value = String(low);\n }\n\n if (this._$highInput) {\n this._$highInput.value = String(high);\n }\n }\n\n private _setCurrentValue(value: [number, number]): void {\n const [low, high] = this._normalizeValue(value);\n\n this._value = [low, high];\n this._valueInitialized = true;\n this._applyValueToInputs(this._value);\n this.requestUpdate('value');\n }\n\n private _wireInput(\n $input: HTMLInputElement,\n onInput: (e: Event) => void,\n onChange: (e: Event) => void,\n ): void {\n $input.addEventListener('input', onInput);\n $input.addEventListener('change', onChange);\n }\n\n private _unwireInputs(): void {\n this._$lowInput?.removeEventListener('input', this._onLowInput);\n this._$lowInput?.removeEventListener('change', this._onLowChange);\n\n this._$highInput?.removeEventListener('input', this._onHighInput);\n this._$highInput?.removeEventListener('change', this._onHighChange);\n }\n\n private _restoreInputs(): void {\n for (const $input of [this._$lowInput, this._$highInput]) {\n $input?.removeAttribute('aria-hidden');\n $input?.removeAttribute('tabindex');\n $input?.removeAttribute('data-rc-range-slider-reflector');\n $input?.style.removeProperty('display');\n }\n }\n\n private _syncInputReflectors(): void {\n const $lo = this._$lowInput;\n const $hi = this._$highInput;\n\n if (!$lo || !$hi) {\n return;\n }\n\n for (const $input of [$lo, $hi]) {\n $input.disabled = this.disabled;\n $input.tabIndex = -1;\n $input.setAttribute('aria-hidden', 'true');\n $input.setAttribute('data-rc-range-slider-reflector', '');\n }\n }\n\n private _syncHostRole(): void {\n if (this.hasAttribute('role')) {\n return;\n }\n\n this.setAttribute('role', 'group');\n this._addedHostRole = true;\n }\n\n private readonly _onLowInput = (e: Event): void => {\n if (this.readonly) {\n this._applyValueToInputs([this._lowValue, this._highValue]);\n\n return;\n }\n\n const $input = e.currentTarget as HTMLInputElement;\n\n this._setCurrentValue([$input.valueAsNumber, this._highValue]);\n this._dispatch('rc-range-slider-input', this.value);\n };\n\n private readonly _onLowChange = (e: Event): void => {\n if (this.readonly) {\n this._applyValueToInputs([this._lowValue, this._highValue]);\n\n return;\n }\n\n const $input = e.currentTarget as HTMLInputElement;\n\n this._setCurrentValue([$input.valueAsNumber, this._highValue]);\n this._dispatch('rc-range-slider-change', this.value);\n };\n\n private readonly _onHighInput = (e: Event): void => {\n if (this.readonly) {\n this._applyValueToInputs([this._lowValue, this._highValue]);\n\n return;\n }\n\n const $input = e.currentTarget as HTMLInputElement;\n\n this._setCurrentValue([this._lowValue, $input.valueAsNumber]);\n this._dispatch('rc-range-slider-input', this.value);\n };\n\n private readonly _onHighChange = (e: Event): void => {\n if (this.readonly) {\n this._applyValueToInputs([this._lowValue, this._highValue]);\n\n return;\n }\n\n const $input = e.currentTarget as HTMLInputElement;\n\n this._setCurrentValue([this._lowValue, $input.valueAsNumber]);\n this._dispatch('rc-range-slider-change', this.value);\n };\n\n /** APG keyboard contract for the low thumb. */\n private readonly _onLowKeydown = (e: KeyboardEvent): void => {\n this._handleThumbKeydown(e, 'low');\n };\n\n /** APG keyboard contract for the high thumb. */\n private readonly _onHighKeydown = (e: KeyboardEvent): void => {\n this._handleThumbKeydown(e, 'high');\n };\n\n private _handleThumbKeydown(e: KeyboardEvent, thumb: RangeThumb): void {\n if (this.disabled || this.readonly) {\n return;\n }\n\n const min = this._min();\n const max = this._max();\n const step = this._step();\n const bigStep = step * 10;\n const low = this._lowValue;\n const high = this._highValue;\n const current = thumb === 'low' ? low : high;\n const effectiveMin = thumb === 'low' ? min : low;\n const effectiveMax = thumb === 'low' ? high : max;\n\n const keys = this._valueKeys();\n let next: number;\n\n if (keys.increase.includes(e.key)) {\n next = current + step;\n } else if (keys.decrease.includes(e.key)) {\n next = current - step;\n } else {\n switch (e.key) {\n case 'PageUp':\n next = current + bigStep;\n break;\n case 'PageDown':\n next = current - bigStep;\n break;\n case 'Home':\n next = effectiveMin;\n break;\n case 'End':\n next = effectiveMax;\n break;\n default:\n return;\n }\n }\n\n e.preventDefault();\n\n const nextValue = snapToStep(next, effectiveMin, effectiveMax, step);\n\n if (nextValue === current) {\n return;\n }\n\n this._setThumbValue(thumb, nextValue);\n this._dispatch('rc-range-slider-input', this.value);\n }\n\n private _onGroupPointerDown(e: PointerEvent): void {\n if (this.disabled || this.readonly || e.button !== 0) {\n return;\n }\n\n const thumb = this._nearestThumb(e);\n const $thumbEl = this._$thumbElement(thumb);\n\n this._dragThumb = thumb;\n this._dragPointerId = e.pointerId;\n\n e.preventDefault();\n\n try {\n (e.currentTarget as HTMLElement).setPointerCapture(e.pointerId);\n } catch {\n // Synthetic browser-test PointerEvents are not active pointer streams.\n }\n\n $thumbEl?.focus();\n this._setThumbValue(thumb, this._valueFromPointer(e, thumb));\n this._dispatch('rc-range-slider-input', this.value);\n }\n\n private _onGroupPointerMove(e: PointerEvent): void {\n if (this._dragPointerId !== e.pointerId || this._dragThumb === null) {\n return;\n }\n\n e.preventDefault();\n this._setThumbValue(this._dragThumb, this._valueFromPointer(e, this._dragThumb));\n this._dispatch('rc-range-slider-input', this.value);\n }\n\n private _onGroupPointerUp(e: PointerEvent): void {\n if (this._dragPointerId !== e.pointerId || this._dragThumb === null) {\n return;\n }\n\n const thumb = this._dragThumb;\n\n this._dragThumb = null;\n this._dragPointerId = null;\n\n try {\n (e.currentTarget as HTMLElement).releasePointerCapture(e.pointerId);\n } catch {\n // Synthetic browser-test PointerEvents are not active pointer streams.\n }\n\n this._dispatch('rc-range-slider-change', this.value);\n this._$thumbElement(thumb)?.focus();\n }\n\n private _onGroupPointerCancel(e: PointerEvent): void {\n if (this._dragPointerId !== e.pointerId) {\n return;\n }\n\n this._dragThumb = null;\n this._dragPointerId = null;\n }\n\n private _setThumbValue(thumb: RangeThumb, value: number): void {\n if (thumb === 'low') {\n this._setCurrentValue([value, this._highValue]);\n\n return;\n }\n\n this._setCurrentValue([this._lowValue, value]);\n }\n\n private _valueFromPointer(e: PointerEvent, thumb: RangeThumb): number {\n const rect = this._groupRect();\n\n if (!rect) {\n return thumb === 'low' ? this._lowValue : this._highValue;\n }\n\n const min = thumb === 'low' ? this._min() : this._lowValue;\n const max = thumb === 'low' ? this._highValue : this._max();\n const span = this._max() - this._min();\n\n if (span <= 0) {\n return min;\n }\n\n const pct = this._axisFraction(e, rect);\n const raw = pct * span + this._min();\n\n return snapToStep(raw, min, max, this._step());\n }\n\n private _nearestThumb(e: PointerEvent): RangeThumb {\n const value = this._valueFromPointer(e, 'low');\n const lowDistance = Math.abs(value - this._lowValue);\n const highDistance = Math.abs(value - this._highValue);\n\n if (lowDistance === highDistance) {\n return value < this._lowValue ? 'low' : 'high';\n }\n\n return lowDistance < highDistance ? 'low' : 'high';\n }\n\n private _rangeStyle(): string {\n const loPct = valueToPercent(this._lowValue, this._min(), this._max());\n const hiPct = valueToPercent(this._highValue, this._min(), this._max());\n const loCenter = this._thumbCenterStyle(loPct);\n const hiCenter = this._thumbCenterStyle(hiPct);\n\n if (this.orientation === 'vertical') {\n return [\n `inset-block-start:${loCenter}`,\n `block-size:max(0px, calc(${hiCenter} - ${loCenter}))`,\n ].join(';');\n }\n\n return [\n `inset-inline-start:${loCenter}`,\n `inline-size:max(0px, calc(${hiCenter} - ${loCenter}))`,\n ].join(';');\n }\n\n private _thumbStyle(value: number): string {\n const pct = valueToPercent(value, this._min(), this._max());\n const center = this._thumbCenterStyle(pct);\n\n if (this.orientation === 'vertical') {\n return `inset-block-start:${center};inset-inline-start:50%`;\n }\n\n return `inset-inline-start:${center};inset-block-start:50%`;\n }\n\n private _thumbCenterStyle(pct: number): string {\n const k = (1 - pct * 2).toFixed(4);\n\n return `calc(${(pct * 100).toFixed(3)}% + ${k} * var(--rc-thumb-radius, 9px))`;\n }\n\n private _floatStyle(value: number): string {\n const pct = valueToPercent(value, this._min(), this._max());\n const center = this._thumbCenterStyle(pct);\n\n if (this.orientation === 'vertical') {\n return `inset-block-start:${center}`;\n }\n\n return `inset-inline-start:${center}`;\n }\n\n /**\n * How far along the layout axis a pointer is, 0 at its logical start.\n * Horizontal layout uses the inline axis; vertical layout uses block.\n */\n private _axisFraction(e: PointerEvent, rect: DOMRect): number {\n const flow = resolveFlow(this);\n const axis = this.orientation === 'horizontal' ? 'inline' : 'block';\n const alongX = physicalAxis(axis, flow) === 'x';\n const fraction = alongX\n ? (e.clientX - rect.left) / rect.width\n : (e.clientY - rect.top) / rect.height;\n\n return isReversed(axis, flow) ? 1 - fraction : fraction;\n }\n\n /**\n * The arrow keys that raise and lower the value, matching a native range\n * input. The keys along the rendered track move the thumb the way it moves\n * on screen. The cross-axis keys keep the native range convention: Up or\n * Right raises the value.\n */\n private _valueKeys(): { increase: readonly string[]; decrease: readonly string[] } {\n const flow = resolveFlow(this);\n const rendered = renderedOrientation(this.orientation, flow);\n const { next, prev } = arrowKeys(rendered, flow);\n\n return {\n increase: [next, rendered === 'horizontal' ? 'ArrowUp' : 'ArrowRight'],\n decrease: [prev, rendered === 'horizontal' ? 'ArrowDown' : 'ArrowLeft'],\n };\n }\n\n private _normalizeValue([low, high]: [number, number]): [number, number] {\n const min = this._min();\n const max = this._max();\n const steppedLow = snapToStep(low, min, max, this._step());\n const steppedHigh = snapToStep(high, min, max, this._step());\n\n return [Math.min(steppedLow, steppedHigh), Math.max(steppedLow, steppedHigh)];\n }\n\n private _min(): number {\n return parseAttr(this._$lowInput?.min ?? '', this.min);\n }\n\n private _max(): number {\n return parseAttr(this._$highInput?.max ?? '', this.max);\n }\n\n private _step(): number {\n return parseAttr(this._$lowInput?.step ?? '', this.step);\n }\n\n private _groupRect(): DOMRect | null {\n return (\n this.shadowRoot\n ?.querySelector<HTMLElement>('.rc-range-slider-group')\n ?.getBoundingClientRect() ?? null\n );\n }\n\n private _$thumbElement(thumb: RangeThumb): HTMLElement | null {\n return this.shadowRoot?.querySelector<HTMLElement>(`[data-thumb=\"${thumb}\"]`) ?? null;\n }\n\n private _thumbLabel(thumb: RangeThumb): string | null {\n const $input = thumb === 'low' ? this._$lowInput : this._$highInput;\n const messages = this._messages.value;\n const fallback =\n thumb === 'low' ? (this.lowLabel ?? messages.low) : (this.highLabel ?? messages.high);\n const explicitLabel = $input?.getAttribute('aria-label');\n\n if (explicitLabel) {\n return explicitLabel;\n }\n\n const nativeLabel = $input?.labels?.[0]?.textContent?.trim();\n\n if (nativeLabel) {\n return nativeLabel;\n }\n\n return fallback || null;\n }\n\n private _dispatch(\n type: 'rc-range-slider-input' | 'rc-range-slider-change',\n value: [number, number],\n ): void {\n const init: CustomEventInit<RCRangeSliderValueEvent> = {\n bubbles: true,\n composed: true,\n detail: { value },\n };\n\n if (type === 'rc-range-slider-input') {\n this.dispatchEvent(new CustomEvent<RCRangeSliderValueEvent>('rc-range-slider-input', init));\n } else {\n this.dispatchEvent(new CustomEvent<RCRangeSliderValueEvent>('rc-range-slider-change', init));\n }\n }\n}\n\nexport default RCRangeSlider;\n"],"names":["displayConverter","v","parseAttr","s","defaultVal","n","DEFAULT_RANGE_SLIDER_MESSAGES","_RCRangeSlider","LitElement","MessagesController","FlowController","NativeChildController","$input","old","$lo","$hi","nothing","format","numberFormat","lowText","highText","valuesContainer","html","thumb","isLow","value","valueText","label","labelledBy","renderedOrientation","$inputs","getDirectChildren","low","high","$lowInput","$highInput","lowValue","highValue","onInput","onChange","min","max","step","bigStep","current","effectiveMin","effectiveMax","keys","next","nextValue","snapToStep","$thumbEl","rect","span","raw","lowDistance","highDistance","loPct","valueToPercent","hiPct","loCenter","hiCenter","pct","center","k","flow","resolveFlow","axis","fraction","physicalAxis","isReversed","rendered","prev","arrowKeys","steppedLow","steppedHigh","messages","fallback","explicitLabel","nativeLabel","type","init","css","RCRangeSlider","__decorateClass","property","state"],"mappings":"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"}
|
|
@@ -1,6 +1,8 @@
|
|
|
1
|
-
import { R as e } from "./rc-range-slider-
|
|
1
|
+
import { R as e } from "./rc-range-slider-C_WJWoq9.js";
|
|
2
|
+
import { D as m } from "./rc-range-slider-C_WJWoq9.js";
|
|
2
3
|
customElements.get("rc-range-slider") || customElements.define("rc-range-slider", e);
|
|
3
4
|
export {
|
|
5
|
+
m as DEFAULT_RANGE_SLIDER_MESSAGES,
|
|
4
6
|
e as RCRangeSlider
|
|
5
7
|
};
|
|
6
8
|
//# sourceMappingURL=rc-range-slider-define.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"rc-range-slider-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCRangeSlider } from './index.js';\n\ncustomElements.get('rc-range-slider') || customElements.define('rc-range-slider', RCRangeSlider);\n\nexport * from './index.js';\n"],"names":["RCRangeSlider"],"mappings":"
|
|
1
|
+
{"version":3,"file":"rc-range-slider-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCRangeSlider } from './index.js';\n\ncustomElements.get('rc-range-slider') || customElements.define('rc-range-slider', RCRangeSlider);\n\nexport * from './index.js';\n"],"names":["RCRangeSlider"],"mappings":";;AAEA,eAAe,IAAI,iBAAiB,KAAK,eAAe,OAAO,mBAAmBA,CAAa;"}
|
package/dist/rc-range-slider.js
CHANGED