hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Deployed fa58b94cd5 to master with MkDocs 1.2.2 and mike 1.0.1

Browse Source
This commit is contained in:
GitHub Action 2021-08-16 14:00:19 +00:00
parent a85c6b8b9c
commit e0eb08a4e2
60 changed files with 655 additions and 655 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
master/extensions/api/classes/renderer.component.badge/index.html
View File

@ -1083,9 +1083,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1138,12 +1138,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.barchart/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.button/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.checkbox/index.html
View File

@ -1044,9 +1044,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1075,12 +1075,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.confirmdialog/index.html
View File

@ -1091,9 +1091,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1125,12 +1125,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.dialog/index.html
View File

@ -1142,9 +1142,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1173,12 +1173,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.drawer/index.html
View File

@ -1084,9 +1084,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1115,12 +1115,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.draweritem/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.drawerparamtoggler/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.drawertitle/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.icon/index.html
View File

@ -1083,9 +1083,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1114,12 +1114,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.input/index.html
View File

@ -1211,9 +1211,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1251,12 +1251,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.kubeeventdetails/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.kubeobjectdetails/index.html
View File

@ -1067,9 +1067,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1107,12 +1107,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.kubeobjectlistlayout/index.html
View File

@ -1080,9 +1080,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1111,12 +1111,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.kubeobjectmenu/index.html
View File

@ -1159,9 +1159,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1190,12 +1190,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.kubeobjectmeta/index.html
View File

@ -1044,9 +1044,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1075,12 +1075,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.lineprogress/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.mainlayout/index.html
View File

@ -1038,9 +1038,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1069,12 +1069,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.menu/index.html
View File

@ -1187,9 +1187,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1229,12 +1229,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.menuactions/index.html
View File

@ -1052,9 +1052,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1089,12 +1089,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.namespaceselect/index.html
View File

@ -1051,9 +1051,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1082,12 +1082,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.namespaceselectfilter/index.html
View File

@ -1107,9 +1107,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1138,12 +1138,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.notifications/index.html
View File

@ -1084,9 +1084,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1118,12 +1118,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.pagelayout/index.html
View File

@ -1054,9 +1054,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1085,12 +1085,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.piechart/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.poddetailslist/index.html
View File

@ -1060,9 +1060,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1091,12 +1091,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.radio/index.html
View File

@ -1044,9 +1044,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1075,12 +1075,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.radiogroup/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.searchinput/index.html
View File

@ -1060,9 +1060,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1091,12 +1091,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.select/index.html
View File

@ -1083,9 +1083,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1114,12 +1114,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.settinglayout/index.html
View File

@ -1054,9 +1054,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1085,12 +1085,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.slider/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.spinner/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.statusbrick/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.stepper/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.subtitle/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.table/index.html
View File

@ -1116,9 +1116,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1147,12 +1147,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.tablecell/index.html
View File

@ -1083,9 +1083,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1114,12 +1114,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.tablehead/index.html
View File

@ -1036,9 +1036,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1067,12 +1067,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.tablerow/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.tabs/index.html
View File

@ -1044,9 +1044,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1078,12 +1078,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.tooltip/index.html
View File

@ -1126,9 +1126,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4> <h4 id="inherited-from">Inherited from<a class="headerlink" href="#inherited-from" title="Permanent link">#</a></h4>
@ -1163,12 +1163,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.wizard/index.html
View File

@ -1123,9 +1123,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1154,12 +1154,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.wizardlayout/index.html
View File

@ -1028,9 +1028,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1059,12 +1059,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

8
master/extensions/api/classes/renderer.component.wizardstep/index.html
View File

@ -1068,9 +1068,9 @@
Should be used with type annotation or static contextType.</p> Should be used with type annotation or static contextType.</p>
<div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span> <div class="highlight"><pre><span></span><code><span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">MyContext</span>
<span class="c1">// For TS pre-3.7:</span> <span class="c1">// For TS pre-3.7:</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
<span class="c1">// For TS 3.7 and above:</span> <span class="c1">// For TS 3.7 and above:</span>
<span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span> <span class="kr">declare</span> <span class="nx">context</span>: <span class="kt">React.ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">MyContext</span><span class="o">&gt;</span>
</code></pre></div> </code></pre></div>
<p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p> <p><strong><code>see</code></strong> https://reactjs.org/docs/context.html</p>
<h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4> <h4 id="inherited-from_2">Inherited from<a class="headerlink" href="#inherited-from_2" title="Permanent link">#</a></h4>
@ -1099,12 +1099,12 @@ https://reactjs.org/docs/refs-and-the-dom.html#legacy-api-string-refs</p>
<p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p> <p>▪ <code>Static</code> <code>Optional</code> <strong>contextType</strong>: <code>Context</code>&lt;any></p>
<p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p> <p>If set, <code>this.context</code> will be set at runtime to the current value of the given Context.</p>
<p>Usage:</p> <p>Usage:</p>
<div class="highlight"><pre><span></span><code><span class="kd">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span> <div class="highlight"><pre><span></span><code><span class="kr">type</span> <span class="nx">MyContext</span> <span class="o">=</span> <span class="kt">number</span>
<span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span> <span class="kd">const</span> <span class="nx">Ctx</span> <span class="o">=</span> <span class="nx">React</span><span class="p">.</span><span class="nx">createContext</span><span class="o">&lt;</span><span class="nx">MyContext</span><span class="o">&gt;</span><span class="p">(</span><span class="mf">0</span><span class="p">)</span>
<span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="kd">class</span> <span class="nx">Foo</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>
<span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span> <span class="k">static</span> <span class="nx">contextType</span> <span class="o">=</span> <span class="nx">Ctx</span>
<span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="k">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span> <span class="nx">context</span><span class="o">!:</span> <span class="nx">React</span><span class="p">.</span><span class="nx">ContextType</span><span class="o">&lt;</span><span class="ow">typeof</span> <span class="nx">Ctx</span><span class="o">&gt;</span>
<span class="nx">render</span> <span class="p">()</span> <span class="p">{</span> <span class="nx">render</span> <span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span> <span class="k">return</span> <span class="o">&lt;&gt;</span><span class="nx">My</span> <span class="nx">context</span><span class="err">&#39;</span><span class="nx">s</span> <span class="nx">value</span><span class="o">:</span> <span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">context</span><span class="p">}</span><span class="o">&lt;</span><span class="err">/&gt;;</span>
<span class="p">}</span> <span class="p">}</span>

74
master/extensions/capabilities/common-capabilities/index.html
View File

