@k-int/stripes-kint-components 3.0.4 → 3.1.0

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/SASQLookupComponent.js.html

@@ -25,28 +25,28 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>0/39</span>
+                <span class='fraction'>0/46</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>0/31</span>
+                <span class='fraction'>0/35</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/11</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>0/38</span>
+                <span class='fraction'>0/45</span>
             </div>
         
             
@@ -336,7 +336,38 @@
 <a name='L271'></a><a href='#L271'>271</a>
 <a name='L272'></a><a href='#L272'>272</a>
 <a name='L273'></a><a href='#L273'>273</a>
-<a name='L274'></a><a href='#L274'>274</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L274'></a><a href='#L274'>274</a>
+<a name='L275'></a><a href='#L275'>275</a>
+<a name='L276'></a><a href='#L276'>276</a>
+<a name='L277'></a><a href='#L277'>277</a>
+<a name='L278'></a><a href='#L278'>278</a>
+<a name='L279'></a><a href='#L279'>279</a>
+<a name='L280'></a><a href='#L280'>280</a>
+<a name='L281'></a><a href='#L281'>281</a>
+<a name='L282'></a><a href='#L282'>282</a>
+<a name='L283'></a><a href='#L283'>283</a>
+<a name='L284'></a><a href='#L284'>284</a>
+<a name='L285'></a><a href='#L285'>285</a>
+<a name='L286'></a><a href='#L286'>286</a>
+<a name='L287'></a><a href='#L287'>287</a>
+<a name='L288'></a><a href='#L288'>288</a>
+<a name='L289'></a><a href='#L289'>289</a>
+<a name='L290'></a><a href='#L290'>290</a>
+<a name='L291'></a><a href='#L291'>291</a>
+<a name='L292'></a><a href='#L292'>292</a>
+<a name='L293'></a><a href='#L293'>293</a>
+<a name='L294'></a><a href='#L294'>294</a>
+<a name='L295'></a><a href='#L295'>295</a>
+<a name='L296'></a><a href='#L296'>296</a>
+<a name='L297'></a><a href='#L297'>297</a>
+<a name='L298'></a><a href='#L298'>298</a>
+<a name='L299'></a><a href='#L299'>299</a>
+<a name='L300'></a><a href='#L300'>300</a>
+<a name='L301'></a><a href='#L301'>301</a>
+<a name='L302'></a><a href='#L302'>302</a>
+<a name='L303'></a><a href='#L303'>303</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -379,6 +410,9 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -397,10 +431,26 @@
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -466,6 +516,8 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -482,6 +534,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -530,6 +583,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -573,6 +627,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -609,7 +664,12 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import PropTypes from 'prop-types';
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { forwardRef, useImperativeHandle } from 'react';
+&nbsp;
+import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import { useInfiniteQuery } from 'react-query';
 &nbsp;
@@ -637,21 +697,24 @@ import { useKintIntl, useKiwtSASQuery, useLocalStorageState } from '../hooks';
 &nbsp;
 import TableBody from './TableBody';
 &nbsp;
