@cube-dev/ui-kit 0.0.0-canary-d37d372 → 0.0.0-canary-5b7252a

package/types/test/render.d.ts

@@ -1,4 +1,61 @@
 import React from 'react';
 import { RenderOptions } from '@testing-library/react';
+import { CubeFormInstance } from '../components/forms';
 export declare function renderWithRoot(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries' | 'wrapper'>): import("@testing-library/react").RenderResult<typeof import("@testing-library/dom/types/queries"), HTMLElement>;
-export * from '@testing-library/react';
+export declare function renderWithForm(ui: React.ReactElement, options?: Omit<RenderOptions, 'queries' | 'wrapper'>): {
+    readonly formInstance: CubeFormInstance<any, import("../components/forms/Form/useForm").CubeFormData<any>>;
+    readonly container: HTMLElement;
+    readonly baseElement: Element;
+    readonly debug: (baseElement?: Element | DocumentFragment | (Element | DocumentFragment)[] | undefined, maxLength?: number | undefined, options?: import("pretty-format").PrettyFormatOptions | undefined) => void;
+    readonly rerender: (ui: React.ReactElement<any, string | React.JSXElementConstructor<any>>) => void;
+    readonly unmount: () => void;
+    readonly asFragment: () => DocumentFragment;
+    readonly getByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
+    readonly getAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly queryByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly findByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByLabelText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByPlaceholderText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement;
+    readonly getAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly queryByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined) => HTMLElement[];
+    readonly findByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").SelectorMatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByAltText: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByTitle: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByDisplayValue: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement;
+    readonly getAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
+    readonly queryByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement | null;
+    readonly queryAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined) => HTMLElement[];
+    readonly findByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByRole: (role: import("@testing-library/react").ByRoleMatcher, options?: import("@testing-library/react").ByRoleOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+    readonly getByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement;
+    readonly getAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly queryByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement | null;
+    readonly queryAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined) => HTMLElement[];
+    readonly findByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement>;
+    readonly findAllByTestId: (id: import("@testing-library/react").Matcher, options?: import("@testing-library/react").MatcherOptions | undefined, waitForElementOptions?: import("@testing-library/react").waitForOptions | undefined) => Promise<HTMLElement[]>;
+};

package/cjs/components/pickers/RangeSlider/Gradation.js

@@ -1,28 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Gradation = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_1 = require("./styled");
-function Gradation(props) {
-    const { state, ranges, values = [] } = props;
-    if (!values.length) {
-        return null;
-    }
-    const getIsActive = (value, idx) => {
-        const [minIdx, maxIdx] = ranges.map((range) => state.getThumbValue(range));
-        return idx >= minIdx && idx <= maxIdx;
-    };
-    return ((0, jsx_runtime_1.jsx)(styled_1.StyledGradation, { children: values.map((value, idx) => ((0, jsx_runtime_1.jsx)(styled_1.StyledGrade, { mods: {
-                active: getIsActive(value, idx),
-            }, children: value }, value))) }, void 0));
-}
-exports.Gradation = Gradation;
-
-        

package/cjs/components/pickers/RangeSlider/RangeInput.js

@@ -1,37 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RangeInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const __1 = require("../../../");
-function calculateWidth(max) {
-    if (typeof max === 'undefined') {
-        return undefined;
-    }
-    const value = String(max).length;
-    const charWidth = 1.75;
-    return `${value * charWidth}x`;
-}
-function RangeInput(props) {
-    const { state, index, suffix, min, max, ...otherProps } = props;
-    const value = state.values[index];
-    const width = calculateWidth(max);
-    const onChange = (0, react_1.useCallback)((value) => {
-        state.setThumbValue(index, value);
-    }, [index, state]);
-    return ((0, jsx_runtime_1.jsx)(__1.NumberInput, { ...otherProps, hideStepper: true, size: "small", inputProps: {
-            maxLength: max && String(max).length,
-        }, inputStyles: {
-            width,
-        }, suffix: suffix && (0, jsx_runtime_1.jsx)(__1.Flow, { padding: "1.5x right", children: suffix }, void 0), value: value, minValue: state.getThumbMinValue(index), maxValue: state.getThumbMaxValue(index), onChange: onChange }, void 0));
-}
-exports.RangeInput = RangeInput;
-
-        

package/cjs/components/pickers/RangeSlider/RangeSlider.js

