@sima-land/ui-nucleons 45.0.0-alpha.5 → 45.0.0-alpha.51

package/carousel/draggable.d.ts

@@ -1,127 +0,0 @@
-import { Component } from 'react';
-import { IPoint } from '../helpers/point';
-import DraggableEvent from './helpers/draggable-event';
-import { EventWithPosition } from '../helpers/events';
-export interface Control {
-    isGrabbed: () => boolean;
-    setOffset: typeof Draggable.prototype.setOffset;
-    toggleTransition: typeof Draggable.prototype.toggleTransition;
-    isTransitionEnabled: () => boolean;
-}
-export type Delta2d = {
-    dx: number;
-    dy: number;
-};
-export type DraggableEventHandler = (e: DraggableEvent) => void;
-export interface DraggableProps {
-    axis?: 'x' | 'y';
-    active?: boolean;
-    onDragStart?: DraggableEventHandler;
-    onDragMove?: DraggableEventHandler;
-    onDragEnd?: DraggableEventHandler;
-    takeControl?: (c: Control) => void;
-    transitionDuration?: number;
-    containerProps?: React.HTMLProps<HTMLDivElement>;
-}
-/**
- * Компонент области, которую можно прокручивать перетаскиванием.
- */
-export declare class Draggable extends Component<DraggableProps> {
-    isGrabbed: boolean;
-    hasTransition: boolean;
-    needPreventClick: boolean;
-    currentOffset: IPoint;
-    clientPosition: IPoint;
-    draggableRef: React.RefObject<HTMLDivElement>;
-    offList: Array<VoidFunction>;
-    /**
-     * Конструктор компонента области, которую можно прокручивать перетаскиванием.
-     * @param props Свойства.
-     */
-    constructor(props: DraggableProps);
-    /**
-     * Запускает инициализацию обработки глобальных событий.
-     * Запускает передачу управления родительскому компоненту.
-     */
-    componentDidMount(): void;
-    /**
-     * Инициализирует обработчики глобальных событий.
-     */
-    initGlobalListeners(): void;
-    /**
-     * Передает управление родительскому компоненту через "takeControl".
-     */
-    passControl(): void;
-    /**
-     * Выполняет отписку от глобальных событий.
-     */
-    componentWillUnmount(): void;
-    /**
-     * Сохраняет данные захвата по событию клика/прикосновения.
-     * @param event Событие передвижения.
-     */
-    startCapture(event: EventWithPosition): void;
-    /**
-     * Обновляет смещение и все данные при необходимости.
-     * @param event Событие передвижения.
-     */
-    handleMove(event: MouseEvent | TouchEvent): void;
-    /**
-     * Отключает захват движения.
-     * Запускает соответствующий callback.
-     * @param event Событие окончания захвата.
-     */
-    handleMoveEnd(event: MouseEvent | TouchEvent): void;
-    /**
-     * Предотвращает клик если было произведено смещение мышью.
-     * @param event Событие окончания захвата.
-     */
-    handleClickCapture(event: React.MouseEvent<HTMLDivElement>): void;
-    /**
-     * Возвращает разницу последней сохраненной позиции и позиции в переданном событии.
-     * @param event Touch- или mouse-событие.
-     * @return Разница.
-     */
-    getClientDelta(event: MouseEvent | TouchEvent): Delta2d;
-    /**
-     * Переключает состояние активности захвата движения.
-     * @param active Активен ли захват движения.
-     */
-    toggleGrabbed(active: boolean): void;
-    /**
-     * Переключает состояние плавного перехода через CSS-свойство "transition".
-     * @param active Нужен ли плавный переход.
-     */
-    toggleTransition(active: boolean): void;
-    /**
-     * Возвращает true, если css свойство transition активно, false в противном случае.
-     * @return Активно ли css свойство transition.
-     */
-    isTransitionEnabled(): boolean;
-    /**
-     * Сохраняет данные позиции на экземпляре.
-     * @param event Событие.
-     */
-    saveClientPosition(event: EventWithPosition): void;
-    /**
-     * Переключает состояние необходимости предотвратить клик.
-     * @param needPrevent Активен ли захват движения.
-     */
-    togglePreventClickNeed(needPrevent: boolean): void;
-    /**
-     * Устанавливает смещение через CSS-свойство transform.
-     * Сохраняет данные смещения на экземпляре.
-     * @param x Смещение по оси абсцисс.
-     * @param y Смещение по оси ординат.
-     */
-    setOffset(x: number, y: number): void;
-    /**
-     * Рендер.
-     * @inheritdoc
-     */
-    render(): JSX.Element;
-}
-/**
- * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
- */
-export default Draggable;

