@infomaximum/ui-kit 0.18.1 → 0.19.0

package/dist/components/Slider/Slider.tokens.js

@@ -0,0 +1,17 @@
+const getSliderTokens = (theme) => ({
+  sliderDot: theme.bgContainer,
+  sliderDefault: theme.primaryBase,
+  sliderHover: theme.primaryHover,
+  sliderDisabled: theme.textHint,
+  sliderRail: theme.bgRail,
+  sliderRailHover: theme.bgRailHover,
+  sliderBorderRadius: 100,
+  /**
+   * @local Нет в Figma — внутренняя инициатива.
+   * Отступ вокруг slider'а под зону активного handle (handle растёт до 16px при hover/active).
+   */
+  sliderHandleSpacing: theme.x2
+});
+export {
+  getSliderTokens
+};

package/dist/components/Slider/Slider.types.d.ts

@@ -0,0 +1,54 @@
+import { Interpolation } from '@emotion/react';
+import { ReactNode } from 'react';
+import { Theme } from 'themes';
+import { BaseTooltipPlacementType } from '../BaseTooltip/BaseTooltip.types';
+import { SliderTokens } from './Slider.tokens';
+export type GetStyle = (sliderTokens: SliderTokens, theme: Theme) => Interpolation;
+export interface SliderTooltipProps {
+    open?: boolean;
+    placement?: BaseTooltipPlacementType;
+    formatter?: ((v: number) => ReactNode) | null;
+    getPopupContainer?: (node: HTMLElement) => HTMLElement;
+}
+export interface SliderStyles {
+    root?: GetStyle;
+    rail?: GetStyle;
+    track?: GetStyle;
+    handle?: GetStyle;
+}
+interface SliderCommonProps {
+    /** @default 0 */
+    min?: number;
+    /** @default 100 */
+    max?: number;
+    /** @default 1 */
+    step?: number | null;
+    /** @default false */
+    disabled?: boolean;
+    /** @default "horizontal" */
+    orientation?: "horizontal" | "vertical";
+    tooltip?: SliderTooltipProps;
+    styles?: SliderStyles;
+    "test-id"?: string;
+}
+export interface SingleSliderProps extends SliderCommonProps {
+    /** @default false */
+    range?: false;
+    value?: number;
+    defaultValue?: number;
+    onChange?: (v: number) => void;
+    onChangeComplete?: (v: number) => void;
+}
+export interface RangeSliderProps extends SliderCommonProps {
+    range: true;
+    value?: [number, number];
+    defaultValue?: [number, number];
+    onChange?: (v: [number, number]) => void;
+    onChangeComplete?: (v: [number, number]) => void;
+}
+export type SliderProps = SingleSliderProps | RangeSliderProps;
+export interface SliderRendererBaseProps extends Pick<SliderProps, "styles" | "test-id"> {
+    tokens: SliderTokens;
+    vertical: boolean;
+}
+export {};

package/dist/components/Slider/Slider.utils.d.ts

@@ -0,0 +1,19 @@
+import { HandleIndex } from './hooks/useSliderDrag/useSliderDrag.types';
+import { SliderTooltipProps } from './Slider.types';
+export declare const railSuffix = "_rail";
+export declare const trackSuffix = "_track";
+export declare const handleSuffix = "_handle_";
+export declare const tooltipSuffix = "_tooltip_";
+export declare const emptyTooltip: SliderTooltipProps;
+export declare const clampToStep: (value: number, min: number, max: number, step: number) => number;
+export declare const validateStep: (step: number | null | undefined) => number | null;
+export declare const valueToPercent: (value: number, min: number, max: number) => number;
+export declare const percentToValue: (percent: number, min: number, max: number, step: number) => number;
+export declare function clampToStepRange({ nextValue, activeIndex, otherValue, min, max, step, }: {
+    nextValue: number;
+    activeIndex: HandleIndex;
+    otherValue: number;
+    min: number;
+    max: number;
+    step: number | null;
+}): number;

package/dist/components/Slider/Slider.utils.js

@@ -0,0 +1,62 @@
+import { clamp } from "lodash-es";
+const railSuffix = "_rail";
+const trackSuffix = "_track";
+const handleSuffix = "_handle_";
+const tooltipSuffix = "_tooltip_";
+const emptyTooltip = {};
+const clampToStep = (value, min, max, step) => {
+  const clampedRaw = clamp(value, min, max);
+  const steps = Math.round((clampedRaw - min) / step);
+  return clamp(min + steps * step, min, max);
+};
+const validateStep = (step) => {
+  if (step === void 0) {
+    return 1;
+  }
+  if (step === null) {
+    return null;
+  }
+  if (step <= 0) {
+    console.warn("[Slider] step must be greater than 0. Falling back to step=1.");
+    return 1;
+  }
+  return step;
+};
+const valueToPercent = (value, min, max) => {
+  if (max === min) {
+    return 0;
+  }
+  return (value - min) / (max - min) * 100;
+};
+const percentToValue = (percent, min, max, step) => {
+  const raw = min + percent / 100 * (max - min);
+  return clampToStep(raw, min, max, step);
+};
+function clampToStepRange({
+  nextValue,
+  activeIndex,
+  otherValue,
+  min,
+  max,
+  step
+}) {
+  const effectiveStep = step ?? 0;
+  const lowerBound = activeIndex === 0 ? min : otherValue + effectiveStep;
+  const upperBound = activeIndex === 0 ? otherValue - effectiveStep : max;
+  if (step === null) {
+    return clamp(nextValue, lowerBound, upperBound);
+  }
+  return clampToStep(nextValue, lowerBound, upperBound, step);
+}
+export {
+  clampToStep,
+  clampToStepRange,
+  emptyTooltip,
+  handleSuffix,
+  percentToValue,
+  railSuffix,
+  tooltipSuffix,
+  trackSuffix,
+  validateStep,
+  valueToPercent
+};

package/dist/components/Slider/components/SliderHandle/SliderHandle.d.ts

@@ -0,0 +1,2 @@
+import { SliderHandleProps } from './SliderHandle.types';
+export declare const SliderHandle: import('react').ForwardRefExoticComponent<SliderHandleProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/Slider/components/SliderHandle/SliderHandle.js