@@ -1,99 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.RangeSlider = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const slider_1 = require("@react-aria/slider");
-const slider_2 = require("@react-stately/slider");
-const FieldWrapper_1 = require("../../forms/FieldWrapper");
-const tasty_1 = require("../../../tasty");
-const Slide_1 = require("./Slide");
-const Gradation_1 = require("./Gradation");
-const Thumb_1 = require("./Thumb");
-const RangeInput_1 = require("./RangeInput");
-const styled_1 = require("./styled");
-function getRanges(value) {
-    if (Array.isArray(value)) {
-        return value.length >= 2 ? [0, 1] : [0];
-    }
-    return [0];
-}
-function RangeSlider(props, ref) {
-    let { labelPosition, label, extra, styles, isRequired, validationState, message, description, requiredMark, labelSuffix, labelStyles, necessityIndicator, defaultValue, value, gradation, step = 1, isDisabled, orientation = 'horizontal', showInput, inputStyles, inputSuffix, inputSuffixPosition, minValue, maxValue, onChange, onChangeEnd, ...otherProps } = props;
-    const ranges = getRanges(defaultValue || value || [0, 1]);
-    const isSingle = ranges.length <= 1;
-    const trackRef = (0, react_1.useRef)(null);
-    const inputRef = (0, react_1.useRef)(null);
-    const numberFormatter = new Intl.NumberFormat();
-    const baseProps = {
-        step,
-        orientation,
-        isDisabled,
-        onChange(range) {
-            if (onChange) {
-                onChange(Array.isArray(range) ? range : [range]);
-            }
-        },
-        onChangeEnd(range) {
-            if (onChangeEnd) {
-                onChangeEnd(Array.isArray(range) ? range : [range]);
-            }
-        },
-    };
-    const state = (0, slider_2.useSliderState)({
-        ...props,
-        ...baseProps,
-        numberFormatter,
-    });
-    const { groupProps, trackProps, labelProps } = (0, slider_1.useSlider)({
-        ...props,
-        ...baseProps,
-    }, state, trackRef);
-    const inputProps = {
-        min: minValue,
-        max: maxValue,
-        step,
-        state: state,
-        suffix: inputSuffix,
-        styles: inputStyles,
-        suffixPosition: inputSuffixPosition,
-        isDisabled,
-    };
-    const sliderField = ((0, jsx_runtime_1.jsxs)(styled_1.StyledSlider, { ...groupProps, mods: {
-            sideLabel: labelPosition === 'side',
-            inputs: showInput,
-        }, children: [!isSingle && showInput && (0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { index: 0, ...inputProps }, void 0), (0, jsx_runtime_1.jsx)(styled_1.StyledContent, { children: (0, jsx_runtime_1.jsxs)(styled_1.StyledControls, { ...trackProps, ref: trackRef, children: [(0, jsx_runtime_1.jsx)(Slide_1.Slide, { state: state, ranges: ranges, isSingle: isSingle, isDisabled: isDisabled }, void 0), (0, jsx_runtime_1.jsx)(Gradation_1.Gradation, { state: state, ranges: ranges, values: gradation }, void 0), ranges.map((thumb) => ((0, jsx_runtime_1.jsx)(Thumb_1.Thumb, { index: thumb, state: state, inputRef: inputRef, trackRef: trackRef, isDisabled: isDisabled, defaultValue: defaultValue && defaultValue[thumb] }, thumb)))] }, void 0) }, void 0), showInput && (0, jsx_runtime_1.jsx)(RangeInput_1.RangeInput, { index: 1, ...inputProps }, void 0)] }, void 0));
-    styles = (0, tasty_1.extractStyles)(otherProps, tasty_1.OUTER_STYLES, styles);
-    return ((0, jsx_runtime_1.jsx)(FieldWrapper_1.FieldWrapper, { ...{
-            labelPosition,
-            label,
-            extra,
-            styles,
-            isRequired,
-            labelStyles,
-            necessityIndicator,
-            labelProps,
-            isDisabled,
-            validationState,
-            message,
-            description,
-            requiredMark,
-            labelSuffix,
-            Component: sliderField,
-            ref: ref,
-        } }, void 0));
-}
-const _RangeSlider = (0, react_1.forwardRef)(RangeSlider);
-const __RangeSlider = Object.assign(_RangeSlider, {
-    cubeInputType: 'CheckboxGroup',
-});
-exports.RangeSlider = __RangeSlider;
-
-        

package/cjs/components/pickers/RangeSlider/Slide.js

