@zag-js/slider 0.10.5 → 0.11.0

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/slider.anatomy.ts","../src/slider.connect.ts","../src/slider.dom.ts","../src/slider.style.ts","../src/slider.machine.ts","../src/slider.utils.ts"],"sourcesContent":["import { createAnatomy } from \"@zag-js/anatomy\"\n\nexport const anatomy = createAnatomy(\"slider\").parts(\n  \"root\",\n  \"label\",\n  \"thumb\",\n  \"hiddenInput\",\n  \"output\",\n  \"track\",\n  \"range\",\n  \"control\",\n  \"markerGroup\",\n  \"marker\",\n)\nexport const parts = anatomy.build()\n","import {\n  EventKeyMap,\n  getEventKey,\n  getEventPoint,\n  getEventStep,\n  getNativeEvent,\n  isLeftClick,\n  isModifiedEvent,\n} from \"@zag-js/dom-event\"\nimport { ariaAttr, dataAttr } from \"@zag-js/dom-query\"\nimport { getPercentValue, getValuePercent } from \"@zag-js/numeric-range\"\nimport type { NormalizeProps, PropTypes } from \"@zag-js/types\"\nimport { parts } from \"./slider.anatomy\"\nimport { dom } from \"./slider.dom\"\nimport type { Send, State } from \"./slider.types\"\n\nexport function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>) {\n  const ariaLabel = state.context[\"aria-label\"]\n  const ariaLabelledBy = state.context[\"aria-labelledby\"]\n  const ariaValueText = state.context.getAriaValueText?.(state.context.value)\n\n  const isFocused = state.matches(\"focus\")\n  const isDragging = state.matches(\"dragging\")\n  const isDisabled = state.context.disabled\n  const isInteractive = state.context.isInteractive\n  const isInvalid = state.context.invalid\n\n  function getPercentValueFn(percent: number) {\n    return getPercentValue(percent, state.context.min, state.context.max, state.context.step)\n  }\n\n  function getValuePercentFn(value: number) {\n    return getValuePercent(value, state.context.min, state.context.max)\n  }\n\n  // TODO - getMarkerState\n\n  return {\n    /**\n     * Whether the slider is focused.\n     */\n    isFocused,\n    /**\n     * Whether the slider is being dragged.\n     */\n    isDragging,\n    /**\n     * The value of the slider.\n     */\n    value: state.context.value,\n    /**\n     * The value of the slider as a percent.\n     */\n    percent: getValuePercent(state.context.value, state.context.min, state.context.max),\n    /**\n     * Function to set the value of the slider.\n     */\n    setValue(value: number) {\n      send({ type: \"SET_VALUE\", value })\n    },\n    /**\n     * Returns the value of the slider at the given percent.\n     */\n    getPercentValue: getPercentValueFn,\n    /**\n     * Returns the percent of the slider at the given value.\n     */\n    getValuePercent: getValuePercentFn,\n    /**\n     * Function to focus the slider.\n     */\n    focus() {\n      dom.getThumbEl(state.context)?.focus()\n    },\n    /**\n     * Function to increment the value of the slider by the step.\n     */\n    increment() {\n      send(\"INCREMENT\")\n    },\n    /**\n     * Function to decrement the value of the slider by the step.\n     */\n    decrement() {\n      send(\"DECREMENT\")\n    },\n\n    rootProps: normalize.element({\n      ...parts.root.attrs,\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-focus\": dataAttr(isFocused),\n      \"data-orientation\": state.context.orientation,\n      \"data-invalid\": dataAttr(isInvalid),\n      id: dom.getRootId(state.context),\n      dir: state.context.dir,\n      style: dom.getRootStyle(state.context),\n    }),\n\n    labelProps: normalize.label({\n      ...parts.label.attrs,\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-invalid\": dataAttr(isInvalid),\n      \"data-focus\": dataAttr(isFocused),\n      id: dom.getLabelId(state.context),\n      htmlFor: dom.getHiddenInputId(state.context),\n      onClick(event) {\n        if (!isInteractive) return\n        event.preventDefault()\n        dom.getThumbEl(state.context)?.focus()\n      },\n      style: dom.getLabelStyle(),\n    }),\n\n    thumbProps: normalize.element({\n      ...parts.thumb.attrs,\n      id: dom.getThumbId(state.context),\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-orientation\": state.context.orientation,\n      \"data-focus\": dataAttr(isFocused),\n      draggable: false,\n      \"aria-invalid\": ariaAttr(isInvalid),\n      \"data-invalid\": dataAttr(isInvalid),\n      \"aria-disabled\": ariaAttr(isDisabled),\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabel ? undefined : ariaLabelledBy ?? dom.getLabelId(state.context),\n      \"aria-orientation\": state.context.orientation,\n      \"aria-valuemax\": state.context.max,\n      \"aria-valuemin\": state.context.min,\n      \"aria-valuenow\": state.context.value,\n      \"aria-valuetext\": ariaValueText,\n      role: \"slider\",\n      tabIndex: isDisabled ? undefined : 0,\n      onBlur() {\n        if (!isInteractive) return\n        send(\"BLUR\")\n      },\n      onFocus() {\n        if (!isInteractive) return\n        send(\"FOCUS\")\n      },\n      onKeyDown(event) {\n        if (!isInteractive) return\n        const step = getEventStep(event) * state.context.step\n        let prevent = true\n        const keyMap: EventKeyMap = {\n          ArrowUp() {\n            send({ type: \"ARROW_UP\", step })\n            prevent = state.context.isVertical\n          },\n          ArrowDown() {\n            send({ type: \"ARROW_DOWN\", step })\n            prevent = state.context.isVertical\n          },\n          ArrowLeft() {\n            send({ type: \"ARROW_LEFT\", step })\n            prevent = state.context.isHorizontal\n          },\n          ArrowRight() {\n            send({ type: \"ARROW_RIGHT\", step })\n            prevent = state.context.isHorizontal\n          },\n          PageUp() {\n            send({ type: \"PAGE_UP\", step })\n          },\n          PageDown() {\n            send({ type: \"PAGE_DOWN\", step })\n          },\n          Home() {\n            send(\"HOME\")\n          },\n          End() {\n            send(\"END\")\n          },\n        }\n\n        const key = getEventKey(event, state.context)\n        const exec = keyMap[key]\n\n        if (!exec) return\n        exec(event)\n\n        if (prevent) {\n          event.preventDefault()\n        }\n      },\n      style: dom.getThumbStyle(state.context),\n    }),\n\n    hiddenInputProps: normalize.input({\n      ...parts.hiddenInput.attrs,\n      type: \"text\",\n      defaultValue: state.context.value,\n      name: state.context.name,\n      form: state.context.form,\n      id: dom.getHiddenInputId(state.context),\n      hidden: true,\n    }),\n\n    outputProps: normalize.output({\n      ...parts.output.attrs,\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-invalid\": dataAttr(isInvalid),\n      id: dom.getOutputId(state.context),\n      htmlFor: dom.getHiddenInputId(state.context),\n      \"aria-live\": \"off\",\n    }),\n\n    trackProps: normalize.element({\n      ...parts.track.attrs,\n      id: dom.getTrackId(state.context),\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-focus\": dataAttr(isFocused),\n      \"data-invalid\": dataAttr(isInvalid),\n      \"data-orientation\": state.context.orientation,\n      style: dom.getTrackStyle(),\n    }),\n\n    rangeProps: normalize.element({\n      ...parts.range.attrs,\n      id: dom.getRangeId(state.context),\n      \"data-focus\": dataAttr(isFocused),\n      \"data-invalid\": dataAttr(isInvalid),\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-orientation\": state.context.orientation,\n      style: dom.getRangeStyle(state.context),\n    }),\n\n    controlProps: normalize.element({\n      ...parts.control.attrs,\n      id: dom.getControlId(state.context),\n      \"data-disabled\": dataAttr(isDisabled),\n      \"data-invalid\": dataAttr(isInvalid),\n      \"data-orientation\": state.context.orientation,\n      \"data-focus\": dataAttr(isFocused),\n      onPointerDown(event) {\n        if (!isInteractive) return\n\n        const evt = getNativeEvent(event)\n        if (!isLeftClick(evt) || isModifiedEvent(evt)) return\n\n        const point = getEventPoint(evt)\n        send({ type: \"POINTER_DOWN\", point })\n\n        event.preventDefault()\n        event.stopPropagation()\n      },\n      style: dom.getControlStyle(),\n    }),\n\n    markerGroupProps: normalize.element({\n      ...parts.markerGroup.attrs,\n      role: \"presentation\",\n      \"aria-hidden\": true,\n      \"data-orientation\": state.context.orientation,\n      style: dom.getMarkerGroupStyle(),\n    }),\n\n    getMarkerProps({ value }: { value: number }) {\n      const percent = getValuePercentFn(value)\n      const style = dom.getMarkerStyle(state.context, percent)\n      const markerState =\n        value > state.context.value ? \"over-value\" : value < state.context.value ? \"under-value\" : \"at-value\"\n\n      return normalize.element({\n        ...parts.marker.attrs,\n        id: dom.getMarkerId(state.context, value),\n        role: \"presentation\",\n        \"data-orientation\": state.context.orientation,\n        \"data-value\": value,\n        \"data-disabled\": dataAttr(isDisabled),\n        \"data-state\": markerState,\n        style,\n      })\n    },\n  }\n}\n","import { getRelativePoint } from \"@zag-js/dom-event\"\nimport { createScope } from \"@zag-js/dom-query\"\nimport { dispatchInputValueEvent } from \"@zag-js/form-utils\"\nimport { getPercentValue } from \"@zag-js/numeric-range\"\nimport { styles } from \"./slider.style\"\nimport type { MachineContext as Ctx, Point } from \"./slider.types\"\n\nexport const dom = createScope({\n  ...styles,\n\n  getRootId: (ctx: Ctx) => ctx.ids?.root ?? `slider:${ctx.id}`,\n  getThumbId: (ctx: Ctx) => ctx.ids?.thumb ?? `slider:${ctx.id}:thumb`,\n  getControlId: (ctx: Ctx) => ctx.ids?.control ?? `slider:${ctx.id}:control`,\n  getHiddenInputId: (ctx: Ctx) => ctx.ids?.hiddenInput ?? `slider:${ctx.id}:input`,\n  getOutputId: (ctx: Ctx) => ctx.ids?.output ?? `slider:${ctx.id}:output`,\n  getTrackId: (ctx: Ctx) => ctx.ids?.track ?? `slider:${ctx.id}track`,\n  getRangeId: (ctx: Ctx) => ctx.ids?.track ?? `slider:${ctx.id}:range`,\n  getLabelId: (ctx: Ctx) => ctx.ids?.label ?? `slider:${ctx.id}:label`,\n  getMarkerId: (ctx: Ctx, value: number) => `slider:${ctx.id}:marker:${value}`,\n\n  getRootEl: (ctx: Ctx) => dom.getById(ctx, dom.getRootId(ctx)),\n  getThumbEl: (ctx: Ctx) => dom.getById(ctx, dom.getThumbId(ctx)),\n  getControlEl: (ctx: Ctx) => dom.queryById(ctx, dom.getControlId(ctx)),\n  getHiddenInputEl: (ctx: Ctx) => dom.getById<HTMLInputElement>(ctx, dom.getHiddenInputId(ctx)),\n\n  getValueFromPoint(ctx: Ctx, point: Point): number | undefined {\n    const relativePoint = getRelativePoint(point, dom.getControlEl(ctx))\n    const percent = relativePoint.getPercentValue({\n      orientation: ctx.orientation,\n      dir: ctx.dir,\n      inverted: { y: true },\n    })\n    return getPercentValue(percent, ctx.min, ctx.max, ctx.step)\n  },\n\n  dispatchChangeEvent(ctx: Ctx) {\n    const input = dom.getHiddenInputEl(ctx)\n    if (!input) return\n    dispatchInputValueEvent(input, { value: ctx.value })\n  },\n})\n","import { getValuePercent, getValueTransformer } from \"@zag-js/numeric-range\"\nimport type { Style } from \"@zag-js/types\"\nimport type { MachineContext as Ctx, SharedContext } from \"./slider.types\"\n\n/* -----------------------------------------------------------------------------\n * Thumb style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getVerticalThumbOffset(ctx: SharedContext) {\n  const { height = 0 } = ctx.thumbSize ?? {}\n  const getValue = getValueTransformer([ctx.min, ctx.max], [-height / 2, height / 2])\n  return parseFloat(getValue(ctx.value).toFixed(2))\n}\n\nfunction getHorizontalThumbOffset(ctx: SharedContext) {\n  const { width = 0 } = ctx.thumbSize ?? {}\n\n  if (ctx.isRtl) {\n    const getValue = getValueTransformer([ctx.max, ctx.min], [-width * 1.5, -width / 2])\n    return -1 * parseFloat(getValue(ctx.value).toFixed(2))\n  }\n\n  const getValue = getValueTransformer([ctx.min, ctx.max], [-width / 2, width / 2])\n  return parseFloat(getValue(ctx.value).toFixed(2))\n}\n\nfunction getThumbOffset(ctx: SharedContext) {\n  const percent = getValuePercent(ctx.value, ctx.min, ctx.max) * 100\n\n  if (ctx.thumbAlignment === \"center\") {\n    return `${percent}%`\n  }\n\n  const offset = ctx.isVertical ? getVerticalThumbOffset(ctx) : getHorizontalThumbOffset(ctx)\n  return `calc(${percent}% - ${offset}px)`\n}\n\nfunction getVisibility(ctx: SharedContext) {\n  let visibility: \"visible\" | \"hidden\" = \"visible\"\n  if (ctx.thumbAlignment === \"contain\" && !ctx.hasMeasuredThumbSize) {\n    visibility = \"hidden\"\n  }\n  return visibility\n}\n\nfunction getThumbStyle(ctx: SharedContext): Style {\n  const placementProp = ctx.isVertical ? \"bottom\" : ctx.isRtl ? \"right\" : \"left\"\n  return {\n    visibility: getVisibility(ctx),\n    position: \"absolute\",\n    transform: \"var(--slider-thumb-transform)\",\n    [placementProp]: \"var(--slider-thumb-offset)\",\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Range style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getRangeOffsets(ctx: Ctx) {\n  let start = \"0%\"\n  let end = `${100 - ctx.valuePercent}%`\n\n  if (ctx.origin === \"center\") {\n    const isNegative = ctx.valuePercent < 50\n    start = isNegative ? `${ctx.valuePercent}%` : \"50%\"\n    end = isNegative ? \"50%\" : end\n  }\n\n  return { start, end }\n}\n\nfunction getRangeStyle(ctx: Pick<SharedContext, \"isVertical\" | \"isRtl\">): Style {\n  if (ctx.isVertical) {\n    return {\n      position: \"absolute\",\n      bottom: \"var(--slider-range-start)\",\n      top: \"var(--slider-range-end)\",\n    }\n  }\n\n  return {\n    position: \"absolute\",\n    [ctx.isRtl ? \"right\" : \"left\"]: \"var(--slider-range-start)\",\n    [ctx.isRtl ? \"left\" : \"right\"]: \"var(--slider-range-end)\",\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Control style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getControlStyle(): Style {\n  return {\n    touchAction: \"none\",\n    userSelect: \"none\",\n    position: \"relative\",\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Root style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getRootStyle(ctx: Ctx): Style {\n  const range = getRangeOffsets(ctx)\n  return {\n    \"--slider-thumb-transform\": ctx.isVertical ? \"translateY(50%)\" : \"translateX(-50%)\",\n    \"--slider-thumb-offset\": getThumbOffset(ctx),\n    \"--slider-range-start\": range.start,\n    \"--slider-range-end\": range.end,\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Marker style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getMarkerStyle(ctx: Pick<SharedContext, \"isHorizontal\" | \"isRtl\">, percent: number): Style {\n  return {\n    position: \"absolute\",\n    pointerEvents: \"none\",\n    [ctx.isHorizontal ? \"left\" : \"bottom\"]: `${(ctx.isRtl ? 1 - percent : percent) * 100}%`,\n  }\n}\n\n/* -----------------------------------------------------------------------------\n * Label style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getLabelStyle(): Style {\n  return { userSelect: \"none\" }\n}\n\n/* -----------------------------------------------------------------------------\n * Label style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getTrackStyle(): Style {\n  return { position: \"relative\" }\n}\n\n/* -----------------------------------------------------------------------------\n * Label style calculations\n * -----------------------------------------------------------------------------*/\n\nfunction getMarkerGroupStyle(): Style {\n  return {\n    userSelect: \"none\",\n    pointerEvents: \"none\",\n    position: \"relative\",\n  }\n}\n\nexport const styles = {\n  getThumbOffset,\n  getControlStyle,\n  getThumbStyle,\n  getRangeStyle,\n  getRootStyle,\n  getMarkerStyle,\n  getLabelStyle,\n  getTrackStyle,\n  getMarkerGroupStyle,\n}\n","import { createMachine } from \"@zag-js/core\"\nimport { trackPointerMove } from \"@zag-js/dom-event\"\nimport { raf } from \"@zag-js/dom-query\"\nimport { trackElementSize } from \"@zag-js/element-size\"\nimport { trackFormControl } from \"@zag-js/form-utils\"\nimport { clampValue, getValuePercent } from \"@zag-js/numeric-range\"\nimport { compact } from \"@zag-js/utils\"\nimport { dom } from \"./slider.dom\"\nimport type { MachineContext, MachineState, UserDefinedContext } from \"./slider.types\"\nimport { constrainValue, decrement, increment } from \"./slider.utils\"\n\nexport function machine(userContext: UserDefinedContext) {\n  const ctx = compact(userContext)\n  return createMachine<MachineContext, MachineState>(\n    {\n      id: \"slider\",\n      initial: \"idle\",\n      context: {\n        thumbSize: null,\n        thumbAlignment: \"contain\",\n        disabled: false,\n        threshold: 5,\n        dir: \"ltr\",\n        origin: \"start\",\n        orientation: \"horizontal\",\n        initialValue: null,\n        value: 0,\n        step: 1,\n        min: 0,\n        max: 100,\n        ...ctx,\n      },\n\n      computed: {\n        isHorizontal: (ctx) => ctx.orientation === \"horizontal\",\n        isVertical: (ctx) => ctx.orientation === \"vertical\",\n        isRtl: (ctx) => ctx.orientation === \"horizontal\" && ctx.dir === \"rtl\",\n        isInteractive: (ctx) => !(ctx.disabled || ctx.readOnly),\n        hasMeasuredThumbSize: (ctx) => ctx.thumbSize !== null,\n        valuePercent: (ctx) => 100 * getValuePercent(ctx.value, ctx.min, ctx.max),\n      },\n\n      watch: {\n        value: [\"invokeOnChange\", \"dispatchChangeEvent\"],\n      },\n\n      activities: [\"trackFormControlState\", \"trackThumbSize\"],\n\n      on: {\n        SET_VALUE: {\n          actions: \"setValue\",\n        },\n        INCREMENT: {\n          actions: \"increment\",\n        },\n        DECREMENT: {\n          actions: \"decrement\",\n        },\n      },\n\n      entry: [\"checkValue\"],\n\n      states: {\n        idle: {\n          on: {\n            POINTER_DOWN: {\n              target: \"dragging\",\n              actions: [\"setPointerValue\", \"invokeOnChangeStart\", \"focusThumb\"],\n            },\n            FOCUS: \"focus\",\n          },\n        },\n\n        focus: {\n          entry: \"focusThumb\",\n          on: {\n            POINTER_DOWN: {\n              target: \"dragging\",\n              actions: [\"setPointerValue\", \"invokeOnChangeStart\", \"focusThumb\"],\n            },\n            ARROW_LEFT: {\n              guard: \"isHorizontal\",\n              actions: \"decrement\",\n            },\n            ARROW_RIGHT: {\n              guard: \"isHorizontal\",\n              actions: \"increment\",\n            },\n            ARROW_UP: {\n              guard: \"isVertical\",\n              actions: \"increment\",\n            },\n            ARROW_DOWN: {\n              guard: \"isVertical\",\n              actions: \"decrement\",\n            },\n            PAGE_UP: {\n              actions: \"increment\",\n            },\n            PAGE_DOWN: {\n              actions: \"decrement\",\n            },\n            HOME: {\n              actions: \"setToMin\",\n            },\n            END: {\n              actions: \"setToMax\",\n            },\n            BLUR: \"idle\",\n          },\n        },\n\n        dragging: {\n          entry: \"focusThumb\",\n          activities: \"trackPointerMove\",\n          on: {\n            POINTER_UP: {\n              target: \"focus\",\n              actions: \"invokeOnChangeEnd\",\n            },\n            POINTER_MOVE: {\n              actions: \"setPointerValue\",\n            },\n          },\n        },\n      },\n    },\n    {\n      guards: {\n        isHorizontal: (ctx) => ctx.isHorizontal,\n        isVertical: (ctx) => ctx.isVertical,\n      },\n\n      activities: {\n        trackFormControlState(ctx) {\n          return trackFormControl(dom.getHiddenInputEl(ctx), {\n            onFieldsetDisabled() {\n              ctx.disabled = true\n            },\n            onFormReset() {\n              if (ctx.initialValue != null) {\n                ctx.value = ctx.initialValue\n              }\n            },\n          })\n        },\n\n        trackPointerMove(ctx, _evt, { send }) {\n          return trackPointerMove(dom.getDoc(ctx), {\n            onPointerMove(info) {\n              send({ type: \"POINTER_MOVE\", point: info.point })\n            },\n            onPointerUp() {\n              send(\"POINTER_UP\")\n            },\n          })\n        },\n        trackThumbSize(ctx, _evt) {\n          if (ctx.thumbAlignment !== \"contain\") return\n          return trackElementSize(dom.getThumbEl(ctx), (size) => {\n            if (size) ctx.thumbSize = size\n          })\n        },\n      },\n\n      actions: {\n        checkValue(ctx) {\n          const value = constrainValue(ctx, ctx.value)\n          ctx.value = value\n          ctx.initialValue = value\n        },\n        invokeOnChangeStart(ctx) {\n          ctx.onChangeStart?.({ value: ctx.value })\n        },\n        invokeOnChangeEnd(ctx) {\n          ctx.onChangeEnd?.({ value: ctx.value })\n        },\n        invokeOnChange(ctx) {\n          ctx.onChange?.({ value: ctx.value })\n        },\n        dispatchChangeEvent(ctx) {\n          dom.dispatchChangeEvent(ctx)\n        },\n        setPointerValue(ctx, evt) {\n          const value = dom.getValueFromPoint(ctx, evt.point)\n          if (value == null) return\n          ctx.value = clampValue(value, ctx.min, ctx.max)\n        },\n        focusThumb(ctx) {\n          raf(() => dom.getThumbEl(ctx)?.focus())\n        },\n        decrement(ctx, evt) {\n          ctx.value = decrement(ctx, evt.step)\n        },\n        increment(ctx, evt) {\n          ctx.value = increment(ctx, evt.step)\n        },\n        setToMin(ctx) {\n          ctx.value = ctx.min\n        },\n        setToMax(ctx) {\n          ctx.value = ctx.max\n        },\n        setValue(ctx, evt) {\n          ctx.value = constrainValue(ctx, evt.value)\n        },\n      },\n    },\n  )\n}\n","import { clampValue, getNextStepValue, getPreviousStepValue, snapValueToStep } from \"@zag-js/numeric-range\"\nimport type { MachineContext as Ctx } from \"./slider.types\"\n\nexport function clampPercent(percent: number) {\n  return clampValue(percent, 0, 1)\n}\n\nexport function constrainValue(ctx: Ctx, value: number) {\n  const snapValue = snapValueToStep(value, ctx.min, ctx.max, ctx.step)\n  return clampValue(snapValue, ctx.min, ctx.max)\n}\n\nexport function decrement(ctx: Ctx, step?: number) {\n  const index = 0\n  const values = getPreviousStepValue(index, {\n    ...ctx,\n    step: step ?? ctx.step,\n    values: [ctx.value],\n  })\n  return values[index]\n}\n\nexport function increment(ctx: Ctx, step?: number) {\n  const index = 0\n  const values = getNextStepValue(index, {\n    ...ctx,\n    step: step ?? ctx.step,\n    values: [ctx.value],\n  })\n  return values[index]\n}\n"],"mappings":";AAAA,SAAS,qBAAqB;AAEvB,IAAM,UAAU,cAAc,QAAQ,EAAE;AAAA,EAC7C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,IAAM,QAAQ,QAAQ,MAAM;;;ACdnC;AAAA,EAEE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,UAAU,gBAAgB;AACnC,SAAS,mBAAAA,kBAAiB,mBAAAC,wBAAuB;;;ACVjD,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAC5B,SAAS,+BAA+B;AACxC,SAAS,uBAAuB;;;ACHhC,SAAS,iBAAiB,2BAA2B;AAQrD,SAAS,uBAAuB,KAAoB;AAClD,QAAM,EAAE,SAAS,EAAE,IAAI,IAAI,aAAa,CAAC;AACzC,QAAM,WAAW,oBAAoB,CAAC,IAAI,KAAK,IAAI,GAAG,GAAG,CAAC,CAAC,SAAS,GAAG,SAAS,CAAC,CAAC;AAClF,SAAO,WAAW,SAAS,IAAI,KAAK,EAAE,QAAQ,CAAC,CAAC;AAClD;AAEA,SAAS,yBAAyB,KAAoB;AACpD,QAAM,EAAE,QAAQ,EAAE,IAAI,IAAI,aAAa,CAAC;AAExC,MAAI,IAAI,OAAO;AACb,UAAMC,YAAW,oBAAoB,CAAC,IAAI,KAAK,IAAI,GAAG,GAAG,CAAC,CAAC,QAAQ,KAAK,CAAC,QAAQ,CAAC,CAAC;AACnF,WAAO,KAAK,WAAWA,UAAS,IAAI,KAAK,EAAE,QAAQ,CAAC,CAAC;AAAA,EACvD;AAEA,QAAM,WAAW,oBAAoB,CAAC,IAAI,KAAK,IAAI,GAAG,GAAG,CAAC,CAAC,QAAQ,GAAG,QAAQ,CAAC,CAAC;AAChF,SAAO,WAAW,SAAS,IAAI,KAAK,EAAE,QAAQ,CAAC,CAAC;AAClD;AAEA,SAAS,eAAe,KAAoB;AAC1C,QAAM,UAAU,gBAAgB,IAAI,OAAO,IAAI,KAAK,IAAI,GAAG,IAAI;AAE/D,MAAI,IAAI,mBAAmB,UAAU;AACnC,WAAO,GAAG;AAAA,EACZ;AAEA,QAAM,SAAS,IAAI,aAAa,uBAAuB,GAAG,IAAI,yBAAyB,GAAG;AAC1F,SAAO,QAAQ,cAAc;AAC/B;AAEA,SAAS,cAAc,KAAoB;AACzC,MAAI,aAAmC;AACvC,MAAI,IAAI,mBAAmB,aAAa,CAAC,IAAI,sBAAsB;AACjE,iBAAa;AAAA,EACf;AACA,SAAO;AACT;AAEA,SAAS,cAAc,KAA2B;AAChD,QAAM,gBAAgB,IAAI,aAAa,WAAW,IAAI,QAAQ,UAAU;AACxE,SAAO;AAAA,IACL,YAAY,cAAc,GAAG;AAAA,IAC7B,UAAU;AAAA,IACV,WAAW;AAAA,IACX,CAAC,aAAa,GAAG;AAAA,EACnB;AACF;AAMA,SAAS,gBAAgB,KAAU;AACjC,MAAI,QAAQ;AACZ,MAAI,MAAM,GAAG,MAAM,IAAI;AAEvB,MAAI,IAAI,WAAW,UAAU;AAC3B,UAAM,aAAa,IAAI,eAAe;AACtC,YAAQ,aAAa,GAAG,IAAI,kBAAkB;AAC9C,UAAM,aAAa,QAAQ;AAAA,EAC7B;AAEA,SAAO,EAAE,OAAO,IAAI;AACtB;AAEA,SAAS,cAAc,KAAyD;AAC9E,MAAI,IAAI,YAAY;AAClB,WAAO;AAAA,MACL,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,KAAK;AAAA,IACP;AAAA,EACF;AAEA,SAAO;AAAA,IACL,UAAU;AAAA,IACV,CAAC,IAAI,QAAQ,UAAU,MAAM,GAAG;AAAA,IAChC,CAAC,IAAI,QAAQ,SAAS,OAAO,GAAG;AAAA,EAClC;AACF;AAMA,SAAS,kBAAyB;AAChC,SAAO;AAAA,IACL,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,UAAU;AAAA,EACZ;AACF;AAMA,SAAS,aAAa,KAAiB;AACrC,QAAM,QAAQ,gBAAgB,GAAG;AACjC,SAAO;AAAA,IACL,4BAA4B,IAAI,aAAa,oBAAoB;AAAA,IACjE,yBAAyB,eAAe,GAAG;AAAA,IAC3C,wBAAwB,MAAM;AAAA,IAC9B,sBAAsB,MAAM;AAAA,EAC9B;AACF;AAMA,SAAS,eAAe,KAAoD,SAAwB;AAClG,SAAO;AAAA,IACL,UAAU;AAAA,IACV,eAAe;AAAA,IACf,CAAC,IAAI,eAAe,SAAS,QAAQ,GAAG,IAAI,IAAI,QAAQ,IAAI,UAAU,WAAW;AAAA,EACnF;AACF;AAMA,SAAS,gBAAuB;AAC9B,SAAO,EAAE,YAAY,OAAO;AAC9B;AAMA,SAAS,gBAAuB;AAC9B,SAAO,EAAE,UAAU,WAAW;AAChC;AAMA,SAAS,sBAA6B;AACpC,SAAO;AAAA,IACL,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,UAAU;AAAA,EACZ;AACF;AAEO,IAAM,SAAS;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;;;AD7JO,IAAM,MAAM,YAAY;AAAA,EAC7B,GAAG;AAAA,EAEH,WAAW,CAAC,QAAa,IAAI,KAAK,QAAQ,UAAU,IAAI;AAAA,EACxD,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,UAAU,IAAI;AAAA,EAC1D,cAAc,CAAC,QAAa,IAAI,KAAK,WAAW,UAAU,IAAI;AAAA,EAC9D,kBAAkB,CAAC,QAAa,IAAI,KAAK,eAAe,UAAU,IAAI;AAAA,EACtE,aAAa,CAAC,QAAa,IAAI,KAAK,UAAU,UAAU,IAAI;AAAA,EAC5D,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,UAAU,IAAI;AAAA,EAC1D,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,UAAU,IAAI;AAAA,EAC1D,YAAY,CAAC,QAAa,IAAI,KAAK,SAAS,UAAU,IAAI;AAAA,EAC1D,aAAa,CAAC,KAAU,UAAkB,UAAU,IAAI,aAAa;AAAA,EAErE,WAAW,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,UAAU,GAAG,CAAC;AAAA,EAC5D,YAAY,CAAC,QAAa,IAAI,QAAQ,KAAK,IAAI,WAAW,GAAG,CAAC;AAAA,EAC9D,cAAc,CAAC,QAAa,IAAI,UAAU,KAAK,IAAI,aAAa,GAAG,CAAC;AAAA,EACpE,kBAAkB,CAAC,QAAa,IAAI,QAA0B,KAAK,IAAI,iBAAiB,GAAG,CAAC;AAAA,EAE5F,kBAAkB,KAAU,OAAkC;AAC5D,UAAM,gBAAgB,iBAAiB,OAAO,IAAI,aAAa,GAAG,CAAC;AACnE,UAAM,UAAU,cAAc,gBAAgB;AAAA,MAC5C,aAAa,IAAI;AAAA,MACjB,KAAK,IAAI;AAAA,MACT,UAAU,EAAE,GAAG,KAAK;AAAA,IACtB,CAAC;AACD,WAAO,gBAAgB,SAAS,IAAI,KAAK,IAAI,KAAK,IAAI,IAAI;AAAA,EAC5D;AAAA,EAEA,oBAAoB,KAAU;AAC5B,UAAM,QAAQ,IAAI,iBAAiB,GAAG;AACtC,QAAI,CAAC;AAAO;AACZ,4BAAwB,OAAO,EAAE,OAAO,IAAI,MAAM,CAAC;AAAA,EACrD;AACF,CAAC;;;ADxBM,SAAS,QAA6B,OAAc,MAAY,WAA8B;AACnG,QAAM,YAAY,MAAM,QAAQ,YAAY;AAC5C,QAAM,iBAAiB,MAAM,QAAQ,iBAAiB;AACtD,QAAM,gBAAgB,MAAM,QAAQ,mBAAmB,MAAM,QAAQ,KAAK;AAE1E,QAAM,YAAY,MAAM,QAAQ,OAAO;AACvC,QAAM,aAAa,MAAM,QAAQ,UAAU;AAC3C,QAAM,aAAa,MAAM,QAAQ;AACjC,QAAM,gBAAgB,MAAM,QAAQ;AACpC,QAAM,YAAY,MAAM,QAAQ;AAEhC,WAAS,kBAAkB,SAAiB;AAC1C,WAAOC,iBAAgB,SAAS,MAAM,QAAQ,KAAK,MAAM,QAAQ,KAAK,MAAM,QAAQ,IAAI;AAAA,EAC1F;AAEA,WAAS,kBAAkB,OAAe;AACxC,WAAOC,iBAAgB,OAAO,MAAM,QAAQ,KAAK,MAAM,QAAQ,GAAG;AAAA,EACpE;AAIA,SAAO;AAAA;AAAA;AAAA;AAAA,IAIL;AAAA;AAAA;AAAA;AAAA,IAIA;AAAA;AAAA;AAAA;AAAA,IAIA,OAAO,MAAM,QAAQ;AAAA;AAAA;AAAA;AAAA,IAIrB,SAASA,iBAAgB,MAAM,QAAQ,OAAO,MAAM,QAAQ,KAAK,MAAM,QAAQ,GAAG;AAAA;AAAA;AAAA;AAAA,IAIlF,SAAS,OAAe;AACtB,WAAK,EAAE,MAAM,aAAa,MAAM,CAAC;AAAA,IACnC;AAAA;AAAA;AAAA;AAAA,IAIA,iBAAiB;AAAA;AAAA;AAAA;AAAA,IAIjB,iBAAiB;AAAA;AAAA;AAAA;AAAA,IAIjB,QAAQ;AACN,UAAI,WAAW,MAAM,OAAO,GAAG,MAAM;AAAA,IACvC;AAAA;AAAA;AAAA;AAAA,IAIA,YAAY;AACV,WAAK,WAAW;AAAA,IAClB;AAAA;AAAA;AAAA;AAAA,IAIA,YAAY;AACV,WAAK,WAAW;AAAA,IAClB;AAAA,IAEA,WAAW,UAAU,QAAQ;AAAA,MAC3B,GAAG,MAAM,KAAK;AAAA,MACd,iBAAiB,SAAS,UAAU;AAAA,MACpC,cAAc,SAAS,SAAS;AAAA,MAChC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,gBAAgB,SAAS,SAAS;AAAA,MAClC,IAAI,IAAI,UAAU,MAAM,OAAO;AAAA,MAC/B,KAAK,MAAM,QAAQ;AAAA,MACnB,OAAO,IAAI,aAAa,MAAM,OAAO;AAAA,IACvC,CAAC;AAAA,IAED,YAAY,UAAU,MAAM;AAAA,MAC1B,GAAG,MAAM,MAAM;AAAA,MACf,iBAAiB,SAAS,UAAU;AAAA,MACpC,gBAAgB,SAAS,SAAS;AAAA,MAClC,cAAc,SAAS,SAAS;AAAA,MAChC,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,SAAS,IAAI,iBAAiB,MAAM,OAAO;AAAA,MAC3C,QAAQ,OAAO;AACb,YAAI,CAAC;AAAe;AACpB,cAAM,eAAe;AACrB,YAAI,WAAW,MAAM,OAAO,GAAG,MAAM;AAAA,MACvC;AAAA,MACA,OAAO,IAAI,cAAc;AAAA,IAC3B,CAAC;AAAA,IAED,YAAY,UAAU,QAAQ;AAAA,MAC5B,GAAG,MAAM,MAAM;AAAA,MACf,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,iBAAiB,SAAS,UAAU;AAAA,MACpC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,cAAc,SAAS,SAAS;AAAA,MAChC,WAAW;AAAA,MACX,gBAAgB,SAAS,SAAS;AAAA,MAClC,gBAAgB,SAAS,SAAS;AAAA,MAClC,iBAAiB,SAAS,UAAU;AAAA,MACpC,cAAc;AAAA,MACd,mBAAmB,YAAY,SAAY,kBAAkB,IAAI,WAAW,MAAM,OAAO;AAAA,MACzF,oBAAoB,MAAM,QAAQ;AAAA,MAClC,iBAAiB,MAAM,QAAQ;AAAA,MAC/B,iBAAiB,MAAM,QAAQ;AAAA,MAC/B,iBAAiB,MAAM,QAAQ;AAAA,MAC/B,kBAAkB;AAAA,MAClB,MAAM;AAAA,MACN,UAAU,aAAa,SAAY;AAAA,MACnC,SAAS;AACP,YAAI,CAAC;AAAe;AACpB,aAAK,MAAM;AAAA,MACb;AAAA,MACA,UAAU;AACR,YAAI,CAAC;AAAe;AACpB,aAAK,OAAO;AAAA,MACd;AAAA,MACA,UAAU,OAAO;AACf,YAAI,CAAC;AAAe;AACpB,cAAM,OAAO,aAAa,KAAK,IAAI,MAAM,QAAQ;AACjD,YAAI,UAAU;AACd,cAAM,SAAsB;AAAA,UAC1B,UAAU;AACR,iBAAK,EAAE,MAAM,YAAY,KAAK,CAAC;AAC/B,sBAAU,MAAM,QAAQ;AAAA,UAC1B;AAAA,UACA,YAAY;AACV,iBAAK,EAAE,MAAM,cAAc,KAAK,CAAC;AACjC,sBAAU,MAAM,QAAQ;AAAA,UAC1B;AAAA,UACA,YAAY;AACV,iBAAK,EAAE,MAAM,cAAc,KAAK,CAAC;AACjC,sBAAU,MAAM,QAAQ;AAAA,UAC1B;AAAA,UACA,aAAa;AACX,iBAAK,EAAE,MAAM,eAAe,KAAK,CAAC;AAClC,sBAAU,MAAM,QAAQ;AAAA,UAC1B;AAAA,UACA,SAAS;AACP,iBAAK,EAAE,MAAM,WAAW,KAAK,CAAC;AAAA,UAChC;AAAA,UACA,WAAW;AACT,iBAAK,EAAE,MAAM,aAAa,KAAK,CAAC;AAAA,UAClC;AAAA,UACA,OAAO;AACL,iBAAK,MAAM;AAAA,UACb;AAAA,UACA,MAAM;AACJ,iBAAK,KAAK;AAAA,UACZ;AAAA,QACF;AAEA,cAAM,MAAM,YAAY,OAAO,MAAM,OAAO;AAC5C,cAAM,OAAO,OAAO,GAAG;AAEvB,YAAI,CAAC;AAAM;AACX,aAAK,KAAK;AAEV,YAAI,SAAS;AACX,gBAAM,eAAe;AAAA,QACvB;AAAA,MACF;AAAA,MACA,OAAO,IAAI,cAAc,MAAM,OAAO;AAAA,IACxC,CAAC;AAAA,IAED,kBAAkB,UAAU,MAAM;AAAA,MAChC,GAAG,MAAM,YAAY;AAAA,MACrB,MAAM;AAAA,MACN,cAAc,MAAM,QAAQ;AAAA,MAC5B,MAAM,MAAM,QAAQ;AAAA,MACpB,MAAM,MAAM,QAAQ;AAAA,MACpB,IAAI,IAAI,iBAAiB,MAAM,OAAO;AAAA,MACtC,QAAQ;AAAA,IACV,CAAC;AAAA,IAED,aAAa,UAAU,OAAO;AAAA,MAC5B,GAAG,MAAM,OAAO;AAAA,MAChB,iBAAiB,SAAS,UAAU;AAAA,MACpC,gBAAgB,SAAS,SAAS;AAAA,MAClC,IAAI,IAAI,YAAY,MAAM,OAAO;AAAA,MACjC,SAAS,IAAI,iBAAiB,MAAM,OAAO;AAAA,MAC3C,aAAa;AAAA,IACf,CAAC;AAAA,IAED,YAAY,UAAU,QAAQ;AAAA,MAC5B,GAAG,MAAM,MAAM;AAAA,MACf,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,iBAAiB,SAAS,UAAU;AAAA,MACpC,cAAc,SAAS,SAAS;AAAA,MAChC,gBAAgB,SAAS,SAAS;AAAA,MAClC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,OAAO,IAAI,cAAc;AAAA,IAC3B,CAAC;AAAA,IAED,YAAY,UAAU,QAAQ;AAAA,MAC5B,GAAG,MAAM,MAAM;AAAA,MACf,IAAI,IAAI,WAAW,MAAM,OAAO;AAAA,MAChC,cAAc,SAAS,SAAS;AAAA,MAChC,gBAAgB,SAAS,SAAS;AAAA,MAClC,iBAAiB,SAAS,UAAU;AAAA,MACpC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,OAAO,IAAI,cAAc,MAAM,OAAO;AAAA,IACxC,CAAC;AAAA,IAED,cAAc,UAAU,QAAQ;AAAA,MAC9B,GAAG,MAAM,QAAQ;AAAA,MACjB,IAAI,IAAI,aAAa,MAAM,OAAO;AAAA,MAClC,iBAAiB,SAAS,UAAU;AAAA,MACpC,gBAAgB,SAAS,SAAS;AAAA,MAClC,oBAAoB,MAAM,QAAQ;AAAA,MAClC,cAAc,SAAS,SAAS;AAAA,MAChC,cAAc,OAAO;AACnB,YAAI,CAAC;AAAe;AAEpB,cAAM,MAAM,eAAe,KAAK;AAChC,YAAI,CAAC,YAAY,GAAG,KAAK,gBAAgB,GAAG;AAAG;AAE/C,cAAM,QAAQ,cAAc,GAAG;AAC/B,aAAK,EAAE,MAAM,gBAAgB,MAAM,CAAC;AAEpC,cAAM,eAAe;AACrB,cAAM,gBAAgB;AAAA,MACxB;AAAA,MACA,OAAO,IAAI,gBAAgB;AAAA,IAC7B,CAAC;AAAA,IAED,kBAAkB,UAAU,QAAQ;AAAA,MAClC,GAAG,MAAM,YAAY;AAAA,MACrB,MAAM;AAAA,MACN,eAAe;AAAA,MACf,oBAAoB,MAAM,QAAQ;AAAA,MAClC,OAAO,IAAI,oBAAoB;AAAA,IACjC,CAAC;AAAA,IAED,eAAe,EAAE,MAAM,GAAsB;AAC3C,YAAM,UAAU,kBAAkB,KAAK;AACvC,YAAM,QAAQ,IAAI,eAAe,MAAM,SAAS,OAAO;AACvD,YAAM,cACJ,QAAQ,MAAM,QAAQ,QAAQ,eAAe,QAAQ,MAAM,QAAQ,QAAQ,gBAAgB;AAE7F,aAAO,UAAU,QAAQ;AAAA,QACvB,GAAG,MAAM,OAAO;AAAA,QAChB,IAAI,IAAI,YAAY,MAAM,SAAS,KAAK;AAAA,QACxC,MAAM;AAAA,QACN,oBAAoB,MAAM,QAAQ;AAAA,QAClC,cAAc;AAAA,QACd,iBAAiB,SAAS,UAAU;AAAA,QACpC,cAAc;AAAA,QACd;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACF;;;AGnRA,SAAS,qBAAqB;AAC9B,SAAS,wBAAwB;AACjC,SAAS,WAAW;AACpB,SAAS,wBAAwB;AACjC,SAAS,wBAAwB;AACjC,SAAS,cAAAC,aAAY,mBAAAC,wBAAuB;AAC5C,SAAS,eAAe;;;ACNxB,SAAS,YAAY,kBAAkB,sBAAsB,uBAAuB;AAO7E,SAAS,eAAe,KAAU,OAAe;AACtD,QAAM,YAAY,gBAAgB,OAAO,IAAI,KAAK,IAAI,KAAK,IAAI,IAAI;AACnE,SAAO,WAAW,WAAW,IAAI,KAAK,IAAI,GAAG;AAC/C;AAEO,SAAS,UAAU,KAAU,MAAe;AACjD,QAAM,QAAQ;AACd,QAAM,SAAS,qBAAqB,OAAO;AAAA,IACzC,GAAG;AAAA,IACH,MAAM,QAAQ,IAAI;AAAA,IAClB,QAAQ,CAAC,IAAI,KAAK;AAAA,EACpB,CAAC;AACD,SAAO,OAAO,KAAK;AACrB;AAEO,SAAS,UAAU,KAAU,MAAe;AACjD,QAAM,QAAQ;AACd,QAAM,SAAS,iBAAiB,OAAO;AAAA,IACrC,GAAG;AAAA,IACH,MAAM,QAAQ,IAAI;AAAA,IAClB,QAAQ,CAAC,IAAI,KAAK;AAAA,EACpB,CAAC;AACD,SAAO,OAAO,KAAK;AACrB;;;ADnBO,SAAS,QAAQ,aAAiC;AACvD,QAAM,MAAM,QAAQ,WAAW;AAC/B,SAAO;AAAA,IACL;AAAA,MACE,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,SAAS;AAAA,QACP,WAAW;AAAA,QACX,gBAAgB;AAAA,QAChB,UAAU;AAAA,QACV,WAAW;AAAA,QACX,KAAK;AAAA,QACL,QAAQ;AAAA,QACR,aAAa;AAAA,QACb,cAAc;AAAA,QACd,OAAO;AAAA,QACP,MAAM;AAAA,QACN,KAAK;AAAA,QACL,KAAK;AAAA,QACL,GAAG;AAAA,MACL;AAAA,MAEA,UAAU;AAAA,QACR,cAAc,CAACC,SAAQA,KAAI,gBAAgB;AAAA,QAC3C,YAAY,CAACA,SAAQA,KAAI,gBAAgB;AAAA,QACzC,OAAO,CAACA,SAAQA,KAAI,gBAAgB,gBAAgBA,KAAI,QAAQ;AAAA,QAChE,eAAe,CAACA,SAAQ,EAAEA,KAAI,YAAYA,KAAI;AAAA,QAC9C,sBAAsB,CAACA,SAAQA,KAAI,cAAc;AAAA,QACjD,cAAc,CAACA,SAAQ,MAAMC,iBAAgBD,KAAI,OAAOA,KAAI,KAAKA,KAAI,GAAG;AAAA,MAC1E;AAAA,MAEA,OAAO;AAAA,QACL,OAAO,CAAC,kBAAkB,qBAAqB;AAAA,MACjD;AAAA,MAEA,YAAY,CAAC,yBAAyB,gBAAgB;AAAA,MAEtD,IAAI;AAAA,QACF,WAAW;AAAA,UACT,SAAS;AAAA,QACX;AAAA,QACA,WAAW;AAAA,UACT,SAAS;AAAA,QACX;AAAA,QACA,WAAW;AAAA,UACT,SAAS;AAAA,QACX;AAAA,MACF;AAAA,MAEA,OAAO,CAAC,YAAY;AAAA,MAEpB,QAAQ;AAAA,QACN,MAAM;AAAA,UACJ,IAAI;AAAA,YACF,cAAc;AAAA,cACZ,QAAQ;AAAA,cACR,SAAS,CAAC,mBAAmB,uBAAuB,YAAY;AAAA,YAClE;AAAA,YACA,OAAO;AAAA,UACT;AAAA,QACF;AAAA,QAEA,OAAO;AAAA,UACL,OAAO;AAAA,UACP,IAAI;AAAA,YACF,cAAc;AAAA,cACZ,QAAQ;AAAA,cACR,SAAS,CAAC,mBAAmB,uBAAuB,YAAY;AAAA,YAClE;AAAA,YACA,YAAY;AAAA,cACV,OAAO;AAAA,cACP,SAAS;AAAA,YACX;AAAA,YACA,aAAa;AAAA,cACX,OAAO;AAAA,cACP,SAAS;AAAA,YACX;AAAA,YACA,UAAU;AAAA,cACR,OAAO;AAAA,cACP,SAAS;AAAA,YACX;AAAA,YACA,YAAY;AAAA,cACV,OAAO;AAAA,cACP,SAAS;AAAA,YACX;AAAA,YACA,SAAS;AAAA,cACP,SAAS;AAAA,YACX;AAAA,YACA,WAAW;AAAA,cACT,SAAS;AAAA,YACX;AAAA,YACA,MAAM;AAAA,cACJ,SAAS;AAAA,YACX;AAAA,YACA,KAAK;AAAA,cACH,SAAS;AAAA,YACX;AAAA,YACA,MAAM;AAAA,UACR;AAAA,QACF;AAAA,QAEA,UAAU;AAAA,UACR,OAAO;AAAA,UACP,YAAY;AAAA,UACZ,IAAI;AAAA,YACF,YAAY;AAAA,cACV,QAAQ;AAAA,cACR,SAAS;AAAA,YACX;AAAA,YACA,cAAc;AAAA,cACZ,SAAS;AAAA,YACX;AAAA,UACF;AAAA,QACF;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE,QAAQ;AAAA,QACN,cAAc,CAACA,SAAQA,KAAI;AAAA,QAC3B,YAAY,CAACA,SAAQA,KAAI;AAAA,MAC3B;AAAA,MAEA,YAAY;AAAA,QACV,sBAAsBA,MAAK;AACzB,iBAAO,iBAAiB,IAAI,iBAAiBA,IAAG,GAAG;AAAA,YACjD,qBAAqB;AACnB,cAAAA,KAAI,WAAW;AAAA,YACjB;AAAA,YACA,cAAc;AACZ,kBAAIA,KAAI,gBAAgB,MAAM;AAC5B,gBAAAA,KAAI,QAAQA,KAAI;AAAA,cAClB;AAAA,YACF;AAAA,UACF,CAAC;AAAA,QACH;AAAA,QAEA,iBAAiBA,MAAK,MAAM,EAAE,KAAK,GAAG;AACpC,iBAAO,iBAAiB,IAAI,OAAOA,IAAG,GAAG;AAAA,YACvC,cAAc,MAAM;AAClB,mBAAK,EAAE,MAAM,gBAAgB,OAAO,KAAK,MAAM,CAAC;AAAA,YAClD;AAAA,YACA,cAAc;AACZ,mBAAK,YAAY;AAAA,YACnB;AAAA,UACF,CAAC;AAAA,QACH;AAAA,QACA,eAAeA,MAAK,MAAM;AACxB,cAAIA,KAAI,mBAAmB;AAAW;AACtC,iBAAO,iBAAiB,IAAI,WAAWA,IAAG,GAAG,CAAC,SAAS;AACrD,gBAAI;AAAM,cAAAA,KAAI,YAAY;AAAA,UAC5B,CAAC;AAAA,QACH;AAAA,MACF;AAAA,MAEA,SAAS;AAAA,QACP,WAAWA,MAAK;AACd,gBAAM,QAAQ,eAAeA,MAAKA,KAAI,KAAK;AAC3C,UAAAA,KAAI,QAAQ;AACZ,UAAAA,KAAI,eAAe;AAAA,QACrB;AAAA,QACA,oBAAoBA,MAAK;AACvB,UAAAA,KAAI,gBAAgB,EAAE,OAAOA,KAAI,MAAM,CAAC;AAAA,QAC1C;AAAA,QACA,kBAAkBA,MAAK;AACrB,UAAAA,KAAI,cAAc,EAAE,OAAOA,KAAI,MAAM,CAAC;AAAA,QACxC;AAAA,QACA,eAAeA,MAAK;AAClB,UAAAA,KAAI,WAAW,EAAE,OAAOA,KAAI,MAAM,CAAC;AAAA,QACrC;AAAA,QACA,oBAAoBA,MAAK;AACvB,cAAI,oBAAoBA,IAAG;AAAA,QAC7B;AAAA,QACA,gBAAgBA,MAAK,KAAK;AACxB,gBAAM,QAAQ,IAAI,kBAAkBA,MAAK,IAAI,KAAK;AAClD,cAAI,SAAS;AAAM;AACnB,UAAAA,KAAI,QAAQE,YAAW,OAAOF,KAAI,KAAKA,KAAI,GAAG;AAAA,QAChD;AAAA,QACA,WAAWA,MAAK;AACd,cAAI,MAAM,IAAI,WAAWA,IAAG,GAAG,MAAM,CAAC;AAAA,QACxC;AAAA,QACA,UAAUA,MAAK,KAAK;AAClB,UAAAA,KAAI,QAAQ,UAAUA,MAAK,IAAI,IAAI;AAAA,QACrC;AAAA,QACA,UAAUA,MAAK,KAAK;AAClB,UAAAA,KAAI,QAAQ,UAAUA,MAAK,IAAI,IAAI;AAAA,QACrC;AAAA,QACA,SAASA,MAAK;AACZ,UAAAA,KAAI,QAAQA,KAAI;AAAA,QAClB;AAAA,QACA,SAASA,MAAK;AACZ,UAAAA,KAAI,QAAQA,KAAI;AAAA,QAClB;AAAA,QACA,SAASA,MAAK,KAAK;AACjB,UAAAA,KAAI,QAAQ,eAAeA,MAAK,IAAI,KAAK;AAAA,QAC3C;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;","names":["getPercentValue","getValuePercent","getValue","getPercentValue","getValuePercent","clampValue","getValuePercent","ctx","getValuePercent","clampValue"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zag-js/slider",
-  "version": "0.10.5",
+  "version": "0.11.0",
   "description": "Core logic for the slider widget implemented as a state machine",
   "keywords": [
     "js",
@@ -27,15 +27,15 @@
     "url": "https://github.com/chakra-ui/zag/issues"
   },
   "dependencies": {
-    "@zag-js/anatomy": "0.10.5",
-    "@zag-js/core": "0.10.5",
-    "@zag-js/dom-query": "0.10.5",
-    "@zag-js/dom-event": "0.10.5",
-    "@zag-js/form-utils": "0.10.5",
-    "@zag-js/utils": "0.10.5",
-    "@zag-js/element-size": "0.10.5",
-    "@zag-js/numeric-range": "0.10.5",
-    "@zag-js/types": "0.10.5"
+    "@zag-js/anatomy": "0.11.0",
+    "@zag-js/core": "0.11.0",
+    "@zag-js/dom-query": "0.11.0",
+    "@zag-js/dom-event": "0.11.0",
+    "@zag-js/form-utils": "0.11.0",
+    "@zag-js/utils": "0.11.0",
+    "@zag-js/element-size": "0.11.0",
+    "@zag-js/numeric-range": "0.11.0",
+    "@zag-js/types": "0.11.0"
   },
   "devDependencies": {
     "clean-package": "2.2.0"
@@ -53,7 +53,7 @@
     "./package.json": "./package.json"
   },
   "scripts": {
-    "build": "vite build -c ../../../vite.config.ts",
+    "build": "tsup",
     "lint": "eslint src --ext .ts,.tsx",
     "typecheck": "tsc --noEmit"
   }

package/dist/slider.anatomy.d.ts

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

package/dist/slider.anatomy.js

@@ -1,22 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const anatomy$1 = require('@zag-js/anatomy');
-
-const anatomy = anatomy$1.createAnatomy("slider").parts(
-  "root",
-  "label",
-  "thumb",
-  "hiddenInput",
-  "output",
-  "track",
-  "range",
-  "control",
-  "markerGroup",
-  "marker"
-);
-const parts = anatomy.build();
-
-exports.anatomy = anatomy;
-exports.parts = parts;

package/dist/slider.anatomy.mjs

@@ -1,17 +0,0 @@
-import { createAnatomy } from '@zag-js/anatomy';
-
-const anatomy = createAnatomy("slider").parts(
-  "root",
-  "label",
-  "thumb",
-  "hiddenInput",
-  "output",
-  "track",
-  "range",
-  "control",
-  "markerGroup",
-  "marker"
-);
-const parts = anatomy.build();
-
-export { anatomy, parts };

package/dist/slider.connect.d.ts

@@ -1,56 +0,0 @@
-import type { NormalizeProps, PropTypes } from "@zag-js/types";
-import type { Send, State } from "./slider.types";
-export declare function connect<T extends PropTypes>(state: State, send: Send, normalize: NormalizeProps<T>): {
-    /**
-     * Whether the slider is focused.
-     */
-    isFocused: boolean;
-    /**
-     * Whether the slider is being dragged.
-     */
-    isDragging: boolean;
-    /**
-     * The value of the slider.
-     */
-    value: number;
-    /**
-     * The value of the slider as a percent.
-     */
-    percent: number;
-    /**
-     * Function to set the value of the slider.
-     */
-    setValue(value: number): void;
-    /**
-     * Returns the value of the slider at the given percent.
-     */
-    getPercentValue: (percent: number) => number;
-    /**
-     * Returns the percent of the slider at the given value.
-     */
-    getValuePercent: (value: number) => number;
-    /**
-     * Function to focus the slider.
-     */
-    focus(): void;
-    /**
-     * Function to increment the value of the slider by the step.
-     */
-    increment(): void;
-    /**
-     * Function to decrement the value of the slider by the step.
-     */
-    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"];
-};

package/dist/slider.connect.js

@@ -1,255 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-
-const domEvent = require('@zag-js/dom-event');
-const domQuery = require('@zag-js/dom-query');
-const numericRange = require('@zag-js/numeric-range');
-const slider_anatomy = require('./slider.anatomy.js');
-const slider_dom = require('./slider.dom.js');
-
-function connect(state, send, normalize) {
-  const ariaLabel = state.context["aria-label"];
-  const ariaLabelledBy = state.context["aria-labelledby"];
-  const ariaValueText = state.context.getAriaValueText?.(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;
-  function getPercentValueFn(percent) {
-    return numericRange.getPercentValue(percent, state.context.min, state.context.max, state.context.step);
-  }
-  function getValuePercentFn(value) {
-    return numericRange.getValuePercent(value, state.context.min, state.context.max);
-  }
-  return {
-    /**
-     * Whether the slider is focused.
-     */
-    isFocused,
-    /**
-     * Whether the slider is being dragged.
-     */
-    isDragging,
-    /**
-     * The value of the slider.
-     */
-    value: state.context.value,
-    /**
-     * The value of the slider as a percent.
-     */
-    percent: numericRange.getValuePercent(state.context.value, state.context.min, state.context.max),
-    /**
-     * Function to set the value of the slider.
-     */
-    setValue(value) {
-      send({ type: "SET_VALUE", value });
-    },
-    /**
-     * Returns the value of the slider at the given percent.
-     */
-    getPercentValue: getPercentValueFn,
-    /**
-     * Returns the percent of the slider at the given value.
-     */
-    getValuePercent: getValuePercentFn,
-    /**
-     * Function to focus the slider.
-     */
-    focus() {
-      slider_dom.dom.getThumbEl(state.context)?.focus();
-    },
-    /**
-     * Function to increment the value of the slider by the step.
-     */
-    increment() {
-      send("INCREMENT");
-    },
-    /**
-     * Function to decrement the value of the slider by the step.
-     */
-    decrement() {
-      send("DECREMENT");
-    },
-    rootProps: normalize.element({
-      ...slider_anatomy.parts.root.attrs,
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-focus": domQuery.dataAttr(isFocused),
-      "data-orientation": state.context.orientation,
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      id: slider_dom.dom.getRootId(state.context),
-      dir: state.context.dir,
-      style: slider_dom.dom.getRootStyle(state.context)
-    }),
-    labelProps: normalize.label({
-      ...slider_anatomy.parts.label.attrs,
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      "data-focus": domQuery.dataAttr(isFocused),
-      id: slider_dom.dom.getLabelId(state.context),
-      htmlFor: slider_dom.dom.getHiddenInputId(state.context),
-      onClick(event) {
-        if (!isInteractive)
-          return;
-        event.preventDefault();
-        slider_dom.dom.getThumbEl(state.context)?.focus();
-      },
-      style: slider_dom.dom.getLabelStyle()
-    }),
-    thumbProps: normalize.element({
-      ...slider_anatomy.parts.thumb.attrs,
-      id: slider_dom.dom.getThumbId(state.context),
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-orientation": state.context.orientation,
-      "data-focus": domQuery.dataAttr(isFocused),
-      draggable: false,
-      "aria-invalid": domQuery.ariaAttr(isInvalid),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      "aria-disabled": domQuery.ariaAttr(isDisabled),
-      "aria-label": ariaLabel,
-      "aria-labelledby": ariaLabel ? void 0 : ariaLabelledBy ?? slider_dom.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 = domEvent.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 = domEvent.getEventKey(event, state.context);
-        const exec = keyMap[key];
-        if (!exec)
-          return;
-        exec(event);
-        if (prevent) {
-          event.preventDefault();
-        }
-      },
-      style: slider_dom.dom.getThumbStyle(state.context)
-    }),
-    hiddenInputProps: normalize.input({
-      ...slider_anatomy.parts.hiddenInput.attrs,
-      type: "text",
-      defaultValue: state.context.value,
-      name: state.context.name,
-      form: state.context.form,
-      id: slider_dom.dom.getHiddenInputId(state.context),
-      hidden: true
-    }),
-    outputProps: normalize.output({
-      ...slider_anatomy.parts.output.attrs,
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      id: slider_dom.dom.getOutputId(state.context),
-      htmlFor: slider_dom.dom.getHiddenInputId(state.context),
-      "aria-live": "off"
-    }),
-    trackProps: normalize.element({
-      ...slider_anatomy.parts.track.attrs,
-      id: slider_dom.dom.getTrackId(state.context),
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-focus": domQuery.dataAttr(isFocused),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      "data-orientation": state.context.orientation,
-      style: slider_dom.dom.getTrackStyle()
-    }),
-    rangeProps: normalize.element({
-      ...slider_anatomy.parts.range.attrs,
-      id: slider_dom.dom.getRangeId(state.context),
-      "data-focus": domQuery.dataAttr(isFocused),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-orientation": state.context.orientation,
-      style: slider_dom.dom.getRangeStyle(state.context)
-    }),
-    controlProps: normalize.element({
-      ...slider_anatomy.parts.control.attrs,
-      id: slider_dom.dom.getControlId(state.context),
-      "data-disabled": domQuery.dataAttr(isDisabled),
-      "data-invalid": domQuery.dataAttr(isInvalid),
-      "data-orientation": state.context.orientation,
-      "data-focus": domQuery.dataAttr(isFocused),
-      onPointerDown(event) {
-        if (!isInteractive)
-          return;
-        const evt = domEvent.getNativeEvent(event);
-        if (!domEvent.isLeftClick(evt) || domEvent.isModifiedEvent(evt))
-          return;
-        const point = domEvent.getEventPoint(evt);
-        send({ type: "POINTER_DOWN", point });
-        event.preventDefault();
-        event.stopPropagation();
-      },
-      style: slider_dom.dom.getControlStyle()
-    }),
-    markerGroupProps: normalize.element({
-      ...slider_anatomy.parts.markerGroup.attrs,
-      role: "presentation",
-      "aria-hidden": true,
-      "data-orientation": state.context.orientation,
-      style: slider_dom.dom.getMarkerGroupStyle()
-    }),
-    getMarkerProps({ value }) {
-      const percent = getValuePercentFn(value);
-      const style = slider_dom.dom.getMarkerStyle(state.context, percent);
-      const markerState = value > state.context.value ? "over-value" : value < state.context.value ? "under-value" : "at-value";
-      return normalize.element({
-        ...slider_anatomy.parts.marker.attrs,
-        id: slider_dom.dom.getMarkerId(state.context, value),
-        role: "presentation",
-        "data-orientation": state.context.orientation,
-        "data-value": value,
-        "data-disabled": domQuery.dataAttr(isDisabled),
-        "data-state": markerState,
-        style
-      });
-    }
-  };
-}
-
-exports.connect = connect;