@@ -0,0 +1,40 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef } from "react";
+import { getHandleStyle } from "./SliderHandle.styles.js";
+import { handleSuffix } from "../../Slider.utils.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const SliderHandle = forwardRef((props, ref) => {
+  var _a;
+  const {
+    index,
+    value,
+    min,
+    max,
+    percent,
+    vertical,
+    disabled,
+    isSliderActive,
+    sizeActive,
+    tokens,
+    styles,
+    "test-id": testId,
+    interactionHandlers,
+    onKeyDown,
+    onKeyUp
+  } = props;
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx("div", { ref, "test-id": `${testId ?? ""}${handleSuffix}${index}`, "data-handle-index": index, role: "slider", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": value, "aria-orientation": vertical ? "vertical" : "horizontal", "aria-disabled": disabled, tabIndex: disabled ? -1 : 0, style: vertical ? {
+    bottom: `${percent}%`
+  } : {
+    left: `${percent}%`
+  }, css: [getHandleStyle({
+    tokens,
+    vertical,
+    colorActive: isSliderActive,
+    sizeActive,
+    disabled
+  })(theme), (_a = styles == null ? void 0 : styles.handle) == null ? void 0 : _a.call(styles, tokens, theme), process.env.NODE_ENV === "production" ? "" : ";label:SliderHandle;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvU2xpZGVyL2NvbXBvbmVudHMvU2xpZGVySGFuZGxlL1NsaWRlckhhbmRsZS50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUNNIiwiZmlsZSI6Ii9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvU2xpZGVyL2NvbXBvbmVudHMvU2xpZGVySGFuZGxlL1NsaWRlckhhbmRsZS50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBmb3J3YXJkUmVmIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCJob29rcy91c2VUaGVtZVwiO1xuaW1wb3J0IHsgZ2V0SGFuZGxlU3R5bGUgfSBmcm9tIFwiLi9TbGlkZXJIYW5kbGUuc3R5bGVzXCI7XG5pbXBvcnQgeyBoYW5kbGVTdWZmaXggfSBmcm9tIFwiLi4vLi4vU2xpZGVyLnV0aWxzXCI7XG5pbXBvcnQgdHlwZSB7IFNsaWRlckhhbmRsZVByb3BzIH0gZnJvbSBcIi4vU2xpZGVySGFuZGxlLnR5cGVzXCI7XG5cbmV4cG9ydCBjb25zdCBTbGlkZXJIYW5kbGUgPSBmb3J3YXJkUmVmPEhUTUxEaXZFbGVtZW50LCBTbGlkZXJIYW5kbGVQcm9wcz4oKHByb3BzLCByZWYpID0+IHtcbiAgY29uc3Qge1xuICAgIGluZGV4LFxuICAgIHZhbHVlLFxuICAgIG1pbixcbiAgICBtYXgsXG4gICAgcGVyY2VudCxcbiAgICB2ZXJ0aWNhbCxcbiAgICBkaXNhYmxlZCxcbiAgICBpc1NsaWRlckFjdGl2ZSxcbiAgICBzaXplQWN0aXZlLFxuICAgIHRva2VucyxcbiAgICBzdHlsZXMsXG4gICAgXCJ0ZXN0LWlkXCI6IHRlc3RJZCxcbiAgICBpbnRlcmFjdGlvbkhhbmRsZXJzLFxuICAgIG9uS2V5RG93bixcbiAgICBvbktleVVwLFxuICB9ID0gcHJvcHM7XG4gIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKTtcblxuICByZXR1cm4gKFxuICAgIDxkaXZcbiAgICAgIHJlZj17cmVmfVxuICAgICAgdGVzdC1pZD17YCR7dGVzdElkID8/IFwiXCJ9JHtoYW5kbGVTdWZmaXh9JHtpbmRleH1gfVxuICAgICAgZGF0YS1oYW5kbGUtaW5kZXg9e2luZGV4fVxuICAgICAgcm9sZT1cInNsaWRlclwiXG4gICAgICBhcmlhLXZhbHVlbWluPXttaW59XG4gICAgICBhcmlhLXZhbHVlbWF4PXttYXh9XG4gICAgICBhcmlhLXZhbHVlbm93PXt2YWx1ZX1cbiAgICAgIGFyaWEtb3JpZW50YXRpb249e3ZlcnRpY2FsID8gXCJ2ZXJ0aWNhbFwiIDogXCJob3Jpem9udGFsXCJ9XG4gICAgICBhcmlhLWRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgIHRhYkluZGV4PXtkaXNhYmxlZCA/IC0xIDogMH1cbiAgICAgIHN0eWxlPXt2ZXJ0aWNhbCA/IHsgYm90dG9tOiBgJHtwZXJjZW50fSVgIH0gOiB7IGxlZnQ6IGAke3BlcmNlbnR9JWAgfX1cbiAgICAgIGNzcz17W1xuICAgICAgICBnZXRIYW5kbGVTdHlsZSh7XG4gICAgICAgICAgdG9rZW5zLFxuICAgICAgICAgIHZlcnRpY2FsLFxuICAgICAgICAgIGNvbG9yQWN0aXZlOiBpc1NsaWRlckFjdGl2ZSxcbiAgICAgICAgICBzaXplQWN0aXZlLFxuICAgICAgICAgIGRpc2FibGVkLFxuICAgICAgICB9KSh0aGVtZSksXG4gICAgICAgIHN0eWxlcz8uaGFuZGxlPy4odG9rZW5zLCB0aGVtZSksXG4gICAgICBdfVxuICAgICAgey4uLmludGVyYWN0aW9uSGFuZGxlcnN9XG4gICAgICBvbktleURvd249e29uS2V5RG93bn1cbiAgICAgIG9uS2V5VXA9e29uS2V5VXB9XG4gICAgLz5cbiAgKTtcbn0pO1xuIl19 */"], ...interactionHandlers, onKeyDown, onKeyUp });
+});
+export {
+  SliderHandle
+};

package/dist/components/Slider/components/SliderHandle/SliderHandle.styles.d.ts

@@ -0,0 +1,10 @@
+import { Interpolation } from '@emotion/react';
+import { Theme } from 'themes';
+import { SliderTokens } from '../../Slider.tokens';
+export declare const getHandleStyle: ({ tokens, vertical, colorActive, sizeActive, disabled, }: {
+    tokens: SliderTokens;
+    vertical: boolean;
+    colorActive: boolean;
+    sizeActive: boolean;
+    disabled: boolean;
+}) => (theme: Theme) => Interpolation;

package/dist/components/Slider/components/SliderHandle/SliderHandle.styles.js