@@ -1,28 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Slide = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styled_1 = require("./styled");
-function Slide(props) {
-    const { ranges, state, isDisabled, isSingle } = props;
-    const styles = {};
-    const mods = (0, react_1.useMemo)(() => ({
-        single: isSingle,
-        disabled: isDisabled,
-    }), [isDisabled, isSingle]);
-    ranges.forEach((rangeIndex) => {
-        styles[`@thumb-${rangeIndex}-value`] = state.getThumbPercent(rangeIndex);
-    });
-    return ((0, jsx_runtime_1.jsx)(styled_1.StyledSlide, { mods: mods, children: (0, jsx_runtime_1.jsx)(styled_1.StyledSlideTrack, { styles: styles, mods: mods }, void 0) }, void 0));
-}
-exports.Slide = Slide;
-
-        

package/cjs/components/pickers/RangeSlider/Thumb.js

@@ -1,36 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Thumb = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const slider_1 = require("@react-aria/slider");
-const interactions_1 = require("@react-aria/interactions");
-const visually_hidden_1 = require("@react-aria/visually-hidden");
-const focus_1 = require("@react-aria/focus");
-const react_2 = require("../../../utils/react");
-const styled_1 = require("./styled");
-function Thumb(props) {
-    const { state, isDisabled } = props;
-    const ref = (0, react_1.useRef)(null);
-    const { thumbProps, inputProps, isDragging, isFocused } = (0, slider_1.useSliderThumb)({
-        ...props,
-        inputRef: ref,
-    }, state);
-    const { hoverProps, isHovered } = (0, interactions_1.useHover)({ isDisabled });
-    return ((0, jsx_runtime_1.jsx)(focus_1.FocusRing, { within: true, children: (0, jsx_runtime_1.jsx)(styled_1.StyledThumb, { mods: {
-                hovered: isHovered,
-                dragged: isDragging,
-                focused: isFocused,
-                disabled: isDisabled,
-            }, ...(0, react_2.mergeProps)(thumbProps, hoverProps), role: "presentation", children: (0, jsx_runtime_1.jsx)(visually_hidden_1.VisuallyHidden, { children: (0, jsx_runtime_1.jsx)("input", { ref: ref, ...inputProps }, void 0) }, void 0) }, void 0) }, void 0));
-}
-exports.Thumb = Thumb;
-
-        

package/cjs/components/pickers/RangeSlider/styled.js

@@ -1,118 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledContent = exports.StyledSlider = exports.StyledControls = exports.StyledGrade = exports.StyledGradation = exports.StyledSlideTrack = exports.StyledSlide = exports.StyledThumb = void 0;
-const tasty_1 = require("../../../tasty");
-exports.StyledThumb = (0, tasty_1.tasty)({
-    styles: {
-        top: '2x',
-        width: '2x',
-        height: '2x',
-        fill: {
-            '': '#purple',
-            hovered: '#6B4FEE',
-            dragged: '#purple',
-            disabled: '#dark-04',
-        },
-        cursor: {
-            hovered: 'pointer',
-            dragged: 'grab',
-        },
-        shadow: '0px 2px 4px #dark.2',
-        radius: '50%',
-        border: {
-            focused: '3px solid #CAC9FF',
-            dragged: '2px solid #665DE8;',
-        },
-        boxSizing: {
-            '': 'border-box',
-            focused: 'content-box',
-            dragged: 'border-box',
-        },
-        transition: 'theme',
-    },
-});
-exports.StyledSlide = (0, tasty_1.tasty)({
-    styles: {
-        top: '1.875x',
-        position: 'absolute',
-        fill: {
-            '': '#dark-05',
-            // disabled: '#dark-04',
-        },
-        height: '2px',
-        width: '100%',
-        radius: true,
-    },
-});
-exports.StyledSlideTrack = (0, tasty_1.tasty)({
-    styles: {
-        position: 'absolute',
-        '@start-range': {
-            '': '@thumb-0-value',
-            single: '0',
-        },
-        '@end-range': {
-            '': '(1 - @thumb-1-value)',
-            single: '(1 - @thumb-0-value)',
-        },
-        left: '(@start-range * 100%)',
-        right: '(@end-range * 100%)',
-        height: '2px',
-        fill: {
-            '': '#purple',
-            disabled: '#dark-04',
-        },
-        radius: true,
-    },
-});
-exports.StyledGradation = (0, tasty_1.tasty)({
-    styles: {},
-});
-exports.StyledGrade = (0, tasty_1.tasty)({
-    styles: {},
-});
-exports.StyledControls = (0, tasty_1.tasty)({
-    styles: {
-        position: 'relative',
-        width: '100% - 2x',
-        height: '4x',
-    },
-});
-exports.StyledSlider = (0, tasty_1.tasty)({
-    as: 'section',
-    styles: {
-        position: 'relative',
-        display: 'flex',
-        gap: {
-            '': '0',
-            inputs: '1x',
-        },
-        flexDirection: {
-            '': 'column',
-            inputs: 'row',
-        },
-        alignItems: 'center',
-        width: '100%',
-        padding: {
-            '': '0',
-            sideLabel: '0.75x top',
-        },
-    },
-});
-exports.StyledContent = (0, tasty_1.tasty)({
-    styles: {
-        display: 'flex',
-        alignItems: 'center',
-        flexDirection: 'column',
-        width: '100%',
-    },
-});
-
-        

