<p dir="auto">i am trying to render a header into the existing header by creating a div into the table</p>
<p dir="auto">HTML Code</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;table
&lt;div id=&quot;container&quot;&gt;&lt;/div&gt;
&lt;tr&gt;&lt;th/&gt;&lt;th/&gt;....&lt;th/&gt;&lt;/tr&gt;------&gt; deleting this row when my header is getting rendered
&lt;tr&gt;&lt;td/&gt;&lt;td/&gt;....&lt;td/&gt;&lt;/td&gt;
&lt;/table&gt;"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">table</span><span class="pl-kos"></span>
<span class="pl-kos">&lt;</span><span class="pl-ent">div</span> <span class="pl-c1">id</span>="<span class="pl-s">container</span>"<span class="pl-kos">&gt;</span><span class="pl-kos">&lt;/</span><span class="pl-ent">div</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;</span><span class="pl-ent">tr</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">th</span>/&gt;<span class="pl-kos">&lt;</span><span class="pl-ent">th</span>/&gt;....<span class="pl-kos">&lt;</span><span class="pl-ent">th</span>/&gt;<span class="pl-kos">&lt;/</span><span class="pl-ent">tr</span><span class="pl-kos">&gt;</span>------<span class="pl-kos">&gt;</span> deleting this row when my header is getting rendered
<span class="pl-kos">&lt;</span><span class="pl-ent">tr</span><span class="pl-kos">&gt;</span><span class="pl-kos">&lt;</span><span class="pl-ent">td</span>/&gt;<span class="pl-kos">&lt;</span><span class="pl-ent">td</span>/&gt;....<span class="pl-kos">&lt;</span><span class="pl-ent">td</span>/&gt;<span class="pl-kos">&lt;/</span><span class="pl-ent">td</span><span class="pl-kos">&gt;</span>
<span class="pl-kos">&lt;/</span><span class="pl-ent">table</span><span class="pl-kos">&gt;</span></pre></div>
<p dir="auto">Script</p>
<div class="highlight highlight-source-js notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="var StickyDiv = React.createClass({
            mixins: [SimplePageScrollMixin, SimpleResizeMixin],
            displayName:&quot;StickyDiv&quot;,
            propTypes:{
                offsetTop: React.PropTypes.number,
                zIndex: React.PropTypes.number,
                className: React.PropTypes.string
            },
            getInitialState : function(){
                return {
                    fix: false,
                    width: null
                };
            },
            getDefaultProps: function() {
                return {
                    offsetTop: 38,
                    className: '',
                    zIndex: 9999
                };
            },
            handleResize : function(){
                this.checkWidth();
                this.checkPositions();
            },
            handleScroll: function () {
                this.checkWidth();
                this.checkPositions();
            },
            checkPositions: function(){
                var pos;
                if('findDOMNode' in React){
                    pos = util.findPosRelativeToViewport(React.findDOMNode(this));
                  } else {
                    pos = util.findPosRelativeToViewport(this.getDOMNode());
                  }               
                 if (pos[1] &lt;=this.props.offsetTop){                    
                    this.setState({fix: true});
                } else {
                    this.setState({fix: false});
                }  
            },
            checkWidth: function () {
                var width = null;
                if (this.refs.duplicate) {
                 if('findDOMNode' in React){
                    width = React.findDOMNode(this.refs.duplicate).getBoundingClientRect().width;
                  } else {
                    width = this.refs.duplicate.getDOMNode().getBoundingClientRect().width;
                  }
                } else {
                 if('findDOMNode' in React){
                    width = React.findDOMNode(this.refs.original).getBoundingClientRect().width;
                  } else {
                    width = this.refs.original.getDOMNode().getBoundingClientRect().width;
                  }

                }
                if (this.state.width !== width) {
                    this.setState({
                        width: width
                    });
                }
            },
            componentDidMount: function () {
                this.checkWidth();
            },
            render: function () {
                var divStyle;
                if (this.state.fix) {
                    divStyle = {
                        display: 'block',
                        position: 'fixed',
                        width: this.state.width ? (this.state.width + 'px') : null,
                        top: this.props.offsetTop,
                        content: &quot;text/html&quot;
                    };

                    return (
                    React.createElement(&quot;div&quot;, {style: {zIndex : this.props.zIndex, position:'relative', width:'100%'}}, 
                        React.createElement(&quot;div&quot;, {ref: &quot;duplicate&quot;, key: &quot;duplicate&quot;, style: {visibility:'hidden'}}, 
                                this.props.children
                            ),     
                        React.createElement(&quot;div&quot;, {ref: &quot;original&quot;, key: &quot;original&quot;, style: divStyle}, 
                            this.props.children
                        )
                    ));
                }
                else {
                    divStyle = {
                        display: 'block',
                        position: 'relative',
                        width:'100%'
                    };
                    return (
                    React.createElement(&quot;div&quot;, {style: {zIndex : this.props.zIndex, position:'relative', width:'100%'}}, 
                        React.createElement(&quot;div&quot;, {ref: &quot;original&quot;, key: &quot;original&quot;, style: divStyle}, 
                            this.props.children
                        )
                    ));
                }
            }
        });

        MyComponent = React.createClass({displayName: &quot;MyComponent&quot;,

        getInitialState: function() {
            return {
                isSelected: false
            };
        },      
        render: function() {

        var myVar = &quot;&lt;%= request.getAttribute(&quot;xxxx&quot;) %&gt;&quot;
             return (
               React.createElement(StickyDiv, null, 
              React.createElement(&quot;table&quot;,{className: &quot;&quot;, cellSpacing: &quot;0&quot;, cellPadding: &quot;0&quot;, border: &quot;0&quot;, width: &quot;100%&quot;},
               React.createElement(&quot;tr&quot;, null, 
               React.createElement(&quot;th&quot;, {valign:'middle', align:'left', width:'3%'},React.createElement(&quot;img&quot;, {src: &quot;&lt;%=appRoot%&gt;/common/images/icon_confirm.gif&quot;, className: &quot;recentlyProcessedIcon&quot;})), 
               React.createElement(&quot;th&quot;, {width:'23%'},React.createElement(&quot;span&quot;, null,&quot;second coloumn&quot;)),
               React.createElement(&quot;th&quot;, {width:'9%'},React.createElement(&quot;span&quot;, {nowrap:true},&quot;third coloumn &quot;)),
               React.createElement(&quot;th&quot;, {width:'12%'},React.createElement(&quot;span&quot;, null,&quot;fourth coloumn&quot;)),
               React.createElement(&quot;th&quot;, {width:'11.5%'},React.createElement(&quot;span&quot;, null,&quot;fifith&quot;)),
               React.createElement(&quot;th&quot;, {width:'10.5%'},React.createElement(&quot;span&quot;,null,&quot;sixth&quot;)),
               React.createElement(&quot;th&quot;, {width:'3%',valign:'middle'},React.createElement(&quot;span&quot;, null,&quot;seventh&quot;))
)  )));
  }});

    React.render(React.createElement(MyComponent, null),
           document.getElementById('container')
        );"><pre class="notranslate"><span class="pl-k">var</span> <span class="pl-v">StickyDiv</span> <span class="pl-c1">=</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createClass</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
            <span class="pl-c1">mixins</span>: <span class="pl-kos">[</span><span class="pl-v">SimplePageScrollMixin</span><span class="pl-kos">,</span> <span class="pl-v">SimpleResizeMixin</span><span class="pl-kos">]</span><span class="pl-kos">,</span>
            <span class="pl-c1">displayName</span>:<span class="pl-s">"StickyDiv"</span><span class="pl-kos">,</span>
            <span class="pl-c1">propTypes</span>:<span class="pl-kos">{</span>
                <span class="pl-c1">offsetTop</span>: <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-c1">PropTypes</span><span class="pl-kos">.</span><span class="pl-c1">number</span><span class="pl-kos">,</span>
                <span class="pl-c1">zIndex</span>: <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-c1">PropTypes</span><span class="pl-kos">.</span><span class="pl-c1">number</span><span class="pl-kos">,</span>
                <span class="pl-c1">className</span>: <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-c1">PropTypes</span><span class="pl-kos">.</span><span class="pl-c1">string</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">getInitialState</span> : <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                <span class="pl-k">return</span> <span class="pl-kos">{</span>
                    <span class="pl-c1">fix</span>: <span class="pl-c1">false</span><span class="pl-kos">,</span>
                    <span class="pl-c1">width</span>: <span class="pl-c1">null</span>
                <span class="pl-kos">}</span><span class="pl-kos">;</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">getDefaultProps</span>: <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                <span class="pl-k">return</span> <span class="pl-kos">{</span>
                    <span class="pl-c1">offsetTop</span>: <span class="pl-c1">38</span><span class="pl-kos">,</span>
                    <span class="pl-c1">className</span>: <span class="pl-s">''</span><span class="pl-kos">,</span>
                    <span class="pl-c1">zIndex</span>: <span class="pl-c1">9999</span>
                <span class="pl-kos">}</span><span class="pl-kos">;</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">handleResize</span> : <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">checkWidth</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">checkPositions</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">handleScroll</span>: <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">checkWidth</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">checkPositions</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">checkPositions</span>: <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                <span class="pl-k">var</span> <span class="pl-s1">pos</span><span class="pl-kos">;</span>
                <span class="pl-k">if</span><span class="pl-kos">(</span><span class="pl-s">'findDOMNode'</span> <span class="pl-k">in</span> <span class="pl-v">React</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                    <span class="pl-s1">pos</span> <span class="pl-c1">=</span> <span class="pl-s1">util</span><span class="pl-kos">.</span><span class="pl-en">findPosRelativeToViewport</span><span class="pl-kos">(</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">findDOMNode</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
                    <span class="pl-s1">pos</span> <span class="pl-c1">=</span> <span class="pl-s1">util</span><span class="pl-kos">.</span><span class="pl-en">findPosRelativeToViewport</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">getDOMNode</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span>               
                 <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-s1">pos</span><span class="pl-kos">[</span><span class="pl-c1">1</span><span class="pl-kos">]</span> <span class="pl-c1">&lt;=</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">offsetTop</span><span class="pl-kos">)</span><span class="pl-kos">{</span>                    
                    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">setState</span><span class="pl-kos">(</span><span class="pl-kos">{</span><span class="pl-c1">fix</span>: <span class="pl-c1">true</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
                    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">setState</span><span class="pl-kos">(</span><span class="pl-kos">{</span><span class="pl-c1">fix</span>: <span class="pl-c1">false</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-kos">}</span>  
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">checkWidth</span>: <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                <span class="pl-k">var</span> <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-c1">null</span><span class="pl-kos">;</span>
                <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">refs</span><span class="pl-kos">.</span><span class="pl-c1">duplicate</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                 <span class="pl-k">if</span><span class="pl-kos">(</span><span class="pl-s">'findDOMNode'</span> <span class="pl-k">in</span> <span class="pl-v">React</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                    <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">findDOMNode</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">refs</span><span class="pl-kos">.</span><span class="pl-c1">duplicate</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">getBoundingClientRect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">width</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
                    <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">refs</span><span class="pl-kos">.</span><span class="pl-c1">duplicate</span><span class="pl-kos">.</span><span class="pl-en">getDOMNode</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">getBoundingClientRect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">width</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span>
                <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
                 <span class="pl-k">if</span><span class="pl-kos">(</span><span class="pl-s">'findDOMNode'</span> <span class="pl-k">in</span> <span class="pl-v">React</span><span class="pl-kos">)</span><span class="pl-kos">{</span>
                    <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">findDOMNode</span><span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">refs</span><span class="pl-kos">.</span><span class="pl-c1">original</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">getBoundingClientRect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">width</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span> <span class="pl-k">else</span> <span class="pl-kos">{</span>
                    <span class="pl-s1">width</span> <span class="pl-c1">=</span> <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">refs</span><span class="pl-kos">.</span><span class="pl-c1">original</span><span class="pl-kos">.</span><span class="pl-en">getDOMNode</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-en">getBoundingClientRect</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">.</span><span class="pl-c1">width</span><span class="pl-kos">;</span>
                  <span class="pl-kos">}</span>

                <span class="pl-kos">}</span>
                <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">.</span><span class="pl-c1">width</span> <span class="pl-c1">!==</span> <span class="pl-s1">width</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                    <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">setState</span><span class="pl-kos">(</span><span class="pl-kos">{</span>
                        <span class="pl-c1">width</span>: <span class="pl-s1">width</span>
                    <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-kos">}</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">componentDidMount</span>: <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-en">checkWidth</span><span class="pl-kos">(</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
            <span class="pl-kos">}</span><span class="pl-kos">,</span>
            <span class="pl-en">render</span>: <span class="pl-k">function</span> <span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                <span class="pl-k">var</span> <span class="pl-s1">divStyle</span><span class="pl-kos">;</span>
                <span class="pl-k">if</span> <span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">.</span><span class="pl-c1">fix</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
                    <span class="pl-s1">divStyle</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span>
                        <span class="pl-c1">display</span>: <span class="pl-s">'block'</span><span class="pl-kos">,</span>
                        <span class="pl-c1">position</span>: <span class="pl-s">'fixed'</span><span class="pl-kos">,</span>
                        <span class="pl-c1">width</span>: <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">.</span><span class="pl-c1">width</span> ? <span class="pl-kos">(</span><span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">state</span><span class="pl-kos">.</span><span class="pl-c1">width</span> <span class="pl-c1">+</span> <span class="pl-s">'px'</span><span class="pl-kos">)</span> : <span class="pl-c1">null</span><span class="pl-kos">,</span>
                        <span class="pl-c1">top</span>: <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">offsetTop</span><span class="pl-kos">,</span>
                        <span class="pl-c1">content</span>: <span class="pl-s">"text/html"</span>
                    <span class="pl-kos">}</span><span class="pl-kos">;</span>

                    <span class="pl-k">return</span> <span class="pl-kos">(</span>
                    <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">style</span>: <span class="pl-kos">{</span><span class="pl-c1">zIndex</span> : <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">zIndex</span><span class="pl-kos">,</span> <span class="pl-c1">position</span>:<span class="pl-s">'relative'</span><span class="pl-kos">,</span> <span class="pl-c1">width</span>:<span class="pl-s">'100%'</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">,</span> 
                        <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">ref</span>: <span class="pl-s">"duplicate"</span><span class="pl-kos">,</span> <span class="pl-c1">key</span>: <span class="pl-s">"duplicate"</span><span class="pl-kos">,</span> <span class="pl-c1">style</span>: <span class="pl-kos">{</span><span class="pl-c1">visibility</span>:<span class="pl-s">'hidden'</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">,</span> 
                                <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">children</span>
                            <span class="pl-kos">)</span><span class="pl-kos">,</span>     
                        <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">ref</span>: <span class="pl-s">"original"</span><span class="pl-kos">,</span> <span class="pl-c1">key</span>: <span class="pl-s">"original"</span><span class="pl-kos">,</span> <span class="pl-c1">style</span>: <span class="pl-s1">divStyle</span><span class="pl-kos">}</span><span class="pl-kos">,</span> 
                            <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">children</span>
                        <span class="pl-kos">)</span>
                    <span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-kos">}</span>
                <span class="pl-k">else</span> <span class="pl-kos">{</span>
                    <span class="pl-s1">divStyle</span> <span class="pl-c1">=</span> <span class="pl-kos">{</span>
                        <span class="pl-c1">display</span>: <span class="pl-s">'block'</span><span class="pl-kos">,</span>
                        <span class="pl-c1">position</span>: <span class="pl-s">'relative'</span><span class="pl-kos">,</span>
                        <span class="pl-c1">width</span>:<span class="pl-s">'100%'</span>
                    <span class="pl-kos">}</span><span class="pl-kos">;</span>
                    <span class="pl-k">return</span> <span class="pl-kos">(</span>
                    <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">style</span>: <span class="pl-kos">{</span><span class="pl-c1">zIndex</span> : <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">zIndex</span><span class="pl-kos">,</span> <span class="pl-c1">position</span>:<span class="pl-s">'relative'</span><span class="pl-kos">,</span> <span class="pl-c1">width</span>:<span class="pl-s">'100%'</span><span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">,</span> 
                        <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"div"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">ref</span>: <span class="pl-s">"original"</span><span class="pl-kos">,</span> <span class="pl-c1">key</span>: <span class="pl-s">"original"</span><span class="pl-kos">,</span> <span class="pl-c1">style</span>: <span class="pl-s1">divStyle</span><span class="pl-kos">}</span><span class="pl-kos">,</span> 
                            <span class="pl-smi">this</span><span class="pl-kos">.</span><span class="pl-c1">props</span><span class="pl-kos">.</span><span class="pl-c1">children</span>
                        <span class="pl-kos">)</span>
                    <span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
                <span class="pl-kos">}</span>
            <span class="pl-kos">}</span>
        <span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

        <span class="pl-v">MyComponent</span> <span class="pl-c1">=</span> <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createClass</span><span class="pl-kos">(</span><span class="pl-kos">{</span><span class="pl-c1">displayName</span>: <span class="pl-s">"MyComponent"</span><span class="pl-kos">,</span>

        <span class="pl-en">getInitialState</span>: <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
            <span class="pl-k">return</span> <span class="pl-kos">{</span>
                <span class="pl-c1">isSelected</span>: <span class="pl-c1">false</span>
            <span class="pl-kos">}</span><span class="pl-kos">;</span>
        <span class="pl-kos">}</span><span class="pl-kos">,</span>      
        <span class="pl-en">render</span>: <span class="pl-k">function</span><span class="pl-kos">(</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>

        <span class="pl-k">var</span> <span class="pl-s1">myVar</span> <span class="pl-c1">=</span> <span class="pl-s">"&lt;%= request.getAttribute("</span><span class="pl-s1">xxxx</span><span class="pl-s">") %&gt;"</span>
             <span class="pl-k">return</span> <span class="pl-kos">(</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-v">StickyDiv</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span> 
              <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"table"</span><span class="pl-kos">,</span><span class="pl-kos">{</span><span class="pl-c1">className</span>: <span class="pl-s">""</span><span class="pl-kos">,</span> <span class="pl-c1">cellSpacing</span>: <span class="pl-s">"0"</span><span class="pl-kos">,</span> <span class="pl-c1">cellPadding</span>: <span class="pl-s">"0"</span><span class="pl-kos">,</span> <span class="pl-c1">border</span>: <span class="pl-s">"0"</span><span class="pl-kos">,</span> <span class="pl-c1">width</span>: <span class="pl-s">"100%"</span><span class="pl-kos">}</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"tr"</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span> 
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">valign</span>:<span class="pl-s">'middle'</span><span class="pl-kos">,</span> <span class="pl-c1">align</span>:<span class="pl-s">'left'</span><span class="pl-kos">,</span> <span class="pl-c1">width</span>:<span class="pl-s">'3%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"img"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">src</span>: <span class="pl-s">"&lt;%=appRoot%&gt;/common/images/icon_confirm.gif"</span><span class="pl-kos">,</span> <span class="pl-c1">className</span>: <span class="pl-s">"recentlyProcessedIcon"</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span> 
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'23%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span><span class="pl-s">"second coloumn"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'9%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">nowrap</span>:<span class="pl-c1">true</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-s">"third coloumn "</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'12%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span><span class="pl-s">"fourth coloumn"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'11.5%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span><span class="pl-s">"fifith"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'10.5%'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span><span class="pl-c1">null</span><span class="pl-kos">,</span><span class="pl-s">"sixth"</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
               <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"th"</span><span class="pl-kos">,</span> <span class="pl-kos">{</span><span class="pl-c1">width</span>:<span class="pl-s">'3%'</span><span class="pl-kos">,</span><span class="pl-c1">valign</span>:<span class="pl-s">'middle'</span><span class="pl-kos">}</span><span class="pl-kos">,</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-s">"span"</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">,</span><span class="pl-s">"seventh"</span><span class="pl-kos">)</span><span class="pl-kos">)</span>
<span class="pl-kos">)</span>  <span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
  <span class="pl-kos">}</span><span class="pl-kos">}</span><span class="pl-kos">)</span><span class="pl-kos">;</span>

    <span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">render</span><span class="pl-kos">(</span><span class="pl-v">React</span><span class="pl-kos">.</span><span class="pl-en">createElement</span><span class="pl-kos">(</span><span class="pl-v">MyComponent</span><span class="pl-kos">,</span> <span class="pl-c1">null</span><span class="pl-kos">)</span><span class="pl-kos">,</span>
           <span class="pl-smi">document</span><span class="pl-kos">.</span><span class="pl-en">getElementById</span><span class="pl-kos">(</span><span class="pl-s">'container'</span><span class="pl-kos">)</span>
        <span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<p dir="auto">it is being rendered but it is not rendered in place of exisitng row but instead as a seperate row.</p>