@@ -0,0 +1,36 @@
+import { hex2Rgba } from "../../../../utils/color/index.js";
+const getHandleStyle = ({
+  tokens,
+  vertical,
+  colorActive,
+  sizeActive,
+  disabled
+}) => (theme) => {
+  const color = disabled ? tokens.sliderDisabled : colorActive ? tokens.sliderHover : tokens.sliderDefault;
+  const size = sizeActive && !disabled ? theme.x4 : 14;
+  const outline = sizeActive && !disabled ? `2px solid ${hex2Rgba(tokens.sliderDefault, 0.2)}` : void 0;
+  return {
+    position: "absolute",
+    width: size,
+    height: size,
+    borderRadius: tokens.sliderBorderRadius,
+    background: tokens.sliderDot,
+    border: `2px solid ${color}`,
+    transform: vertical ? "translate(-50%, 50%)" : "translate(-50%, -50%)",
+    cursor: disabled ? "not-allowed" : "pointer",
+    boxSizing: "border-box",
+    outline,
+    outlineOffset: 0,
+    userSelect: "none",
+    touchAction: "none",
+    WebkitUserDrag: "none",
+    ...vertical ? {
+      left: "50%"
+    } : {
+      top: "50%"
+    }
+  };
+};
+export {
+  getHandleStyle
+};

package/dist/components/Slider/components/SliderHandle/SliderHandle.types.d.ts

@@ -0,0 +1,16 @@
+import { RequiredDivHandlers } from '../../../../types';
+import { SliderRendererBaseProps } from '../../Slider.types';
+import { SliderInteractionHandleHandlers } from '../../hooks/useSliderInteractionState/useSliderInteractionState.types';
+type DivKeyHandlers = RequiredDivHandlers<"onKeyDown" | "onKeyUp">;
+export interface SliderHandleProps extends SliderRendererBaseProps, DivKeyHandlers {
+    index: number;
+    value: number;
+    min: number;
+    max: number;
+    percent: number;
+    disabled: boolean;
+    isSliderActive: boolean;
+    sizeActive: boolean;
+    interactionHandlers: SliderInteractionHandleHandlers;
+}
+export {};

package/dist/components/Slider/components/SliderHandle/index.d.ts

@@ -0,0 +1 @@
+export { SliderHandle } from './SliderHandle';

package/dist/components/Slider/components/SliderHandleTooltip/SliderHandleTooltip.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SliderHandleTooltipProps } from './SliderHandleTooltip.types';
+export declare const SliderHandleTooltip: FC<SliderHandleTooltipProps>;

package/dist/components/Slider/components/SliderHandleTooltip/SliderHandleTooltip.js

@@ -0,0 +1,22 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { identity } from "lodash-es";
+import { Tooltip } from "../../../Tooltip/Tooltip.js";
+import { tooltipStyles } from "./SliderHandleTooltip.styles.js";
+const SliderHandleTooltip = (props) => {
+  const {
+    value,
+    open,
+    tooltip,
+    vertical,
+    getTargetDOMNode,
+    "test-id": testId
+  } = props;
+  if (tooltip.formatter === null) {
+    return null;
+  }
+  const formatter = tooltip.formatter ?? identity;
+  return /* @__PURE__ */ jsx(Tooltip, { styles: tooltipStyles, open, title: formatter(value), placement: tooltip.placement ?? (vertical ? "right" : "top"), getTargetDOMNode, getPopupContainer: tooltip.getPopupContainer, trigger: "hover", "test-id": testId });
+};
+export {
+  SliderHandleTooltip
+};

package/dist/components/Slider/components/SliderHandleTooltip/SliderHandleTooltip.styles.d.ts

@@ -0,0 +1,7 @@
+export declare const tooltipStyles: {
+    content: {
+        wrapper: () => {
+            minWidth: string;
+        };
+    };
+};

package/dist/components/Slider/components/SliderHandleTooltip/SliderHandleTooltip.styles.js

@@ -0,0 +1,10 @@
+const tooltipStyles = {
+  content: {
+    wrapper: () => ({
+      minWidth: "unset"
+    })
+  }
+};
+export {
+  tooltipStyles
+};

package/dist/components/Slider/components/SliderHandleTooltip/SliderHandleTooltip.types.d.ts

@@ -0,0 +1,9 @@
+import { SliderTooltipProps } from '../../Slider.types';
+export interface SliderHandleTooltipProps {
+    value: number;
+    open: boolean;
+    tooltip: SliderTooltipProps;
+    vertical: boolean;
+    getTargetDOMNode: () => HTMLDivElement | null;
+    "test-id"?: string;
+}

package/dist/components/Slider/components/SliderHandleTooltip/index.d.ts

@@ -0,0 +1 @@
+export { SliderHandleTooltip } from './SliderHandleTooltip';

package/dist/components/Slider/components/SliderInternal/SliderInternal.d.ts

@@ -0,0 +1,2 @@
+import { SliderInternalProps } from './SliderInternal.types';
+export declare const SliderInternal: import('react').ForwardRefExoticComponent<SliderInternalProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/components/Slider/components/SliderInternal/SliderInternal.js