package/carousel/draggable.js

@@ -1,246 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Draggable = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const point_1 = __importDefault(require("../helpers/point"));
-const draggable_event_1 = __importDefault(require("./helpers/draggable-event"));
-const styles_1 = require("../helpers/styles");
-const events_1 = require("../helpers/events");
-const bind_1 = __importDefault(require("classnames/bind"));
-const draggable_module_scss_1 = __importDefault(require("./draggable.module.scss"));
-const on_1 = __importDefault(require("../helpers/on"));
-const cx = bind_1.default.bind(draggable_module_scss_1.default);
-const EVENT_NAMES = {
-    move: ['mousemove', 'touchmove'],
-    moveEnd: ['mouseup', 'touchend', 'touchcancel'],
-};
-/**
- * Компонент области, которую можно прокручивать перетаскиванием.
- */
-class Draggable extends react_1.Component {
-    /**
-     * Конструктор компонента области, которую можно прокручивать перетаскиванием.
-     * @param props Свойства.
-     */
-    constructor(props) {
-        super(props);
-        this.isGrabbed = false;
-        this.hasTransition = false;
-        this.needPreventClick = false;
-        this.currentOffset = (0, point_1.default)();
-        this.clientPosition = (0, point_1.default)();
-        this.draggableRef = (0, react_1.createRef)();
-        this.handleClickCapture = this.handleClickCapture.bind(this);
-        this.startCapture = this.startCapture.bind(this);
-        this.offList = [];
-    }
-    /**
-     * Запускает инициализацию обработки глобальных событий.
-     * Запускает передачу управления родительскому компоненту.
-     */
-    componentDidMount() {
-        this.initGlobalListeners();
-        this.passControl();
-    }
-    /**
-     * Инициализирует обработчики глобальных событий.
-     */
-    initGlobalListeners() {
-        // eslint-disable-next-line require-jsdoc
-        const listen = (fn) => (eventName) => (0, on_1.default)(window, eventName, fn);
-        const moveHandler = this.handleMove.bind(this);
-        const moveEndHandler = this.handleMoveEnd.bind(this);
-        this.offList = [
-            ...EVENT_NAMES.move.map(listen(moveHandler)),
-            ...EVENT_NAMES.moveEnd.map(listen(moveEndHandler)),
-        ];
-    }
-    /**
-     * Передает управление родительскому компоненту через "takeControl".
-     */
-    passControl() {
-        const { takeControl } = this.props;
-        takeControl &&
-            takeControl({
-                isGrabbed: () => this.isGrabbed,
-                setOffset: this.setOffset.bind(this),
-                toggleTransition: this.toggleTransition.bind(this),
-                isTransitionEnabled: this.isTransitionEnabled.bind(this),
-            });
-    }
-    /**
-     * Выполняет отписку от глобальных событий.
-     */
-    componentWillUnmount() {
-        this.offList.forEach(fn => fn());
-    }
-    /**
-     * Сохраняет данные захвата по событию клика/прикосновения.
-     * @param event Событие передвижения.
-     */
-    startCapture(event) {
-        const { x, y } = this.currentOffset;
-        const { active = true, onDragStart } = this.props;
-        const isTouch = (0, events_1.isTouchEvent)(event);
-        if (active && ((0, events_1.isMainMouseButton)(event) || isTouch)) {
-            this.toggleGrabbed(true);
-            this.saveClientPosition(event);
-            if (!isTouch) {
-                event.preventDefault();
-                window.getSelection().removeAllRanges();
-            }
-            onDragStart &&
-                onDragStart(new draggable_event_1.default({
-                    offset: (0, point_1.default)(x, y),
-                    client: (0, events_1.getEventClientPos)(event),
-                }));
-        }
-    }
-    /**
-     * Обновляет смещение и все данные при необходимости.
-     * @param event Событие передвижения.
-     */
-    handleMove(event) {
-        var _a;
-        const { axis, onDragMove } = this.props;
-        if (this.isGrabbed) {
-            const { x, y } = this.currentOffset;
-            const { dx, dy } = this.getClientDelta(event);
-            const offsetX = x - (axis !== 'y' ? dx : 0);
-            const offsetY = y - (axis !== 'x' ? dy : 0);
-            const customEvent = new draggable_event_1.default({
-                offset: (0, point_1.default)(x, y),
-                client: (0, events_1.getEventClientPos)(event),
-            });
-            if (!(0, events_1.isTouchEvent)(event)) {
-                // предотвращаем выделение текста на странице
-                event.preventDefault();
-                (_a = window.getSelection()) === null || _a === void 0 ? void 0 : _a.removeAllRanges();
-                // предотвращаем клик только на НЕ touch-устройствах тк на них срабатывает клик при перетаскивании
-                this.togglePreventClickNeed(true);
-            }
-            onDragMove && onDragMove(customEvent);
-            if (!customEvent.prevented) {
-                this.saveClientPosition(event);
-                this.setOffset(offsetX, offsetY);
-            }
-        }
-    }
-    /**
-     * Отключает захват движения.
-     * Запускает соответствующий callback.
-     * @param event Событие окончания захвата.
-     */
-    handleMoveEnd(event) {
-        const { x: clientX, y: clientY } = this.clientPosition;
-        const { x, y } = this.currentOffset;
-        const { onDragEnd } = this.props;
-        if (this.isGrabbed && onDragEnd) {
-            !(0, events_1.isTouchEvent)(event) && event.preventDefault();
-            onDragEnd(new draggable_event_1.default({
-                offset: (0, point_1.default)(x, y),
-                client: (0, point_1.default)(clientX, clientY),
-            }));
-        }
-        this.toggleGrabbed(false);
-    }
-    /**
-     * Предотвращает клик если было произведено смещение мышью.
-     * @param event Событие окончания захвата.
-     */
-    handleClickCapture(event) {
-        if (this.needPreventClick) {
-            event.preventDefault();
-            this.togglePreventClickNeed(false);
-        }
-    }
-    /**
-     * Возвращает разницу последней сохраненной позиции и позиции в переданном событии.
-     * @param event Touch- или mouse-событие.
-     * @return Разница.
-     */
-    getClientDelta(event) {
-        const eventPos = (0, events_1.getEventClientPos)(event);
-        return {
-            dx: this.clientPosition.x - eventPos.x,
-            dy: this.clientPosition.y - eventPos.y,
-        };
-    }
-    /**
-     * Переключает состояние активности захвата движения.
-     * @param active Активен ли захват движения.
-     */
-    toggleGrabbed(active) {
-        this.isGrabbed = Boolean(active);
-    }
-    /**
-     * Переключает состояние плавного перехода через CSS-свойство "transition".
-     * @param active Нужен ли плавный переход.
-     */
-    toggleTransition(active) {
-        const { transitionDuration: duration = 320 } = this.props;
-        const { current: draggableEl } = this.draggableRef;
-        if (draggableEl && this.hasTransition !== Boolean(active)) {
-            this.hasTransition = Boolean(active);
-            draggableEl.style.transition = active ? (0, styles_1.getTransitionStyle)(duration, 'transform') : '';
-        }
-    }
-    /**
-     * Возвращает true, если css свойство transition активно, false в противном случае.
-     * @return Активно ли css свойство transition.
-     */
-    isTransitionEnabled() {
-        return this.hasTransition;
-    }
-    /**
-     * Сохраняет данные позиции на экземпляре.
-     * @param event Событие.
-     */
-    saveClientPosition(event) {
-        const eventPos = (0, events_1.getEventClientPos)(event);
-        this.clientPosition.x = eventPos.x;
-        this.clientPosition.y = eventPos.y;
-    }
-    /**
-     * Переключает состояние необходимости предотвратить клик.
-     * @param needPrevent Активен ли захват движения.
-     */
-    togglePreventClickNeed(needPrevent) {
-        this.needPreventClick = Boolean(needPrevent);
-    }
-    /**
-     * Устанавливает смещение через CSS-свойство transform.
-     * Сохраняет данные смещения на экземпляре.
-     * @param x Смещение по оси абсцисс.
-     * @param y Смещение по оси ординат.
-     */
-    setOffset(x, y) {
-        const { current: draggableEl } = this.draggableRef;
-        this.currentOffset.x = x || 0;
-        this.currentOffset.y = y || 0;
-        draggableEl && (draggableEl.style.transform = (0, styles_1.getTranslateStyle)(x, y));
-    }
-    /**
-     * Рендер.
-     * @inheritdoc
-     */
-    render() {
-        const { children, containerProps = {}, transitionDuration: duration = 320 } = this.props;
-        const { x, y } = this.currentOffset;
-        return ((0, jsx_runtime_1.jsx)("div", Object.assign({}, containerProps, { className: cx('draggable-container', containerProps.className), 
-            // обрабатываем захват чтобы при обработке клика на дочернем элементе defaultPrevented уже был true
-            onClickCapture: this.handleClickCapture, onMouseDown: this.startCapture, onTouchStart: this.startCapture }, { children: (0, jsx_runtime_1.jsx)("div", { ref: this.draggableRef, style: {
-                    transform: (0, styles_1.getTranslateStyle)(x, y),
-                    transition: this.hasTransition ? (0, styles_1.getTransitionStyle)(duration, 'transform') : '',
-                }, className: cx('draggable'), children: children }) })));
-    }
-}
-exports.Draggable = Draggable;
-/**
- * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
- */
-exports.default = Draggable;

