fix: linting issues

core/store/src/state/context/document.tsx

@@ -28,9 +28,9 @@ export const DocumentContextProvider: FC<{ docId: string | undefined }> = ({
 /**
  * Retrieves a Document object from a document id
  */
-export const useDocument = (docId: string) => {
+export const useDocument = (docId?: string) => {
   const store = useStore();
-  return store.docs[docId];
+  return docId ? store.docs[docId] : undefined;
 };
 
 export const useGetDocument = () => {

plugins/axe-plugin/README.md

@@ -9,9 +9,9 @@
     -   [<ins>AxeAllyBlock</ins>](#insaxeallyblockins)
     -   [<ins>AxeContextProvider</ins>](#insaxecontextproviderins)
     -   [<ins>SelectionContextProvider</ins>](#insselectioncontextproviderins)
-    -   [<ins>isTagSelected</ins>](#insistagselectedins)
+    -   [<ins>useIsTagSelected</ins>](#insistagselectedins)
     -   [<ins>isSelected</ins>](#insisselectedins)
-    -   [<ins>isTagSelected</ins>](#insistagselectedins-1)
+    -   [<ins>useIsTagSelected</ins>](#insistagselectedins-1)
     -   [<ins>overview</ins>](#insoverviewins)
 
 # In action
@@ -100,15 +100,15 @@ _AxeContextProvider [source code](https://github.com/ccontrols/component-control
 
 _SelectionContextProvider [source code](https://github.com/ccontrols/component-controls/tree/master/plugins/axe-plugin/src/state/context.tsx)_
 
-## <ins>isTagSelected</ins>
+## <ins>useIsTagSelected</ins>
 
 _isTagSelected [source code](https://github.com/ccontrols/component-controls/tree/master/plugins/axe-plugin/src/state/context.tsx)_
 
 ## <ins>isSelected</ins>
 
 _isSelected [source code](https://github.com/ccontrols/component-controls/tree/master/plugins/axe-plugin/src/state/recoil.tsx)_
 
-## <ins>isTagSelected</ins>
+## <ins>useIsTagSelected</ins>
 
 _isTagSelected [source code](https://github.com/ccontrols/component-controls/tree/master/plugins/axe-plugin/src/state/recoil.tsx)_
 

plugins/axe-plugin/src/components/AllyDashboard.tsx

@@ -6,13 +6,13 @@ import {
   AxeContext,
   useTaggedList,
   SelectionContext,
-  isTagSelected,
+  useIsTagSelected,
 } from '../state/context';
 
 type StatsStatus = 'passes' | 'violations';
 
 const TagSelectionCheckbox: FC<{ tag: string }> = ({ tag }) => {
-  const isSelected = isTagSelected(tag);
+  const isSelected = useIsTagSelected(tag);
   const { selection, setSelection } = useContext(SelectionContext);
   const tagged = useTaggedList();
   const toggleTagSelected = (tag: string) => {

plugins/axe-plugin/src/state/context.tsx

@@ -90,7 +90,7 @@ export const SelectionContextProvider: FC = ({ children }) => {
   );
 };
 
-export const isTagSelected = (tag: string = '') => {
+export const useIsTagSelected = (tag: string = '') => {
   const tagged = useTaggedList();
   const { selection } = useContext(SelectionContext);
   return tagged[tag]

plugins/axe-plugin/src/state/recoil.tsx

@@ -81,7 +81,7 @@ export const isSelected = (targets?: Selection) =>
     },
   });
 
-export const isTagSelected = (tag: string = '') =>
+export const useIsTagSelected = (tag: string = '') =>
   selector<boolean>({
     key: `isTagSelected_${tag}`,
     get: ({ get }: any) => {

ui/app/src/DocumentHomePage/DocumentHomePage.tsx

@@ -20,11 +20,10 @@ export const DocumentHomePage: FC<DocumentHomePageProps> = ({ type }) => {
   const config = useConfig();
   const { categories } = config || {};
   const isCategory = categories?.includes(type);
+  const pages = useSortedDocByType(type);
   if (isCategory) {
     return <CategoryList type={type} />;
   }
-
-  const pages = useSortedDocByType(type);
   const page = config.pages?.[type] || {};
   if (page.indexHome) {
     return (

ui/blocks/src/StoryConfig/StoryConfig.tsx

@@ -31,7 +31,7 @@ export const StoryConfig: FC<StoryConfigProps> = ({
 }) => {
   const story = useStory({ id, name });
   const doc = useCurrentDocument();
-  const docPackage = doc && doc.package ? usePackage(doc.package) : undefined;
+  const docPackage = usePackage(doc?.package);
   return (
     <StoryBlockContainer {...rest}>
       <BaseStoryConfig

ui/blocks/src/StorySource/StorySource.tsx

@@ -42,7 +42,7 @@ export const StorySource: FC<StorySourceProps> = ({
 }) => {
   const story = useStory({ id, name });
   const doc = useCurrentDocument();
-  const docPackage = doc && doc.package ? usePackage(doc.package) : undefined;
+  const docPackage = usePackage(doc?.package);
 
   return (
     <StoryBlockContainer {...rest}>

ui/blocks/src/Title/Title.tsx

@@ -21,7 +21,7 @@ export const Title: FC<TitleProps> = ({ id, name, children, ...rest }) => {
     id,
     name,
   });
-  const doc = story && story.doc ? useDocument(story.doc) : undefined;
+  const doc = useDocument(story?.doc);
   const component = useStoryComponent({
     id,
     name,

ui/components/src/Link/Link.tsx

@@ -2,14 +2,15 @@ import React, { FC, useMemo } from 'react';
 import { LinkProps } from 'theme-ui';
 import { ExternalLink } from '../ExternalLink';
 import { useGetLinkClass } from './LinkContext';
+
 export const Link: FC<LinkProps> = props => {
   const { href } = props;
   //https://stackoverflow.com/questions/10687099/how-to-test-if-a-url-string-is-absolute-or-relative/10687158
   const r = useMemo(() => new RegExp('^(?:[a-z]+:)?//', 'i'), []);
+  const LinkClass = useGetLinkClass();
   if (typeof href === 'string' && r.test(href)) {
     //@ts-ignore
     return <ExternalLink {...props} />;
   }
-  const LinkClass = useGetLinkClass();
   return <LinkClass {...props} />;
 };

ui/components/src/Navmenu/Navmenu.tsx

@@ -254,8 +254,7 @@ export const Navmenu: FC<NavMenuProps> = ({
 
   const renderItem = (item: MenuItem, level: number = 1) => {
     const { expandedItems } = state;
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { items, id, label, widget, icon, onClick, ...rest } = item;
+    const { items, id, label, widget, icon, ...rest } = item;
     const itemId = id || label;
     const isExpanded: boolean =
       expandedItems && itemId ? expandedItems.includes(item) : false;
@@ -281,6 +280,7 @@ export const Navmenu: FC<NavMenuProps> = ({
             textDecoration: 'none',
             cursor: 'pointer',
           }}
+          {...rest}
           onClick={(e: any) => {
             if (items) {
               e.stopPropagation();
@@ -290,7 +290,6 @@ export const Navmenu: FC<NavMenuProps> = ({
             }
           }}
           className={isActiveParent ? 'active' : undefined}
-          {...rest}
         >
           <Flex variant="navmenu.itemcontainer">
             <Box variant="navmenu.iteminner">

ui/components/src/SearchInput/SearchInput.tsx

@@ -136,6 +136,7 @@ export const SearchInput = <ItemType extends SearchInputItemType>({
         break;
       case TAB:
       case ESC:
+      default:
         updateIsOpen(false);
         break;
     }

ui/components/src/Tabs/Tabs.tsx

@@ -12,7 +12,7 @@ import {
   resetIdCounter,
 } from 'react-tabs';
 
-export { resetIdCounter as resetTabCounter };
+export const resetTabCounter = resetIdCounter;
 /**
  * Tab heading - you should specify the title/label string as the children property. To be created inside the `<TabList />` component through the children prop.
  */