@@ -0,0 +1,121 @@
+import { jsxs, jsx } from "@emotion/react/jsx-runtime";
+import { forwardRef, useRef, useMemo, useCallback } from "react";
+import { useMergeRefs } from "@floating-ui/react";
+import { getSliderTokens } from "../../Slider.tokens.js";
+import { getRootStyle } from "../../Slider.styles.js";
+import { validateStep, valueToPercent, tooltipSuffix, emptyTooltip } from "../../Slider.utils.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+import { useComponentTokens } from "../../../ConfigProvider/hooks/useComponentTokens/useComponentTokens.js";
+import { useControlledState } from "../../../../hooks/useControlledState/useControlledState.js";
+import { useSliderInteractionState } from "../../hooks/useSliderInteractionState/useSliderInteractionState.js";
+import { useSliderDrag } from "../../hooks/useSliderDrag/useSliderDrag.js";
+import { useSliderKeyboard } from "../../hooks/useSliderKeyboard/useSliderKeyboard.js";
+import { SliderRail } from "../SliderRail/SliderRail.js";
+import { SliderTrack } from "../SliderTrack/SliderTrack.js";
+import { SliderHandle } from "../SliderHandle/SliderHandle.js";
+import { SliderHandleTooltip } from "../SliderHandleTooltip/SliderHandleTooltip.js";
+const SliderInternal = forwardRef((props, ref) => {
+  var _a;
+  const {
+    range,
+    value,
+    defaultValue,
+    min = 0,
+    max = 100,
+    step: stepProp = 1,
+    disabled = false,
+    orientation = "horizontal",
+    onChange,
+    onChangeComplete,
+    tooltip = emptyTooltip,
+    styles,
+    "test-id": testId
+  } = props;
+  const vertical = orientation === "vertical";
+  const step = validateStep(stepProp);
+  const theme = useTheme();
+  const tokens = useComponentTokens("Slider", getSliderTokens(theme));
+  const containerRef = useRef(null);
+  const handleRefs = useRef([null, null]);
+  const mergedRef = useMergeRefs([containerRef, ref]);
+  const [mergedValue, setLocalValue] = useControlledState(defaultValue, value);
+  const setHandleRefs = useMemo(() => [(el) => {
+    handleRefs.current[0] = el;
+  }, (el) => {
+    handleRefs.current[1] = el;
+  }], []);
+  const getHandleNodes = useMemo(() => [() => handleRefs.current[0], () => handleRefs.current[1]], []);
+  const handleChange = useCallback((v) => {
+    setLocalValue(v);
+    onChange == null ? void 0 : onChange(v);
+  }, [setLocalValue, onChange]);
+  const {
+    state: {
+      isRootHovered,
+      hoverIndex,
+      focusIndex,
+      keyboardFocusIndex
+    },
+    rootHandlers,
+    getHandleHandlers,
+    resetKeyboardFocus,
+    setHoverIndex
+  } = useSliderInteractionState();
+  const keyboardActiveIndex = range && (focusIndex === 0 || focusIndex === 1) ? focusIndex : 0;
+  const {
+    draggingValues,
+    activeIndex,
+    dragHandlers
+  } = useSliderDrag({
+    containerRef,
+    range,
+    min,
+    max,
+    step,
+    vertical,
+    disabled,
+    value: mergedValue,
+    onChange: handleChange,
+    onChangeComplete,
+    onDragStart: (source) => {
+      if (source === "handle") {
+        resetKeyboardFocus();
+      }
+    },
+    onDragEnd: (hoveringHandleIndex) => {
+      setHoverIndex(hoveringHandleIndex);
+    }
+  });
+  const keyboardHandlers = useSliderKeyboard({
+    range,
+    min,
+    max,
+    step,
+    disabled,
+    value: mergedValue,
+    activeIndex: keyboardActiveIndex,
+    onChange: handleChange,
+    onChangeComplete
+  });
+  const displayValues = draggingValues ?? mergedValue;
+  const isSliderActive = isRootHovered || keyboardFocusIndex !== null || draggingValues !== null;
+  const percents = displayValues.map((v) => valueToPercent(v, min, max));
+  const trackStart = range ? percents[0] : 0;
+  const trackEnd = range ? percents[1] : percents[0];
+  return /* @__PURE__ */ jsxs("div", { ref: mergedRef, role: "group", "test-id": testId, css: [getRootStyle({
+    tokens,
+    vertical,
+    disabled
+  })(theme), (_a = styles == null ? void 0 : styles.root) == null ? void 0 : _a.call(styles, tokens, theme), process.env.NODE_ENV === "production" ? "" : ";label:SliderInternal;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvU2xpZGVyL2NvbXBvbmVudHMvU2xpZGVySW50ZXJuYWwvU2xpZGVySW50ZXJuYWwudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXVITSIsImZpbGUiOiIvYnVpbGRzL2Zyb250ZW5kL2xpYnMvdWkta2l0L3NyYy9jb21wb25lbnRzL1NsaWRlci9jb21wb25lbnRzL1NsaWRlckludGVybmFsL1NsaWRlckludGVybmFsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGZvcndhcmRSZWYsIHVzZUNhbGxiYWNrLCB1c2VNZW1vLCB1c2VSZWYgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IHVzZU1lcmdlUmVmcyB9IGZyb20gXCJAZmxvYXRpbmctdWkvcmVhY3RcIjtcbmltcG9ydCB7IHVzZVRoZW1lIH0gZnJvbSBcImhvb2tzL3VzZVRoZW1lXCI7XG5pbXBvcnQgeyB1c2VDb250cm9sbGVkU3RhdGUgfSBmcm9tIFwiaG9va3MvdXNlQ29udHJvbGxlZFN0YXRlXCI7XG5pbXBvcnQgeyB1c2VDb21wb25lbnRUb2tlbnMgfSBmcm9tIFwiY29tcG9uZW50cy9Db25maWdQcm92aWRlclwiO1xuaW1wb3J0IHsgZ2V0U2xpZGVyVG9rZW5zIH0gZnJvbSBcIi4uLy4uL1NsaWRlci50b2tlbnNcIjtcbmltcG9ydCB7IGdldFJvb3RTdHlsZSB9IGZyb20gXCIuLi8uLi9TbGlkZXIuc3R5bGVzXCI7XG5pbXBvcnQgeyB1c2VTbGlkZXJEcmFnIH0gZnJvbSBcIi4uLy4uL2hvb2tzL3VzZVNsaWRlckRyYWdcIjtcbmltcG9ydCB7IHVzZVNsaWRlcktleWJvYXJkIH0gZnJvbSBcIi4uLy4uL2hvb2tzL3VzZVNsaWRlcktleWJvYXJkXCI7XG5pbXBvcnQgeyB1c2VTbGlkZXJJbnRlcmFjdGlvblN0YXRlIH0gZnJvbSBcIi4uLy4uL2hvb2tzL3VzZVNsaWRlckludGVyYWN0aW9uU3RhdGVcIjtcbmltcG9ydCB7IGVtcHR5VG9vbHRpcCwgdG9vbHRpcFN1ZmZpeCwgdmFsaWRhdGVTdGVwLCB2YWx1ZVRvUGVyY2VudCB9IGZyb20gXCIuLi8uLi9TbGlkZXIudXRpbHNcIjtcbmltcG9ydCB7IFNsaWRlclJhaWwgfSBmcm9tIFwiLi4vU2xpZGVyUmFpbFwiO1xuaW1wb3J0IHsgU2xpZGVyVHJhY2sgfSBmcm9tIFwiLi4vU2xpZGVyVHJhY2tcIjtcbmltcG9ydCB7IFNsaWRlckhhbmRsZSB9IGZyb20gXCIuLi9TbGlkZXJIYW5kbGVcIjtcbmltcG9ydCB7IFNsaWRlckhhbmRsZVRvb2x0aXAgfSBmcm9tIFwiLi4vU2xpZGVySGFuZGxlVG9vbHRpcFwiO1xuaW1wb3J0IHR5cGUgeyBTbGlkZXJJbnRlcm5hbFByb3BzLCBTbGlkZXJWYWx1ZXMgfSBmcm9tIFwiLi9TbGlkZXJJbnRlcm5hbC50eXBlc1wiO1xuXG5leHBvcnQgY29uc3QgU2xpZGVySW50ZXJuYWwgPSBmb3J3YXJkUmVmPEhUTUxEaXZFbGVtZW50LCBTbGlkZXJJbnRlcm5hbFByb3BzPigocHJvcHMsIHJlZikgPT4ge1xuICBjb25zdCB7XG4gICAgcmFuZ2UsXG4gICAgdmFsdWUsXG4gICAgZGVmYXVsdFZhbHVlLFxuICAgIG1pbiA9IDAsXG4gICAgbWF4ID0gMTAwLFxuICAgIHN0ZXA6IHN0ZXBQcm9wID0gMSxcbiAgICBkaXNhYmxlZCA9IGZhbHNlLFxuICAgIG9yaWVudGF0aW9uID0gXCJob3Jpem9udGFsXCIsXG4gICAgb25DaGFuZ2UsXG4gICAgb25DaGFuZ2VDb21wbGV0ZSxcbiAgICB0b29sdGlwID0gZW1wdHlUb29sdGlwLFxuICAgIHN0eWxlcyxcbiAgICBcInRlc3QtaWRcIjogdGVzdElkLFxuICB9ID0gcHJvcHM7XG4gIGNvbnN0IHZlcnRpY2FsID0gb3JpZW50YXRpb24gPT09IFwidmVydGljYWxcIjtcbiAgY29uc3Qgc3RlcCA9IHZhbGlkYXRlU3RlcChzdGVwUHJvcCk7XG4gIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKTtcbiAgY29uc3QgdG9rZW5zID0gdXNlQ29tcG9uZW50VG9rZW5zKFwiU2xpZGVyXCIsIGdldFNsaWRlclRva2Vucyh0aGVtZSkpO1xuICBjb25zdCBjb250YWluZXJSZWYgPSB1c2VSZWY8SFRNTERpdkVsZW1lbnQgfCBudWxsPihudWxsKTtcbiAgY29uc3QgaGFuZGxlUmVmcyA9IHVzZVJlZjxBcnJheTxIVE1MRGl2RWxlbWVudCB8IG51bGw+PihbbnVsbCwgbnVsbF0pO1xuICBjb25zdCBtZXJnZWRSZWYgPSB1c2VNZXJnZVJlZnMoW2NvbnRhaW5lclJlZiwgcmVmXSk7XG5cbiAgY29uc3QgW21lcmdlZFZhbHVlLCBzZXRMb2NhbFZhbHVlXSA9IHVzZUNvbnRyb2xsZWRTdGF0ZTxTbGlkZXJWYWx1ZXM+KGRlZmF1bHRWYWx1ZSwgdmFsdWUpO1xuXG4gIGNvbnN0IHNldEhhbmRsZVJlZnMgPSB1c2VNZW1vKFxuICAgICgpID0+IFtcbiAgICAgIChlbDogSFRNTERpdkVsZW1lbnQgfCBudWxsKSA9PiB7XG4gICAgICAgIGhhbmRsZVJlZnMuY3VycmVudFswXSA9IGVsO1xuICAgICAgfSxcbiAgICAgIChlbDogSFRNTERpdkVsZW1lbnQgfCBudWxsKSA9PiB7XG4gICAgICAgIGhhbmRsZVJlZnMuY3VycmVudFsxXSA9IGVsO1xuICAgICAgfSxcbiAgICBdLFxuICAgIFtdXG4gICk7XG5cbiAgY29uc3QgZ2V0SGFuZGxlTm9kZXMgPSB1c2VNZW1vKFxuICAgICgpID0+IFsoKSA9PiBoYW5kbGVSZWZzLmN1cnJlbnRbMF0sICgpID0+IGhhbmRsZVJlZnMuY3VycmVudFsxXV0sXG4gICAgW11cbiAgKTtcblxuICBjb25zdCBoYW5kbGVDaGFuZ2UgPSB1c2VDYWxsYmFjayhcbiAgICAodjogU2xpZGVyVmFsdWVzKSA9PiB7XG4gICAgICBzZXRMb2NhbFZhbHVlKHYpO1xuICAgICAgb25DaGFuZ2U/Lih2KTtcbiAgICB9LFxuICAgIFtzZXRMb2NhbFZhbHVlLCBvbkNoYW5nZV1cbiAgKTtcbiAgY29uc3Qge1xuICAgIHN0YXRlOiB7IGlzUm9vdEhvdmVyZWQsIGhvdmVySW5kZXgsIGZvY3VzSW5kZXgsIGtleWJvYXJkRm9jdXNJbmRleCB9LFxuICAgIHJvb3RIYW5kbGVycyxcbiAgICBnZXRIYW5kbGVIYW5kbGVycyxcbiAgICByZXNldEtleWJvYXJkRm9jdXMsXG4gICAgc2V0SG92ZXJJbmRleCxcbiAgfSA9IHVzZVNsaWRlckludGVyYWN0aW9uU3RhdGUoKTtcbiAgY29uc3Qga2V5Ym9hcmRBY3RpdmVJbmRleCA9IHJhbmdlICYmIChmb2N1c0luZGV4ID09PSAwIHx8IGZvY3VzSW5kZXggPT09IDEpID8gZm9jdXNJbmRleCA6IDA7XG4gIGNvbnN0IHsgZHJhZ2dpbmdWYWx1ZXMsIGFjdGl2ZUluZGV4LCBkcmFnSGFuZGxlcnMgfSA9IHVzZVNsaWRlckRyYWcoe1xuICAgIGNvbnRhaW5lclJlZixcbiAgICByYW5nZSxcbiAgICBtaW4sXG4gICAgbWF4LFxuICAgIHN0ZXAsXG4gICAgdmVydGljYWwsXG4gICAgZGlzYWJsZWQsXG4gICAgdmFsdWU6IG1lcmdlZFZhbHVlLFxuICAgIG9uQ2hhbmdlOiBoYW5kbGVDaGFuZ2UsXG4gICAgb25DaGFuZ2VDb21wbGV0ZSxcbiAgICBvbkRyYWdTdGFydDogKHNvdXJjZSkgPT4ge1xuICAgICAgaWYgKHNvdXJjZSA9PT0gXCJoYW5kbGVcIikge1xuICAgICAgICByZXNldEtleWJvYXJkRm9jdXMoKTtcbiAgICAgIH1cbiAgICB9LFxuICAgIG9uRHJhZ0VuZDogKGhvdmVyaW5nSGFuZGxlSW5kZXgpID0+IHtcbiAgICAgIHNldEhvdmVySW5kZXgoaG92ZXJpbmdIYW5kbGVJbmRleCk7XG4gICAgfSxcbiAgfSk7XG4gIGNvbnN0IGtleWJvYXJkSGFuZGxlcnMgPSB1c2VTbGlkZXJLZXlib2FyZCh7XG4gICAgcmFuZ2UsXG4gICAgbWluLFxuICAgIG1heCxcbiAgICBzdGVwLFxuICAgIGRpc2FibGVkLFxuICAgIHZhbHVlOiBtZXJnZWRWYWx1ZSxcbiAgICBhY3RpdmVJbmRleDoga2V5Ym9hcmRBY3RpdmVJbmRleCxcbiAgICBvbkNoYW5nZTogaGFuZGxlQ2hhbmdlLFxuICAgIG9uQ2hhbmdlQ29tcGxldGUsXG4gIH0pO1xuXG4gIGNvbnN0IGRpc3BsYXlWYWx1ZXMgPSBkcmFnZ2luZ1ZhbHVlcyA/PyBtZXJnZWRWYWx1ZTtcbiAgY29uc3QgaXNTbGlkZXJBY3RpdmUgPSBpc1Jvb3RIb3ZlcmVkIHx8IGtleWJvYXJkRm9jdXNJbmRleCAhPT0gbnVsbCB8fCBkcmFnZ2luZ1ZhbHVlcyAhPT0gbnVsbDtcblxuICBjb25zdCBwZXJjZW50cyA9IGRpc3BsYXlWYWx1ZXMubWFwKCh2KSA9PiB2YWx1ZVRvUGVyY2VudCh2LCBtaW4sIG1heCkpO1xuICBjb25zdCB0cmFja1N0YXJ0ID0gcmFuZ2UgPyBwZXJjZW50c1swXSA6IDA7XG4gIGNvbnN0IHRyYWNrRW5kID0gcmFuZ2UgPyBwZXJjZW50c1sxXSA6IHBlcmNlbnRzWzBdO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgcmVmPXttZXJnZWRSZWZ9XG4gICAgICByb2xlPVwiZ3JvdXBcIlxuICAgICAgdGVzdC1pZD17dGVzdElkfVxuICAgICAgY3NzPXtbZ2V0Um9vdFN0eWxlKHsgdG9rZW5zLCB2ZXJ0aWNhbCwgZGlzYWJsZWQgfSkodGhlbWUpLCBzdHlsZXM/LnJvb3Q/Lih0b2tlbnMsIHRoZW1lKV19XG4gICAgICB7Li4ucm9vdEhhbmRsZXJzfVxuICAgICAgey4uLmRyYWdIYW5kbGVyc31cbiAgICA+XG4gICAgICA8U2xpZGVyUmFpbFxuICAgICAgICB0b2tlbnM9e3Rva2Vuc31cbiAgICAgICAgdmVydGljYWw9e3ZlcnRpY2FsfVxuICAgICAgICBpc0FjdGl2ZT17aXNTbGlkZXJBY3RpdmUgJiYgIWRpc2FibGVkfVxuICAgICAgICBzdHlsZXM9e3N0eWxlc31cbiAgICAgICAgdGVzdC1pZD17dGVzdElkfVxuICAgICAgLz5cbiAgICAgIDxTbGlkZXJUcmFja1xuICAgICAgICB0b2tlbnM9e3Rva2Vuc31cbiAgICAgICAgdmVydGljYWw9e3ZlcnRpY2FsfVxuICAgICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICAgIGlzQWN0aXZlPXtpc1NsaWRlckFjdGl2ZX1cbiAgICAgICAgc3RhcnRQZXJjZW50PXt0cmFja1N0YXJ0fVxuICAgICAgICBlbmRQZXJjZW50PXt0cmFja0VuZH1cbiAgICAgICAgc3R5bGVzPXtzdHlsZXN9XG4gICAgICAgIHRlc3QtaWQ9e3Rlc3RJZH1cbiAgICAgIC8+XG4gICAgICB7ZGlzcGxheVZhbHVlcy5tYXAoKHYsIGkpID0+IChcbiAgICAgICAgPFNsaWRlckhhbmRsZVxuICAgICAgICAgIGtleT17aX1cbiAgICAgICAgICByZWY9e3NldEhhbmRsZVJlZnNbaV19XG4gICAgICAgICAgaW5kZXg9e2l9XG4gICAgICAgICAgdmFsdWU9e3Z9XG4gICAgICAgICAgbWluPXttaW59XG4gICAgICAgICAgbWF4PXttYXh9XG4gICAgICAgICAgcGVyY2VudD17cGVyY2VudHNbaV19XG4gICAgICAgICAgdmVydGljYWw9e3ZlcnRpY2FsfVxuICAgICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICBpc1NsaWRlckFjdGl2ZT17aXNTbGlkZXJBY3RpdmV9XG4gICAgICAgICAgc2l6ZUFjdGl2ZT17YWN0aXZlSW5kZXggPT09IGkgfHwgaG92ZXJJbmRleCA9PT0gaSB8fCBrZXlib2FyZEZvY3VzSW5kZXggPT09IGl9XG4gICAgICAgICAgdG9rZW5zPXt0b2tlbnN9XG4gICAgICAgICAgc3R5bGVzPXtzdHlsZXN9XG4gICAgICAgICAgdGVzdC1pZD17dGVzdElkfVxuICAgICAgICAgIGludGVyYWN0aW9uSGFuZGxlcnM9e2dldEhhbmRsZUhhbmRsZXJzKGkpfVxuICAgICAgICAgIHsuLi5rZXlib2FyZEhhbmRsZXJzfVxuICAgICAgICAvPlxuICAgICAgKSl9XG4gICAgICB7ZGlzcGxheVZhbHVlcy5tYXAoKHYsIGkpID0+IHtcbiAgICAgICAgY29uc3Qgb3BlbiA9XG4gICAgICAgICAgdG9vbHRpcC5vcGVuID8/XG4gICAgICAgICAgKGhvdmVySW5kZXggPT09IGkgfHxcbiAgICAgICAgICAgIGtleWJvYXJkRm9jdXNJbmRleCA9PT0gaSB8fFxuICAgICAgICAgICAgKGRyYWdnaW5nVmFsdWVzICE9PSBudWxsICYmIGFjdGl2ZUluZGV4ID09PSBpKSk7XG5cbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICA8U2xpZGVySGFuZGxlVG9vbHRpcFxuICAgICAgICAgICAga2V5PXtgdG9vbHRpcC0ke2l9YH1cbiAgICAgICAgICAgIHZhbHVlPXt2fVxuICAgICAgICAgICAgb3Blbj17b3Blbn1cbiAgICAgICAgICAgIHRvb2x0aXA9e3Rvb2x0aXB9XG4gICAgICAgICAgICB2ZXJ0aWNhbD17dmVydGljYWx9XG4gICAgICAgICAgICBnZXRUYXJnZXRET01Ob2RlPXtnZXRIYW5kbGVOb2Rlc1tpXX1cbiAgICAgICAgICAgIHRlc3QtaWQ9e2Ake3Rlc3RJZH0ke3Rvb2x0aXBTdWZmaXh9JHtpfWB9XG4gICAgICAgICAgLz5cbiAgICAgICAgKTtcbiAgICAgIH0pfVxuICAgIDwvZGl2PlxuICApO1xufSk7XG4iXX0= */"], ...rootHandlers, ...dragHandlers, children: [
+    /* @__PURE__ */ jsx(SliderRail, { tokens, vertical, isActive: isSliderActive && !disabled, styles, "test-id": testId }),
+    /* @__PURE__ */ jsx(SliderTrack, { tokens, vertical, disabled, isActive: isSliderActive, startPercent: trackStart, endPercent: trackEnd, styles, "test-id": testId }),
+    displayValues.map((v, i) => /* @__PURE__ */ jsx(SliderHandle, { ref: setHandleRefs[i], index: i, value: v, min, max, percent: percents[i], vertical, disabled, isSliderActive, sizeActive: activeIndex === i || hoverIndex === i || keyboardFocusIndex === i, tokens, styles, "test-id": testId, interactionHandlers: getHandleHandlers(i), ...keyboardHandlers }, i)),
+    displayValues.map((v, i) => {
+      const open = tooltip.open ?? (hoverIndex === i || keyboardFocusIndex === i || draggingValues !== null && activeIndex === i);
+      return /* @__PURE__ */ jsx(SliderHandleTooltip, { value: v, open, tooltip, vertical, getTargetDOMNode: getHandleNodes[i], "test-id": `${testId}${tooltipSuffix}${i}` }, `tooltip-${i}`);
+    })
+  ] });
+});
+export {
+  SliderInternal
+};

