@ndla/ui 35.0.9 → 35.0.11

package/src/SearchTypeResult/ActiveFilters.tsx

@@ -122,7 +122,8 @@ const ActiveFilters = ({
           <Tooltip
             tooltip={t('searchPage.searchFilterMessages.removeFilter', {
               filterName: filter.title,
-            })}>
+            })}
+          >
             <ActiveFilterContent filter={filter} onFilterRemove={onFilterRemove} />
           </Tooltip>
         ) : (
@@ -144,7 +145,8 @@ const ActiveFilters = ({
               })}
               size="normal"
               shape="pill"
-              onClick={onClickShowHiddenSubjects}>
+              onClick={onClickShowHiddenSubjects}
+            >
               <StyledActiveFilterTitle>
                 {t('searchPage.searchFilterMessages.additionalSubjectFilters', {
                   count: filterLength - showFilterCount + 1,

package/src/SearchTypeResult/PopupFilter.tsx

@@ -102,7 +102,8 @@ const PopupFilter = ({
       animationDuration={50}
       onClose={onClose}
       isOpen={isOpen}
-      size="fullscreen">
+      size="fullscreen"
+    >
       {() => (
         <ModalBody>
           <ModalWrapper>
@@ -117,7 +118,8 @@ const PopupFilter = ({
                     onClick={() => setSelectedMenu(MENU_ALL_SUBJECTS)}
                     colorTheme={selectedMenu !== MENU_ALL_SUBJECTS ? 'lighter' : undefined}
                     size="normal"
-                    shape="pill">
+                    shape="pill"
+                  >
                     {t('frontpageMenu.allsubjects')}
                   </ButtonV2>
                 </MainFilterButtonWrapper>
@@ -127,7 +129,8 @@ const PopupFilter = ({
                   onClick={() => setSelectedMenu(MENU_PROGRAMMES)}
                   colorTheme={selectedMenu !== MENU_PROGRAMMES ? 'lighter' : undefined}
                   size="normal"
-                  shape="pill">
+                  shape="pill"
+                >
                   {t('frontpageMenu.program')}
                 </ButtonV2>
               )}

package/src/SearchTypeResult/SearchFieldHeader.tsx

@@ -113,7 +113,8 @@ const SearchFieldHeader = ({
           onClick={() => {
             onChange('');
             inputRef.current?.focus();
-          }}>
+          }}
+        >
           <CrossIcon style={iconStyle} title={t<string>('welcomePage.resetSearch')} />
         </ClearButton>
       )}

package/src/SearchTypeResult/SearchNotionItem.tsx

@@ -158,7 +158,8 @@ const SearchNotionItem = ({
           animation="subtle"
           animationDuration={50}
           backgroundColor="white"
-          size="medium">
+          size="medium"
+        >
           {(onClose: () => void) => (
             <>
               <ModalHeader>

package/src/SearchTypeResult/SearchTypeHeader.tsx

@@ -121,7 +121,8 @@ const SearchTypeHeader = ({ filters = [], onFilterClick, totalCount, type }: Pro
                     e.currentTarget.blur();
                   }
                   onFilterClick?.(option.id);
-                }}>
+                }}
+              >
                 {option.name}
                 {option.active && (
                   <CategoryTypeCrossWrapper>

package/src/SearchTypeResult/SearchViewType.tsx

@@ -86,7 +86,8 @@ const SearchViewType = ({ viewType, onChangeViewType }: SearchViewTypeProps) =>
           type="button"
           size="normal"
           title={t('searchPage.resultType.gridView')}
-          onClick={() => onClickHandler('grid')}>
+          onClick={() => onClickHandler('grid')}
+        >
           <ButtonContent selected={viewType === 'grid'}>
             <Grid aria-hidden title="" />
           </ButtonContent>
@@ -97,7 +98,8 @@ const SearchViewType = ({ viewType, onChangeViewType }: SearchViewTypeProps) =>
           variant="stripped"
           size="normal"
           title={t('searchPage.resultType.listView')}
-          onClick={() => onClickHandler('list')}>
+          onClick={() => onClickHandler('list')}
+        >
           <ButtonContent selected={viewType === 'list'}>
             <ListCircle aria-hidden title="" />
           </ButtonContent>

package/src/SearchTypeResult/components/ItemContexts.tsx

@@ -109,7 +109,8 @@ const ItemContexts = ({ contexts, id, title }: ItemContextsType) => {
             </ModalButton>
           }
           animation="subtle"
-          animationDuration={50}>
+          animationDuration={50}
+        >
           {(onClose: () => void) => (
             <>
               <ModalHeader>

package/src/SnackBar/DefaultSnackbar.tsx

@@ -50,7 +50,8 @@ const DefaultSnack = (snack: Snack) => {
             variant="outline"
             colorTheme="greyLighter"
             onClick={() => closeSnack(snack)}
-            aria-label={t('snackbar.close')}>
+            aria-label={t('snackbar.close')}
+          >
             <Cross />
           </IconButtonV2>
         )}

package/src/TagSelector/DropdownIndicator.tsx

@@ -36,7 +36,8 @@ const DropdownIndicator = ({ selectProps, children, ...props }: DropdownIndicato
       css={css}
       {...props}
       selectProps={selectProps}
-      aria-label={menuIsOpen ? t('tagSelector.hideTags') : t('tagSelector.showTags')}>
+      aria-label={menuIsOpen ? t('tagSelector.hideTags') : t('tagSelector.showTags')}
+    >
       <StyledIconWrapper aria-hidden>
         <Icon />
       </StyledIconWrapper>

package/src/TagSelector/Option.tsx

@@ -43,7 +43,8 @@ const Option = ({ innerProps, innerRef, children, isSelected, isFocused }: Optio
       selected={isSelected}
       css={buttonStyle({ colorTheme: 'lighter', variant: 'ghost', shape: 'sharp' })}
       ref={innerRef}
-      {...innerProps}>
+      {...innerProps}
+    >
       {children}
       {isSelected && <StyledCheck />}
     </StyledMenuOption>

package/src/TagSelector/ValueButton.tsx

@@ -35,7 +35,8 @@ const ValueButton = ({ innerProps, children, removeProps, isFocused }: MultiValu
       role="button"
       css={buttonStyle({ colorTheme: 'lighter', shape: 'pill', size: 'small' })}
       {...innerProps}
-      {...removeProps}>
+      {...removeProps}
+    >
       <span aria-hidden>#</span>
       {children}
       <Cross />

package/src/Topic/Topic.tsx

@@ -279,7 +279,8 @@ const Topic = ({
                 activateButton={
                   <VisualElementButton
                     variant="stripped"
-                    title={topic.visualElement.type === 'image' ? t('image.largeSize') : t('visualElement.show')}>
+                    title={topic.visualElement.type === 'image' ? t('image.largeSize') : t('visualElement.show')}
+                  >
                     <ShowVisualElementWrapper>
                       <TopicHeaderImage
                         src={`${topic.image.url}?${makeSrcQueryString(800, topic.image.crop, topic.image.focalPoint)}`}
@@ -292,7 +293,8 @@ const Topic = ({
                 }
                 animation="subtle"
                 animationDuration={50}
-                size="large">
+                size="large"
+              >
                 {(onClose: () => void) => (
                   <>
                     <ModalHeader>
@@ -319,7 +321,8 @@ const Topic = ({
               aria-expanded={!!showContent}
               aria-controls={contentId}
               variant="link"
-              onClick={() => onToggleShowContent()}>
+              onClick={() => onToggleShowContent()}
+            >
               {showContent ? (
                 <>
                   {t('navigation.showShorterDescription')} <ChevronUp />

package/src/TreeStructure/AddFolderButton.tsx

@@ -70,7 +70,8 @@ const AddFolderButton = ({
           e.currentTarget.focus();
           setNewFolderParentId(focusedFolder?.id);
           setShowTree(true);
-        }}>
+        }}
+      >
         <StyledPlus /> {t('myNdla.newFolder')}
       </StyledAddFolderButton>
     </Tooltip>

package/src/TreeStructure/ComboboxButton.tsx

@@ -118,7 +118,8 @@ const ComboboxButton = forwardRef<HTMLButtonElement, Props>(
             onToggleTree(!showTree);
             innerRef.current?.focus();
           }
-        }}>
+        }}
+      >
         {loading && (
           <ContentLoader width={1000} height={40}>
             <rect x="15" y="0" width="1000" rx="3" ry="3" r="15" height="40" />
@@ -144,7 +145,8 @@ const ComboboxButton = forwardRef<HTMLButtonElement, Props>(
             onClick={() => {
               innerRef.current?.focus();
               onToggleTree(!showTree);
-            }}>
+            }}
+          >
             {selectedFolder?.name}
           </StyledSelectedFolder>
         )}
@@ -160,7 +162,8 @@ const ComboboxButton = forwardRef<HTMLButtonElement, Props>(
           onClick={() => {
             innerRef.current?.focus();
             onToggleTree(!showTree);
-          }}>
+          }}
+        >
           {showTree ? <ChevronUp /> : <ChevronDown />}
         </IconButton>
       </StyledRow>

package/src/TreeStructure/FolderItem.tsx

@@ -193,7 +193,8 @@ const FolderItem = ({
       tabIndex={tabable ? 0 : -1}
       selected={selected}
       onFocus={() => setFocusedFolder(folder)}
-      onClick={handleClickFolder}>
+      onClick={handleClickFolder}
+    >
       {!hideArrow && (
         <OpenButton
           aria-hidden
@@ -208,7 +209,8 @@ const FolderItem = ({
             } else {
               onOpenFolder(id);
             }
-          }}>
+          }}
+        >
           <ArrowDropDownRounded />
         </OpenButton>
       )}
@@ -235,7 +237,8 @@ const FolderItem = ({
         setFocusedFolder(focusedFolder || folder);
       }}
       onClick={handleClickFolder}
-      isCreatingFolder={isCreatingFolder}>
+      isCreatingFolder={isCreatingFolder}
+    >
       {!hideArrow && (
         <OpenButton
           aria-hidden
@@ -249,7 +252,8 @@ const FolderItem = ({
             } else {
               onOpenFolder(id);
             }
-          }}>
+          }}
+        >
           <ArrowDropDownRounded />
         </OpenButton>
       )}

package/src/TreeStructure/FolderItems.tsx

@@ -72,7 +72,8 @@ const FolderItems = ({
     }
     tabIndex={-1}
     aria-labelledby={level === 0 && type === 'picker' ? treestructureId(type, 'label') : undefined}
-    role={level === 0 ? 'tree' : 'group'}>
+    role={level === 0 ? 'tree' : 'group'}
+  >
     {children}
     {folders.map((folder, index) => {
       const { subfolders, id } = folder;
@@ -102,7 +103,8 @@ const FolderItems = ({
               openFolders={openFolders}
               newFolderInput={newFolderInput}
               onCreate={onCreate}
-              {...rest}>
+              {...rest}
+            >
               {newFolderParentId === id && (
                 <li role="none">{newFolderInput?.({ parentId: id, onClose: onCancelNewFolder, onCreate })}</li>
               )}

package/src/TreeStructure/TreeStructure.tsx

@@ -184,7 +184,8 @@ const TreeStructure = ({
         if (type === 'picker' && !e.currentTarget.contains(e.relatedTarget)) {
           onToggleTree(false);
         }
-      }}>
+      }}
+    >
       <Row>
         {label && <StyledLabel id={treestructureId(type, 'label')}>{label}</StyledLabel>}
         {type === 'picker' && (

package/src/User/AuthModal.tsx

@@ -84,7 +84,8 @@ const AuthModal = ({
       isOpen={isOpen}
       onClose={onClose}
       controllable={!activateButton}
-      label={isAuthenticated ? t('user.modal.isAuth') : t('user.modal.isNotAuth')}>
+      label={isAuthenticated ? t('user.modal.isAuth') : t('user.modal.isNotAuth')}
+    >
       {(onClose: () => void) => (
         <StyledModalBody>
           <StyledModalHeader>

package/src/types.ts

@@ -9,7 +9,7 @@
 import { ReactNode } from 'react';
 
 const locales = ['nb', 'nn', 'en', 'se', 'sma'] as const;
-export type Locale = typeof locales[number];
+export type Locale = (typeof locales)[number];
 
 export type Link = {
   text: string;