@ -989,7 +989,7 @@ It adds app menu items to the Lens UI.
In order to see logs from this extension, you need to start Lens from the command line.</p> In order to see logs from this extension, you need to start Lens from the command line.</p>
<h3 id="activate">Activate<a class="headerlink" href="#activate" title="Permanent link">#</a></h3> <h3 id="activate">Activate<a class="headerlink" href="#activate" title="Permanent link">#</a></h3>
<p>This extension can register a custom callback that is executed when an extension is activated (started).</p> <p>This extension can register a custom callback that is executed when an extension is activated (started).</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -999,7 +999,7 @@ In order to see logs from this extension, you need to start Lens from the comman
</code></pre></div> </code></pre></div>
<h3 id="deactivate">Deactivate<a class="headerlink" href="#deactivate" title="Permanent link">#</a></h3> <h3 id="deactivate">Deactivate<a class="headerlink" href="#deactivate" title="Permanent link">#</a></h3>
<p>This extension can register a custom callback that is executed when an extension is deactivated (stopped).</p> <p>This extension can register a custom callback that is executed when an extension is deactivated (stopped).</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="k">async</span> <span class="nx">onDeactivate</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">onDeactivate</span><span class="p">()</span> <span class="p">{</span>
@ -1010,7 +1010,7 @@ In order to see logs from this extension, you need to start Lens from the comman
<h3 id="app-menus">App Menus<a class="headerlink" href="#app-menus" title="Permanent link">#</a></h3> <h3 id="app-menus">App Menus<a class="headerlink" href="#app-menus" title="Permanent link">#</a></h3>
<p>This extension can register custom app menus that will be displayed on OS native menus.</p> <p>This extension can register custom app menus that will be displayed on OS native menus.</p>
<p>Example:</p> <p>Example:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span>
@ -1029,7 +1029,7 @@ In order to see logs from this extension, you need to start Lens from the comman
In order to see logs from this extension you need to check them via <strong>View</strong> &gt; <strong>Toggle Developer Tools</strong> &gt; <strong>Console</strong>.</p> In order to see logs from this extension you need to check them via <strong>View</strong> &gt; <strong>Toggle Developer Tools</strong> &gt; <strong>Console</strong>.</p>
<h3 id="activate_1">Activate<a class="headerlink" href="#activate_1" title="Permanent link">#</a></h3> <h3 id="activate_1">Activate<a class="headerlink" href="#activate_1" title="Permanent link">#</a></h3>
<p>This extension can register a custom callback that is executed when an extension is activated (started).</p> <p>This extension can register a custom callback that is executed when an extension is activated (started).</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -1039,7 +1039,7 @@ In order to see logs from this extension you need to check them via <strong>View
</code></pre></div> </code></pre></div>
<h3 id="deactivate_1">Deactivate<a class="headerlink" href="#deactivate_1" title="Permanent link">#</a></h3> <h3 id="deactivate_1">Deactivate<a class="headerlink" href="#deactivate_1" title="Permanent link">#</a></h3>
<p>This extension can register a custom callback that is executed when an extension is deactivated (stopped).</p> <p>This extension can register a custom callback that is executed when an extension is deactivated (stopped).</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="k">async</span> <span class="nx">onDeactivate</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">onDeactivate</span><span class="p">()</span> <span class="p">{</span>
@ -1050,9 +1050,9 @@ In order to see logs from this extension you need to check them via <strong>View
<h3 id="global-pages">Global Pages<a class="headerlink" href="#global-pages" title="Permanent link">#</a></h3> <h3 id="global-pages">Global Pages<a class="headerlink" href="#global-pages" title="Permanent link">#</a></h3>
<p>This extension can register custom global pages (views) to Lens's main window. <p>This extension can register custom global pages (views) to Lens's main window.
The global page is a full-screen page that hides all other content from a window.</p> The global page is a full-screen page that hides all other content from a window.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-page&quot;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1075,7 +1075,7 @@ The global page is a full-screen page that hides all other content from a window
<span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example page&quot;</span><span class="p">,</span> <span class="c1">// used in icon&#39;s tooltip</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example page&quot;</span><span class="p">,</span> <span class="c1">// used in icon&#39;s tooltip</span>
<span class="nx">target</span><span class="o">:</span> <span class="p">{</span> <span class="nx">pageId</span><span class="o">:</span> <span class="s2">&quot;example&quot;</span> <span class="p">}</span> <span class="nx">target</span><span class="o">:</span> <span class="p">{</span> <span class="nx">pageId</span><span class="o">:</span> <span class="s2">&quot;example&quot;</span> <span class="p">}</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Icon</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;arrow&quot;</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Icon</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;arrow&quot;</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
@ -1084,10 +1084,10 @@ The global page is a full-screen page that hides all other content from a window
<h3 id="app-preferences">App Preferences<a class="headerlink" href="#app-preferences" title="Permanent link">#</a></h3> <h3 id="app-preferences">App Preferences<a class="headerlink" href="#app-preferences" title="Permanent link">#</a></h3>
<p>This extension can register custom app preferences. <p>This extension can register custom app preferences.
It is responsible for storing a state for custom preferences.</p> It is responsible for storing a state for custom preferences.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">myCustomPreferencesStore</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/my-custom-preferences-store&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">myCustomPreferencesStore</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/my-custom-preferences-store&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">MyCustomPreferenceHint</span><span class="p">,</span> <span class="nx">MyCustomPreferenceInput</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/my-custom-preference&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">MyCustomPreferenceHint</span><span class="p">,</span> <span class="nx">MyCustomPreferenceInput</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/my-custom-preference&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
@ -1095,8 +1095,8 @@ It is responsible for storing a state for custom preferences.</p>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;My Custom Preference&quot;</span><span class="p">,</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;My Custom Preference&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">MyCustomPreferenceHint</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">MyCustomPreferenceHint</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">MyCustomPreferenceInput</span> <span class="nx">store</span><span class="o">=</span><span class="p">{</span><span class="nx">myCustomPreferencesStore</span><span class="p">}</span><span class="o">/&gt;</span> <span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">MyCustomPreferenceInput</span> <span class="nx">store</span><span class="o">=</span><span class="p">{</span><span class="nx">myCustomPreferencesStore</span><span class="p">}</span><span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
@ -1105,9 +1105,9 @@ It is responsible for storing a state for custom preferences.</p>
<h3 id="cluster-pages">Cluster Pages<a class="headerlink" href="#cluster-pages" title="Permanent link">#</a></h3> <h3 id="cluster-pages">Cluster Pages<a class="headerlink" href="#cluster-pages" title="Permanent link">#</a></h3>
<p>This extension can register custom cluster pages. <p>This extension can register custom cluster pages.
These pages are visible in a cluster menu when a cluster is opened.</p> These pages are visible in a cluster menu when a cluster is opened.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/page&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span>
@ -1115,7 +1115,7 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;extension-example&quot;</span><span class="p">,</span> <span class="c1">// optional</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;extension-example&quot;</span><span class="p">,</span> <span class="c1">// optional</span>
<span class="nx">exact</span>: <span class="kt">true</span><span class="p">,</span> <span class="c1">// optional</span> <span class="nx">exact</span>: <span class="kt">true</span><span class="p">,</span> <span class="c1">// optional</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
@ -1133,8 +1133,8 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
</code></pre></div> </code></pre></div>
<h3 id="top-bar-items">Top Bar Items<a class="headerlink" href="#top-bar-items" title="Permanent link">#</a></h3> <h3 id="top-bar-items">Top Bar Items<a class="headerlink" href="#top-bar-items" title="Permanent link">#</a></h3>
<p>This extension can register custom components to a top bar area.</p> <p>This extension can register custom components to a top bar area.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1147,7 +1147,7 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Item</span><span class="o">:</span> <span class="p">(</span> <span class="nx">Item</span><span class="o">:</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;favorite&quot;</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="o">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;/example-page&quot;</span> <span class="o">/&gt;</span> <span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;favorite&quot;</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="p">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;/example-page&quot;</span> <span class="o">/&gt;</span>
<span class="p">)</span> <span class="p">)</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
@ -1156,8 +1156,8 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
</code></pre></div> </code></pre></div>
<h3 id="status-bar-items">Status Bar Items<a class="headerlink" href="#status-bar-items" title="Permanent link">#</a></h3> <h3 id="status-bar-items">Status Bar Items<a class="headerlink" href="#status-bar-items" title="Permanent link">#</a></h3>
<p>This extension can register custom icons and text to a status bar area.</p> <p>This extension can register custom icons and text to a status bar area.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1170,7 +1170,7 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Item</span><span class="o">:</span> <span class="p">(</span> <span class="nx">Item</span><span class="o">:</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">div</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;flex align-center gaps hover-highlight&quot;</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="o">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;/example-page&quot;</span><span class="p">)}</span> <span class="o">&gt;</span> <span class="o">&lt;</span><span class="nx">div</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;flex align-center gaps hover-highlight&quot;</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="p">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;/example-page&quot;</span><span class="p">)}</span> <span class="o">&gt;</span>
<span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;favorite&quot;</span> <span class="o">/&gt;</span> <span class="o">&lt;</span><span class="nx">Icon</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;favorite&quot;</span> <span class="o">/&gt;</span>
<span class="o">&lt;</span><span class="err">/div&gt;</span> <span class="o">&lt;</span><span class="err">/div&gt;</span>
<span class="p">)</span> <span class="p">)</span>
@ -1181,15 +1181,15 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
</code></pre></div> </code></pre></div>
<h3 id="kubernetes-workloads-overview-items">Kubernetes Workloads Overview Items<a class="headerlink" href="#kubernetes-workloads-overview-items" title="Permanent link">#</a></h3> <h3 id="kubernetes-workloads-overview-items">Kubernetes Workloads Overview Items<a class="headerlink" href="#kubernetes-workloads-overview-items" title="Permanent link">#</a></h3>
<p>This extension can register custom workloads overview items.</p> <p>This extension can register custom workloads overview items.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">CustomWorkloadsOverviewItem</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/custom-workloads-overview-item&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">CustomWorkloadsOverviewItem</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/custom-workloads-overview-item&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">kubeWorkloadsOverviewItems</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">kubeWorkloadsOverviewItems</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">components</span> <span class="o">:</span> <span class="p">{</span> <span class="nx">components</span> <span class="o">:</span> <span class="p">{</span>
<span class="nx">Details</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomWorkloadsOverviewItem</span> <span class="o">/&gt;</span> <span class="nx">Details</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomWorkloadsOverviewItem</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
@ -1197,9 +1197,9 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
</code></pre></div> </code></pre></div>
<h3 id="kubernetes-object-menu-items">Kubernetes Object Menu Items<a class="headerlink" href="#kubernetes-object-menu-items" title="Permanent link">#</a></h3> <h3 id="kubernetes-object-menu-items">Kubernetes Object Menu Items<a class="headerlink" href="#kubernetes-object-menu-items" title="Permanent link">#</a></h3>
<p>This extension can register custom menu items (actions) for specified Kubernetes kinds/apiVersions.</p> <p>This extension can register custom menu items (actions) for specified Kubernetes kinds/apiVersions.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">CustomMenuItem</span><span class="p">,</span> <span class="nx">CustomMenuItemProps</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/custom-menu-item&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">CustomMenuItem</span><span class="p">,</span> <span class="nx">CustomMenuItemProps</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/custom-menu-item&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">kubeObjectMenuItems</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">kubeObjectMenuItems</span> <span class="o">=</span> <span class="p">[</span>
@ -1207,7 +1207,7 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
<span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;Node&quot;</span><span class="p">,</span> <span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;Node&quot;</span><span class="p">,</span>
<span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span> <span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">MenuItem</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CustomMenuItemProps</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomMenuItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="nx">MenuItem</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CustomMenuItemProps</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomMenuItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
@ -1215,9 +1215,9 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
</code></pre></div> </code></pre></div>
<h3 id="kubernetes-object-details">Kubernetes Object Details<a class="headerlink" href="#kubernetes-object-details" title="Permanent link">#</a></h3> <h3 id="kubernetes-object-details">Kubernetes Object Details<a class="headerlink" href="#kubernetes-object-details" title="Permanent link">#</a></h3>
<p>This extension can register custom details (content) for specified Kubernetes kinds/apiVersions.</p> <p>This extension can register custom details (content) for specified Kubernetes kinds/apiVersions.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">CustomKindDetails</span><span class="p">,</span> <span class="nx">CustomKindDetailsProps</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/custom-kind-details&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">CustomKindDetails</span><span class="p">,</span> <span class="nx">CustomKindDetailsProps</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/custom-kind-details&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">kubeObjectDetailItems</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">kubeObjectDetailItems</span> <span class="o">=</span> <span class="p">[</span>
@ -1225,7 +1225,7 @@ These pages are visible in a cluster menu when a cluster is opened.</p>
<span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;CustomKind&quot;</span><span class="p">,</span> <span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;CustomKind&quot;</span><span class="p">,</span>
<span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;custom.acme.org/v1&quot;</span><span class="p">],</span> <span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;custom.acme.org/v1&quot;</span><span class="p">],</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CustomKindDetailsProps</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomKindDetails</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CustomKindDetailsProps</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">CustomKindDetails</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>

6
master/extensions/capabilities/styling/index.html
View File