package/dist/components/Slider/components/SliderInternal/SliderInternal.types.d.ts

@@ -0,0 +1,24 @@
+import { SliderStyles, SliderTooltipProps } from '../../Slider.types';
+export type SliderValues = [number] | [number, number];
+export declare const isRangeValues: (v: SliderValues) => v is [number, number];
+/**
+ * Внутренний props для общей реализации Slider'а.
+ * Внешний API (`SingleSliderProps`/`RangeSliderProps`) адаптируется к этому
+ * виду в `Slider.tsx` — value/defaultValue приводятся к tuple длины 1 (single)
+ * или 2 (range), onChange/onChangeComplete оборачиваются.
+ */
+export interface SliderInternalProps {
+    range: boolean;
+    value?: SliderValues;
+    defaultValue: SliderValues;
+    min?: number;
+    max?: number;
+    step?: number | null;
+    disabled?: boolean;
+    orientation?: "horizontal" | "vertical";
+    tooltip?: SliderTooltipProps;
+    styles?: SliderStyles;
+    "test-id"?: string;
+    onChange?: (value: SliderValues) => void;
+    onChangeComplete?: (value: SliderValues) => void;
+}

package/dist/components/Slider/components/SliderInternal/SliderInternal.types.js

@@ -0,0 +1,4 @@
+const isRangeValues = (v) => v.length === 2;
+export {
+  isRangeValues
+};