package/carousel/helpers/draggable-event.d.ts

@@ -1,28 +0,0 @@
-import { IPoint } from '../../helpers/point';
-interface Data {
-    offset: IPoint;
-    client: IPoint;
-}
-/**
- * Нестандартное событие перетаскивания.
- */
-export declare class DraggableEvent implements Data {
-    prevented: boolean;
-    offset: IPoint;
-    client: IPoint;
-    /**
-     * Конструктор.
-     * @param props Свойства.
-     * @param props.offset Смещение контента.
-     * @param props.client Клиентская позиция.
-     */
-    constructor(props: Data);
-    /**
-     * Помечает событие как отмененное.
-     */
-    preventDefault(): void;
-}
-/**
- * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
- */
-export default DraggableEvent;

package/carousel/helpers/draggable-event.js

@@ -1,30 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.DraggableEvent = void 0;
-/**
- * Нестандартное событие перетаскивания.
- */
-class DraggableEvent {
-    /**
-     * Конструктор.
-     * @param props Свойства.
-     * @param props.offset Смещение контента.
-     * @param props.client Клиентская позиция.
-     */
-    constructor(props) {
-        this.prevented = false;
-        this.offset = props.offset;
-        this.client = props.client;
-    }
-    /**
-     * Помечает событие как отмененное.
-     */
-    preventDefault() {
-        this.prevented = true;
-    }
-}
-exports.DraggableEvent = DraggableEvent;
-/**
- * @deprecated Следует использовать именованный экспорт. Экспорт по умолчанию будет удалён в будущем.
- */
-exports.default = DraggableEvent;