@zag-js/slider 0.1.5 → 0.1.6
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/index.js +41 -41
- package/dist/index.js.map +3 -3
- package/dist/index.mjs +41 -41
- package/dist/index.mjs.map +3 -3
- package/dist/slider.dom.d.ts +1 -0
- package/dist/slider.dom.d.ts.map +1 -1
- package/dist/slider.machine.d.ts.map +1 -1
- package/dist/slider.types.d.ts +6 -5
- package/dist/slider.types.d.ts.map +1 -1
- package/package.json +4 -4
package/dist/index.mjs
CHANGED
|
@@ -206,48 +206,50 @@ function dispatchInputValueEvent(el, value) {
|
|
|
206
206
|
const event = new win.Event("input", { bubbles: true });
|
|
207
207
|
el.dispatchEvent(event);
|
|
208
208
|
}
|
|
209
|
-
function trackInputPropertyMutation(el, options) {
|
|
210
|
-
const { fn, property, type } = options;
|
|
211
|
-
if (!fn || !el)
|
|
212
|
-
return;
|
|
213
|
-
const { get, set } = getDescriptor(el, { property, type });
|
|
214
|
-
let run = true;
|
|
215
|
-
Object.defineProperty(el, property, {
|
|
216
|
-
get() {
|
|
217
|
-
return get == null ? void 0 : get.call(this);
|
|
218
|
-
},
|
|
219
|
-
set(value) {
|
|
220
|
-
if (run)
|
|
221
|
-
fn(value);
|
|
222
|
-
return set == null ? void 0 : set.call(this, value);
|
|
223
|
-
}
|
|
224
|
-
});
|
|
225
|
-
return function() {
|
|
226
|
-
run = false;
|
|
227
|
-
};
|
|
228
|
-
}
|
|
229
209
|
function getNativeEvent(event) {
|
|
230
210
|
var _a;
|
|
231
211
|
return (_a = event.nativeEvent) != null ? _a : event;
|
|
232
212
|
}
|
|
233
|
-
function
|
|
213
|
+
function observeAttributes(node, attributes, fn) {
|
|
214
|
+
if (!node)
|
|
215
|
+
return noop;
|
|
216
|
+
const attrs = Array.isArray(attributes) ? attributes : [attributes];
|
|
217
|
+
const win = node.ownerDocument.defaultView || window;
|
|
218
|
+
const obs = new win.MutationObserver((changes) => {
|
|
219
|
+
for (const change of changes) {
|
|
220
|
+
if (change.type === "attributes" && change.attributeName && attrs.includes(change.attributeName)) {
|
|
221
|
+
fn(change);
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
});
|
|
225
|
+
obs.observe(node, { attributes: true, attributeFilter: attrs });
|
|
226
|
+
return () => obs.disconnect();
|
|
227
|
+
}
|
|
228
|
+
function getClosestForm(el) {
|
|
234
229
|
if (isFormElement(el))
|
|
235
230
|
return el.form;
|
|
236
231
|
else
|
|
237
232
|
return el.closest("form");
|
|
238
233
|
}
|
|
239
234
|
function isFormElement(el) {
|
|
240
|
-
return
|
|
235
|
+
return el.matches("textarea, input, select, button");
|
|
241
236
|
}
|
|
242
237
|
function trackFormReset(el, callback) {
|
|
243
238
|
if (!el)
|
|
244
239
|
return;
|
|
245
|
-
const form =
|
|
240
|
+
const form = getClosestForm(el);
|
|
246
241
|
form == null ? void 0 : form.addEventListener("reset", callback, { passive: true });
|
|
247
242
|
return () => {
|
|
248
243
|
form == null ? void 0 : form.removeEventListener("reset", callback);
|
|
249
244
|
};
|
|
250
245
|
}
|
|
246
|
+
function trackFieldsetDisabled(el, callback) {
|
|
247
|
+
const fieldset = el == null ? void 0 : el.closest("fieldset");
|
|
248
|
+
if (!fieldset)
|
|
249
|
+
return;
|
|
250
|
+
callback(fieldset.disabled);
|
|
251
|
+
return observeAttributes(fieldset, ["disabled"], () => callback(fieldset.disabled));
|
|
252
|
+
}
|
|
251
253
|
var rtlKeyMap = {
|
|
252
254
|
ArrowLeft: "ArrowRight",
|
|
253
255
|
ArrowRight: "ArrowLeft",
|
|
@@ -604,6 +606,7 @@ var dom = {
|
|
|
604
606
|
return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `slider:${ctx.uid}:label`;
|
|
605
607
|
},
|
|
606
608
|
getMarkerId: (ctx, value) => `slider:${ctx.uid}:marker:${value}`,
|
|
609
|
+
getRootEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getRootId(ctx)),
|
|
607
610
|
getThumbEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getThumbId(ctx)),
|
|
608
611
|
getControlEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getControlId(ctx)),
|
|
609
612
|
getInputEl: (ctx) => dom.getRootNode(ctx).getElementById(dom.getInputId(ctx)),
|
|
@@ -646,7 +649,11 @@ var dom = {
|
|
|
646
649
|
|
|
647
650
|
// ../../types/dist/index.mjs
|
|
648
651
|
function createNormalizer(fn) {
|
|
649
|
-
return {
|
|
652
|
+
return new Proxy({}, {
|
|
653
|
+
get() {
|
|
654
|
+
return fn;
|
|
655
|
+
}
|
|
656
|
+
});
|
|
650
657
|
}
|
|
651
658
|
var normalizeProp = createNormalizer((v) => v);
|
|
652
659
|
|
|
@@ -896,7 +903,7 @@ function machine(ctx = {}) {
|
|
|
896
903
|
watch: {
|
|
897
904
|
value: ["invokeOnChange", "dispatchChangeEvent"]
|
|
898
905
|
},
|
|
899
|
-
activities: ["trackFormReset", "
|
|
906
|
+
activities: ["trackFormReset", "trackFieldsetDisabled"],
|
|
900
907
|
on: {
|
|
901
908
|
SET_VALUE: {
|
|
902
909
|
actions: "setValue"
|
|
@@ -984,17 +991,12 @@ function machine(ctx = {}) {
|
|
|
984
991
|
isVertical: (ctx2) => ctx2.isVertical
|
|
985
992
|
},
|
|
986
993
|
activities: {
|
|
987
|
-
|
|
994
|
+
trackFieldsetDisabled(ctx2) {
|
|
988
995
|
let cleanup;
|
|
989
996
|
nextTick(() => {
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
cleanup = trackInputPropertyMutation(el, {
|
|
994
|
-
type: "input",
|
|
995
|
-
property: "value",
|
|
996
|
-
fn(value) {
|
|
997
|
-
send({ type: "SET_VALUE", value: parseFloat(value) });
|
|
997
|
+
cleanup = trackFieldsetDisabled(dom.getRootEl(ctx2), (disabled) => {
|
|
998
|
+
if (disabled != ctx2.disabled) {
|
|
999
|
+
ctx2.disabled = disabled;
|
|
998
1000
|
}
|
|
999
1001
|
});
|
|
1000
1002
|
});
|
|
@@ -1003,15 +1005,13 @@ function machine(ctx = {}) {
|
|
|
1003
1005
|
trackFormReset(ctx2) {
|
|
1004
1006
|
let cleanup;
|
|
1005
1007
|
nextTick(() => {
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
return;
|
|
1009
|
-
cleanup = trackFormReset(el, () => {
|
|
1010
|
-
if (ctx2.initialValue != null)
|
|
1008
|
+
cleanup = trackFormReset(dom.getInputEl(ctx2), () => {
|
|
1009
|
+
if (ctx2.initialValue != null) {
|
|
1011
1010
|
ctx2.value = ctx2.initialValue;
|
|
1011
|
+
}
|
|
1012
1012
|
});
|
|
1013
1013
|
});
|
|
1014
|
-
return cleanup;
|
|
1014
|
+
return () => cleanup == null ? void 0 : cleanup();
|
|
1015
1015
|
},
|
|
1016
1016
|
trackPointerMove(ctx2, _evt, { send }) {
|
|
1017
1017
|
return trackPointerMove({
|
|
@@ -1067,7 +1067,7 @@ function machine(ctx = {}) {
|
|
|
1067
1067
|
ctx2.value = utils.clamp(ctx2, value);
|
|
1068
1068
|
},
|
|
1069
1069
|
focusThumb(ctx2) {
|
|
1070
|
-
|
|
1070
|
+
raf(() => {
|
|
1071
1071
|
var _a;
|
|
1072
1072
|
return (_a = dom.getThumbEl(ctx2)) == null ? void 0 : _a.focus();
|
|
1073
1073
|
});
|