package/dist/components/Slider/components/SliderInternal/index.d.ts

@@ -0,0 +1 @@
+export { SliderInternal } from './SliderInternal';

package/dist/components/Slider/components/SliderRail/SliderRail.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SliderRailProps } from './SliderRail.types';
+export declare const SliderRail: FC<SliderRailProps>;

package/dist/components/Slider/components/SliderRail/SliderRail.js

@@ -0,0 +1,23 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { getRailStyle } from "./SliderRail.styles.js";
+import { railSuffix } from "../../Slider.utils.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const SliderRail = (props) => {
+  var _a;
+  const {
+    tokens,
+    vertical,
+    isActive,
+    styles,
+    "test-id": testId
+  } = props;
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx("div", { "test-id": `${testId ?? ""}${railSuffix}`, css: [getRailStyle({
+    tokens,
+    vertical,
+    active: isActive
+  })(theme), (_a = styles == null ? void 0 : styles.rail) == null ? void 0 : _a.call(styles, tokens, theme), process.env.NODE_ENV === "production" ? "" : ";label:SliderRail;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvU2xpZGVyL2NvbXBvbmVudHMvU2xpZGVyUmFpbC9TbGlkZXJSYWlsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhTSIsImZpbGUiOiIvYnVpbGRzL2Zyb250ZW5kL2xpYnMvdWkta2l0L3NyYy9jb21wb25lbnRzL1NsaWRlci9jb21wb25lbnRzL1NsaWRlclJhaWwvU2xpZGVyUmFpbC50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IEZDIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCJob29rcy91c2VUaGVtZVwiO1xuaW1wb3J0IHsgZ2V0UmFpbFN0eWxlIH0gZnJvbSBcIi4vU2xpZGVyUmFpbC5zdHlsZXNcIjtcbmltcG9ydCB7IHJhaWxTdWZmaXggfSBmcm9tIFwiLi4vLi4vU2xpZGVyLnV0aWxzXCI7XG5pbXBvcnQgdHlwZSB7IFNsaWRlclJhaWxQcm9wcyB9IGZyb20gXCIuL1NsaWRlclJhaWwudHlwZXNcIjtcblxuZXhwb3J0IGNvbnN0IFNsaWRlclJhaWw6IEZDPFNsaWRlclJhaWxQcm9wcz4gPSAocHJvcHMpID0+IHtcbiAgY29uc3QgeyB0b2tlbnMsIHZlcnRpY2FsLCBpc0FjdGl2ZSwgc3R5bGVzLCBcInRlc3QtaWRcIjogdGVzdElkIH0gPSBwcm9wcztcbiAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpO1xuXG4gIHJldHVybiAoXG4gICAgPGRpdlxuICAgICAgdGVzdC1pZD17YCR7dGVzdElkID8/IFwiXCJ9JHtyYWlsU3VmZml4fWB9XG4gICAgICBjc3M9e1tcbiAgICAgICAgZ2V0UmFpbFN0eWxlKHsgdG9rZW5zLCB2ZXJ0aWNhbCwgYWN0aXZlOiBpc0FjdGl2ZSB9KSh0aGVtZSksXG4gICAgICAgIHN0eWxlcz8ucmFpbD8uKHRva2VucywgdGhlbWUpLFxuICAgICAgXX1cbiAgICAvPlxuICApO1xufTtcbiJdfQ== */"] });
+};
+export {
+  SliderRail
+};

