@zag-js/slider 0.16.0 → 0.17.0

package/src/slider.types.ts

@@ -97,61 +97,12 @@ type PublicContext = DirectionProperty &
      * - `contain`: the thumb will be contained within the bounds of the track.
      */
     thumbAlignment?: "contain" | "center"
+    /**
+     * The slider thumb dimensions.If not provided, the thumb size will be measured automatically.
+     */
+    thumbSize: { width: number; height: number } | null
   }
 
-export type PublicApi<T extends PropTypes = PropTypes> = {
-  /**
-   * 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"]
-}
-
 export type UserDefinedContext = RequiredBy<PublicContext, "id">
 
 type ComputedContext = Readonly<{
@@ -159,49 +110,50 @@ type ComputedContext = Readonly<{
    * @computed
    * Whether the slider is interactive
    */
-  readonly isInteractive: boolean
+  isInteractive: boolean
   /**
    * @computed
    * Whether the thumb size has been measured
    */
-  readonly hasMeasuredThumbSize: boolean
+  hasMeasuredThumbSize: boolean
   /**
    * @computed
    * Whether the slider is horizontal
    */
-  readonly isHorizontal: boolean
+  isHorizontal: boolean
   /**
    * @computed
    * Whether the slider is vertical
    */
-  readonly isVertical: boolean
+  isVertical: boolean
   /**
    * @computed
    * Whether the slider is in RTL mode
    */
-  readonly isRtl: boolean
+  isRtl: boolean
   /**
    * @computed
    * The value of the slider as a percentage
    */
-  readonly valuePercent: number
+  valuePercent: number
+  /**
+   * @computed
+   * Whether the slider is disabled
+   */
+  isDisabled: boolean
 }>
 
 type PrivateContext = Context<{
   /**
-   * @internal The move threshold of the slider thumb before it is considered to be moved
+   * @internal
+   * The move threshold of the slider thumb before it is considered to be moved
    */
   threshold: number
-  /**
-   * @internal The slider thumb dimensions
-   */
-  thumbSize: { width: number; height: number } | null
   /**
    * @internal
-   * The value of the slider when it was initially rendered.
-   * Used when the `form.reset(...)` is called.
+   * Whether the slider fieldset is disabled
    */
-  initialValue: number | null
+  fieldsetDisabled: boolean
 }>
 
 export type MachineContext = PublicContext & ComputedContext & PrivateContext
@@ -233,3 +185,56 @@ export type Point = {
   x: number
   y: number
 }
+
+export type MachineApi<T extends PropTypes = PropTypes> = {
+  /**
+   * 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"]
+}