package/es/components/pickers/RangeSlider/Gradation.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { StyledGradation, StyledGrade } from './styled';
-export function Gradation(props) {
-    const { state, ranges, values = [] } = props;
-    if (!values.length) {
-        return null;
-    }
-    const getIsActive = (value, idx) => {
-        const [minIdx, maxIdx] = ranges.map((range) => state.getThumbValue(range));
-        return idx >= minIdx && idx <= maxIdx;
-    };
-    return (_jsx(StyledGradation, { children: values.map((value, idx) => (_jsx(StyledGrade, { mods: {
-                active: getIsActive(value, idx),
-            }, children: value }, value))) }, void 0));
-}
-
-        

package/es/components/pickers/RangeSlider/Header.js

@@ -1,12 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-export function Header() {
-    return null;
-}
-
-        

package/es/components/pickers/RangeSlider/RangeInput.js

@@ -1,33 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-import { Flow, NumberInput } from '../../../';
-function calculateWidth(max) {
-    if (typeof max === 'undefined') {
-        return undefined;
-    }
-    const value = String(max).length;
-    const charWidth = 1.75;
-    return `${value * charWidth}x`;
-}
-export function RangeInput(props) {
-    const { state, index, suffix, min, max, ...otherProps } = props;
-    const value = state.values[index];
-    const width = calculateWidth(max);
-    const onChange = useCallback((value) => {
-        state.setThumbValue(index, value);
-    }, [index, state]);
-    return (_jsx(NumberInput, { ...otherProps, hideStepper: true, size: "small", inputProps: {
-            maxLength: max && String(max).length,
-        }, inputStyles: {
-            width,
-        }, suffix: suffix && _jsx(Flow, { padding: "1.5x right", children: suffix }, void 0), value: value, minValue: state.getThumbMinValue(index), maxValue: state.getThumbMaxValue(index), onChange: onChange }, void 0));
-}
-
-        

package/es/components/pickers/RangeSlider/RangeSlider.js