package/dist/components/Slider/components/SliderRail/SliderRail.styles.d.ts

@@ -0,0 +1,8 @@
+import { Interpolation } from '@emotion/react';
+import { Theme } from 'themes';
+import { SliderTokens } from '../../Slider.tokens';
+export declare const getRailStyle: ({ tokens, vertical, active }: {
+    tokens: SliderTokens;
+    vertical: boolean;
+    active: boolean;
+}) => (theme: Theme) => Interpolation;

package/dist/components/Slider/components/SliderRail/SliderRail.styles.js

@@ -0,0 +1,15 @@
+const getRailStyle = ({
+  tokens,
+  vertical,
+  active
+}) => (theme) => {
+  return {
+    width: vertical ? theme.x1 : "100%",
+    height: vertical ? "100%" : theme.x1,
+    borderRadius: tokens.sliderBorderRadius,
+    background: active ? tokens.sliderRailHover : tokens.sliderRail
+  };
+};
+export {
+  getRailStyle
+};

package/dist/components/Slider/components/SliderRail/SliderRail.types.d.ts

@@ -0,0 +1,4 @@
+import { SliderRendererBaseProps } from '../../Slider.types';
+export interface SliderRailProps extends SliderRendererBaseProps {
+    isActive: boolean;
+}

package/dist/components/Slider/components/SliderRail/index.d.ts