<p dir="auto">Is there any way i could render this new element as a row to the existing table..?????/</p>
<p dir="auto">with this code sticky is working with this header but the all the coloumns are misaligned since i guess there is no cordination between the two tables i guess</p>
<p dir="auto">Thanks</p>
<p dir="auto"><strong>Do you want to request a <em>feature</em> or report a <em>bug</em>?</strong><br>
Bug</p>
<p dir="auto"><strong>What is the current behavior?</strong><br>
When developing an external library locally and using <code class="notranslate">yarn link</code> to link the library to a local react app the "hooks can only be called inside the body of a function component" error comes up. However, after publishing to npm and using the published version in the local react app everything works as expected.</p>
<p dir="auto"><strong>If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (<a href="https://jsfiddle.net/Luktwrdm/" rel="nofollow">https://jsfiddle.net/Luktwrdm/</a>) or CodeSandbox (<a href="https://codesandbox.io/s/new" rel="nofollow">https://codesandbox.io/s/new</a>) example below:</strong></p>
<ol dir="auto">
<li>Create a library that's built with hooks (my-hooks-lib)</li>
<li>Create a local app that uses the library (my-react-app) using CRA</li>
<li><code class="notranslate">yarn link</code> in my-hooks-lib and in my-react-app run <code class="notranslate">yarn link my-hooks-lib</code></li>
</ol>
<p dir="auto"><strong>What is the expected behavior?</strong><br>
<code class="notranslate">yarn start</code> in the react app should use hooks and render normally</p>
<p dir="auto"><strong>Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?</strong><br>
react and react-dom <code class="notranslate">16.7.0-alpha.2</code><br>
OSX</p>