@@ -1,96 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useRef } from 'react';
-import { useSlider } from '@react-aria/slider';
-import { useSliderState } from '@react-stately/slider';
-import { FieldWrapper } from '../../forms/FieldWrapper';
-import { extractStyles, OUTER_STYLES, } from '../../../tasty';
-import { Slide } from './Slide';
-import { Gradation } from './Gradation';
-import { Thumb } from './Thumb';
-import { RangeInput } from './RangeInput';
-import { StyledControls, StyledSlider, StyledContent } from './styled';
-function getRanges(value) {
-    if (Array.isArray(value)) {
-        return value.length >= 2 ? [0, 1] : [0];
-    }
-    return [0];
-}
-function RangeSlider(props, ref) {
-    let { labelPosition, label, extra, styles, isRequired, validationState, message, description, requiredMark, labelSuffix, labelStyles, necessityIndicator, defaultValue, value, gradation, step = 1, isDisabled, orientation = 'horizontal', showInput, inputStyles, inputSuffix, inputSuffixPosition, minValue, maxValue, onChange, onChangeEnd, ...otherProps } = props;
-    const ranges = getRanges(defaultValue || value || [0, 1]);
-    const isSingle = ranges.length <= 1;
-    const trackRef = useRef(null);
-    const inputRef = useRef(null);
-    const numberFormatter = new Intl.NumberFormat();
-    const baseProps = {
-        step,
-        orientation,
-        isDisabled,
-        onChange(range) {
-            if (onChange) {
-                onChange(Array.isArray(range) ? range : [range]);
-            }
-        },
-        onChangeEnd(range) {
-            if (onChangeEnd) {
-                onChangeEnd(Array.isArray(range) ? range : [range]);
-            }
-        },
-    };
-    const state = useSliderState({
-        ...props,
-        ...baseProps,
-        numberFormatter,
-    });
-    const { groupProps, trackProps, labelProps } = useSlider({
-        ...props,
-        ...baseProps,
-    }, state, trackRef);
-    const inputProps = {
-        min: minValue,
-        max: maxValue,
-        step,
-        state: state,
-        suffix: inputSuffix,
-        styles: inputStyles,
-        suffixPosition: inputSuffixPosition,
-        isDisabled,
-    };
-    const sliderField = (_jsxs(StyledSlider, { ...groupProps, mods: {
-            sideLabel: labelPosition === 'side',
-            inputs: showInput,
-        }, children: [!isSingle && showInput && _jsx(RangeInput, { index: 0, ...inputProps }, void 0), _jsx(StyledContent, { children: _jsxs(StyledControls, { ...trackProps, ref: trackRef, children: [_jsx(Slide, { state: state, ranges: ranges, isSingle: isSingle, isDisabled: isDisabled }, void 0), _jsx(Gradation, { state: state, ranges: ranges, values: gradation }, void 0), ranges.map((thumb) => (_jsx(Thumb, { index: thumb, state: state, inputRef: inputRef, trackRef: trackRef, isDisabled: isDisabled, defaultValue: defaultValue && defaultValue[thumb] }, thumb)))] }, void 0) }, void 0), showInput && _jsx(RangeInput, { index: 1, ...inputProps }, void 0)] }, void 0));
-    styles = extractStyles(otherProps, OUTER_STYLES, styles);
-    return (_jsx(FieldWrapper, { ...{
-            labelPosition,
-            label,
-            extra,
-            styles,
-            isRequired,
-            labelStyles,
-            necessityIndicator,
-            labelProps,
-            isDisabled,
-            validationState,
-            message,
-            description,
-            requiredMark,
-            labelSuffix,
-            Component: sliderField,
-            ref: ref,
-        } }, void 0));
-}
-const _RangeSlider = forwardRef(RangeSlider);
-const __RangeSlider = Object.assign(_RangeSlider, {
-    cubeInputType: 'CheckboxGroup',
-});
-export { __RangeSlider as RangeSlider };
-
-        

package/es/components/pickers/RangeSlider/Slide.js

@@ -1,24 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { StyledSlide, StyledSlideTrack } from './styled';
-export function Slide(props) {
-    const { ranges, state, isDisabled, isSingle } = props;
-    const styles = {};
-    const mods = useMemo(() => ({
-        single: isSingle,
-        disabled: isDisabled,
-    }), [isDisabled, isSingle]);
-    ranges.forEach((rangeIndex) => {
-        styles[`@thumb-${rangeIndex}-value`] = state.getThumbPercent(rangeIndex);
-    });
-    return (_jsx(StyledSlide, { mods: mods, children: _jsx(StyledSlideTrack, { styles: styles, mods: mods }, void 0) }, void 0));
-}
-
-        

package/es/components/pickers/RangeSlider/Thumb.js

@@ -1,32 +0,0 @@
-/**
- * @license MIT
- * author: Cube Dev Team
- * @cube-dev/ui-kit v0.0.0-canary-d37d372
- * Released under the MIT license.
- */
-
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useRef } from 'react';
-import { useSliderThumb } from '@react-aria/slider';
-import { useHover } from '@react-aria/interactions';
-import { VisuallyHidden } from '@react-aria/visually-hidden';
-import { FocusRing } from '@react-aria/focus';
-import { mergeProps } from '../../../utils/react';
-import { StyledThumb } from './styled';
-export function Thumb(props) {
-    const { state, isDisabled } = props;
-    const ref = useRef(null);
-    const { thumbProps, inputProps, isDragging, isFocused } = useSliderThumb({
-        ...props,
-        inputRef: ref,
-    }, state);
-    const { hoverProps, isHovered } = useHover({ isDisabled });
-    return (_jsx(FocusRing, { within: true, children: _jsx(StyledThumb, { mods: {
-                hovered: isHovered,
-                dragged: isDragging,
-                focused: isFocused,
-                disabled: isDisabled,
-            }, ...mergeProps(thumbProps, hoverProps), role: "presentation", children: _jsx(VisuallyHidden, { children: _jsx("input", { ref: ref, ...inputProps }, void 0) }, void 0) }, void 0) }, void 0));
-}
-
-