@@ -0,0 +1 @@
+export { SliderRail } from './SliderRail';

package/dist/components/Slider/components/SliderTrack/SliderTrack.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SliderTrackProps } from './SliderTrack.types';
+export declare const SliderTrack: FC<SliderTrackProps>;

package/dist/components/Slider/components/SliderTrack/SliderTrack.js

@@ -0,0 +1,29 @@
+import { jsx } from "@emotion/react/jsx-runtime";
+import { getTrackStyle } from "./SliderTrack.styles.js";
+import { trackSuffix } from "../../Slider.utils.js";
+import { useTheme } from "../../../../hooks/useTheme/useTheme.js";
+const SliderTrack = (props) => {
+  var _a;
+  const {
+    tokens,
+    vertical,
+    disabled,
+    isActive,
+    startPercent,
+    endPercent,
+    styles,
+    "test-id": testId
+  } = props;
+  const theme = useTheme();
+  return /* @__PURE__ */ jsx("div", { "test-id": `${testId ?? ""}${trackSuffix}`, css: [getTrackStyle({
+    tokens,
+    startPercent,
+    endPercent,
+    vertical,
+    disabled,
+    active: isActive
+  })(theme), (_a = styles == null ? void 0 : styles.track) == null ? void 0 : _a.call(styles, tokens, theme), process.env.NODE_ENV === "production" ? "" : ";label:SliderTrack;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9idWlsZHMvZnJvbnRlbmQvbGlicy91aS1raXQvc3JjL2NvbXBvbmVudHMvU2xpZGVyL2NvbXBvbmVudHMvU2xpZGVyVHJhY2svU2xpZGVyVHJhY2sudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCTSIsImZpbGUiOiIvYnVpbGRzL2Zyb250ZW5kL2xpYnMvdWkta2l0L3NyYy9jb21wb25lbnRzL1NsaWRlci9jb21wb25lbnRzL1NsaWRlclRyYWNrL1NsaWRlclRyYWNrLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB0eXBlIHsgRkMgfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCB7IHVzZVRoZW1lIH0gZnJvbSBcImhvb2tzL3VzZVRoZW1lXCI7XG5pbXBvcnQgeyBnZXRUcmFja1N0eWxlIH0gZnJvbSBcIi4vU2xpZGVyVHJhY2suc3R5bGVzXCI7XG5pbXBvcnQgeyB0cmFja1N1ZmZpeCB9IGZyb20gXCIuLi8uLi9TbGlkZXIudXRpbHNcIjtcbmltcG9ydCB0eXBlIHsgU2xpZGVyVHJhY2tQcm9wcyB9IGZyb20gXCIuL1NsaWRlclRyYWNrLnR5cGVzXCI7XG5cbmV4cG9ydCBjb25zdCBTbGlkZXJUcmFjazogRkM8U2xpZGVyVHJhY2tQcm9wcz4gPSAocHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIHRva2VucyxcbiAgICB2ZXJ0aWNhbCxcbiAgICBkaXNhYmxlZCxcbiAgICBpc0FjdGl2ZSxcbiAgICBzdGFydFBlcmNlbnQsXG4gICAgZW5kUGVyY2VudCxcbiAgICBzdHlsZXMsXG4gICAgXCJ0ZXN0LWlkXCI6IHRlc3RJZCxcbiAgfSA9IHByb3BzO1xuICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKCk7XG5cbiAgcmV0dXJuIChcbiAgICA8ZGl2XG4gICAgICB0ZXN0LWlkPXtgJHt0ZXN0SWQgPz8gXCJcIn0ke3RyYWNrU3VmZml4fWB9XG4gICAgICBjc3M9e1tcbiAgICAgICAgZ2V0VHJhY2tTdHlsZSh7XG4gICAgICAgICAgdG9rZW5zLFxuICAgICAgICAgIHN0YXJ0UGVyY2VudCxcbiAgICAgICAgICBlbmRQZXJjZW50LFxuICAgICAgICAgIHZlcnRpY2FsLFxuICAgICAgICAgIGRpc2FibGVkLFxuICAgICAgICAgIGFjdGl2ZTogaXNBY3RpdmUsXG4gICAgICAgIH0pKHRoZW1lKSxcbiAgICAgICAgc3R5bGVzPy50cmFjaz8uKHRva2VucywgdGhlbWUpLFxuICAgICAgXX1cbiAgICAvPlxuICApO1xufTtcbiJdfQ== */"] });
+};
+export {
+  SliderTrack
+};

package/dist/components/Slider/components/SliderTrack/SliderTrack.styles.d.ts

@@ -0,0 +1,11 @@
+import { Interpolation } from '@emotion/react';
+import { Theme } from 'themes';
+import { SliderTokens } from '../../Slider.tokens';
+export declare const getTrackStyle: ({ tokens, startPercent, endPercent, vertical, disabled, active, }: {
+    tokens: SliderTokens;
+    startPercent: number;
+    endPercent: number;
+    vertical: boolean;
+    disabled: boolean;
+    active: boolean;
+}) => (theme: Theme) => Interpolation;