import { action, computed, makeObservable, observable } from 'mobx';
import { addResizeObserver } from '@wix/bex-core';
export class HorizontalOverflowState {
    constructor(params) {
        this._scrollWidth = 0;
        this._clientWidth = 0;
        const { state } = params;
        this.container = state.container;
        this._state = state;
        makeObservable(this, {
            _sync: action.bound,
            _scrollWidth: observable.ref,
            _clientWidth: observable.ref,
            _isOverflowing: computed,
        });
        this._syncThrottled = this.container.lodash.throttle(() => {
            window.requestAnimationFrame(this._sync);
        }, 200);
    }
    get _isOverflowing() {
        return this._scrollWidth > this._clientWidth;
    }
    _sync() {
        const { _element } = this;
        if (!_element) {
            return;
        }
        this._clientWidth = _element.clientWidth;
        this._scrollWidth = _element.scrollWidth;
    }
    initLayout() {
        const { _element, _state } = this;
        if (_state.responsiveDisabled) {
            return;
        }
        if (!_element) {
            return;
        }
        this._sync();
    }
    init() {
        const { _element, _state } = this;
        if (_state.responsiveDisabled) {
            return;
        }
        if (!_element) {
            return;
        }
        const disposers = [addResizeObserver(_element, this._syncThrottled)];
        return () => {
            disposers.forEach((d) => d?.());
        };
    }
}
//# sourceMappingURL=HorizontalOverflowState.js.map