(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "tslib", "react", "../../../typography", "./styles"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var tslib_1 = require("tslib");
    var react_1 = (0, tslib_1.__importStar)(require("react"));
    var typography_1 = require("../../../typography");
    var styles_1 = require("./styles");
    var SelectValueContainer = function (props) {
        var valueContainerRef = (0, react_1.useRef)(null);
        var handleWheel = function (event) {
            var _a;
            event.preventDefault();
            (_a = valueContainerRef.current) === null || _a === void 0 ? void 0 : _a.scrollBy({
                left: event.deltaY < 0 ? -30 : 30
            });
        };
        (0, react_1.useEffect)(function () {
            var valueContainer = valueContainerRef.current;
            valueContainer === null || valueContainer === void 0 ? void 0 : valueContainer.addEventListener("wheel", handleWheel, {
                passive: false
            });
            return function () { return valueContainer === null || valueContainer === void 0 ? void 0 : valueContainer.removeEventListener("wheel", handleWheel); };
        });
        return (react_1.default.createElement(styles_1.ValueContainerStyle, { "data-element": "select-valueContainer", ref: valueContainerRef, size: props.selectProps.size, isMulti: props.isMulti, isHasValue: props.hasValue, isFocused: props.selectProps.menuIsOpen, isReadOnly: props.selectProps.isReadOnly, isDisabled: props.selectProps.isDisabled }, !props.hasValue && props.selectProps.isReadOnly ? (react_1.default.createElement(typography_1.P2, { type: "corvus", className: "text-readonly" }, "\u041D\u0435 \u0437\u0430\u043F\u043E\u043B\u043D\u0435\u043D\u043E")) : (props.children)));
    };
    exports.default = SelectValueContainer;
});