@ -961,9 +961,9 @@ For example:</p>
If the class isn't there, the theme defaults to dark. The active theme can be changed in the <strong>Preferences</strong> page: If the class isn't there, the theme defaults to dark. The active theme can be changed in the <strong>Preferences</strong> page:
<img alt="Color Theme" src="../images/theme-selector.png" /></p> <img alt="Color Theme" src="../images/theme-selector.png" /></p>
<p>There is a way of detect active theme and its changes in JS. <a href="https://github.com/mobxjs/mobx-react#observercomponent">MobX observer function/decorator</a> can be used for this purpose.</p> <p>There is a way of detect active theme and its changes in JS. <a href="https://github.com/mobxjs/mobx-react#observercomponent">MobX observer function/decorator</a> can be used for this purpose.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx-react&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx-react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="err">@</span><span class="nx">observer</span> <span class="err">@</span><span class="nx">observer</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">SupportPage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">SupportPage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span> <span class="p">{</span>

8
master/extensions/get-started/anatomy/index.html
View File

@ -883,16 +883,16 @@ On the <code>renderer</code> entry point, the Hello World sample extension defin
The <code>Cluster Page</code> object registers the <code>/extension-example</code> path, and this path renders the <code>ExamplePage</code> React component. The <code>Cluster Page</code> object registers the <code>/extension-example</code> path, and this path renders the <code>ExamplePage</code> React component.
It also registers the <code>MenuItem</code> component that displays the <code>ExampleIcon</code> React component and the "Hello World" text in the left-side menu of the cluster dashboard. It also registers the <code>MenuItem</code> component that displays the <code>ExampleIcon</code> React component and the "Hello World" text in the left-side menu of the cluster dashboard.
These React components are defined in the additional <code>./src/page.tsx</code> file.</p> These React components are defined in the additional <code>./src/page.tsx</code> file.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./page&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;extension-example&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;extension-example&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>

14
master/extensions/guides/ipc/index.html
View File

@ -885,8 +885,8 @@ Only <code>renderer</code> can initiate this kind of request, and only <code>mai
</ul> </ul>
<p>To register either a handler or a listener, you should do something like the following:</p> <p>To register either a handler or a listener, you should do something like the following:</p>
<p><code>main.ts</code>: <p><code>main.ts</code>:
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">IpcMain</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./helpers/main&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">IpcMain</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./helpers/main&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -898,7 +898,7 @@ Only <code>renderer</code> can initiate this kind of request, and only <code>mai
Lens will automatically clean up that store and all the handlers on deactivation and uninstall.</p> Lens will automatically clean up that store and all the handlers on deactivation and uninstall.</p>
<hr /> <hr />
<p><code>helpers/main.ts</code>: <p><code>helpers/main.ts</code>:
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">IpcMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">Ipc</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">IpcMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">Ipc</span> <span class="p">{</span>
<span class="kr">constructor</span><span class="p">(</span><span class="nx">extension</span>: <span class="kt">Main.LensExtension</span><span class="p">)</span> <span class="p">{</span> <span class="kr">constructor</span><span class="p">(</span><span class="nx">extension</span>: <span class="kt">Main.LensExtension</span><span class="p">)</span> <span class="p">{</span>
@ -916,21 +916,21 @@ Lens will automatically clean up that store and all the handlers on deactivation
You should be able to just call <code>IpcMain.getInstance()</code> anywhere it is needed in your extension.</p> You should be able to just call <code>IpcMain.getInstance()</code> anywhere it is needed in your extension.</p>
<hr /> <hr />
<p><code>renderer.ts</code>: <p><code>renderer.ts</code>:
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">IpcRenderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./helpers/renderer&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">IpcRenderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./helpers/renderer&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleExtensionRenderer</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleExtensionRenderer</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">ipc</span> <span class="o">=</span> <span class="nx">IpcRenderer</span><span class="p">.</span><span class="nx">createInstance</span><span class="p">(</span><span class="k">this</span><span class="p">);</span> <span class="kd">const</span> <span class="nx">ipc</span> <span class="o">=</span> <span class="nx">IpcRenderer</span><span class="p">.</span><span class="nx">createInstance</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="nx">setTimeout</span><span class="p">(()</span> <span class="o">=&gt;</span> <span class="nx">ipc</span><span class="p">.</span><span class="nx">broadcast</span><span class="p">(</span><span class="s2">&quot;initialize&quot;</span><span class="p">,</span> <span class="s2">&quot;an-id&quot;</span><span class="p">),</span> <span class="mf">5000</span><span class="p">);</span> <span class="nx">setTimeout</span><span class="p">(()</span> <span class="p">=&gt;</span> <span class="nx">ipc</span><span class="p">.</span><span class="nx">broadcast</span><span class="p">(</span><span class="s2">&quot;initialize&quot;</span><span class="p">,</span> <span class="s2">&quot;an-id&quot;</span><span class="p">),</span> <span class="mf">5000</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
</code></pre></div></p> </code></pre></div></p>
<p>It is also needed to create an instance to broadcast messages too.</p> <p>It is also needed to create an instance to broadcast messages too.</p>
<hr /> <hr />
<p><code>helpers/renderer.ts</code>: <p><code>helpers/renderer.ts</code>:
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">IpcRenderer</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Ipc</span> <span class="p">{}</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">IpcRenderer</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Ipc</span> <span class="p">{}</span>
</code></pre></div></p> </code></pre></div></p>

48
master/extensions/guides/kube-object-list-layout/index.html
View File

@ -779,9 +779,9 @@ We will do this in our extension class <code>CrdSampleExtension</code> that is d
<p>To register menu item in the cluster menu we need to register <code>PageMenuRegistration</code> object. <p>To register menu item in the cluster menu we need to register <code>PageMenuRegistration</code> object.
This object will register a menu item with "Certificates" text. This object will register a menu item with "Certificates" text.
It will also use <code>CertificateIcon</code> component to render an icon and navigate to cluster page that is having <code>certificates</code> page id.</p> It will also use <code>CertificateIcon</code> component to render an icon and navigate to cluster page that is having <code>certificates</code> page id.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">IconProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">IconProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">IconProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">IconProps</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -813,7 +813,7 @@ It will also use <code>CertificateIcon</code> component to render an icon and na
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[{</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;certificates&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;certificates&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">CertificatePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span> <span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">CertificatePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span> <span class="o">/&gt;</span><span class="p">,</span>
<span class="nx">MenuIcon</span>: <span class="kt">CertificateIcon</span><span class="p">,</span> <span class="nx">MenuIcon</span>: <span class="kt">CertificateIcon</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}]</span> <span class="p">}]</span>
@ -828,7 +828,7 @@ In this step we will actually implement that.
Lens Extensions API provides easy mechanism to do this. Lens Extensions API provides easy mechanism to do this.
We just need to define <code>Certificate</code> class derived from <code>Renderer.K8sApi.KubeObject</code>, <code>CertificatesApi</code>derived from <code>Renderer.K8sApi.KubeApi</code> and <code>CertificatesStore</code> derived from <code>Renderer.K8sApi.KubeObjectStore</code>.</p> We just need to define <code>Certificate</code> class derived from <code>Renderer.K8sApi.KubeObject</code>, <code>CertificatesApi</code>derived from <code>Renderer.K8sApi.KubeApi</code> and <code>CertificatesStore</code> derived from <code>Renderer.K8sApi.KubeObjectStore</code>.</p>
<p><code>Certificate</code> class defines properties found in the CRD object:</p> <p><code>Certificate</code> class defines properties found in the CRD object:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span> <span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span>
@ -875,7 +875,7 @@ We just need to define <code>Certificate</code> class derived from <code>Rendere
<span class="nx">message</span>: <span class="kt">string</span><span class="p">;</span> <span class="nx">message</span>: <span class="kt">string</span><span class="p">;</span>
<span class="nx">reason</span>: <span class="kt">string</span><span class="p">;</span> <span class="nx">reason</span>: <span class="kt">string</span><span class="p">;</span>
<span class="nx">status</span>: <span class="kt">string</span><span class="p">;</span> <span class="nx">status</span>: <span class="kt">string</span><span class="p">;</span>
<span class="kd">type</span><span class="o">?:</span> <span class="kt">string</span><span class="p">;</span> <span class="kr">type</span><span class="nx">?</span>: <span class="kt">string</span><span class="p">;</span>
<span class="p">}[];</span> <span class="p">}[];</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
@ -883,7 +883,7 @@ We just need to define <code>Certificate</code> class derived from <code>Rendere
<p>With <code>CertificatesApi</code> class we are able to manage <code>Certificate</code> objects in Kubernetes API:</p> <p>With <code>CertificatesApi</code> class we are able to manage <code>Certificate</code> objects in Kubernetes API:</p>
<div class="highlight"><pre><span></span><code><span class="k">export</span> <span class="kd">class</span> <span class="nx">CertificatesApi</span> <span class="k">extends</span> <span class="nx">KubeApi</span><span class="o">&lt;</span><span class="nx">Certificate</span><span class="o">&gt;</span> <span class="p">{}</span> <div class="highlight"><pre><span></span><code><span class="k">export</span> <span class="kd">class</span> <span class="nx">CertificatesApi</span> <span class="k">extends</span> <span class="nx">KubeApi</span><span class="o">&lt;</span><span class="nx">Certificate</span><span class="o">&gt;</span> <span class="p">{}</span>
<span class="k">export</span> <span class="kd">const</span> <span class="nx">certificatesApi</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">CertificatesApi</span><span class="p">({</span> <span class="k">export</span> <span class="kd">const</span> <span class="nx">certificatesApi</span> <span class="o">=</span> <span class="ow">new</span> <span class="nx">CertificatesApi</span><span class="p">({</span>
<span class="nx">objectConstructor</span>: <span class="kt">Certificate</span> <span class="nx">objectConstructor</span>: <span class="kt">Certificate</span>
<span class="p">});</span> <span class="p">});</span>
</code></pre></div> </code></pre></div>
@ -892,7 +892,7 @@ We just need to define <code>Certificate</code> class derived from <code>Rendere
<span class="nx">api</span> <span class="o">=</span> <span class="nx">certificatesApi</span> <span class="nx">api</span> <span class="o">=</span> <span class="nx">certificatesApi</span>
<span class="p">}</span> <span class="p">}</span>
<span class="k">export</span> <span class="kd">const</span> <span class="nx">certificatesStore</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">CertificatesStore</span><span class="p">();</span> <span class="k">export</span> <span class="kd">const</span> <span class="nx">certificatesStore</span> <span class="o">=</span> <span class="ow">new</span> <span class="nx">CertificatesStore</span><span class="p">();</span>
</code></pre></div> </code></pre></div>
<p>And, finally, we register this store to Lens's API manager.</p> <p>And, finally, we register this store to Lens's API manager.</p>
<div class="highlight"><pre><span></span><code><span class="nx">apiManager</span><span class="p">.</span><span class="nx">registerStore</span><span class="p">(</span><span class="nx">certificatesStore</span><span class="p">);</span> <div class="highlight"><pre><span></span><code><span class="nx">apiManager</span><span class="p">.</span><span class="nx">registerStore</span><span class="p">(</span><span class="nx">certificatesStore</span><span class="p">);</span>
@ -901,10 +901,10 @@ We just need to define <code>Certificate</code> class derived from <code>Rendere
<p>Now we have created mechanism to manage <code>Certificate</code> objects in Kubernetes API. <p>Now we have created mechanism to manage <code>Certificate</code> objects in Kubernetes API.
Then we need to fetch those and render them in the UI.</p> Then we need to fetch those and render them in the UI.</p>
<p>First we define <code>CertificatePage</code> class that extends <code>React.Component</code>.</p> <p>First we define <code>CertificatePage</code> class that extends <code>React.Component</code>.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">certificatesStore</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;../certificate-store&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">certificatesStore</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;../certificate-store&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Certificate</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;../certificate&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Certificate</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;../certificate&quot;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">CertificatePage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">Renderer.LensExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">CertificatePage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">Renderer.LensExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span>
@ -915,7 +915,7 @@ To do that, we just need to add <code>Renderer.Component.KubeObjectListLayout</c
To define which objects the list is showing, we need to pass <code>certificateStore</code> object to <code>Renderer.Component.KubeObjectListLayout</code> in <code>store</code> property. To define which objects the list is showing, we need to pass <code>certificateStore</code> object to <code>Renderer.Component.KubeObjectListLayout</code> in <code>store</code> property.
<code>Renderer.Component.KubeObjectListLayout</code> will fetch automatically items from the given store when component is mounted. <code>Renderer.Component.KubeObjectListLayout</code> will fetch automatically items from the given store when component is mounted.
Also, we can define needed sorting callbacks and search filters for the list:</p> Also, we can define needed sorting callbacks and search filters for the list:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -939,12 +939,12 @@ Also, we can define needed sorting callbacks and search filters for the list:</p
<span class="o">&lt;</span><span class="nx">KubeObjectListLayout</span> <span class="o">&lt;</span><span class="nx">KubeObjectListLayout</span>
<span class="nx">className</span><span class="o">=</span><span class="s2">&quot;Certificates&quot;</span> <span class="nx">store</span><span class="o">=</span><span class="p">{</span><span class="nx">certificatesStore</span><span class="p">}</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;Certificates&quot;</span> <span class="nx">store</span><span class="o">=</span><span class="p">{</span><span class="nx">certificatesStore</span><span class="p">}</span>
<span class="nx">sortingCallbacks</span><span class="o">=</span><span class="p">{{</span> <span class="nx">sortingCallbacks</span><span class="o">=</span><span class="p">{{</span>
<span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">name</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">getName</span><span class="p">(),</span> <span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">name</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">getName</span><span class="p">(),</span>
<span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">namespace</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">metadata</span><span class="p">.</span><span class="nx">namespace</span><span class="p">,</span> <span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">namespace</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">metadata</span><span class="p">.</span><span class="nx">namespace</span><span class="p">,</span>
<span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">issuer</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">issuerRef</span><span class="p">.</span><span class="nx">name</span> <span class="p">[</span><span class="nx">sortBy</span><span class="p">.</span><span class="nx">issuer</span><span class="p">]</span><span class="o">:</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">issuerRef</span><span class="p">.</span><span class="nx">name</span>
<span class="p">}}</span> <span class="p">}}</span>
<span class="nx">searchFilters</span><span class="o">=</span><span class="p">{[</span> <span class="nx">searchFilters</span><span class="o">=</span><span class="p">{[</span>
<span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">getSearchFields</span><span class="p">()</span> <span class="p">(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">getSearchFields</span><span class="p">()</span>
<span class="p">]}</span> <span class="p">]}</span>
<span class="nx">renderHeaderTitle</span><span class="o">=</span><span class="s2">&quot;Certificates&quot;</span> <span class="nx">renderHeaderTitle</span><span class="o">=</span><span class="s2">&quot;Certificates&quot;</span>
<span class="nx">renderTableHeader</span><span class="o">=</span><span class="p">{[</span> <span class="nx">renderTableHeader</span><span class="o">=</span><span class="p">{[</span>
@ -952,7 +952,7 @@ Also, we can define needed sorting callbacks and search filters for the list:</p
<span class="p">{</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Namespace&quot;</span><span class="p">,</span> <span class="nx">className</span><span class="o">:</span> <span class="s2">&quot;namespace&quot;</span><span class="p">,</span> <span class="nx">sortBy</span>: <span class="kt">sortBy.namespace</span> <span class="p">},</span> <span class="p">{</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Namespace&quot;</span><span class="p">,</span> <span class="nx">className</span><span class="o">:</span> <span class="s2">&quot;namespace&quot;</span><span class="p">,</span> <span class="nx">sortBy</span>: <span class="kt">sortBy.namespace</span> <span class="p">},</span>
<span class="p">{</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Issuer&quot;</span><span class="p">,</span> <span class="nx">className</span><span class="o">:</span> <span class="s2">&quot;issuer&quot;</span><span class="p">,</span> <span class="nx">sortBy</span>: <span class="kt">sortBy.namespace</span> <span class="p">},</span> <span class="p">{</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Issuer&quot;</span><span class="p">,</span> <span class="nx">className</span><span class="o">:</span> <span class="s2">&quot;issuer&quot;</span><span class="p">,</span> <span class="nx">sortBy</span>: <span class="kt">sortBy.namespace</span> <span class="p">},</span>
<span class="p">]}</span> <span class="p">]}</span>
<span class="nx">renderTableContents</span><span class="o">=</span><span class="p">{(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">[</span> <span class="nx">renderTableContents</span><span class="o">=</span><span class="p">{(</span><span class="nx">certificate</span>: <span class="kt">Certificate</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="p">[</span>
<span class="nx">certificate</span><span class="p">.</span><span class="nx">getName</span><span class="p">(),</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">getName</span><span class="p">(),</span>
<span class="nx">certificate</span><span class="p">.</span><span class="nx">metadata</span><span class="p">.</span><span class="nx">namespace</span><span class="p">,</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">metadata</span><span class="p">.</span><span class="nx">namespace</span><span class="p">,</span>
<span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">issuerRef</span><span class="p">.</span><span class="nx">name</span> <span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">issuerRef</span><span class="p">.</span><span class="nx">name</span>
@ -975,7 +975,7 @@ We will do this again in <code>CrdSampleExtension</code> class:</p>
<span class="nx">kind</span>: <span class="kt">Certificate.kind</span><span class="p">,</span> <span class="nx">kind</span>: <span class="kt">Certificate.kind</span><span class="p">,</span>
<span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;cert-manager.io/v1alpha2&quot;</span><span class="p">],</span> <span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;cert-manager.io/v1alpha2&quot;</span><span class="p">],</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CertificateDetailsProps</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">CertificateDetails</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">CertificateDetailsProps</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">CertificateDetails</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}]</span> <span class="p">}]</span>
<span class="p">}</span> <span class="p">}</span>
@ -984,9 +984,9 @@ We will do this again in <code>CrdSampleExtension</code> class:</p>
So, next we need to implement that component. So, next we need to implement that component.
Lens will inject <code>Certificate</code> object into our component so we just need to render some information out of it. Lens will inject <code>Certificate</code> object into our component so we just need to render some information out of it.
We can use <code>Renderer.Component.DrawerItem</code> component from Lens Extensions API to give the same look and feel as Lens is using elsewhere:</p> We can use <code>Renderer.Component.DrawerItem</code> component from Lens Extensions API to give the same look and feel as Lens is using elsewhere:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Certificate</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;../certificate&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Certificate</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;../certificate&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1016,9 +1016,9 @@ We can use <code>Renderer.Component.DrawerItem</code> component from Lens Extens
<span class="p">{</span><span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">secretName</span><span class="p">}</span> <span class="p">{</span><span class="nx">certificate</span><span class="p">.</span><span class="nx">spec</span><span class="p">.</span><span class="nx">secretName</span><span class="p">}</span>
<span class="o">&lt;</span><span class="err">/DrawerItem&gt;</span> <span class="o">&lt;</span><span class="err">/DrawerItem&gt;</span>
<span class="o">&lt;</span><span class="nx">DrawerItem</span> <span class="nx">name</span><span class="o">=</span><span class="s2">&quot;Status&quot;</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;status&quot;</span> <span class="nx">labelsOnly</span><span class="o">&gt;</span> <span class="o">&lt;</span><span class="nx">DrawerItem</span> <span class="nx">name</span><span class="o">=</span><span class="s2">&quot;Status&quot;</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;status&quot;</span> <span class="nx">labelsOnly</span><span class="o">&gt;</span>
<span class="p">{</span><span class="nx">certificate</span><span class="p">.</span><span class="nx">status</span><span class="p">.</span><span class="nx">conditions</span><span class="p">.</span><span class="nx">map</span><span class="p">((</span><span class="nx">condition</span><span class="p">,</span> <span class="nx">index</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="p">{</span><span class="nx">certificate</span><span class="p">.</span><span class="nx">status</span><span class="p">.</span><span class="nx">conditions</span><span class="p">.</span><span class="nx">map</span><span class="p">((</span><span class="nx">condition</span><span class="p">,</span> <span class="nx">index</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">type</span><span class="p">,</span> <span class="nx">reason</span><span class="p">,</span> <span class="nx">message</span><span class="p">,</span> <span class="nx">status</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">condition</span><span class="p">;</span> <span class="kd">const</span> <span class="p">{</span> <span class="kr">type</span><span class="p">,</span> <span class="nx">reason</span><span class="p">,</span> <span class="nx">message</span><span class="p">,</span> <span class="nx">status</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">condition</span><span class="p">;</span>
<span class="kd">const</span> <span class="nx">kind</span> <span class="o">=</span> <span class="kd">type</span> <span class="o">||</span> <span class="nx">reason</span><span class="p">;</span> <span class="kd">const</span> <span class="nx">kind</span> <span class="o">=</span> <span class="kr">type</span> <span class="o">||</span> <span class="nx">reason</span><span class="p">;</span>
<span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">kind</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span> <span class="k">if</span> <span class="p">(</span><span class="o">!</span><span class="nx">kind</span><span class="p">)</span> <span class="k">return</span> <span class="kc">null</span><span class="p">;</span>
<span class="k">return</span> <span class="p">(</span> <span class="k">return</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">Badge</span> <span class="o">&lt;</span><span class="nx">Badge</span>

8
master/extensions/guides/main-extension/index.html
View File

@ -822,7 +822,7 @@ It also provides convenient methods for navigating to built-in Lens pages and ex
<h2 id="mainlensextension-class"><code>Main.LensExtension</code> Class<a class="headerlink" href="#mainlensextension-class" title="Permanent link">#</a></h2> <h2 id="mainlensextension-class"><code>Main.LensExtension</code> Class<a class="headerlink" href="#mainlensextension-class" title="Permanent link">#</a></h2>
<h3 id="onactivate-and-ondeactivate-methods"><code>onActivate()</code> and <code>onDeactivate()</code> Methods<a class="headerlink" href="#onactivate-and-ondeactivate-methods" title="Permanent link">#</a></h3> <h3 id="onactivate-and-ondeactivate-methods"><code>onActivate()</code> and <code>onDeactivate()</code> Methods<a class="headerlink" href="#onactivate-and-ondeactivate-methods" title="Permanent link">#</a></h3>
<p>To create a main extension simply extend the <code>Main.LensExtension</code> class:</p> <p>To create a main extension simply extend the <code>Main.LensExtension</code> class:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -852,7 +852,7 @@ Achieve this by starting Lens from the command prompt.</p>
<p>The Main Extension API allows you to customize the UI application menu. <p>The Main Extension API allows you to customize the UI application menu.
Note that this is the only UI feature that the Main Extension API allows you to customize. Note that this is the only UI feature that the Main Extension API allows you to customize.
The following example demonstrates adding an item to the <strong>Help</strong> menu.</p> The following example demonstrates adding an item to the <strong>Help</strong> menu.</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">SamplePageMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">SamplePageMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span>
@ -880,14 +880,14 @@ However, you would typically have this navigate to a specific page or perform an
Note that pages are associated with the <a href="../renderer-extension/"><code>Renderer.LensExtension</code></a> class and can be defined in the process of extending it.</li> Note that pages are associated with the <a href="../renderer-extension/"><code>Renderer.LensExtension</code></a> class and can be defined in the process of extending it.</li>
</ul> </ul>
<p>The following example demonstrates how an application menu can be used to navigate to such a page:</p> <p>The following example demonstrates how an application menu can be used to navigate to such a page:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">SamplePageMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">SamplePageMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">appMenus</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">parentId</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span> <span class="nx">parentId</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span>
<span class="nx">label</span><span class="o">:</span> <span class="s2">&quot;Sample&quot;</span><span class="p">,</span> <span class="nx">label</span><span class="o">:</span> <span class="s2">&quot;Sample&quot;</span><span class="p">,</span>
<span class="nx">click</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;myGlobalPage&quot;</span><span class="p">)</span> <span class="nx">click</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;myGlobalPage&quot;</span><span class="p">)</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">]</span> <span class="p">]</span>
<span class="p">}</span> <span class="p">}</span>

2
master/extensions/guides/protocol-handlers/index.html
View File

@ -801,7 +801,7 @@ Handlers will be run in both <code>main</code> and <code>renderer</code> in para
Furthermore, both <code>main</code> and <code>renderer</code> are routed separately. Furthermore, both <code>main</code> and <code>renderer</code> are routed separately.
In other words, which handler is selected in either process is independent from the list of possible handlers in the other.</p> In other words, which handler is selected in either process is independent from the list of possible handlers in the other.</p>
<p>Example of registering a handler:</p> <p>Example of registering a handler:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span><span class="p">,</span> <span class="nx">Common</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span><span class="p">,</span> <span class="nx">Common</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">function</span> <span class="nx">rootHandler</span><span class="p">(</span><span class="nx">params</span>: <span class="kt">Common.Types.ProtocolRouteParams</span><span class="p">)</span> <span class="p">{</span> <span class="kd">function</span> <span class="nx">rootHandler</span><span class="p">(</span><span class="nx">params</span>: <span class="kt">Common.Types.ProtocolRouteParams</span><span class="p">)</span> <span class="p">{</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;routed to ExampleExtension&quot;</span><span class="p">,</span> <span class="nx">params</span><span class="p">);</span> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;routed to ExampleExtension&quot;</span><span class="p">,</span> <span class="nx">params</span><span class="p">);</span>

144
master/extensions/guides/renderer-extension/index.html
View File

@ -1028,7 +1028,7 @@ The Renderer Extension API allows you to access, configure, and customize Lens d
<h2 id="rendererlensextension-class"><code>Renderer.LensExtension</code> Class<a class="headerlink" href="#rendererlensextension-class" title="Permanent link">#</a></h2> <h2 id="rendererlensextension-class"><code>Renderer.LensExtension</code> Class<a class="headerlink" href="#rendererlensextension-class" title="Permanent link">#</a></h2>
<h3 id="onactivate-and-ondeactivate-methods"><code>onActivate()</code> and <code>onDeactivate()</code> Methods<a class="headerlink" href="#onactivate-and-ondeactivate-methods" title="Permanent link">#</a></h3> <h3 id="onactivate-and-ondeactivate-methods"><code>onActivate()</code> and <code>onDeactivate()</code> Methods<a class="headerlink" href="#onactivate-and-ondeactivate-methods" title="Permanent link">#</a></h3>
<p>To create a renderer extension, extend the <code>Renderer.LensExtension</code> class:</p> <p>To create a renderer extension, extend the <code>Renderer.LensExtension</code> class:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtensionMain</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -1060,16 +1060,16 @@ Use cluster pages to display information about or add functionality to the activ
It is also possible to include custom details from other clusters. It is also possible to include custom details from other clusters.
Use your extension to access Kubernetes resources in the active cluster with <a href="../stores#Clusterstore"><code>ClusterStore.getInstance()</code></a>.</p> Use your extension to access Kubernetes resources in the active cluster with <a href="../stores#Clusterstore"><code>ClusterStore.getInstance()</code></a>.</p>
<p>Add a cluster page definition to a <code>Renderer.LensExtension</code> subclass with the following example:</p> <p>Add a cluster page definition to a <code>Renderer.LensExtension</code> subclass with the following example:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./page&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1084,8 +1084,8 @@ The properties of the <code>clusterPages</code> array objects are defined as fol
It offers flexibility in defining the appearance and behavior of your page.</li> It offers flexibility in defining the appearance and behavior of your page.</li>
</ul> </ul>
<p><code>ExamplePage</code> in the example above can be defined in <code>page.tsx</code>:</p> <p><code>ExamplePage</code> in the example above can be defined in <code>page.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">ExamplePage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">LensRendererExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">ExamplePage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">LensRendererExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="nx">render</span><span class="p">()</span> <span class="p">{</span> <span class="nx">render</span><span class="p">()</span> <span class="p">{</span>
@ -1105,16 +1105,16 @@ Use <code>clusterPageMenus</code>, covered in the next section, to add cluster p
<h3 id="clusterpagemenus"><code>clusterPageMenus</code><a class="headerlink" href="#clusterpagemenus" title="Permanent link">#</a></h3> <h3 id="clusterpagemenus"><code>clusterPageMenus</code><a class="headerlink" href="#clusterpagemenus" title="Permanent link">#</a></h3>
<p><code>clusterPageMenus</code> allows you to add cluster page menu items to the secondary left nav, below Lens's standard cluster menus like <strong>Workloads</strong>, <strong>Custom Resources</strong>, etc.</p> <p><code>clusterPageMenus</code> allows you to add cluster page menu items to the secondary left nav, below Lens's standard cluster menus like <strong>Workloads</strong>, <strong>Custom Resources</strong>, etc.</p>
<p>By expanding on the above example, you can add a cluster page menu item to the <code>ExampleExtension</code> definition:</p> <p>By expanding on the above example, you can add a cluster page menu item to the <code>ExampleExtension</code> definition:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./page&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1142,10 +1142,10 @@ The properties of the <code>clusterPageMenus</code> array objects are defined as
<p>The above example creates a menu item that reads <strong>Hello World</strong>. <p>The above example creates a menu item that reads <strong>Hello World</strong>.
When users click <strong>Hello World</strong>, the cluster dashboard will show the contents of <code>Example Page</code>.</p> When users click <strong>Hello World</strong>, the cluster dashboard will show the contents of <code>Example Page</code>.</p>
<p>This example requires the definition of another React-based component, <code>ExampleIcon</code>, which has been added to <code>page.tsx</code>, as follows:</p> <p>This example requires the definition of another React-based component, <code>ExampleIcon</code>, which has been added to <code>page.tsx</code>, as follows:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="kd">type</span> <span class="nx">IconProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">IconProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">IconProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">IconProps</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Icon</span> <span class="p">},</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Icon</span> <span class="p">},</span>
@ -1174,22 +1174,22 @@ The properties that <code>Renderer.Component.Icon</code> uses are defined as fol
</ul> </ul>
<p><code>clusterPageMenus</code> can also be used to define sub menu items, so that you can create groups of cluster pages. <p><code>clusterPageMenus</code> can also be used to define sub menu items, so that you can create groups of cluster pages.
The following example groups two sub menu items under one parent menu item:</p> The following example groups two sub menu items under one parent menu item:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleIcon</span><span class="p">,</span> <span class="nx">ExamplePage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./page&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">clusterPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;hello&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">},</span> <span class="p">},</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;bonjour&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;bonjour&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExemplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExemplePage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1239,16 +1239,16 @@ A cluster page menu object is defined to be a submenu item by setting the <code>
Their primary use is to display information and provide functionality across clusters (or catalog entities), including customized data and functionality unique to your extension.</p> Their primary use is to display information and provide functionality across clusters (or catalog entities), including customized data and functionality unique to your extension.</p>
<p>Unlike cluster pages, users can trigger global pages even when there is no active cluster (or catalog entity).</p> <p>Unlike cluster pages, users can trigger global pages even when there is no active cluster (or catalog entity).</p>
<p>The following example defines a <code>Renderer.LensExtension</code> subclass with a single global page definition:</p> <p>The following example defines a <code>Renderer.LensExtension</code> subclass with a single global page definition:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s1">&#39;@k8slens/extensions&#39;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s1">&#39;@k8slens/extensions&#39;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">HelpPage</span> <span class="p">}</span> <span class="k">from</span> <span class="s1">&#39;./page&#39;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">HelpPage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s1">&#39;./page&#39;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s1">&#39;react&#39;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s1">&#39;react&#39;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">HelpExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">HelpExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">globalPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">globalPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">HelpPage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">HelpPage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1263,8 +1263,8 @@ The properties of the <code>globalPages</code> array objects are defined as foll
It offers flexibility in defining the appearance and behavior of your page.</li> It offers flexibility in defining the appearance and behavior of your page.</li>
</ul> </ul>
<p><code>HelpPage</code> in the example above can be defined in <code>page.tsx</code>:</p> <p><code>HelpPage</code> in the example above can be defined in <code>page.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">HelpPage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">LensRendererExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">HelpPage</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="p">{</span> <span class="nx">extension</span>: <span class="kt">LensRendererExtension</span> <span class="p">}</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="nx">render</span><span class="p">()</span> <span class="p">{</span> <span class="nx">render</span><span class="p">()</span> <span class="p">{</span>
@ -1291,10 +1291,10 @@ Global pages are typically made available in the following ways:</p>
<p>The Lens <strong>Preferences</strong> page is a built-in global page. <p>The Lens <strong>Preferences</strong> page is a built-in global page.
You can use Lens extensions to add custom preferences to the Preferences page, providing a single location for users to configure global options.</p> You can use Lens extensions to add custom preferences to the Preferences page, providing a single location for users to configure global options.</p>
<p>The following example demonstrates adding a custom preference:</p> <p>The following example demonstrates adding a custom preference:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferenceHint</span><span class="p">,</span> <span class="nx">ExamplePreferenceInput</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-preference&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferenceHint</span><span class="p">,</span> <span class="nx">ExamplePreferenceInput</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-preference&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
@ -1304,8 +1304,8 @@ You can use Lens extensions to add custom preferences to the Preferences page, p
<span class="p">{</span> <span class="p">{</span>
<span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Preferences&quot;</span><span class="p">,</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Preferences&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceInput</span> <span class="nx">preference</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">preference</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceInput</span> <span class="nx">preference</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">preference</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceHint</span><span class="o">/&gt;</span> <span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceHint</span><span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1329,10 +1329,10 @@ The properties of the <code>appPreferences</code> array objects are defined as f
This is how <code>ExampleRendererExtension</code> handles the state of the preference input. This is how <code>ExampleRendererExtension</code> handles the state of the preference input.
<code>ExampleRendererExtension</code> has a <code>preference</code> field, which you will add to <code>ExamplePreferenceInput</code>.</p> <code>ExampleRendererExtension</code> has a <code>preference</code> field, which you will add to <code>ExamplePreferenceInput</code>.</p>
<p>In this example <code>ExamplePreferenceInput</code>, <code>ExamplePreferenceHint</code>, and <code>ExamplePreferenceProps</code> are defined in <code>./src/example-preference.tsx</code> as follows:</p> <p>In this example <code>ExamplePreferenceInput</code>, <code>ExamplePreferenceHint</code>, and <code>ExamplePreferenceProps</code> are defined in <code>./src/example-preference.tsx</code> as follows:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1360,7 +1360,7 @@ This is how <code>ExampleRendererExtension</code> handles the state of the prefe
<span class="o">&lt;</span><span class="nx">Checkbox</span> <span class="o">&lt;</span><span class="nx">Checkbox</span>
<span class="nx">label</span><span class="o">=</span><span class="s2">&quot;I understand appPreferences&quot;</span> <span class="nx">label</span><span class="o">=</span><span class="s2">&quot;I understand appPreferences&quot;</span>
<span class="nx">value</span><span class="o">=</span><span class="p">{</span><span class="nx">preference</span><span class="p">.</span><span class="nx">enabled</span><span class="p">}</span> <span class="nx">value</span><span class="o">=</span><span class="p">{</span><span class="nx">preference</span><span class="p">.</span><span class="nx">enabled</span><span class="p">}</span>
<span class="nx">onChange</span><span class="o">=</span><span class="p">{</span><span class="nx">v</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="nx">preference</span><span class="p">.</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">v</span><span class="p">;</span> <span class="p">}}</span> <span class="nx">onChange</span><span class="o">=</span><span class="p">{</span><span class="nx">v</span> <span class="p">=&gt;</span> <span class="p">{</span> <span class="nx">preference</span><span class="p">.</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">v</span><span class="p">;</span> <span class="p">}}</span>
<span class="o">/&gt;</span> <span class="o">/&gt;</span>
<span class="p">);</span> <span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
@ -1400,16 +1400,16 @@ However, we recommend that you manage your extension's state data using <a href=
They can be used to display status information, or act as links to global pages as well as external pages.</p> They can be used to display status information, or act as links to global pages as well as external pages.</p>
<p>The following example adds a <code>statusBarItems</code> definition and a <code>globalPages</code> definition to a <code>LensRendererExtension</code> subclass. <p>The following example adds a <code>statusBarItems</code> definition and a <code>globalPages</code> definition to a <code>LensRendererExtension</code> subclass.
It configures the status bar item to navigate to the global page upon activation (normally a mouse click):</p> It configures the status bar item to navigate to the global page upon activation (normally a mouse click):</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s1">&#39;@k8slens/extensions&#39;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s1">&#39;@k8slens/extensions&#39;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">HelpIcon</span><span class="p">,</span> <span class="nx">HelpPage</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./page&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">HelpIcon</span><span class="p">,</span> <span class="nx">HelpPage</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./page&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s1">&#39;react&#39;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s1">&#39;react&#39;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">HelpExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">HelpExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">globalPages</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">globalPages</span> <span class="o">=</span> <span class="p">[</span>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span> <span class="nx">id</span><span class="o">:</span> <span class="s2">&quot;help&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">HelpPage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Page</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">HelpPage</span> <span class="nx">extension</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">}</span><span class="o">/&gt;</span><span class="p">,</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1420,7 +1420,7 @@ It configures the status bar item to navigate to the global page upon activation
<span class="nx">Item</span><span class="o">:</span> <span class="p">(</span> <span class="nx">Item</span><span class="o">:</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">div</span> <span class="o">&lt;</span><span class="nx">div</span>
<span class="nx">className</span><span class="o">=</span><span class="s2">&quot;flex align-center gaps&quot;</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;flex align-center gaps&quot;</span>
<span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="o">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;help&quot;</span><span class="p">)}</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="p">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">navigate</span><span class="p">(</span><span class="s2">&quot;help&quot;</span><span class="p">)}</span>
<span class="o">&gt;</span> <span class="o">&gt;</span>
<span class="o">&lt;</span><span class="nx">HelpIcon</span> <span class="o">/&gt;</span> <span class="o">&lt;</span><span class="nx">HelpIcon</span> <span class="o">/&gt;</span>
<span class="nx">My</span> <span class="nx">Status</span> <span class="nx">Bar</span> <span class="nx">Item</span> <span class="nx">My</span> <span class="nx">Status</span> <span class="nx">Bar</span> <span class="nx">Item</span>
@ -1449,12 +1449,12 @@ Thus, clicking the status bar item activates the associated global pages.</li>
<p>They also appear on the title bar of the details page for specific resources:</p> <p>They also appear on the title bar of the details page for specific resources:</p>
<p><img alt="Details" src="../images/kubeobjectmenuitemdetail.png" /></p> <p><img alt="Details" src="../images/kubeobjectmenuitemdetail.png" /></p>
<p>The following example shows how to add a <code>kubeObjectMenuItems</code> for namespace resources with an associated action:</p> <p>The following example shows how to add a <code>kubeObjectMenuItems</code> for namespace resources with an associated action:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">NamespaceMenuItem</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/namespace-menu-item&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">NamespaceMenuItem</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/namespace-menu-item&quot;</span>
<span class="kd">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">kubeObjectMenuItems</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">kubeObjectMenuItems</span> <span class="o">=</span> <span class="p">[</span>
@ -1462,7 +1462,7 @@ Thus, clicking the status bar item activates the associated global pages.</li>
<span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;Namespace&quot;</span><span class="p">,</span> <span class="nx">kind</span><span class="o">:</span> <span class="s2">&quot;Namespace&quot;</span><span class="p">,</span>
<span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span> <span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">MenuItem</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectMenuProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">NamespaceMenuItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="nx">MenuItem</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectMenuProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">NamespaceMenuItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1479,8 +1479,8 @@ The properties of the <code>kubeObjectMenuItems</code> array objects are defined
In this example a <code>NamespaceMenuItem</code> object is returned.</li> In this example a <code>NamespaceMenuItem</code> object is returned.</li>
</ul> </ul>
<p><code>NamespaceMenuItem</code> is defined in <code>./src/namespace-menu-item.tsx</code>:</p> <p><code>NamespaceMenuItem</code> is defined in <code>./src/namespace-menu-item.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1491,8 +1491,8 @@ In this example a <code>NamespaceMenuItem</code> object is returned.</li>
<span class="nx">Navigation</span><span class="p">,</span> <span class="nx">Navigation</span><span class="p">,</span>
<span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">function</span> <span class="nx">NamespaceMenuItem</span><span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectMenuProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">function</span> <span class="nx">NamespaceMenuItem</span><span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectMenuProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="p">{</span>
<span class="kd">const</span> <span class="p">{</span> <span class="nx">object</span>: <span class="kt">namespace</span><span class="p">,</span> <span class="nx">toolbar</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">props</span><span class="p">;</span> <span class="kd">const</span> <span class="p">{</span> <span class="nx">object</span>: <span class="kt">namespace</span><span class="p">,</span> <span class="nx">toolbar</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">props</span><span class="p">;</span>
@ -1500,7 +1500,7 @@ In this example a <code>NamespaceMenuItem</code> object is returned.</li>
<span class="kd">const</span> <span class="nx">namespaceName</span> <span class="o">=</span> <span class="nx">namespace</span><span class="p">.</span><span class="nx">getName</span><span class="p">();</span> <span class="kd">const</span> <span class="nx">namespaceName</span> <span class="o">=</span> <span class="nx">namespace</span><span class="p">.</span><span class="nx">getName</span><span class="p">();</span>
<span class="kd">const</span> <span class="nx">sendToTerminal</span> <span class="o">=</span> <span class="p">(</span><span class="nx">command</span>: <span class="kt">string</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="kd">const</span> <span class="nx">sendToTerminal</span> <span class="o">=</span> <span class="p">(</span><span class="nx">command</span>: <span class="kt">string</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="nx">terminalStore</span><span class="p">.</span><span class="nx">sendCommand</span><span class="p">(</span><span class="nx">command</span><span class="p">,</span> <span class="p">{</span> <span class="nx">terminalStore</span><span class="p">.</span><span class="nx">sendCommand</span><span class="p">(</span><span class="nx">command</span><span class="p">,</span> <span class="p">{</span>
<span class="nx">enter</span>: <span class="kt">true</span><span class="p">,</span> <span class="nx">enter</span>: <span class="kt">true</span><span class="p">,</span>
<span class="nx">newTab</span>: <span class="kt">true</span><span class="p">,</span> <span class="nx">newTab</span>: <span class="kt">true</span><span class="p">,</span>
@ -1508,7 +1508,7 @@ In this example a <code>NamespaceMenuItem</code> object is returned.</li>
<span class="nx">Navigation</span><span class="p">.</span><span class="nx">hideDetails</span><span class="p">();</span> <span class="nx">Navigation</span><span class="p">.</span><span class="nx">hideDetails</span><span class="p">();</span>
<span class="p">};</span> <span class="p">};</span>
<span class="kd">const</span> <span class="nx">getPods</span> <span class="o">=</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="kd">const</span> <span class="nx">getPods</span> <span class="o">=</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="nx">sendToTerminal</span><span class="p">(</span><span class="sb">`kubectl get pods -n </span><span class="si">${</span><span class="nx">namespaceName</span><span class="si">}</span><span class="sb">`</span><span class="p">);</span> <span class="nx">sendToTerminal</span><span class="p">(</span><span class="sb">`kubectl get pods -n </span><span class="si">${</span><span class="nx">namespaceName</span><span class="si">}</span><span class="sb">`</span><span class="p">);</span>
<span class="p">};</span> <span class="p">};</span>
@ -1532,13 +1532,13 @@ Thus, <code>kubeObjectMenuItems</code> afford convenient access to the specific
These custom details appear on the details page for a specific resource, such as a Namespace as shown here:</p> These custom details appear on the details page for a specific resource, such as a Namespace as shown here:</p>
<p><img alt="Details" src="../images/kubeobjectdetailitem.png" /></p> <p><img alt="Details" src="../images/kubeobjectdetailitem.png" /></p>
<p>The following example shows how to use <code>kubeObjectDetailItems</code> to add a tabulated list of pods to the Namespace resource details page:</p> <p>The following example shows how to use <code>kubeObjectDetailItems</code> to add a tabulated list of pods to the Namespace resource details page:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">NamespaceDetailsItem</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/namespace-details-item&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">NamespaceDetailsItem</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/namespace-details-item&quot;</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">KubeObjectDetailsProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectDetailsProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubeObjectDetailsProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectDetailsProps</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">kubeObjectDetailItems</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">kubeObjectDetailItems</span> <span class="o">=</span> <span class="p">[</span>
@ -1547,7 +1547,7 @@ These custom details appear on the details page for a specific resource, such as
<span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span> <span class="nx">apiVersions</span><span class="o">:</span> <span class="p">[</span><span class="s2">&quot;v1&quot;</span><span class="p">],</span>
<span class="nx">priority</span>: <span class="kt">10</span><span class="p">,</span> <span class="nx">priority</span>: <span class="kt">10</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectDetailsProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">NamespaceDetailsItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="nx">Details</span><span class="o">:</span> <span class="p">(</span><span class="nx">props</span>: <span class="kt">KubeObjectDetailsProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">NamespaceDetailsItem</span> <span class="p">{...</span><span class="nx">props</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -1564,11 +1564,11 @@ The properties of the <code>kubeObjectDetailItems</code> array objects are defin
In this example a <code>NamespaceDetailsItem</code> object is returned.</li> In this example a <code>NamespaceDetailsItem</code> object is returned.</li>
</ul> </ul>
<p><code>NamespaceDetailsItem</code> is defined in <code>./src/namespace-details-item.tsx</code>:</p> <p><code>NamespaceDetailsItem</code> is defined in <code>./src/namespace-details-item.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">PodsDetailsList</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./pods-details-list&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">PodsDetailsList</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./pods-details-list&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span> <span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span>
@ -1579,9 +1579,9 @@ In this example a <code>NamespaceDetailsItem</code> object is returned.</li>
<span class="p">},</span> <span class="p">},</span>
<span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubeObjectMenuProps</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">Component</span><span class="p">.</span><span class="nx">KubeObjectMenuProps</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Namespace</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Namespace</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span>
<span class="kd">@observer</span> <span class="kd">@observer</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">NamespaceDetailsItem</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="nx">KubeObjectDetailsProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;&gt;</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">NamespaceDetailsItem</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="nx">KubeObjectDetailsProps</span><span class="o">&lt;</span><span class="nx">Namespace</span><span class="o">&gt;&gt;</span> <span class="p">{</span>
@ -1620,8 +1620,8 @@ This is done simply by marking the <code>pods</code> field as an <code>observabl
Details are placed in drawers, and using <code>Renderer.Component.DrawerTitle</code> provides a separator from details above this one. Details are placed in drawers, and using <code>Renderer.Component.DrawerTitle</code> provides a separator from details above this one.
Multiple details in a drawer can be placed in <code>&lt;Renderer.Component.DrawerItem&gt;</code> elements for further separation, if desired. Multiple details in a drawer can be placed in <code>&lt;Renderer.Component.DrawerItem&gt;</code> elements for further separation, if desired.
The rest of this example's details are defined in <code>PodsDetailsList</code>, found in <code>./pods-details-list.tsx</code>:</p> The rest of this example's details are defined in <code>PodsDetailsList</code>, found in <code>./pods-details-list.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -1632,14 +1632,14 @@ The rest of this example's details are defined in <code>PodsDetailsList</code>,
<span class="p">},</span> <span class="p">},</span>
<span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span>
<span class="kd">interface</span> <span class="nx">Props</span> <span class="p">{</span> <span class="kd">interface</span> <span class="nx">Props</span> <span class="p">{</span>
<span class="nx">pods?</span>: <span class="kt">Pod</span><span class="p">[];</span> <span class="nx">pods?</span>: <span class="kt">Pod</span><span class="p">[];</span>
<span class="p">}</span> <span class="p">}</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">PodsDetailsList</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="nx">Props</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">PodsDetailsList</span> <span class="k">extends</span> <span class="nx">React</span><span class="p">.</span><span class="nx">Component</span><span class="o">&lt;</span><span class="nx">Props</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="nx">getTableRow</span> <span class="o">=</span> <span class="p">(</span><span class="nx">pod</span>: <span class="kt">Pod</span><span class="p">)</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="nx">getTableRow</span> <span class="o">=</span> <span class="p">(</span><span class="nx">pod</span>: <span class="kt">Pod</span><span class="p">)</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="k">return</span> <span class="p">(</span> <span class="k">return</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">TableRow</span> <span class="nx">key</span><span class="o">=</span><span class="p">{</span><span class="nx">index</span><span class="p">}</span> <span class="nx">nowrap</span><span class="o">&gt;</span> <span class="o">&lt;</span><span class="nx">TableRow</span> <span class="nx">key</span><span class="o">=</span><span class="p">{</span><span class="nx">index</span><span class="p">}</span> <span class="nx">nowrap</span><span class="o">&gt;</span>
<span class="o">&lt;</span><span class="nx">TableCell</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;podName&quot;</span><span class="o">&gt;</span><span class="p">{</span><span class="nx">pods</span><span class="p">[</span><span class="nx">index</span><span class="p">].</span><span class="nx">getName</span><span class="p">()}</span><span class="o">&lt;</span><span class="err">/TableCell&gt;</span> <span class="o">&lt;</span><span class="nx">TableCell</span> <span class="nx">className</span><span class="o">=</span><span class="s2">&quot;podName&quot;</span><span class="o">&gt;</span><span class="p">{</span><span class="nx">pods</span><span class="p">[</span><span class="nx">index</span><span class="p">].</span><span class="nx">getName</span><span class="p">()}</span><span class="o">&lt;</span><span class="err">/TableCell&gt;</span>

40
master/extensions/guides/resource-stack/index.html
View File

@ -737,8 +737,8 @@ It could be applied automatically to a cluster by the extension, or the end-user
</code></pre></div> </code></pre></div>
<p>It is simply a pod named <code>example-pod</code>, running nginx. Assume this content is in the file <code>../resources/example-pod.yml</code>.</p> <p>It is simply a pod named <code>example-pod</code>, running nginx. Assume this content is in the file <code>../resources/example-pod.yml</code>.</p>
<p>The following code sample shows how to use the <code>Renderer.K8sApi.ResourceStack</code> to manage installing and uninstalling this resource stack:</p> <p>The following code sample shows how to use the <code>Renderer.K8sApi.ResourceStack</code> to manage installing and uninstalling this resource stack:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span><span class="p">,</span> <span class="nx">Common</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span><span class="p">,</span> <span class="nx">Common</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="o">*</span> <span class="kr">as</span> <span class="nx">path</span> <span class="k">from</span> <span class="s2">&quot;path&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="o">*</span> <span class="kr">as</span> <span class="nx">path</span> <span class="kr">from</span> <span class="s2">&quot;path&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span> <span class="nx">K8sApi</span><span class="o">:</span> <span class="p">{</span>
@ -748,27 +748,27 @@ It could be applied automatically to a cluster by the extension, or the end-user
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">ResourceStack</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">ResourceStack</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">ResourceStack</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">ResourceStack</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">Pod</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">K8sApi</span><span class="p">.</span><span class="nx">Pod</span><span class="p">;</span>
<span class="kd">type</span> <span class="nx">KubernetesCluster</span> <span class="o">=</span> <span class="nx">Common</span><span class="p">.</span><span class="nx">Catalog</span><span class="p">.</span><span class="nx">KubernetesCluster</span><span class="p">;</span> <span class="kr">type</span> <span class="nx">KubernetesCluster</span> <span class="o">=</span> <span class="nx">Common</span><span class="p">.</span><span class="nx">Catalog</span><span class="p">.</span><span class="nx">KubernetesCluster</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleClusterFeature</span> <span class="p">{</span> <span class="k">export</span> <span class="kd">class</span> <span class="nx">ExampleClusterFeature</span> <span class="p">{</span>
<span class="k">protected</span> <span class="nx">stack</span>: <span class="kt">ResourceStack</span><span class="p">;</span> <span class="k">protected</span> <span class="nx">stack</span>: <span class="kt">ResourceStack</span><span class="p">;</span>
<span class="kr">constructor</span><span class="p">(</span><span class="k">protected</span> <span class="nx">cluster</span>: <span class="kt">KubernetesCluster</span><span class="p">)</span> <span class="p">{</span> <span class="kr">constructor</span><span class="p">(</span><span class="k">protected</span> <span class="nx">cluster</span>: <span class="kt">KubernetesCluster</span><span class="p">)</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">stack</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">ResourceStack</span><span class="p">(</span><span class="nx">cluster</span><span class="p">,</span> <span class="s2">&quot;example-resource-stack&quot;</span><span class="p">);</span> <span class="k">this</span><span class="p">.</span><span class="nx">stack</span> <span class="o">=</span> <span class="ow">new</span> <span class="nx">ResourceStack</span><span class="p">(</span><span class="nx">cluster</span><span class="p">,</span> <span class="s2">&quot;example-resource-stack&quot;</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
<span class="nx">get</span> <span class="nx">resourceFolder</span><span class="p">()</span> <span class="p">{</span> <span class="nx">get</span> <span class="nx">resourceFolder</span><span class="p">()</span> <span class="p">{</span>
<span class="k">return</span> <span class="nx">path</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="nx">__dirname</span><span class="p">,</span> <span class="s2">&quot;../resources/&quot;</span><span class="p">);</span> <span class="k">return</span> <span class="nx">path</span><span class="p">.</span><span class="nx">join</span><span class="p">(</span><span class="nx">__dirname</span><span class="p">,</span> <span class="s2">&quot;../resources/&quot;</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
<span class="nx">install</span><span class="p">()</span><span class="o">:</span> <span class="nx">Promise</span><span class="o">&lt;</span><span class="kt">string</span><span class="o">&gt;</span> <span class="p">{</span> <span class="nx">install</span><span class="p">()</span><span class="o">:</span> <span class="nb">Promise</span><span class="o">&lt;</span><span class="kt">string</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;installing example-pod&quot;</span><span class="p">);</span> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;installing example-pod&quot;</span><span class="p">);</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">stack</span><span class="p">.</span><span class="nx">kubectlApplyFolder</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resourceFolder</span><span class="p">);</span> <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">stack</span><span class="p">.</span><span class="nx">kubectlApplyFolder</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resourceFolder</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
<span class="k">async</span> <span class="nx">isInstalled</span><span class="p">()</span><span class="o">:</span> <span class="nx">Promise</span><span class="o">&lt;</span><span class="kr">boolean</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">isInstalled</span><span class="p">()</span><span class="o">:</span> <span class="nb">Promise</span><span class="o">&lt;</span><span class="kt">boolean</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="k">try</span> <span class="p">{</span> <span class="k">try</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">podApi</span> <span class="o">=</span> <span class="nx">forCluster</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">cluster</span><span class="p">,</span> <span class="nx">Pod</span><span class="p">);</span> <span class="kd">const</span> <span class="nx">podApi</span> <span class="o">=</span> <span class="nx">forCluster</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">cluster</span><span class="p">,</span> <span class="nx">Pod</span><span class="p">);</span>
<span class="kd">const</span> <span class="nx">examplePod</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">podApi</span><span class="p">.</span><span class="nx">get</span><span class="p">({</span><span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;example-pod&quot;</span><span class="p">,</span> <span class="nx">namespace</span><span class="o">:</span> <span class="s2">&quot;default&quot;</span><span class="p">});</span> <span class="kd">const</span> <span class="nx">examplePod</span> <span class="o">=</span> <span class="k">await</span> <span class="nx">podApi</span><span class="p">.</span><span class="nx">get</span><span class="p">({</span><span class="nx">name</span><span class="o">:</span> <span class="s2">&quot;example-pod&quot;</span><span class="p">,</span> <span class="nx">namespace</span><span class="o">:</span> <span class="s2">&quot;default&quot;</span><span class="p">});</span>
@ -785,7 +785,7 @@ It could be applied automatically to a cluster by the extension, or the end-user
<span class="k">return</span> <span class="kc">false</span><span class="p">;</span> <span class="k">return</span> <span class="kc">false</span><span class="p">;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="k">async</span> <span class="nx">uninstall</span><span class="p">()</span><span class="o">:</span> <span class="nx">Promise</span><span class="o">&lt;</span><span class="kt">string</span><span class="o">&gt;</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">uninstall</span><span class="p">()</span><span class="o">:</span> <span class="nb">Promise</span><span class="o">&lt;</span><span class="kt">string</span><span class="o">&gt;</span> <span class="p">{</span>
<span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;uninstalling example-pod&quot;</span><span class="p">);</span> <span class="nx">console</span><span class="p">.</span><span class="nx">log</span><span class="p">(</span><span class="s2">&quot;uninstalling example-pod&quot;</span><span class="p">);</span>
<span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">stack</span><span class="p">.</span><span class="nx">kubectlDeleteFolder</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resourceFolder</span><span class="p">);</span> <span class="k">return</span> <span class="k">this</span><span class="p">.</span><span class="nx">stack</span><span class="p">.</span><span class="nx">kubectlDeleteFolder</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">resourceFolder</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
@ -801,11 +801,11 @@ Similarly, <code>ExampleClusterFeature</code> implements an <code>uninstall()</c
<code>isInstalled()</code> simply tries to find a pod named <code>example-pod</code>, as a way to determine if the pod is already installed. <code>isInstalled()</code> simply tries to find a pod named <code>example-pod</code>, as a way to determine if the pod is already installed.
This method can be useful in creating a context-sensitive UI for installing/uninstalling the feature, as demonstrated in the next sample code.</p> This method can be useful in creating a context-sensitive UI for installing/uninstalling the feature, as demonstrated in the next sample code.</p>
<p>To allow the end-user to control the life cycle of this cluster feature the following code sample shows how to implement a user interface based on React and custom Lens UI components:</p> <p>To allow the end-user to control the life cycle of this cluster feature the following code sample shows how to implement a user interface based on React and custom Lens UI components:</p>
<div class="highlight"><pre><span></span><code> <span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span><span class="p">,</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span><span class="p">,</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">computed</span><span class="p">,</span> <span class="nx">observable</span><span class="p">,</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">computed</span><span class="p">,</span> <span class="nx">observable</span><span class="p">,</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleClusterFeature</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./example-cluster-feature&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleClusterFeature</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./example-cluster-feature&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -830,7 +830,7 @@ This method can be useful in creating a context-sensitive UI for installing/unin
<span class="nx">feature</span>: <span class="kt">ExampleClusterFeature</span><span class="p">;</span> <span class="nx">feature</span>: <span class="kt">ExampleClusterFeature</span><span class="p">;</span>
<span class="k">async</span> <span class="nx">componentDidMount</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">componentDidMount</span><span class="p">()</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">feature</span> <span class="o">=</span> <span class="k">new</span> <span class="nx">ExampleClusterFeature</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">props</span><span class="p">.</span><span class="nx">cluster</span><span class="p">);</span> <span class="k">this</span><span class="p">.</span><span class="nx">feature</span> <span class="o">=</span> <span class="ow">new</span> <span class="nx">ExampleClusterFeature</span><span class="p">(</span><span class="k">this</span><span class="p">.</span><span class="nx">props</span><span class="p">.</span><span class="nx">cluster</span><span class="p">);</span>
<span class="k">await</span> <span class="k">this</span><span class="p">.</span><span class="nx">updateFeatureState</span><span class="p">();</span> <span class="k">await</span> <span class="k">this</span><span class="p">.</span><span class="nx">updateFeatureState</span><span class="p">();</span>
<span class="p">}</span> <span class="p">}</span>
@ -874,7 +874,7 @@ This method can be useful in creating a context-sensitive UI for installing/unin
<span class="o">&lt;</span><span class="nx">Button</span> <span class="o">&lt;</span><span class="nx">Button</span>
<span class="nx">label</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">buttonLabel</span><span class="p">}</span> <span class="nx">label</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">buttonLabel</span><span class="p">}</span>
<span class="nx">waiting</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">inProgress</span><span class="p">}</span> <span class="nx">waiting</span><span class="o">=</span><span class="p">{</span><span class="k">this</span><span class="p">.</span><span class="nx">inProgress</span><span class="p">}</span>
<span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="o">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">save</span><span class="p">()}</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="p">=&gt;</span> <span class="k">this</span><span class="p">.</span><span class="nx">save</span><span class="p">()}</span>
<span class="nx">primary</span> <span class="o">/&gt;</span> <span class="nx">primary</span> <span class="o">/&gt;</span>
<span class="o">&lt;</span><span class="err">/section&gt;</span> <span class="o">&lt;</span><span class="err">/section&gt;</span>
<span class="o">&lt;</span><span class="err">/&gt;</span> <span class="o">&lt;</span><span class="err">/&gt;</span>
@ -894,9 +894,9 @@ The <code>ExampleClusterFeatureSettings</code> class is marked as an <code>@obse
As well, the <code>installed</code> and <code>inProgress</code> fields are marked as <code>@observable</code>, ensuring that the button gets rerendered any time these fields change.</p> As well, the <code>installed</code> and <code>inProgress</code> fields are marked as <code>@observable</code>, ensuring that the button gets rerendered any time these fields change.</p>
<p>Finally, <code>ExampleClusterFeatureSettings</code> needs to be connected to the extension, and would typically appear on the cluster <strong>Settings</strong> page via a <code>Renderer.LensExtension.entitySettings</code> entry. <p>Finally, <code>ExampleClusterFeatureSettings</code> needs to be connected to the extension, and would typically appear on the cluster <strong>Settings</strong> page via a <code>Renderer.LensExtension.entitySettings</code> entry.
The <code>ExampleExtension</code> would look like this:</p> The <code>ExampleExtension</code> would look like this:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span><span class="p">,</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span><span class="p">,</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleClusterFeatureSettings</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-cluster-feature-settings&quot;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExampleClusterFeatureSettings</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-cluster-feature-settings&quot;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="nx">entitySettings</span> <span class="o">=</span> <span class="p">[</span> <span class="nx">entitySettings</span> <span class="o">=</span> <span class="p">[</span>
@ -906,7 +906,7 @@ The <code>ExampleExtension</code> would look like this:</p>
<span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Cluster Feature&quot;</span><span class="p">,</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Cluster Feature&quot;</span><span class="p">,</span>
<span class="nx">priority</span>: <span class="kt">5</span><span class="p">,</span> <span class="nx">priority</span>: <span class="kt">5</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">View</span><span class="o">:</span> <span class="p">({</span> <span class="nx">entity</span> <span class="o">=</span> <span class="kc">null</span> <span class="p">}</span><span class="o">:</span> <span class="p">{</span> <span class="nx">entity</span>: <span class="kt">Common.Catalog.KubernetesCluster</span><span class="p">})</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="nx">View</span><span class="o">:</span> <span class="p">({</span> <span class="nx">entity</span> <span class="o">=</span> <span class="kc">null</span> <span class="p">}</span><span class="o">:</span> <span class="p">{</span> <span class="nx">entity</span>: <span class="kt">Common.Catalog.KubernetesCluster</span><span class="p">})</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="k">return</span> <span class="p">(</span> <span class="k">return</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">ExampleClusterFeatureSettings</span> <span class="nx">cluster</span><span class="o">=</span><span class="p">{</span><span class="nx">entity</span><span class="p">}</span> <span class="o">/&gt;</span> <span class="o">&lt;</span><span class="nx">ExampleClusterFeatureSettings</span> <span class="nx">cluster</span><span class="o">=</span><span class="p">{</span><span class="nx">entity</span><span class="p">}</span> <span class="o">/&gt;</span>
<span class="p">);</span> <span class="p">);</span>

34
master/extensions/guides/stores/index.html
View File

@ -779,10 +779,10 @@ It is also recommenced to delete the instance, using the inherited static method
Everywhere else in your code you should use the <code>getInstance()</code> static method. Everywhere else in your code you should use the <code>getInstance()</code> static method.
This is so that your data is kept up to date and not persisted longer than expected.</p> This is so that your data is kept up to date and not persisted longer than expected.</p>
<p>The following example code creates a store for the <code>appPreferences</code> guide example:</p> <p>The following example code creates a store for the <code>appPreferences</code> guide example:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Common</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span><span class="p">,</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observable</span><span class="p">,</span> <span class="nx">makeObservable</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="kd">type</span> <span class="nx">ExamplePreferencesModel</span> <span class="o">=</span> <span class="p">{</span> <span class="k">export</span> <span class="kr">type</span> <span class="nx">ExamplePreferencesModel</span> <span class="o">=</span> <span class="p">{</span>
<span class="nx">enabled</span>: <span class="kt">boolean</span><span class="p">;</span> <span class="nx">enabled</span>: <span class="kt">boolean</span><span class="p">;</span>
<span class="p">};</span> <span class="p">};</span>
@ -800,7 +800,7 @@ This is so that your data is kept up to date and not persisted longer than expec
<span class="nx">makeObservable</span><span class="p">(</span><span class="k">this</span><span class="p">);</span> <span class="nx">makeObservable</span><span class="p">(</span><span class="k">this</span><span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>
<span class="k">protected</span> <span class="nx">fromStore</span><span class="p">({</span> <span class="nx">enabled</span> <span class="p">}</span><span class="o">:</span> <span class="nx">ExamplePreferencesModel</span><span class="p">)</span><span class="o">:</span> <span class="k">void</span> <span class="p">{</span> <span class="k">protected</span> <span class="nx">fromStore</span><span class="p">({</span> <span class="nx">enabled</span> <span class="p">}</span><span class="o">:</span> <span class="nx">ExamplePreferencesModel</span><span class="p">)</span><span class="o">:</span> <span class="ow">void</span> <span class="p">{</span>
<span class="k">this</span><span class="p">.</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">enabled</span><span class="p">;</span> <span class="k">this</span><span class="p">.</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">enabled</span><span class="p">;</span>
<span class="p">}</span> <span class="p">}</span>
@ -835,8 +835,8 @@ Thus it prevents an instance from being created when the constructor args are no
<p>The following example code, modified from the <a href="../renderer-extension#apppreferences"><code>appPreferences</code></a> guide demonstrates how to use the extension store. <p>The following example code, modified from the <a href="../renderer-extension#apppreferences"><code>appPreferences</code></a> guide demonstrates how to use the extension store.
<code>ExamplePreferencesStore</code> must be loaded in the main process, where loaded stores are automatically saved when exiting Lens. <code>ExamplePreferencesStore</code> must be loaded in the main process, where loaded stores are automatically saved when exiting Lens.
This can be done in <code>./main.ts</code>:</p> This can be done in <code>./main.ts</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Main</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-preference-store&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-preference-store&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleMainExtension</span> <span class="k">extends</span> <span class="nx">Main</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
<span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span> <span class="k">async</span> <span class="nx">onActivate</span><span class="p">()</span> <span class="p">{</span>
@ -847,10 +847,10 @@ This can be done in <code>./main.ts</code>:</p>
<p>Here, <code>ExamplePreferencesStore</code> loads with <code>ExamplePreferencesStore.getInstanceOrCreate().loadExtension(this)</code>, which is conveniently called from the <code>onActivate()</code> method of <code>ExampleMainExtension</code>. <p>Here, <code>ExamplePreferencesStore</code> loads with <code>ExamplePreferencesStore.getInstanceOrCreate().loadExtension(this)</code>, which is conveniently called from the <code>onActivate()</code> method of <code>ExampleMainExtension</code>.
Similarly, <code>ExamplePreferencesStore</code> must load in the renderer process where the <code>appPreferences</code> are handled. Similarly, <code>ExamplePreferencesStore</code> must load in the renderer process where the <code>appPreferences</code> are handled.
This can be done in <code>./renderer.ts</code>:</p> This can be done in <code>./renderer.ts</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferenceHint</span><span class="p">,</span> <span class="nx">ExamplePreferenceInput</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-preference&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferenceHint</span><span class="p">,</span> <span class="nx">ExamplePreferenceInput</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-preference&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./src/example-preference-store&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./src/example-preference-store&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span> <span class="k">export</span> <span class="k">default</span> <span class="kd">class</span> <span class="nx">ExampleRendererExtension</span> <span class="k">extends</span> <span class="nx">Renderer</span><span class="p">.</span><span class="nx">LensExtension</span> <span class="p">{</span>
@ -862,8 +862,8 @@ This can be done in <code>./renderer.ts</code>:</p>
<span class="p">{</span> <span class="p">{</span>
<span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Preferences&quot;</span><span class="p">,</span> <span class="nx">title</span><span class="o">:</span> <span class="s2">&quot;Example Preferences&quot;</span><span class="p">,</span>
<span class="nx">components</span><span class="o">:</span> <span class="p">{</span> <span class="nx">components</span><span class="o">:</span> <span class="p">{</span>
<span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceInput</span> <span class="o">/&gt;</span><span class="p">,</span> <span class="nx">Input</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceInput</span> <span class="o">/&gt;</span><span class="p">,</span>
<span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceHint</span><span class="o">/&gt;</span> <span class="nx">Hint</span><span class="o">:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="o">&lt;</span><span class="nx">ExamplePreferenceHint</span><span class="o">/&gt;</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">}</span> <span class="p">}</span>
<span class="p">];</span> <span class="p">];</span>
@ -871,10 +871,10 @@ This can be done in <code>./renderer.ts</code>:</p>
</code></pre></div> </code></pre></div>
<p>Again, <code>ExamplePreferencesStore.getInstanceOrCreate().loadExtension(this)</code> is called to load <code>ExamplePreferencesStore</code>, this time from the <code>onActivate()</code> method of <code>ExampleRendererExtension</code>.</p> <p>Again, <code>ExamplePreferencesStore.getInstanceOrCreate().loadExtension(this)</code> is called to load <code>ExamplePreferencesStore</code>, this time from the <code>onActivate()</code> method of <code>ExampleRendererExtension</code>.</p>
<p><code>ExamplePreferenceInput</code> is defined in <code>./src/example-preference.tsx</code>:</p> <p><code>ExamplePreferenceInput</code> is defined in <code>./src/example-preference.tsx</code>:</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">observer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;mobx-react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;./example-preference-store&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;./example-preference-store&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -890,7 +890,7 @@ This can be done in <code>./renderer.ts</code>:</p>
<span class="o">&lt;</span><span class="nx">Checkbox</span> <span class="o">&lt;</span><span class="nx">Checkbox</span>
<span class="nx">label</span><span class="o">=</span><span class="s2">&quot;I understand appPreferences&quot;</span> <span class="nx">label</span><span class="o">=</span><span class="s2">&quot;I understand appPreferences&quot;</span>
<span class="nx">value</span><span class="o">=</span><span class="p">{</span><span class="nx">ExamplePreferencesStore</span><span class="p">.</span><span class="nx">getInstance</span><span class="p">().</span><span class="nx">enabled</span><span class="p">}</span> <span class="nx">value</span><span class="o">=</span><span class="p">{</span><span class="nx">ExamplePreferencesStore</span><span class="p">.</span><span class="nx">getInstance</span><span class="p">().</span><span class="nx">enabled</span><span class="p">}</span>
<span class="nx">onChange</span><span class="o">=</span><span class="p">{</span><span class="nx">v</span> <span class="o">=&gt;</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span><span class="p">.</span><span class="nx">getInstance</span><span class="p">().</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">v</span><span class="p">;</span> <span class="p">}}</span> <span class="nx">onChange</span><span class="o">=</span><span class="p">{</span><span class="nx">v</span> <span class="p">=&gt;</span> <span class="p">{</span> <span class="nx">ExamplePreferencesStore</span><span class="p">.</span><span class="nx">getInstance</span><span class="p">().</span><span class="nx">enabled</span> <span class="o">=</span> <span class="nx">v</span><span class="p">;</span> <span class="p">}}</span>
<span class="o">/&gt;</span> <span class="o">/&gt;</span>
<span class="p">);</span> <span class="p">);</span>
<span class="p">}</span> <span class="p">}</span>

14
master/extensions/testing-and-publishing/testing/index.html
View File

@ -850,8 +850,8 @@ These components can be tested by popular React testing tools like <a href="http
Just use <code>npm start</code> or <code>yarn test</code> to run the tests.</p> Just use <code>npm start</code> or <code>yarn test</code> to run the tests.</p>
<p>For example, I have a component <code>GlobalPageMenuIcon</code> and want to test if <code>props.navigate</code> is called when user clicks the icon.</p> <p>For example, I have a component <code>GlobalPageMenuIcon</code> and want to test if <code>props.navigate</code> is called when user clicks the icon.</p>
<p>My component <code>GlobalPageMenuIcon</code></p> <p>My component <code>GlobalPageMenuIcon</code></p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">Renderer</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@k8slens/extensions&quot;</span><span class="p">;</span>
<span class="kd">const</span> <span class="p">{</span> <span class="kd">const</span> <span class="p">{</span>
<span class="nx">Component</span><span class="o">:</span> <span class="p">{</span> <span class="nx">Component</span><span class="o">:</span> <span class="p">{</span>
@ -859,19 +859,19 @@ Just use <code>npm start</code> or <code>yarn test</code> to run the tests.</p>
<span class="p">},</span> <span class="p">},</span>
<span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span> <span class="p">}</span> <span class="o">=</span> <span class="nx">Renderer</span><span class="p">;</span>
<span class="kd">const</span> <span class="nx">GlobalPageMenuIcon</span> <span class="o">=</span> <span class="p">({</span> <span class="nx">navigate</span> <span class="p">}</span><span class="o">:</span> <span class="p">{</span> <span class="nx">navigate</span><span class="o">?:</span> <span class="p">()</span> <span class="o">=&gt;</span> <span class="k">void</span> <span class="p">})</span><span class="o">:</span> <span class="nx">JSX</span><span class="p">.</span><span class="nx">Element</span> <span class="o">=&gt;</span> <span class="p">(</span> <span class="kd">const</span> <span class="nx">GlobalPageMenuIcon</span> <span class="o">=</span> <span class="p">({</span> <span class="nx">navigate</span> <span class="p">}</span><span class="o">:</span> <span class="p">{</span> <span class="nx">navigate</span><span class="o">?:</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="ow">void</span> <span class="p">})</span><span class="o">:</span> <span class="nx">JSX</span><span class="p">.</span><span class="nx">Element</span> <span class="p">=&gt;</span> <span class="p">(</span>
<span class="o">&lt;</span><span class="nx">Icon</span> <span class="o">&lt;</span><span class="nx">Icon</span>
<span class="nx">material</span><span class="o">=</span><span class="s2">&quot;trip_origin&quot;</span> <span class="nx">material</span><span class="o">=</span><span class="s2">&quot;trip_origin&quot;</span>
<span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="o">=&gt;</span> <span class="nx">navigate</span><span class="p">()}</span> <span class="nx">onClick</span><span class="o">=</span><span class="p">{()</span> <span class="p">=&gt;</span> <span class="nx">navigate</span><span class="p">()}</span>
<span class="nx">data</span><span class="o">-</span><span class="nx">testid</span><span class="o">=</span><span class="s2">&quot;global-page-menu-icon&quot;</span> <span class="nx">data</span><span class="o">-</span><span class="nx">testid</span><span class="o">=</span><span class="s2">&quot;global-page-menu-icon&quot;</span>
<span class="o">/&gt;</span> <span class="o">/&gt;</span>
<span class="p">)</span> <span class="p">)</span>
</code></pre></div> </code></pre></div>
<p>The test</p> <p>The test</p>
<div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="k">from</span> <span class="s2">&quot;react&quot;</span> <div class="highlight"><pre><span></span><code><span class="k">import</span> <span class="nx">React</span> <span class="kr">from</span> <span class="s2">&quot;react&quot;</span>
<span class="k">import</span> <span class="p">{</span> <span class="nx">render</span><span class="p">,</span> <span class="nx">screen</span><span class="p">,</span> <span class="nx">fireEvent</span> <span class="p">}</span> <span class="k">from</span> <span class="s2">&quot;@testing-library/react&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="p">{</span> <span class="nx">render</span><span class="p">,</span> <span class="nx">screen</span><span class="p">,</span> <span class="nx">fireEvent</span> <span class="p">}</span> <span class="kr">from</span> <span class="s2">&quot;@testing-library/react&quot;</span><span class="p">;</span>
<span class="k">import</span> <span class="nx">GlobalPageMenuIcon</span> <span class="k">from</span> <span class="s2">&quot;./GlobalPageMenuIcon&quot;</span><span class="p">;</span> <span class="k">import</span> <span class="nx">GlobalPageMenuIcon</span> <span class="kr">from</span> <span class="s2">&quot;./GlobalPageMenuIcon&quot;</span><span class="p">;</span>
<span class="nx">test</span><span class="p">(</span><span class="s2">&quot;click called navigate()&quot;</span><span class="p">,</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="p">{</span> <span class="nx">test</span><span class="p">(</span><span class="s2">&quot;click called navigate()&quot;</span><span class="p">,</span> <span class="p">()</span> <span class="p">=&gt;</span> <span class="p">{</span>
<span class="kd">const</span> <span class="nx">navigate</span> <span class="o">=</span> <span class="nx">jest</span><span class="p">.</span><span class="nx">fn</span><span class="p">();</span> <span class="kd">const</span> <span class="nx">navigate</span> <span class="o">=</span> <span class="nx">jest</span><span class="p">.</span><span class="nx">fn</span><span class="p">();</span>

548
master/sitemap.xml
View File

File diff suppressed because it is too large Load Diff

BIN
master/sitemap.xml.gz
View File

Binary file not shown.