-const SASQLookupComponent = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(p</span>rops) =&gt; {</span>
+const SASQLookupComponent = <span class="cstat-no" title="statement not covered" >forwardRef(<span class="fstat-no" title="function not covered" >(p</span>rops, ref) =&gt; {</span>
   const {
     children,
     fetchParameters = <span class="branch-0 cbranch-no" title="branch not covered" >{},</span>
     FilterComponent = <span class="fstat-no" title="function not covered" ><span class="branch-0 cbranch-no" title="branch not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >null,</span></span>
     FilterPaneHeaderComponent = <span class="fstat-no" title="function not covered" ><span class="branch-0 cbranch-no" title="branch not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >null,</span></span>
-    filterPaneProps,
+    filterPaneProps = <span class="branch-0 cbranch-no" title="branch not covered" >{},</span>
     id,
     intlKey: passedIntlKey,
     intlNS: passedIntlNS,
     labelOverrides = <span class="branch-0 cbranch-no" title="branch not covered" >{},</span>
     mainPaneProps,
     noSearchField,
+    persistedPanesetProps = <span class="branch-0 cbranch-no" title="branch not covered" >{},</span>
     RenderBody,
     sasqProps,
+    searchFieldAriaLabel,
+    searchFieldProps
   } = <span class="cstat-no" title="statement not covered" >props;</span>
   const kintIntl = <span class="cstat-no" title="statement not covered" >useKintIntl(passedIntlKey, passedIntlNS);</span>
 &nbsp;
@@ -669,14 +732,30 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
 &nbsp;
   const [filterPaneVisible, setFilterPaneVisible] = <span class="cstat-no" title="statement not covered" >useLocalStorageState(filterPaneVisibileKey, true);</span>
   const toggleFilterPane = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; <span class="cstat-no" title="statement not covered" >setFilterPaneVisible(!filterPaneVisible);</span></span>
+&nbsp;
+  const queryNamespace = <span class="cstat-no" title="statement not covered" >[namespace, 'SASQ'];</span>
+<span class="cstat-no" title="statement not covered" >  if (id) {</span>
+<span class="cstat-no" title="statement not covered" >    queryNamespace.push(id);</span>
+  }
+<span class="cstat-no" title="statement not covered" >  queryNamespace.push('viewAll');</span>
+<span class="cstat-no" title="statement not covered" >  queryNamespace.push(query);</span>
 &nbsp;
   const {
     data: totalData = <span class="branch-0 cbranch-no" title="branch not covered" >{},</span>
     ...restOfInfiniteQueryProps
   } = <span class="cstat-no" title="statement not covered" >useInfiniteQuery(</span>
-    [namespace, id, 'data', query],
+    queryNamespace,
     fetchPageData
   );
+&nbsp;
+<span class="cstat-no" title="statement not covered" >  useImperativeHandle(ref, <span class="fstat-no" title="function not covered" >()</span> =&gt; (</span>
+<span class="cstat-no" title="statement not covered" >    {</span>
+      lookupQueryProps: {
+        data: totalData,
+        ...restOfInfiniteQueryProps
+      }
+    }
+  ));
 &nbsp;
   const data = <span class="cstat-no" title="statement not covered" >totalData.pages?.reduce(</span>
 <span class="fstat-no" title="function not covered" >    (a</span>cc, curr) =&gt; {
@@ -731,10 +810,12 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
             &lt;PersistedPaneset
               appId={namespace}
               id={`${id}-paneset`}
+              {...persistedPanesetProps}
             &gt;
               {filterPaneVisible &amp;&amp;
                 &lt;Pane
                   defaultWidth="20%"
+                  id={`${id}-filter-pane`}
                   lastMenu={
                     &lt;PaneMenu&gt;
                       &lt;IconButton
@@ -751,6 +832,7 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
                     {!noSearchField &amp;&amp;
                       &lt;&gt;
                         &lt;SearchField
+                          ariaLabel={searchFieldAriaLabel}
                           autoFocus
                           id={`sasq-search-field-${id}`}
                           name="query"
@@ -763,6 +845,7 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
                           }}
                           onClear={searchHandlers.reset}
                           value={searchValue.query}
+                          {...searchFieldProps}
                         /&gt;
                         &lt;Button
                           buttonStyle="primary"
@@ -808,6 +891,7 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
                   &lt;/PaneMenu&gt;
                 :
                 null}
+                id={`${id}-main-pane`}
                 noOverflow
                 padContent={false}
                 paneSub={
@@ -844,7 +928,7 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
       }
     &lt;/SearchAndSortQuery&gt;
   );
-};
+});
 &nbsp;
 <span class="cstat-no" title="statement not covered" >SASQLookupComponent.propTypes = {</span>
   children: PropTypes.oneOfType([
@@ -872,13 +956,16 @@ const SASQLookupComponent = <span class="cstat-no" title="statement not covered"
   mclProps: PropTypes.object,
   noSearchField: PropTypes.bool,
   path: PropTypes.string.isRequired,
+  persistedPanesetProps: PropTypes.object,
   RenderBody: PropTypes.oneOfType([
     PropTypes.func,
     PropTypes.node
   ]),
   resource: PropTypes.object,
   resultColumns: PropTypes.arrayOf(PropTypes.object),
-  sasqProps: PropTypes.object
+  sasqProps: PropTypes.object,
+  searchFieldAriaLabel: PropTypes.string,
+  searchFieldProps: PropTypes.object
 };
 &nbsp;
 export default SASQLookupComponent;
@@ -889,7 +976,7 @@ export default SASQLookupComponent;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/TableBody/TableBody.js.html

@@ -385,7 +385,7 @@ export default TableBody;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/TableBody/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/TableBody/index.js.html

@@ -73,7 +73,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/index.html

@@ -25,28 +25,28 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>0/39</span>
+                <span class='fraction'>0/46</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>0/31</span>
+                <span class='fraction'>0/35</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/11</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>0/38</span>
+                <span class='fraction'>0/45</span>
             </div>
         
             
@@ -84,13 +84,13 @@
 	<div class="chart"><div class="cover-fill" style="width: 0%"></div><div class="cover-empty" style="width: 100%"></div></div>
 	</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="39" class="abs low">0/39</td>
+	<td data-value="46" class="abs low">0/46</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="31" class="abs low">0/31</td>
+	<td data-value="35" class="abs low">0/35</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="10" class="abs low">0/10</td>
+	<td data-value="11" class="abs low">0/11</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="38" class="abs low">0/38</td>
+	<td data-value="45" class="abs low">0/45</td>
 	</tr>
 
 <tr>
@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQLookupComponent/index.js.html

@@ -76,7 +76,7 @@ export { default as TableBody } from './TableBody';
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQRoute/SASQRoute.js.html

@@ -25,7 +25,7 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/14</span>
             </div>
         
             
@@ -39,14 +39,14 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/3</span>
+                <span class='fraction'>0/4</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/13</span>
             </div>
         
             
@@ -135,7 +135,22 @@
 <a name='L70'></a><a href='#L70'>70</a>
 <a name='L71'></a><a href='#L71'>71</a>
 <a name='L72'></a><a href='#L72'>72</a>
-<a name='L73'></a><a href='#L73'>73</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L73'></a><a href='#L73'>73</a>
+<a name='L74'></a><a href='#L74'>74</a>
+<a name='L75'></a><a href='#L75'>75</a>
+<a name='L76'></a><a href='#L76'>76</a>
+<a name='L77'></a><a href='#L77'>77</a>
+<a name='L78'></a><a href='#L78'>78</a>
+<a name='L79'></a><a href='#L79'>79</a>
+<a name='L80'></a><a href='#L80'>80</a>
+<a name='L81'></a><a href='#L81'>81</a>
+<a name='L82'></a><a href='#L82'>82</a>
+<a name='L83'></a><a href='#L83'>83</a>
+<a name='L84'></a><a href='#L84'>84</a>
+<a name='L85'></a><a href='#L85'>85</a>
+<a name='L86'></a><a href='#L86'>86</a>
+<a name='L87'></a><a href='#L87'>87</a>
+<a name='L88'></a><a href='#L88'>88</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -148,11 +163,24 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -175,6 +203,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -192,6 +221,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -207,7 +237,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from 'react';
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { forwardRef, useImperativeHandle, useRef } from 'react';
 import PropTypes from 'prop-types';
 &nbsp;
 import {
@@ -218,9 +248,22 @@ import {
 import { SASQLookupComponent } from '../SASQLookupComponent';
 import SASQViewComponent from '../SASQViewComponent';
 &nbsp;
-const SASQRoute = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >({</span> children, path, fetchParameters, ...props }) =&gt; {</span>
+const SASQRoute = <span class="cstat-no" title="statement not covered" >forwardRef(<span class="fstat-no" title="function not covered" >({</span></span>
+  children,
+  fetchParameters,
+  path,
+  ...props
+}, ref) =&gt; {
   // Grab the SASQ_MAP and tweak it
   const { SASQ_MAP = <span class="branch-0 cbranch-no" title="branch not covered" >{} </span>} = <span class="cstat-no" title="statement not covered" >fetchParameters;</span>
+&nbsp;
+  const lookupRef = <span class="cstat-no" title="statement not covered" >useRef();</span>
+  const viewRef = <span class="cstat-no" title="statement not covered" >useRef();</span>
+&nbsp;
+<span class="cstat-no" title="statement not covered" >  useImperativeHandle(ref, <span class="fstat-no" title="function not covered" >()</span> =&gt; (<span class="cstat-no" title="statement not covered" >{</span></span>
+    ...lookupRef.current,
+    ...viewRef.current
+  }));
 &nbsp;
 <span class="cstat-no" title="statement not covered" >  if (!SASQ_MAP.perPage) {</span>
 <span class="cstat-no" title="statement not covered" >    SASQ_MAP.perPage = 25;</span>
@@ -237,6 +280,7 @@ const SASQRoute = <span class="cstat-no" title="statement not covered" ><span cl
       render={<span class="fstat-no" title="function not covered" >ro</span>uteProps =&gt; {
 <span class="cstat-no" title="statement not covered" >        return (</span>
           &lt;SASQLookupComponent
+            ref={lookupRef}
             {...routeProps}
             fetchParameters={fetchParameters}
             path={path}
@@ -248,6 +292,7 @@ const SASQRoute = <span class="cstat-no" title="statement not covered" ><span cl
                 path={`${path}/:id`}
                 render={<span class="fstat-no" title="function not covered" >in</span>nerProps =&gt; (
 <span class="cstat-no" title="statement not covered" >                  &lt;SASQViewComponent</span>
+                    ref={viewRef}
                     {...innerProps}
                     fetchParameters={fetchParameters}
                     path={path}
@@ -262,7 +307,7 @@ const SASQRoute = <span class="cstat-no" title="statement not covered" ><span cl
       }}
     /&gt;
   );
-};
+});
 &nbsp;
 <span class="cstat-no" title="statement not covered" >SASQRoute.propTypes = {</span>
   children: PropTypes.oneOfType([
@@ -286,7 +331,7 @@ export default SASQRoute;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQRoute/index.html

@@ -25,7 +25,7 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/14</span>
             </div>
         
             
@@ -39,14 +39,14 @@
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/3</span>
+                <span class='fraction'>0/4</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>0/10</span>
+                <span class='fraction'>0/13</span>
             </div>
         
             
@@ -84,13 +84,13 @@
 	<div class="chart"><div class="cover-fill" style="width: 0%"></div><div class="cover-empty" style="width: 100%"></div></div>
 	</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="10" class="abs low">0/10</td>
+	<td data-value="14" class="abs low">0/14</td>
 	<td data-value="0" class="pct low">0%</td>
 	<td data-value="3" class="abs low">0/3</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="3" class="abs low">0/3</td>
+	<td data-value="4" class="abs low">0/4</td>
 	<td data-value="0" class="pct low">0%</td>
-	<td data-value="10" class="abs low">0/10</td>
+	<td data-value="13" class="abs low">0/13</td>
 	</tr>
 
 <tr>
@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/src/artifacts/coverage-jest/lcov-report/SASQRoute/index.js.html

@@ -73,7 +73,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2022-09-16T13:23:25.290Z
+                at 2022-11-03T13:44:33.087Z
             </div>
         <script src="../prettify.js"></script>
         <script>