@zag-js/slider 0.2.6 → 0.2.8

package/dist/slider.anatomy.d.ts

@@ -0,0 +1,6 @@
+import * as _zag_js_anatomy from '@zag-js/anatomy';
+
+declare const anatomy: _zag_js_anatomy.AnatomyInstance<"root" | "label" | "thumb" | "hiddenInput" | "output" | "track" | "range" | "control" | "markerGroup" | "marker">;
+declare const parts: Record<"root" | "label" | "thumb" | "hiddenInput" | "output" | "track" | "range" | "control" | "markerGroup" | "marker", _zag_js_anatomy.AnatomyPart>;
+
+export { anatomy, parts };

package/dist/slider.anatomy.js

@@ -0,0 +1,45 @@
+"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/slider.anatomy.ts
+var slider_anatomy_exports = {};
+__export(slider_anatomy_exports, {
+  anatomy: () => anatomy,
+  parts: () => parts
+});
+module.exports = __toCommonJS(slider_anatomy_exports);
+var import_anatomy = require("@zag-js/anatomy");
+var anatomy = (0, import_anatomy.createAnatomy)("slider").parts(
+  "root",
+  "label",
+  "thumb",
+  "hiddenInput",
+  "output",
+  "track",
+  "range",
+  "control",
+  "markerGroup",
+  "marker"
+);
+var parts = anatomy.build();
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  anatomy,
+  parts
+});

package/dist/slider.anatomy.mjs

@@ -0,0 +1,8 @@
+import {
+  anatomy,
+  parts
+} from "./chunk-3Y7IIPR5.mjs";
+export {
+  anatomy,
+  parts
+};

package/dist/slider.connect.d.ts

@@ -0,0 +1,30 @@
+import { PropTypes, NormalizeProps } from '@zag-js/types';
+import { State, Send } from './slider.types.js';
+import '@zag-js/core';
+
+declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
+    isFocused: boolean;
+    isDragging: boolean;
+    value: number;
+    percent: number;
+    setValue(value: number): void;
+    getPercentValue(percent: number): number;
+    getValuePercent(value: number): number;
+    focus(): void;
+    increment(): void;
+    decrement(): void;
+    rootProps: T["element"];
+    labelProps: T["label"];
+    thumbProps: T["element"];
+    hiddenInputProps: T["input"];
+    outputProps: T["output"];
+    trackProps: T["element"];
+    rangeProps: T["element"];
+    controlProps: T["element"];
+    markerGroupProps: T["element"];
+    getMarkerProps({ value }: {
+        value: number;
+    }): T["element"];
+};
+
+export { connect };

package/dist/slider.connect.js

