Павел Родионов

componentDidMount() {
        document.addEventListener('click', this.close);
    }
    
    componentWillUnmount() {
        document.removeEventListener('click', this.close);
    }
    
    close = (event) => {
        const domNode = ReactDOM.findDOMNode(this);
        if (!domNode || !domNode.contains(event.target)) {
            this.setState({ isOpened: false });
        }
    }

я у себя так делаю закрытие чего-либо по клику в любом месте

Основной контейнер серой полосы делается в relative, внутренние элементы-ползунки через absolute с процентуальным смещением и шириной.

Я давно знал что dreamveaver лучше вообще обходить стороной. Но так и не успел перейти на phpstorm.

Если Вы юзаете dreamveaver, то вероятно Вам нужен не phpStorm, а webStorm.

Или может проблема в коде?

Наверняка. Судя по ошибке, которая не может найти закрывающую фигурную скобку. И если бы Вы выкладывали код как код, то думаю даже нашли бы ее. Или мы бы подсказали. Но код картинка - это не уважение к коллегам.
Я уверен, что в аду есть даже специальное место для тех кто так код вставляет. Рядом с теми, кто не включает поворотники.