@zag-js/slider 0.1.15 → 0.2.0

package/dist/index.d.ts

@@ -172,6 +172,10 @@ declare const dom: {
     getById: <T_1 = HTMLElement>(ctx: {
         getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
     }, id: string) => T_1 | null;
+    createEmitter: (ctx: {
+        getRootNode?: (() => Document | Node | ShadowRoot) | undefined;
+    }, target: HTMLElement) => (evt: string, detail: Record<string, any>, options?: EventInit | undefined) => void;
+    createListener: (target: HTMLElement) => <T_2 = any>(evt: string, handler: (e: CustomEvent<T_2>) => void) => () => void;
 } & {
     getRootId: (ctx: MachineContext) => string;
     getThumbId: (ctx: MachineContext) => string;

package/dist/index.js

@@ -1,10 +1,38 @@
-// ../../utilities/dom/dist/index.js
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  connect: () => connect,
+  machine: () => machine,
+  unstable__dom: () => dom
+});
+module.exports = __toCommonJS(src_exports);
+
+// ../../utilities/dom/dist/index.mjs
 var dataAttr = (guard) => {
   return guard ? "" : void 0;
 };
 var runIfFn = (v, ...a) => {
   const res = typeof v === "function" ? v(...a) : v;
-  return res ?? void 0;
+  return res != null ? res : void 0;
 };
 var callAll = (...fns) => (...a) => {
   fns.forEach(function(fn) {
@@ -16,8 +44,9 @@ var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
 var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
 var isDom = () => typeof window !== "undefined";
 function getPlatform() {
+  var _a;
   const agent = navigator.userAgentData;
-  return (agent == null ? void 0 : agent.platform) ?? navigator.platform;
+  return (_a = agent == null ? void 0 : agent.platform) != null ? _a : navigator.platform;
 }
 var pt = (v) => isDom() && v.test(getPlatform());
 var isTouchDevice = () => isDom() && !!navigator.maxTouchPoints;
@@ -31,22 +60,44 @@ function isWindow(value) {
   return (value == null ? void 0 : value.toString()) === "[object Window]";
 }
 function getDocument(el) {
+  var _a;
   if (isWindow(el))
     return el.document;
   if (isDocument(el))
     return el;
-  return (el == null ? void 0 : el.ownerDocument) ?? document;
+  return (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
 }
 function defineDomHelpers(helpers) {
   const dom2 = {
     getRootNode: (ctx) => {
-      var _a;
-      return ((_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) ?? document;
+      var _a, _b;
+      return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
     },
     getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
-    getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
+    getWin: (ctx) => {
+      var _a;
+      return (_a = dom2.getDoc(ctx).defaultView) != null ? _a : window;
+    },
     getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
-    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
+    getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id),
+    createEmitter: (ctx, target) => {
+      const win = dom2.getWin(ctx);
+      return function emit(evt, detail, options) {
+        const { bubbles = true, cancelable, composed = true } = options != null ? options : {};
+        const eventName = `zag:${evt}`;
+        const init = { bubbles, cancelable, composed, detail };
+        const event = new win.CustomEvent(eventName, init);
+        target.dispatchEvent(event);
+      };
+    },
+    createListener: (target) => {
+      return function listen(evt, handler) {
+        const eventName = `zag:${evt}`;
+        const listener = (e) => handler(e);
+        target.addEventListener(eventName, listener);
+        return () => target.removeEventListener(eventName, listener);
+      };
+    }
   };
   return {
     ...dom2,
@@ -54,7 +105,8 @@ function defineDomHelpers(helpers) {
   };
 }
 function getNativeEvent(e) {
-  return e.nativeEvent ?? e;
+  var _a;
+  return (_a = e.nativeEvent) != null ? _a : e;
 }
 var supportsPointerEvent = () => isDom() && window.onpointerdown === null;
 var supportsTouchEvent = () => isDom() && window.ontouchstart === null;
@@ -92,7 +144,8 @@ var fallback = {
   clientY: 0
 };
 function getEventPoint(event, type = "page") {
-  const point = isTouchEvent(event) ? event.touches[0] ?? event.changedTouches[0] ?? fallback : event;
+  var _a, _b;
+  const point = isTouchEvent(event) ? (_b = (_a = event.touches[0]) != null ? _a : event.changedTouches[0]) != null ? _b : fallback : event;
   return { x: point[`${type}X`], y: point[`${type}Y`] };
 }
 function getPointRelativeToNode(point, element) {
@@ -115,9 +168,10 @@ var sameKeyMap = {
   Right: "ArrowRight"
 };
 function getEventKey(event, options = {}) {
+  var _a;
   const { dir = "ltr", orientation = "horizontal" } = options;
   let { key } = event;
-  key = sameKeyMap[key] ?? key;
+  key = (_a = sameKeyMap[key]) != null ? _a : key;
   const isRtl = dir === "rtl" && orientation === "horizontal";
   if (isRtl && key in rtlKeyMap) {
     key = rtlKeyMap[key];
@@ -154,7 +208,8 @@ function addDomEvent(target, eventName, handler, options) {
   };
 }
 function addPointerEvent(target, event, listener, options) {
-  const type = getEventName(event) ?? event;
+  var _a;
+  const type = (_a = getEventName(event)) != null ? _a : event;
   return addDomEvent(target, type, wrapHandler(listener, event === "pointerdown"), options);
 }
 function wrapHandler(fn, filter = false) {
@@ -165,7 +220,8 @@ function wrapHandler(fn, filter = false) {
 }
 function filterPrimaryPointer(fn) {
   return (event) => {
-    const win = event.view ?? window;
+    var _a;
+    const win = (_a = event.view) != null ? _a : window;
     const isMouseEvent2 = event instanceof win.MouseEvent;
     const isPrimary = !isMouseEvent2 || isMouseEvent2 && event.button === 0;
     if (isPrimary)
@@ -220,7 +276,7 @@ var state = "default";
 var savedUserSelect = "";
 var modifiedElementMap = /* @__PURE__ */ new WeakMap();
 function disableTextSelection({ target, doc } = {}) {
-  const _document = doc ?? document;
+  const _document = doc != null ? doc : document;
   if (isIos()) {
     if (state === "default") {
       savedUserSelect = _document.documentElement.style.webkitUserSelect;
@@ -234,7 +290,7 @@ function disableTextSelection({ target, doc } = {}) {
   return () => restoreTextSelection({ target, doc: _document });
 }
 function restoreTextSelection({ target, doc } = {}) {
-  const _document = doc ?? document;
+  const _document = doc != null ? doc : document;
   if (isIos()) {
     if (state !== "disabled")
       return;
@@ -254,7 +310,7 @@ function restoreTextSelection({ target, doc } = {}) {
     if (target && modifiedElementMap.has(target)) {
       let targetOldUserSelect = modifiedElementMap.get(target);
       if (target.style.userSelect === "none") {
-        target.style.userSelect = targetOldUserSelect ?? "";
+        target.style.userSelect = targetOldUserSelect != null ? targetOldUserSelect : "";
       }
       if (target.getAttribute("style") === "") {
         target.removeAttribute("style");
@@ -286,9 +342,10 @@ function trackPointerMove(doc, opts) {
   );
 }
 
-// ../../utilities/form-utils/dist/index.js
+// ../../utilities/form-utils/dist/index.mjs
 function getWindow(el) {
-  return (el == null ? void 0 : el.ownerDocument.defaultView) ?? window;
+  var _a;
+  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
 }
 function observeAttributes(node, attributes, fn) {
   if (!node)
@@ -306,9 +363,10 @@ function observeAttributes(node, attributes, fn) {
   return () => obs.disconnect();
 }
 function getDescriptor(el, options) {
+  var _a;
   const { type, property } = options;
   const proto = getWindow(el)[type].prototype;
-  return Object.getOwnPropertyDescriptor(proto, property) ?? {};
+  return (_a = Object.getOwnPropertyDescriptor(proto, property)) != null ? _a : {};
 }
 function dispatchInputValueEvent(el, value) {
   var _a;
@@ -348,10 +406,10 @@ function trackFieldsetDisabled(el, callback) {
   return observeAttributes(fieldset, ["disabled"], () => callback(fieldset.disabled));
 }
 
-// ../../utilities/number/dist/index.js
+// ../../utilities/number/dist/index.mjs
 function round(v, t) {
   let num = valueOf(v);
-  const p = 10 ** (t ?? 10);
+  const p = 10 ** (t != null ? t : 10);
   num = Math.round(num * p) / p;
   return t ? num.toFixed(t) : v.toString();
 }
@@ -409,12 +467,14 @@ var transform = (a, b) => {
 
 // src/slider.style.ts
 function getVerticalThumbOffset(ctx) {
-  const { height = 0 } = ctx.thumbSize ?? {};
+  var _a;
+  const { height = 0 } = (_a = ctx.thumbSize) != null ? _a : {};
   const getValue = transform([ctx.min, ctx.max], [-height / 2, height / 2]);
   return parseFloat(getValue(ctx.value).toFixed(2));
 }
 function getHorizontalThumbOffset(ctx) {
-  const { width = 0 } = ctx.thumbSize ?? {};
+  var _a;
+  const { width = 0 } = (_a = ctx.thumbSize) != null ? _a : {};
   if (ctx.isRtl) {
     const getValue2 = transform([ctx.max, ctx.min], [-width * 1.5, -width / 2]);
     return -1 * parseFloat(getValue2(ctx.value).toFixed(2));
@@ -524,11 +584,11 @@ var utils = {
     return clamp(parseFloat(snapToStep(value, ctx.step)), ctx);
   },
   decrement(ctx, step) {
-    let value = decrement(ctx.value, step ?? ctx.step);
+    let value = decrement(ctx.value, step != null ? step : ctx.step);
     return utils.convert(ctx, value);
   },
   increment(ctx, step) {
-    let value = increment(ctx.value, step ?? ctx.step);
+    let value = increment(ctx.value, step != null ? step : ctx.step);
     return utils.convert(ctx, value);
   }
 };
@@ -537,33 +597,33 @@ var utils = {
 var dom = defineDomHelpers({
   ...styles,
   getRootId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.root) ?? `slider:${ctx.id}`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `slider:${ctx.id}`;
   },
   getThumbId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.thumb) ?? `slider:${ctx.id}:thumb`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.thumb) != null ? _b : `slider:${ctx.id}:thumb`;
   },
   getControlId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.control) ?? `slider:${ctx.id}:control`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.control) != null ? _b : `slider:${ctx.id}:control`;
   },
   getInputId: (ctx) => `slider:${ctx.id}:input`,
   getOutputId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.output) ?? `slider:${ctx.id}:output`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.output) != null ? _b : `slider:${ctx.id}:output`;
   },
   getTrackId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.track) ?? `slider:${ctx.id}track`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.track) != null ? _b : `slider:${ctx.id}track`;
   },
   getRangeId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.track) ?? `slider:${ctx.id}:range`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.track) != null ? _b : `slider:${ctx.id}:range`;
   },
   getLabelId: (ctx) => {
-    var _a;
-    return ((_a = ctx.ids) == null ? void 0 : _a.label) ?? `slider:${ctx.id}:label`;
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.label) != null ? _b : `slider:${ctx.id}:label`;
   },
   getMarkerId: (ctx, value) => `slider:${ctx.id}:marker:${value}`,
   getRootEl: (ctx) => dom.getById(ctx, dom.getRootId(ctx)),
@@ -662,7 +722,7 @@ function connect(state2, send, normalize) {
       "data-invalid": dataAttr(isInvalid),
       "aria-disabled": isDisabled || void 0,
       "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabel ? void 0 : ariaLabelledBy ?? dom.getLabelId(state2.context),
+      "aria-labelledby": ariaLabel ? void 0 : ariaLabelledBy != null ? ariaLabelledBy : dom.getLabelId(state2.context),
       "aria-orientation": state2.context.orientation,
       "aria-valuemax": state2.context.max,
       "aria-valuemin": state2.context.min,
@@ -806,10 +866,10 @@ function connect(state2, send, normalize) {
 }
 
 // src/slider.machine.ts
-import { createMachine } from "@zag-js/core";
-import { trackElementSize } from "@zag-js/element-size";
+var import_core = require("@zag-js/core");
+var import_element_size = require("@zag-js/element-size");
 function machine(ctx) {
-  return createMachine(
+  return (0, import_core.createMachine)(
     {
       id: "slider",
       initial: "unknown",
@@ -954,7 +1014,7 @@ function machine(ctx) {
         trackThumbSize(ctx2, _evt) {
           if (ctx2.thumbAlignment !== "contain")
             return;
-          return trackElementSize(dom.getThumbEl(ctx2), (size) => {
+          return (0, import_element_size.trackElementSize)(dom.getThumbEl(ctx2), (size) => {
             if (size)
               ctx2.thumbSize = size;
           });
@@ -1012,8 +1072,9 @@ function machine(ctx) {
     }
   );
 }
-export {
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
   connect,
   machine,
-  dom as unstable__dom
-};
+  unstable__dom
+});