@laser-ui/components 2.3.4 → 2.4.0

package/image/ImagePreview.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { ImagePreviewProps } from './types';
 export declare function ImagePreview(props: ImagePreviewProps): React.ReactElement | null;

package/image/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES, PREVIEW_CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/input/Input.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { InputProps } from './types';
 import { InputNumber } from './InputNumber';
 export declare const Input: {

package/input/Input.js

@@ -42,7 +42,10 @@ export const Input = (props) => {
             var _a, _b;
             (_a = restProps.onClick) === null || _a === void 0 ? void 0 : _a.call(restProps, e);
             (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
-        }, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, styled('input__input'), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
+        }, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, mergeCS(styled('input__input'), {
+                className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
+                style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
+            }), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
                     inputRef.current = instance;
                     const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
                     return () => {

package/input/InputNumber.js

@@ -85,7 +85,10 @@ export function InputNumber(props) {
             var _a, _b;
             (_a = restProps.onClick) === null || _a === void 0 ? void 0 : _a.call(restProps, e);
             (_b = inputRef.current) === null || _b === void 0 ? void 0 : _b.focus({ preventScroll: true });
-        }, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, styled('input__input'), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
+        }, children: [checkNodeExist(prefix) && _jsx("div", Object.assign({}, styled('input__prefix'), { children: prefix })), _jsx(BaseInput, Object.assign({}, inputProps, mergeCS(styled('input__input'), {
+                className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
+                style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
+            }), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { ref: (instance) => {
                     inputRef.current = instance;
                     const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);
                     return () => {

package/input/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { FormControlProvider } from '../form/types';
 import type { BaseProps, Size } from '../types';

package/internal/lazy-loading/LazyLoading.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { LazyLoadingProps } from './types';
 export declare function LazyLoading(props: LazyLoadingProps): React.ReactNode;

package/internal/lazy-loading/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export {};
 export interface LazyLoadingProps {
     children?: React.ReactNode;

package/internal/popup/Popup.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { PopupProps } from './types';
 export declare function Popup(props: PopupProps): React.ReactElement | null;

package/internal/popup/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export {};
 export interface PopupProps {
     children: (props: {

package/internal/portal/Portal.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { PortalProps } from './types';
 export declare function Portal<T extends Element = HTMLElement>(props: PortalProps<T>): React.ReactElement | null;

package/internal/portal/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export {};
 export interface PortalProps<T extends Element = HTMLElement> {
     ref?: React.Ref<T | null>;

package/mask/Mask.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { MaskProps } from './types';
 export declare function Mask(props: MaskProps): React.ReactElement | null;

package/mask/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export {};
 export interface MaskProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
     visible: boolean;

package/menu/Menu.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { MenuItem, MenuProps } from './types';
 export declare function Menu<ID extends React.Key, T extends MenuItem<ID>>(props: MenuProps<ID, T>): React.ReactElement | null;

package/menu/Menu.js

@@ -290,12 +290,12 @@ export function Menu(props) {
                 return (_jsx(Fragment, { children: itemType === 'item' ? (_jsx(MenuItemFC, { namespace: namespace, styled: styled, id: id, level: level, space: space, step: step, icon: itemIcon, 
                         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                         posinset: posinset.get(itemId), mode: mode, inNav: inNav, active: active === itemId, focus: focusVisible && isFocus, disabled: itemDisabled, onClick: handleItemClick, children: itemTitle })) : itemType === 'group' ? (_jsx(MenuGroup, { styled: styled, id: id, level: level, space: space, step: step, list: children && getNodes(children, level + 1, nextSubParents), empty: isEmpty, children: itemTitle })) : (_jsx(MenuSub, { ref: (instance) => {
-                            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                            const fn = instance;
-                            updateSubPosition.current.set(itemId, fn);
-                            return () => {
-                                updateSubPosition.current.delete(itemId);
-                            };
+                            if (instance) {
+                                updateSubPosition.current.set(itemId, instance);
+                                return () => {
+                                    updateSubPosition.current.delete(itemId);
+                                };
+                            }
                         }, namespace: namespace, styled: styled, id: id, level: level, space: space, step: step, icon: itemIcon, list: children && getNodes(children, mode === 'vertical' ? level + 1 : 0, nextSubParents), popupState: popupState === null || popupState === void 0 ? void 0 : popupState.visible, trigger: expandTrigger !== null && expandTrigger !== void 0 ? expandTrigger : (mode === 'vertical' ? 'click' : 'hover'), 
                         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                         posinset: posinset.get(itemId), mode: mode, inNav: inNav, active: (mode === 'vertical' ? !isExpand : isUndefined(popupState)) && actives.includes(itemId), includeActive: actives.includes(itemId), expand: isExpand, empty: isEmpty, focus: focusVisible && isFocus, disabled: itemDisabled, onVisibleChange: (visible) => {

package/menu/internal/MenuGroup.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Styled } from '../../hooks/useStyled';
 import type { CLASSES } from '../vars';
 interface MenuGroupProps {

package/menu/internal/MenuItem.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Styled } from '../../hooks/useStyled';
 import type { MenuMode } from '../types';
 import type { CLASSES } from '../vars';

package/menu/internal/MenuSub.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Styled } from '../../hooks/useStyled';
 import type { MenuMode } from '../types';
 import type { CLASSES } from '../vars';

package/menu/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/menu/utils.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { MenuItem } from './types';
 export declare function checkEnableItem<ID extends React.Key, T extends MenuItem<ID>>(item: T): boolean;
 export declare function getSameLevelEnableItems<ID extends React.Key, T extends MenuItem<ID>>(arr: T[]): T[];

package/modal/Modal.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { ModalProps } from './types';
 import { ModalAlert } from './ModalAlert';
 import { ModalFooter } from './ModalFooter';

package/modal/ModalAlert.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { ModalAlertProps } from './types';
 export declare function ModalAlert(props: ModalAlertProps): React.ReactElement | null;

package/modal/ModalFooter.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { ModalFooterProps } from './types';
 export declare function ModalFooter(props: ModalFooterProps): React.ReactElement | null;

package/modal/ModalHeader.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { ModalHeaderProps } from './types';
 export declare function ModalHeader(props: ModalHeaderProps): React.ReactElement | null;

package/modal/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { ButtonProps } from '../button';
 import type { BaseProps } from '../types';

package/modal/vars.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const CLASSES: {
     modal: string;
     'modal--center': string;

package/notification/Notification.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { NotificationProps } from './types';
 export declare function Notification(props: NotificationProps): React.ReactElement | null;

package/notification/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@laser-ui/components",
-  "version": "2.3.4",
+  "version": "2.4.0",
   "description": "React components.",
   "keywords": [
     "ui",
@@ -37,5 +37,5 @@
     "access": "public",
     "directory": "../../dist/libs/components"
   },
-  "gitHead": "5c907970283c561b245053dbf13e6560e3bd5c74"
+  "gitHead": "6aa6cb81ee51849b66dddeab0de811cadcb65c60"
 }

package/pagination/Pagination.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { PaginationProps } from './types';
 export declare function Pagination(props: PaginationProps): React.ReactElement | null;

package/pagination/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/pagination/utils.d.ts

@@ -1,2 +1 @@
-/// <reference types="react" />
-export declare function buttonProps(handleClick: () => void, disabled?: boolean): import("react").HTMLAttributes<HTMLElement>;
+export declare function buttonProps(handleClick: () => void, disabled?: boolean): React.HTMLAttributes<HTMLElement>;

package/popover/Popover.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { PopoverProps } from './types';
 import { PopoverFooter } from './PopoverFooter';
 import { PopoverHeader } from './PopoverHeader';

package/popover/PopoverFooter.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { PopoverFooterProps } from './types';
 export declare function PopoverFooter(props: PopoverFooterProps): React.ReactElement | null;

package/popover/PopoverHeader.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { PopoverHeaderProps } from './types';
 export declare function PopoverHeader(props: PopoverHeaderProps): React.ReactElement | null;

package/popover/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { ButtonProps } from '../button';
 import type { BaseProps, PopupPlacement } from '../types';

package/popover/vars.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 export declare const CLASSES: {
     popover: string;
     'popover--top': string;

package/progress/Progress.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { ProgressProps } from './types';
 export declare function Progress(props: ProgressProps): React.ReactElement | null;

package/progress/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/radio/Radio.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { RadioProps } from './types';
 import { RadioGroup } from './RadioGroup';
 export declare const Radio: {

package/radio/Radio.js

@@ -36,7 +36,10 @@ export const Radio = (props) => {
                     return () => {
                         waveRef.current = null;
                     };
-                }, color: `var(--${namespace}-color-primary)` }), _jsx("div", Object.assign({}, styled('radio__input-wrapper'), { children: _jsx("input", Object.assign({}, inputProps, styled('radio__input'), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "radio", checked: checked, disabled: disabled, "aria-checked": checked, onChange: () => {
+                }, color: `var(--${namespace}-color-primary)` }), _jsx("div", Object.assign({}, styled('radio__input-wrapper'), { children: _jsx("input", Object.assign({}, inputProps, mergeCS(styled('radio__input'), {
+                    className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
+                    style: inputProps === null || inputProps === void 0 ? void 0 : inputProps.style,
+                }), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "radio", checked: checked, disabled: disabled, "aria-checked": checked, onChange: () => {
                         changeChecked(true);
                     } })) })), checkNodeExist(children) && _jsx("div", Object.assign({}, styled('radio__label'), { children: children }))] })));
 };

package/radio/RadioGroup.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { RadioGroupItem, RadioGroupProps } from './types';
 export declare function RadioGroup<V extends React.Key, T extends RadioGroupItem<V>>(props: RadioGroupProps<V, T>): React.ReactElement | null;

package/radio/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { FormControlProvider } from '../form/types';
 import type { BaseProps, Size } from '../types';

package/radio/vars.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Size } from '../types';
 export declare const CLASSES: {
     radio: string;
@@ -15,6 +14,6 @@ export declare const CLASSES: {
     radio__label: string;
 };
 export declare const RadioGroupContext: import("react").Context<{
-    pattern?: "fill" | "outline" | undefined;
+    pattern?: "outline" | "fill";
     size: Size;
 } | undefined>;

package/rating/Rating.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { RatingProps } from './types';
 export declare function Rating(props: RatingProps): React.ReactElement | null;

package/rating/internal/RatingStar.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Styled } from '../../hooks/useStyled';
 import type { CLASSES } from '../vars';
 interface RatingStarProps {

package/rating/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { FormControlProvider } from '../form/types';
 import type { BaseProps } from '../types';

package/root/Dialogs.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { DialogInstance } from '../dialog-service';
 export declare const Dialogs: import("react").NamedExoticComponent<{
     dialogs: DialogInstance<any>[];

package/root/Root.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { RootProps } from './types';
 export declare function Root(props: RootProps): React.ReactElement | null;

package/root/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type resources from '../resources.json';
 import type { Lang } from '../types';
 export {};

package/root/vars.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { Lang } from '../types';
 import resources from '../resources.json';
 export declare const ROOT_DATA: {

package/select/Select.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SelectItem, SelectProps } from './types';
 export declare function Select<V extends React.Key, T extends SelectItem<V>>(props: SelectProps<V, T>): React.ReactElement | null;

package/select/Select.js

@@ -90,10 +90,8 @@ export function Select(props) {
         if (!hasSearch) {
             return [];
         }
-        const filterFn = isUndefined(customSearch === null || customSearch === void 0 ? void 0 : customSearch.filter)
-            ? (item) => item.label.includes(searchValue)
-            : // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                (item) => customSearch.filter(searchValue, item);
+        const customFilterFn = customSearch && customSearch.filter ? customSearch.filter : undefined;
+        const filterFn = customFilterFn ? (item) => customFilterFn(searchValue, item) : (item) => item.label.includes(searchValue);
         const sortFn = customSearch === null || customSearch === void 0 ? void 0 : customSearch.sort;
         let itemCreated = createItem === null || createItem === void 0 ? void 0 : createItem(searchValue);
         if (itemCreated) {
@@ -290,10 +288,8 @@ export function Select(props) {
                     changeVisible((draft) => (searchable ? true : !draft));
                 }, children: [_jsxs("div", Object.assign({}, styled('select__container'), { title: selectedLabel, children: [(() => {
                                 const nodeProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, inputProps), mergeCS(styled('select__search'), {
-                                    style: {
-                                        opacity: inputable ? undefined : 0,
-                                        zIndex: inputable ? undefined : -1,
-                                    },
+                                    className: inputProps === null || inputProps === void 0 ? void 0 : inputProps.className,
+                                    style: Object.assign(Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps.style), { opacity: inputable ? undefined : 0, zIndex: inputable ? undefined : -1 }),
                                 })), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria), { ref: (instance) => {
                                         inputRef.current = instance;
                                         const ret = setRef(inputProps === null || inputProps === void 0 ? void 0 : inputProps.ref, instance);

package/select/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { FormControlProvider } from '../form/types';
 import type { BaseProps, Size } from '../types';

package/separator/Separator.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SeparatorProps } from './types';
 export declare function Separator(props: SeparatorProps): React.ReactElement | null;

package/separator/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/skeleton/Skeleton.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SkeletonProps } from './types';
 export declare function Skeleton(props: SkeletonProps): React.ReactElement | null;

package/skeleton/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/slider/Slider.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SliderProps } from './types';
 export declare function Slider(props: SliderProps): React.ReactElement | null;

package/slider/Slider.js

@@ -248,46 +248,52 @@ export function Slider(props) {
                 };
             }, visible: isLeft ? visibleLeft : visibleRight, title: customTooltip ? customTooltip(value) : value, placement: vertical ? 'right' : 'top', onVisibleChange: (visible) => {
                 setDotVisible(visible ? (isLeft ? 'left' : 'right') : null);
-            }, children: (tooltipProps) => (_jsx("div", Object.assign({}, mergeCS(styled('slider__input-wrapper'), {
-                style: {
-                    left: vertical ? undefined : `calc(${value} / ${max - min} * 100% - 7px)`,
-                    bottom: vertical ? `calc(${value} / ${max - min} * 100% - 7px)` : undefined,
-                },
-            }), { ref: (instance) => {
-                    const dotRef = isLeft ? dotLeftRef : dotRightRef;
-                    dotRef.current = instance;
-                    return () => {
-                        dotRef.current = null;
-                    };
-                } }, tooltipProps, { children: _jsx("input", Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], styled('slider__input'), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "range", value: value, max: max, min: min, step: step !== null && step !== void 0 ? step : undefined, disabled: disabled, "aria-orientation": vertical ? 'vertical' : 'horizontal', onChange: (e) => {
-                        const val = toNumber(e.currentTarget.value);
-                        if (range) {
-                            const index = isLeft ? 0 : 1;
-                            changeValue((draft) => {
-                                const offset = val - draft[index];
-                                const isAdd = offset > 0;
-                                draft[index] = val;
-                                if (isNumber(rangeMinDistance) && draft[1] - draft[0] < rangeMinDistance) {
-                                    const _index = isLeft ? 1 : 0;
-                                    draft[_index] = getValue(draft[_index] + offset, isAdd ? 'ceil' : 'floor');
-                                    if (draft[1] - draft[0] < rangeMinDistance) {
-                                        draft[index] = getValue(draft[_index] + (isAdd ? -rangeMinDistance : rangeMinDistance), isAdd ? 'floor' : 'ceil');
+            }, children: (tooltipProps) => {
+                var _a, _b;
+                return (_jsx("div", Object.assign({}, mergeCS(styled('slider__input-wrapper'), {
+                    style: {
+                        left: vertical ? undefined : `calc(${value} / ${max - min} * 100% - 7px)`,
+                        bottom: vertical ? `calc(${value} / ${max - min} * 100% - 7px)` : undefined,
+                    },
+                }), { ref: (instance) => {
+                        const dotRef = isLeft ? dotLeftRef : dotRightRef;
+                        dotRef.current = instance;
+                        return () => {
+                            dotRef.current = null;
+                        };
+                    } }, tooltipProps, { children: _jsx("input", Object.assign({}, inputProps === null || inputProps === void 0 ? void 0 : inputProps[index], mergeCS(styled('slider__input'), {
+                        className: (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.className,
+                        style: (_b = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _b === void 0 ? void 0 : _b.style,
+                    }), formControl === null || formControl === void 0 ? void 0 : formControl.inputAria, { type: "range", value: value, max: max, min: min, step: step !== null && step !== void 0 ? step : undefined, disabled: disabled, "aria-orientation": vertical ? 'vertical' : 'horizontal', onChange: (e) => {
+                            const val = toNumber(e.currentTarget.value);
+                            if (range) {
+                                const index = isLeft ? 0 : 1;
+                                changeValue((draft) => {
+                                    const offset = val - draft[index];
+                                    const isAdd = offset > 0;
+                                    draft[index] = val;
+                                    if (isNumber(rangeMinDistance) && draft[1] - draft[0] < rangeMinDistance) {
+                                        const _index = isLeft ? 1 : 0;
+                                        draft[_index] = getValue(draft[_index] + offset, isAdd ? 'ceil' : 'floor');
+                                        if (draft[1] - draft[0] < rangeMinDistance) {
+                                            draft[index] = getValue(draft[_index] + (isAdd ? -rangeMinDistance : rangeMinDistance), isAdd ? 'floor' : 'ceil');
+                                        }
                                     }
-                                }
-                            });
-                        }
-                        else {
-                            changeValue(val);
-                        }
-                    }, onFocus: (e) => {
-                        var _a, _b;
-                        (_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onFocus) === null || _b === void 0 ? void 0 : _b.call(_a, e);
-                        setDotFocused(isLeft ? 'left' : 'right');
-                    }, onBlur: (e) => {
-                        var _a, _b;
-                        (_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, e);
-                        setDotFocused(null);
-                    } })) }))) }));
+                                });
+                            }
+                            else {
+                                changeValue(val);
+                            }
+                        }, onFocus: (e) => {
+                            var _a, _b;
+                            (_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onFocus) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+                            setDotFocused(isLeft ? 'left' : 'right');
+                        }, onBlur: (e) => {
+                            var _a, _b;
+                            (_b = (_a = inputProps === null || inputProps === void 0 ? void 0 : inputProps[index]) === null || _a === void 0 ? void 0 : _a.onBlur) === null || _b === void 0 ? void 0 : _b.call(_a, e);
+                            setDotFocused(null);
+                        } })) })));
+            } }));
     };
     const preventBlur = (e) => {
         if (e.button === 0) {

package/slider/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { FormControlProvider } from '../form/types';
 import type { BaseProps } from '../types';

package/slides/Slides.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SlidesItem, SlidesProps } from './types';
 export declare function Slides<ID extends React.Key, T extends SlidesItem<ID>>(props: SlidesProps<ID, T>): React.ReactElement | null;

package/slides/Slides.js

@@ -152,20 +152,20 @@ export function Slides(props) {
         setDragOpacity(undefined);
     };
     useIsomorphicLayoutEffect(() => {
-        if (slidesRef.current) {
+        const slidesEl = slidesRef.current;
+        if (slidesEl) {
             let size = 0;
-            const slideEls = slidesRef.current.querySelectorAll(`.${namespace}-slides__slide`);
+            const slideEls = slidesEl.querySelectorAll(`.${namespace}-slides__slide`);
             slideEls.forEach((el) => {
                 const index = Number(el.dataset['index']);
                 if (index < activeIndex) {
                     size += el[vertical ? 'offsetHeight' : 'offsetWidth'];
                 }
                 else if (index === activeIndex) {
-                    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                    slidesRef.current.style.height = el.offsetHeight + 'px';
+                    slidesEl.style.height = el.offsetHeight + 'px';
                 }
             });
-            const containerEl = slidesRef.current.querySelector(`.${namespace}-slides__container`);
+            const containerEl = slidesEl.querySelector(`.${namespace}-slides__container`);
             containerEl.style.transform = effect === 'slide' ? `translate${vertical ? 'Y' : 'X'}(calc(-${size}px + ${dragDistance}px))` : '';
         }
     });

package/slides/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/spinner/Spinner.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { SpinnerProps } from './types';
 export declare function Spinner(props: SpinnerProps): React.ReactElement | null;

package/spinner/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};

package/stepper/Stepper.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type { StepperItem, StepperProps } from './types';
 export declare function Stepper<T extends StepperItem>(props: StepperProps<T>): React.ReactElement | null;

package/stepper/types.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import type { CLASSES } from './vars';
 import type { BaseProps } from '../types';
 export {};