@@ -0,0 +1,601 @@
+"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/slider.connect.ts
+var slider_connect_exports = {};
+__export(slider_connect_exports, {
+  connect: () => connect
+});
+module.exports = __toCommonJS(slider_connect_exports);
+
+// ../../utilities/dom/src/attrs.ts
+var dataAttr = (guard) => {
+  return guard ? "" : void 0;
+};
+
+// ../../utilities/core/src/guard.ts
+var isArray = (v) => Array.isArray(v);
+var isObject = (v) => !(v == null || typeof v !== "object" || isArray(v));
+var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
+
+// ../../utilities/dom/src/query.ts
+function isDocument(el) {
+  return el.nodeType === Node.DOCUMENT_NODE;
+}
+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 (_a = el == null ? void 0 : el.ownerDocument) != null ? _a : document;
+}
+function getWindow(el) {
+  var _a;
+  return (_a = el == null ? void 0 : el.ownerDocument.defaultView) != null ? _a : window;
+}
+function defineDomHelpers(helpers) {
+  const dom2 = {
+    getRootNode: (ctx) => {
+      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) => {
+      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)
+  };
+  return {
+    ...dom2,
+    ...helpers
+  };
+}
+
+// ../../utilities/dom/src/event.ts
+function getNativeEvent(e) {
+  var _a;
+  return (_a = e.nativeEvent) != null ? _a : e;
+}
+var isTouchEvent = (v) => isObject(v) && hasProp(v, "touches");
+var isLeftClick = (v) => v.button === 0;
+var isModifiedEvent = (v) => v.ctrlKey || v.altKey || v.metaKey;
+
+// ../../utilities/dom/src/get-element-offset.ts
+function getElementOffset(element) {
+  let left = 0;
+  let top = 0;
+  let el = element;
+  if (el.parentNode) {
+    do {
+      left += el.offsetLeft;
+      top += el.offsetTop;
+    } while ((el = el.offsetParent) && el.nodeType < 9);
+    el = element;
+    do {
+      left -= el.scrollLeft;
+      top -= el.scrollTop;
+    } while ((el = el.parentNode) && !/body/i.test(el.nodeName));
+  }
+  return {
+    top,
+    right: innerWidth - left - element.offsetWidth,
+    bottom: innerHeight - top - element.offsetHeight,
+    left
+  };
+}
+
+// ../../utilities/dom/src/get-event-point.ts
+var fallback = {
+  pageX: 0,
+  pageY: 0,
+  clientX: 0,
+  clientY: 0
+};
+function getEventPoint(event, type = "page") {
+  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`] };
+}
+
+// ../../utilities/dom/src/get-point-relative-to-element.ts
+function getPointRelativeToNode(point, element) {
+  const offset = getElementOffset(element);
+  const x = point.x - offset.left;
+  const y = point.y - offset.top;
+  return { x, y };
+}
+
+// ../../utilities/dom/src/keyboard-event.ts
+var rtlKeyMap = {
+  ArrowLeft: "ArrowRight",
+  ArrowRight: "ArrowLeft"
+};
+var sameKeyMap = {
+  Up: "ArrowUp",
+  Down: "ArrowDown",
+  Esc: "Escape",
+  " ": "Space",
+  ",": "Comma",
+  Left: "ArrowLeft",
+  Right: "ArrowRight"
+};
+function getEventKey(event, options = {}) {
+  var _a;
+  const { dir = "ltr", orientation = "horizontal" } = options;
+  let { key } = event;
+  key = (_a = sameKeyMap[key]) != null ? _a : key;
+  const isRtl = dir === "rtl" && orientation === "horizontal";
+  if (isRtl && key in rtlKeyMap) {
+    key = rtlKeyMap[key];
+  }
+  return key;
+}
+var PAGE_KEYS = /* @__PURE__ */ new Set(["PageUp", "PageDown"]);
+var ARROW_KEYS = /* @__PURE__ */ new Set(["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"]);
+function getEventStep(event) {
+  if (event.ctrlKey || event.metaKey) {
+    return 0.1;
+  } else {
+    const isPageKey = PAGE_KEYS.has(event.key);
+    const isSkipKey = isPageKey || event.shiftKey && ARROW_KEYS.has(event.key);
+    return isSkipKey ? 10 : 1;
+  }
+}
+
+// src/slider.connect.ts
+var import_numeric_range3 = require("@zag-js/numeric-range");
+
+// src/slider.anatomy.ts
+var import_anatomy = require("@zag-js/anatomy");
+var anatomy = (0, import_anatomy.createAnatomy)("slider").parts(
+  "root",
+  "label",
+  "thumb",
+  "hiddenInput",
+  "output",
+  "track",
+  "range",
+  "control",
+  "markerGroup",
+  "marker"
+);
+var parts = anatomy.build();
+
+// ../../utilities/form-utils/src/input-event.ts
+function getDescriptor(el, options) {
+  var _a;
+  const { type, property = "value" } = options;
+  const proto = getWindow(el)[type].prototype;
+  return (_a = Object.getOwnPropertyDescriptor(proto, property)) != null ? _a : {};
+}
+function dispatchInputValueEvent(el, value) {
+  var _a;
+  if (!el)
+    return;
+  const win = getWindow(el);
+  if (!(el instanceof win.HTMLInputElement))
+    return;
+  const desc = getDescriptor(el, { type: "HTMLInputElement", property: "value" });
+  (_a = desc.set) == null ? void 0 : _a.call(el, value);
+  const event = new win.Event("input", { bubbles: true });
+  el.dispatchEvent(event);
+}
+
+// src/slider.dom.ts
+var import_numeric_range2 = require("@zag-js/numeric-range");
+
+// src/slider.style.ts
+var import_numeric_range = require("@zag-js/numeric-range");
+function getVerticalThumbOffset(ctx) {
+  var _a;
+  const { height = 0 } = (_a = ctx.thumbSize) != null ? _a : {};
+  const getValue = (0, import_numeric_range.getValueTransformer)([ctx.min, ctx.max], [-height / 2, height / 2]);
+  return parseFloat(getValue(ctx.value).toFixed(2));
+}
+function getHorizontalThumbOffset(ctx) {
+  var _a;
+  const { width = 0 } = (_a = ctx.thumbSize) != null ? _a : {};
+  if (ctx.isRtl) {
+    const getValue2 = (0, import_numeric_range.getValueTransformer)([ctx.max, ctx.min], [-width * 1.5, -width / 2]);
+    return -1 * parseFloat(getValue2(ctx.value).toFixed(2));
+  }
+  const getValue = (0, import_numeric_range.getValueTransformer)([ctx.min, ctx.max], [-width / 2, width / 2]);
+  return parseFloat(getValue(ctx.value).toFixed(2));
+}
+function getThumbOffset(ctx) {
+  const percent = (0, import_numeric_range.getValuePercent)(ctx.value, ctx.min, ctx.max) * 100;
+  if (ctx.thumbAlignment === "center") {
+    return `${percent}%`;
+  }
+  const offset = ctx.isVertical ? getVerticalThumbOffset(ctx) : getHorizontalThumbOffset(ctx);
+  return `calc(${percent}% - ${offset}px)`;
+}
+function getVisibility(ctx) {
+  let visibility = "visible";
+  if (ctx.thumbAlignment === "contain" && !ctx.hasMeasuredThumbSize) {
+    visibility = "hidden";
+  }
+  return visibility;
+}
+function getThumbStyle(ctx) {
+  const placementProp = ctx.isVertical ? "bottom" : ctx.isRtl ? "right" : "left";
+  return {
+    visibility: getVisibility(ctx),
+    position: "absolute",
+    transform: "var(--slider-thumb-transform)",
+    [placementProp]: "var(--slider-thumb-offset)"
+  };
+}
+function getRangeOffsets(ctx) {
+  let start = "0%";
+  let end = `${100 - ctx.valuePercent}%`;
+  if (ctx.origin === "center") {
+    const isNegative = ctx.valuePercent < 50;
+    start = isNegative ? `${ctx.valuePercent}%` : "50%";
+    end = isNegative ? "50%" : end;
+  }
+  return { start, end };
+}
+function getRangeStyle(ctx) {
+  if (ctx.isVertical) {
+    return {
+      position: "absolute",
+      bottom: "var(--slider-range-start)",
+      top: "var(--slider-range-end)"
+    };
+  }
+  return {
+    position: "absolute",
+    [ctx.isRtl ? "right" : "left"]: "var(--slider-range-start)",
+    [ctx.isRtl ? "left" : "right"]: "var(--slider-range-end)"
+  };
+}
+function getControlStyle() {
+  return {
+    touchAction: "none",
+    userSelect: "none",
+    position: "relative"
+  };
+}
+function getRootStyle(ctx) {
+  const range = getRangeOffsets(ctx);
+  return {
+    "--slider-thumb-transform": ctx.isVertical ? "translateY(50%)" : "translateX(-50%)",
+    "--slider-thumb-offset": getThumbOffset(ctx),
+    "--slider-range-start": range.start,
+    "--slider-range-end": range.end
+  };
+}
+function getMarkerStyle(ctx, percent) {
+  return {
+    position: "absolute",
+    pointerEvents: "none",
+    [ctx.isHorizontal ? "left" : "bottom"]: `${(ctx.isRtl ? 1 - percent : percent) * 100}%`
+  };
+}
+function getLabelStyle() {
+  return { userSelect: "none" };
+}
+function getTrackStyle() {
+  return { position: "relative" };
+}
+function getMarkerGroupStyle() {
+  return {
+    userSelect: "none",
+    pointerEvents: "none",
+    position: "relative"
+  };
+}
+var styles = {
+  getThumbOffset,
+  getControlStyle,
+  getThumbStyle,
+  getRangeStyle,
+  getRootStyle,
+  getMarkerStyle,
+  getLabelStyle,
+  getTrackStyle,
+  getMarkerGroupStyle
+};
+
+// src/slider.dom.ts
+var dom = defineDomHelpers({
+  ...styles,
+  getRootId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.root) != null ? _b : `slider:${ctx.id}`;
+  },
+  getThumbId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.thumb) != null ? _b : `slider:${ctx.id}:thumb`;
+  },
+  getControlId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.control) != null ? _b : `slider:${ctx.id}:control`;
+  },
+  getHiddenInputId: (ctx) => `slider:${ctx.id}:input`,
+  getOutputId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.output) != null ? _b : `slider:${ctx.id}:output`;
+  },
+  getTrackId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.track) != null ? _b : `slider:${ctx.id}track`;
+  },
+  getRangeId: (ctx) => {
+    var _a, _b;
+    return (_b = (_a = ctx.ids) == null ? void 0 : _a.track) != null ? _b : `slider:${ctx.id}:range`;
+  },
+  getLabelId: (ctx) => {
+    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)),
+  getThumbEl: (ctx) => dom.getById(ctx, dom.getThumbId(ctx)),
+  getControlEl: (ctx) => dom.getById(ctx, dom.getControlId(ctx)),
+  getHiddenInputEl: (ctx) => dom.getById(ctx, dom.getHiddenInputId(ctx)),
+  getValueFromPoint(ctx, point) {
+    const el = dom.getControlEl(ctx);
+    if (!el)
+      return;
+    const relativePoint = getPointRelativeToNode(point, el);
+    const percentX = relativePoint.x / el.offsetWidth;
+    const percentY = relativePoint.y / el.offsetHeight;
+    let percent;
+    if (ctx.isHorizontal) {
+      percent = ctx.isRtl ? 1 - percentX : percentX;
+    } else {
+      percent = 1 - percentY;
+    }
+    return (0, import_numeric_range2.getPercentValue)(percent, ctx.min, ctx.max, ctx.step);
+  },
+  dispatchChangeEvent(ctx) {
+    const input = dom.getHiddenInputEl(ctx);
+    if (!input)
+      return;
+    dispatchInputValueEvent(input, ctx.value);
+  }
+});
+
+// src/slider.connect.ts
+function connect(state, send, normalize) {
+  var _a, _b;
+  const ariaLabel = state.context["aria-label"];
+  const ariaLabelledBy = state.context["aria-labelledby"];
+  const ariaValueText = (_b = (_a = state.context).getAriaValueText) == null ? void 0 : _b.call(_a, state.context.value);
+  const isFocused = state.matches("focus");
+  const isDragging = state.matches("dragging");
+  const isDisabled = state.context.disabled;
+  const isInteractive = state.context.isInteractive;
+  const isInvalid = state.context.invalid;
+  return {
+    isFocused,
+    isDragging,
+    value: state.context.value,
+    percent: (0, import_numeric_range3.getValuePercent)(state.context.value, state.context.min, state.context.max),
+    setValue(value) {
+      send({ type: "SET_VALUE", value });
+    },
+    getPercentValue(percent) {
+      return (0, import_numeric_range3.getPercentValue)(percent, state.context.min, state.context.max, state.context.step);
+    },
+    getValuePercent(value) {
+      return (0, import_numeric_range3.getValuePercent)(value, state.context.min, state.context.max);
+    },
+    focus() {
+      var _a2;
+      (_a2 = dom.getThumbEl(state.context)) == null ? void 0 : _a2.focus();
+    },
+    increment() {
+      send("INCREMENT");
+    },
+    decrement() {
+      send("DECREMENT");
+    },
+    rootProps: normalize.element({
+      ...parts.root.attrs,
+      "data-disabled": dataAttr(isDisabled),
+      "data-focus": dataAttr(isFocused),
+      "data-orientation": state.context.orientation,
+      "data-invalid": dataAttr(isInvalid),
+      id: dom.getRootId(state.context),
+      dir: state.context.dir,
+      style: dom.getRootStyle(state.context)
+    }),
+    labelProps: normalize.label({
+      ...parts.label.attrs,
+      "data-disabled": dataAttr(isDisabled),
+      "data-invalid": dataAttr(isInvalid),
+      "data-focus": dataAttr(isFocused),
+      id: dom.getLabelId(state.context),
+      htmlFor: dom.getHiddenInputId(state.context),
+      onClick(event) {
+        var _a2;
+        if (!isInteractive)
+          return;
+        event.preventDefault();
+        (_a2 = dom.getThumbEl(state.context)) == null ? void 0 : _a2.focus();
+      },
+      style: dom.getLabelStyle()
+    }),
+    thumbProps: normalize.element({
+      ...parts.thumb.attrs,
+      id: dom.getThumbId(state.context),
+      "data-disabled": dataAttr(isDisabled),
+      "data-orientation": state.context.orientation,
+      "data-focus": dataAttr(isFocused),
+      draggable: false,
+      "aria-invalid": isInvalid || void 0,
+      "data-invalid": dataAttr(isInvalid),
+      "aria-disabled": isDisabled || void 0,
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabel ? void 0 : ariaLabelledBy != null ? ariaLabelledBy : dom.getLabelId(state.context),
+      "aria-orientation": state.context.orientation,
+      "aria-valuemax": state.context.max,
+      "aria-valuemin": state.context.min,
+      "aria-valuenow": state.context.value,
+      "aria-valuetext": ariaValueText,
+      role: "slider",
+      tabIndex: isDisabled ? void 0 : 0,
+      onBlur() {
+        if (!isInteractive)
+          return;
+        send("BLUR");
+      },
+      onFocus() {
+        if (!isInteractive)
+          return;
+        send("FOCUS");
+      },
+      onKeyDown(event) {
+        if (!isInteractive)
+          return;
+        const step = getEventStep(event) * state.context.step;
+        let prevent = true;
+        const keyMap = {
+          ArrowUp() {
+            send({ type: "ARROW_UP", step });
+            prevent = state.context.isVertical;
+          },
+          ArrowDown() {
+            send({ type: "ARROW_DOWN", step });
+            prevent = state.context.isVertical;
+          },
+          ArrowLeft() {
+            send({ type: "ARROW_LEFT", step });
+            prevent = state.context.isHorizontal;
+          },
+          ArrowRight() {
+            send({ type: "ARROW_RIGHT", step });
+            prevent = state.context.isHorizontal;
+          },
+          PageUp() {
+            send({ type: "PAGE_UP", step });
+          },
+          PageDown() {
+            send({ type: "PAGE_DOWN", step });
+          },
+          Home() {
+            send("HOME");
+          },
+          End() {
+            send("END");
+          }
+        };
+        const key = getEventKey(event, state.context);
+        const exec = keyMap[key];
+        if (!exec)
+          return;
+        exec(event);
+        if (prevent) {
+          event.preventDefault();
+        }
+      },
+      style: dom.getThumbStyle(state.context)
+    }),
+    hiddenInputProps: normalize.input({
+      ...parts.hiddenInput.attrs,
+      type: "text",
+      defaultValue: state.context.value,
+      name: state.context.name,
+      form: state.context.form,
+      id: dom.getHiddenInputId(state.context),
+      hidden: true
+    }),
+    outputProps: normalize.output({
+      ...parts.output.attrs,
+      "data-disabled": dataAttr(isDisabled),
+      "data-invalid": dataAttr(isInvalid),
+      id: dom.getOutputId(state.context),
+      htmlFor: dom.getHiddenInputId(state.context),
+      "aria-live": "off"
+    }),
+    trackProps: normalize.element({
+      ...parts.track.attrs,
+      id: dom.getTrackId(state.context),
+      "data-disabled": dataAttr(isDisabled),
+      "data-focus": dataAttr(isFocused),
+      "data-invalid": dataAttr(isInvalid),
+      "data-orientation": state.context.orientation,
+      style: dom.getTrackStyle()
+    }),
+    rangeProps: normalize.element({
+      ...parts.range.attrs,
+      id: dom.getRangeId(state.context),
+      "data-focus": dataAttr(isFocused),
+      "data-invalid": dataAttr(isInvalid),
+      "data-disabled": dataAttr(isDisabled),
+      "data-orientation": state.context.orientation,
+      style: dom.getRangeStyle(state.context)
+    }),
+    controlProps: normalize.element({
+      ...parts.control.attrs,
+      id: dom.getControlId(state.context),
+      "data-disabled": dataAttr(isDisabled),
+      "data-invalid": dataAttr(isInvalid),
+      "data-orientation": state.context.orientation,
+      "data-focus": dataAttr(isFocused),
+      onPointerDown(event) {
+        if (!isInteractive)
+          return;
+        const evt = getNativeEvent(event);
+        if (!isLeftClick(evt) || isModifiedEvent(evt))
+          return;
+        const point = getEventPoint(evt);
+        send({ type: "POINTER_DOWN", point });
+        event.preventDefault();
+        event.stopPropagation();
+      },
+      style: dom.getControlStyle()
+    }),
+    markerGroupProps: normalize.element({
+      ...parts.markerGroup.attrs,
+      role: "presentation",
+      "aria-hidden": true,
+      "data-orientation": state.context.orientation,
+      style: dom.getMarkerGroupStyle()
+    }),
+    getMarkerProps({ value }) {
+      const percent = this.getValuePercent(value);
+      const style = dom.getMarkerStyle(state.context, percent);
+      const markerState = value > state.context.value ? "over-value" : value < state.context.value ? "under-value" : "at-value";
+      return normalize.element({
+        ...parts.marker.attrs,
+        role: "presentation",
+        "data-orientation": state.context.orientation,
+        id: dom.getMarkerId(state.context, value),
+        "data-value": value,
+        "data-disabled": dataAttr(isDisabled),
+        "data-state": markerState,
+        style
+      });
+    }
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  connect
+});

package/dist/slider.connect.mjs

@@ -0,0 +1,10 @@
+import {
+  connect
+} from "./chunk-6D4ETNPG.mjs";
+import "./chunk-3Y7IIPR5.mjs";
+import "./chunk-SGCWELVB.mjs";
+import "./chunk-J5IGGBVE.mjs";
+import "./chunk-YREEXXZP.mjs";
+export {
+  connect
+};