Source map is missing

[vdh]

node_modules/react-double-scrollbar/dist/DoubleScrollbar.js has:

//# sourceMappingURL=DoubleScrollbar.js.map

But DoubleScrollbar.js.map is not included in the release.

[willnode]

Me too. Having a warning generated when building from Parcel.

‼  Could not load existing sourcemap of "../node_modules/react-double-scrollbar/dist/DoubleScrollbar.js".

[lfsando]

Also having the same issue

[bujoriosif]

Same issue here

[dogeow]

Same issue here

[mithusingh32]

@umchee I can create a PR for the fix. Just a simple missing file.

[frankadrian]

Hi, facing the same issue here, is this project still being maintained?

[moonbe77]

ATM found this workaround, it is related to another library but it worked for me. mswjs/msw#1030 (comment)

[German919]

estoy teniendo el mismo error... como puedo solucionarlo

[GersonDias]

pleeease press the button and deploy this source map to NPM!

[milanchymcak]

pleeease press the button and deploy this source map to NPM!

You can fork it and create your own component out of it. I added the height: "0px" so its good looking and made it typescript friendly

import React from 'react';

interface DoubleScrollbarProps {
    children: React.ReactNode;
}

interface DoubleScrollbarState {
    width: string;
}

class DoubleScrollbar extends React.Component<DoubleScrollbarProps, DoubleScrollbarState> {
    outerDiv: React.RefObject<HTMLDivElement>;
    innerDiv: React.RefObject<HTMLDivElement>;
    childrenWrapper: React.RefObject<HTMLDivElement>;
    boundCalculateWidth: () => void;

    constructor(props: DoubleScrollbarProps) {
        super(props);
        this.state = {
            width: "auto"
        };

        this.outerDiv = React.createRef();
        this.innerDiv = React.createRef();
        this.childrenWrapper = React.createRef();

        this.boundCalculateWidth = this.calculateWidth.bind(this);
    }

    componentDidMount() {
        const outerDiv = this.outerDiv.current;
        const childWrapper = this.childrenWrapper.current;

        // Set initial width
        this.calculateWidth();

        // Update width when window size changes
        window.addEventListener("resize", this.boundCalculateWidth);

        // Associate the scrolls
        if (outerDiv && childWrapper) {
            outerDiv.onscroll = () => {
                childWrapper.scrollLeft = outerDiv.scrollLeft;
            };

            childWrapper.onscroll = () => {
                outerDiv.scrollLeft = childWrapper.scrollLeft;
            };
        }
    }

    componentWillUnmount() {
        window.removeEventListener("resize", this.boundCalculateWidth);
    }

    componentDidUpdate() {
        this.calculateWidth();
    }

    calculateWidth() {
        const width = this.getChildWrapperWidth() || "auto";

        // Set the width of the inner div to the first child's
        if (width !== this.state.width) {
            this.setState({ width });
        }
    }

    getChildWrapperWidth() {
        if (this.childrenWrapper.current) {
            return `${this.childrenWrapper.current.scrollWidth}px`;
        }
        return null;
    }

    render() {
        const outerDivStyle: React.CSSProperties = { overflowX: "auto", overflowY: "hidden" };
        const innerDivStyle: React.CSSProperties = { paddingTop: "1px", width: this.state.width, height: "0px" };
        const childDivStyle: React.CSSProperties = { overflow: "auto", overflowY: "hidden" };

        return (
            <div>
                <div ref={this.outerDiv} style={outerDivStyle}>
                    <div ref={this.innerDiv} style={innerDivStyle}>&nbsp;</div>
                </div>
                <div ref={this.childrenWrapper} style={childDivStyle}>
                    {this.props.children}
                </div>
            </div>
        );
    }
}

export default DoubleScrollbar;