@ark-ui/solid/dist/chunk/DBNXBHAT.js

A collection of unstyled, accessible UI components for Solid, utilizing state machines for seamless interaction.

import { createSplitProps } from './ZMHI4GDJ.js';
import { ark } from './EPLBB4QN.js';
import { useEnvironmentContext } from './5QLLQM7E.js';
import { useLocaleContext } from './RVOPDSQY.js';
import { runIfFn } from './DT73WLR4.js';
import { createContext } from './THN5C4U6.js';
import { __export } from './ESLJRKWD.js';
import { createComponent, mergeProps as mergeProps$1 } from 'solid-js/web';
import { mergeProps, useMachine, normalizeProps } from '@zag-js/solid';
import * as slider from '@zag-js/slider';
import { createUniqueId, createMemo } from 'solid-js';

// src/components/slider/use-slider-context.ts
var [SliderProvider, useSliderContext] = createContext({
  hookName: "useSliderContext",
  providerName: "<SliderProvider />"
});

// src/components/slider/slider-context.tsx
var SliderContext = (props) => props.children(useSliderContext());
var SliderControl = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getControlProps(), props);
  return createComponent(ark.div, mergedProps);
};

// src/components/slider/use-slider-thumb-props-context.ts
var [SliderThumbPropsProvider, useSliderThumbPropsContext] = createContext({
  hookName: "useSliderThumbPropsContext",
  providerName: "<SliderThumbPropsProvider />"
});

// src/components/slider/slider-dragging-indicator.tsx
var SliderDraggingIndicator = (props) => {
  const slider2 = useSliderContext();
  const thumbProps = useSliderThumbPropsContext();
  const mergedProps = mergeProps(() => slider2().getDraggingIndicatorProps(thumbProps), props);
  return createComponent(ark.span, mergeProps$1(mergedProps, {
    get children() {
      return props.children || slider2().getThumbValue(thumbProps.index);
    }
  }));
};
var SliderHiddenInput = (props) => {
  const slider2 = useSliderContext();
  const thumbProps = useSliderThumbPropsContext();
  const mergedProps = mergeProps(slider2().getHiddenInputProps(thumbProps), props);
  return createComponent(ark.input, mergedProps);
};
var SliderLabel = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getLabelProps(), props);
  return createComponent(ark.label, mergedProps);
};
var SliderMarker = (props) => {
  const [markerProps, localProps] = createSplitProps()(props, ["value"]);
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getMarkerProps(markerProps), localProps);
  return createComponent(ark.span, mergedProps);
};
var SliderMarkerGroup = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getMarkerGroupProps(), props);
  return createComponent(ark.div, mergedProps);
};
var SliderRange = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getRangeProps(), props);
  return createComponent(ark.div, mergedProps);
};
var useSlider = (props) => {
  const id = createUniqueId();
  const locale = useLocaleContext();
  const environment = useEnvironmentContext();
  const machineProps = createMemo(() => ({
    id,
    dir: locale().dir,
    getRootNode: environment().getRootNode,
    ...runIfFn(props)
  }));
  const service = useMachine(slider.machine, machineProps);
  return createMemo(() => slider.connect(service, normalizeProps));
};

// src/components/slider/slider-root.tsx
var SliderRoot = (props) => {
  const [useSliderProps, localProps] = createSplitProps()(props, ["aria-label", "aria-labelledby", "defaultValue", "disabled", "form", "getAriaValueText", "id", "ids", "invalid", "max", "min", "minStepsBetweenThumbs", "name", "onFocusChange", "onValueChange", "onValueChangeEnd", "orientation", "origin", "readOnly", "step", "thumbAlignment", "thumbAlignment", "thumbSize", "value"]);
  const api = useSlider(useSliderProps);
  const mergedProps = mergeProps(() => api().getRootProps(), localProps);
  return createComponent(SliderProvider, {
    value: api,
    get children() {
      return createComponent(ark.div, mergedProps);
    }
  });
};
var SliderRootProvider = (props) => {
  const [{
    value: slider2
  }, localProps] = createSplitProps()(props, ["value"]);
  const mergedProps = mergeProps(() => slider2().getRootProps(), localProps);
  return createComponent(SliderProvider, {
    value: slider2,
    get children() {
      return createComponent(ark.div, mergedProps);
    }
  });
};
var SliderThumb = (props) => {
  const [thumbProps, localProps] = createSplitProps()(props, ["index", "name"]);
  const slider2 = useSliderContext();
  const mergedProps = mergeProps(() => slider2().getThumbProps(thumbProps), localProps);
  return createComponent(SliderThumbPropsProvider, {
    value: thumbProps,
    get children() {
      return createComponent(ark.div, mergedProps);
    }
  });
};
var SliderTrack = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getTrackProps(), props);
  return createComponent(ark.div, mergedProps);
};
var SliderValueText = (props) => {
  const api = useSliderContext();
  const mergedProps = mergeProps(() => api().getValueTextProps(), props);
  return createComponent(ark.span, mergeProps$1(mergedProps, {
    get children() {
      return props.children || api().value.join(",");
    }
  }));
};

// src/components/slider/slider.ts
var slider_exports = {};
__export(slider_exports, {
  Context: () => SliderContext,
  Control: () => SliderControl,
  DraggingIndicator: () => SliderDraggingIndicator,
  HiddenInput: () => SliderHiddenInput,
  Label: () => SliderLabel,
  Marker: () => SliderMarker,
  MarkerGroup: () => SliderMarkerGroup,
  Range: () => SliderRange,
  Root: () => SliderRoot,
  RootProvider: () => SliderRootProvider,
  Thumb: () => SliderThumb,
  Track: () => SliderTrack,
  ValueText: () => SliderValueText
});

export { SliderContext, SliderControl, SliderDraggingIndicator, SliderHiddenInput, SliderLabel, SliderMarker, SliderMarkerGroup, SliderRange, SliderRoot, SliderRootProvider, SliderThumb, SliderTrack, SliderValueText, slider_exports, useSlider, useSliderContext };