@ndla/ui 3.3.17 → 4.0.2

package/src/LearningPaths/LearningPathMenuAside.tsx

@@ -103,8 +103,6 @@ type Props = {
     }[];
     license: {
       license: string;
-      description: string;
-      url: string;
     };
   };
 };

package/src/LearningPaths/LearningPathMenuAsideCopyright.tsx

@@ -36,8 +36,6 @@ type Props = {
     }[];
     license: {
       license: string;
-      description: string;
-      url: string;
     };
   };
 };

package/src/LearningPaths/LearningPathMenuModalWrapper.tsx

@@ -10,7 +10,6 @@ import React, { ReactChild, ReactChildren, ReactNode } from 'react';
 import { spacing, mq, breakpoints } from '@ndla/core';
 import Modal, { ModalHeader, ModalBody, ModalCloseButton } from '@ndla/modal';
 import { css } from '@emotion/core';
-// @ts-ignore
 import Button from '@ndla/button';
 import { LearningPath } from '@ndla/icons/contentType';
 import { useTranslation } from 'react-i18next';

package/src/Masthead/MastheadAuthModal.tsx

@@ -8,7 +8,6 @@
 
 import React from 'react';
 import styled from '@emotion/styled';
-// @ts-ignore
 import Button from '@ndla/button';
 import { Feide } from '@ndla/icons/common';
 
@@ -16,7 +15,7 @@ import AuthModal from '../User';
 import { AuthModalProps } from '../User/AuthModal';
 
 type FeideWrapperProps = {
-  inverted: boolean;
+  inverted?: boolean;
 };
 
 const StyledButton = styled(Button)<FeideWrapperProps>`

package/src/Masthead/MastheadSearchModal.tsx

@@ -1,6 +1,5 @@
 import React, { ReactChild, ReactChildren, ReactNode } from 'react';
 import Modal from '@ndla/modal';
-// @ts-ignore
 import Button from '@ndla/button';
 import { Cross } from '@ndla/icons/action';
 import { isFunction } from '@ndla/util';

package/src/MessageBox/MessageBox.tsx

@@ -128,6 +128,11 @@ const Link = styled.a`
     box-shadow: none;
   }
 `;
+const CloseButtonWrapper = styled.div`
+  position: absolute;
+  top: 10px;
+  right: 1px;
+`;
 
 type LinkProps = {
   href?: string;
@@ -136,12 +141,12 @@ type LinkProps = {
 type Props = {
   type?: WrapperProps['boxType'];
   sticky?: boolean;
-  onClose?: boolean;
   children?: string;
   links?: LinkProps[];
+  showCloseButton?: boolean;
 };
 
-export const MessageBox = ({ type, sticky = false, onClose, children, links, t }: Props & WithTranslation) => {
+export const MessageBox = ({ type, sticky = false, children, links, t, showCloseButton }: Props & WithTranslation) => {
   const [hideMessageBox, setHideMessageBox] = useState(false);
   const onCloseMessageBox = () => {
     setHideMessageBox(true);
@@ -157,7 +162,11 @@ export const MessageBox = ({ type, sticky = false, onClose, children, links, t }
           </IconWrapper>
           <TextWrapper>{children}</TextWrapper>
         </InfoWrapper>
-        {onClose && <CloseButton onClick={onCloseMessageBox} color="#444444" />}
+        {showCloseButton && (
+          <CloseButtonWrapper>
+            <CloseButton onClick={onCloseMessageBox} />
+          </CloseButtonWrapper>
+        )}
       </Wrapper>
 
       {links && (

package/src/NDLAFilm/AboutNdlaFilm.tsx

@@ -3,7 +3,6 @@ import { useTranslation } from 'react-i18next';
 import styled from '@emotion/styled';
 import Modal, { ModalHeader, ModalBody, ModalCloseButton } from '@ndla/modal';
 import { colors, spacing, fonts, mq, breakpoints } from '@ndla/core';
-//@ts-ignore
 import Button from '@ndla/button';
 import { OneColumn } from '..';
 import VisualElement from './VisualElement';

package/src/Navigation/NavigationBox.tsx

@@ -1,7 +1,6 @@
 import React, { MouseEvent, ChangeEventHandler } from 'react';
 import styled from '@emotion/styled';
 import { SafeLinkButton } from '@ndla/safelink';
-// @ts-ignore
 import Button from '@ndla/button';
 import { breakpoints, colors, fonts, misc, mq, spacing } from '@ndla/core';
 import { css } from '@emotion/core';
@@ -230,7 +229,7 @@ export const NavigationBox = ({
               lighter={colorMode === 'light'}
               selected={item.selected}>
               <ListElementType
-                to={item.url}
+                to={item.url ?? ''}
                 lighter={!item.selected && colorMode === 'light'}
                 greyLighter={!item.selected && colorMode === 'greyLighter'}
                 greyLightest={!item.selected && colorMode === 'greyLightest'}

package/src/Navigation/NavigationTopicAbout.tsx

@@ -3,7 +3,6 @@ import parse from 'html-react-parser';
 import styled from '@emotion/styled';
 import { breakpoints, colors, fonts, mq, spacing } from '@ndla/core';
 import { css } from '@emotion/core';
-// @ts-ignore
 import Button from '@ndla/button';
 import { ChevronDown, ChevronUp } from '@ndla/icons/common';
 import { useTranslation } from 'react-i18next';

package/src/NoContentBox/NoContentBox.tsx

@@ -8,7 +8,6 @@
 
 import React from 'react';
 import BEMHelper from 'react-bem-helper';
-//@ts-ignore
 import Button from '@ndla/button';
 
 const classes = new BEMHelper({

package/src/Notion/Notion.tsx

@@ -2,8 +2,6 @@ import styled from '@emotion/styled';
 import { useTranslation } from 'react-i18next';
 import HTMLReactParser from 'html-react-parser';
 import React, { MouseEventHandler, ReactNode } from 'react';
-
-// @ts-ignore
 import Button from '@ndla/button';
 import { joinArrayWithConjunction } from '@ndla/util';
 import { colors, fonts } from '@ndla/core';

package/src/Programme/ProgrammeSubjects.tsx

@@ -8,7 +8,6 @@
 
 import React from 'react';
 import styled from '@emotion/styled';
-// @ts-ignore
 import Button from '@ndla/button';
 import { breakpoints, mq } from '@ndla/core';
 import { NavigationBox } from '../Navigation';

package/src/RelatedArticleList/RelatedArticleList.tsx

@@ -1,6 +1,5 @@
 import React, { Children, cloneElement, ReactElement } from 'react';
 import BEMHelper from 'react-bem-helper';
-//@ts-ignore
 import Button from '@ndla/button';
 import SafeLink from '@ndla/safelink';
 import SectionHeading from '../SectionHeading';

package/src/Search/ContentTypeResult.tsx

@@ -1,5 +1,4 @@
 import React, { useState, useEffect, useRef, ReactElement } from 'react';
-// @ts-ignore
 import Button from '@ndla/button';
 import Tooltip from '@ndla/tooltip';
 import { Additional, ChevronUp, ChevronDown } from '@ndla/icons/common';

package/src/SearchTypeResult/ActiveFilterContent.tsx

@@ -10,7 +10,6 @@ import React from 'react';
 import styled from '@emotion/styled';
 import { Cross } from '@ndla/icons/action';
 import { spacing, fonts } from '@ndla/core';
-// @ts-ignore
 import Button from '@ndla/button';
 import { WithTranslation, withTranslation } from 'react-i18next';
 

package/src/SearchTypeResult/PopupFilter.tsx

@@ -10,7 +10,6 @@ import React, { useEffect, useRef, useState } from 'react';
 import styled from '@emotion/styled';
 import Modal, { ModalCloseButton, ModalBody } from '@ndla/modal';
 import { breakpoints, fonts, mq, spacing } from '@ndla/core';
-// @ts-ignore
 import Button from '@ndla/button';
 import { Plus as PlusIcon } from '@ndla/icons/action';
 import { useTranslation } from 'react-i18next';

package/src/SearchTypeResult/ResultNavigation.tsx

@@ -9,7 +9,6 @@
 import React from 'react';
 import styled from '@emotion/styled';
 import { ChevronDown } from '@ndla/icons/common';
-// @ts-ignore
 import Button from '@ndla/button';
 import { spacing } from '@ndla/core';
 import { useTranslation } from 'react-i18next';

package/src/SearchTypeResult/SearchHeader.tsx

@@ -10,7 +10,6 @@ import React, { FormEvent } from 'react';
 import styled from '@emotion/styled';
 import { breakpoints, fonts, mq, spacing } from '@ndla/core';
 
-// @ts-ignore
 import Button from '@ndla/button';
 import { WithTranslation, withTranslation } from 'react-i18next';
 import { FilterProps } from './ActiveFilterContent';

package/src/SearchTypeResult/SearchItem.tsx

@@ -11,7 +11,6 @@ import styled from '@emotion/styled';
 import parse from 'html-react-parser';
 import { ChevronRight, Additional, Core } from '@ndla/icons/common';
 import SafeLink from '@ndla/safelink';
-// @ts-ignore
 import Button from '@ndla/button';
 import Modal, { ModalCloseButton } from '@ndla/modal';
 

package/src/SearchTypeResult/SearchNotionItem.tsx

@@ -12,7 +12,6 @@ import parse from 'html-react-parser';
 
 import { breakpoints, colors, fonts, mq, spacing } from '@ndla/core';
 import { getLicenseByAbbreviation } from '@ndla/licenses';
-// @ts-ignore
 import Button from '@ndla/button';
 import { Play } from '@ndla/icons/common';
 import { ArrowExpand } from '@ndla/icons/editor';

package/src/SearchTypeResult/SearchTypeHeader.tsx

@@ -8,7 +8,6 @@
 
 import React, { MouseEvent, memo } from 'react'; // useMemo , { Children }
 import styled from '@emotion/styled';
-// @ts-ignore
 import Button from '@ndla/button';
 import { breakpoints, mq, spacing } from '@ndla/core';
 import { WithTranslation, withTranslation } from 'react-i18next';

package/src/Topic/Topic.tsx

@@ -13,7 +13,6 @@ import { animations, breakpoints, colors, fonts, mq, spacing } from '@ndla/core'
 import parse from 'html-react-parser';
 import { ChevronDown, ChevronUp, PlayCircleFilled } from '@ndla/icons/common';
 import Modal, { ModalCloseButton, ModalHeader, ModalBody } from '@ndla/modal';
-// @ts-ignore
 import Button from '@ndla/button';
 import { CursorClick, ExpandTwoArrows } from '@ndla/icons/action';
 import { css } from '@emotion/core';
@@ -280,8 +279,6 @@ const Topic = ({
                                   topic.image.focalPoint,
                                 )}`}
                                 alt={topic.image.alt}
-                                crop={topic.image.crop}
-                                focalPoint={topic.image.focalPoint}
                               />
                               <TopicHeaderOverlay />
                             </ShowVisualElementWrapper>
@@ -318,8 +315,6 @@ const Topic = ({
                     <TopicHeaderImage
                       src={`${topic.image.url}?${makeSrcQueryString(400, topic.image.crop, topic.image.focalPoint)}`}
                       alt={topic.image.alt}
-                      crop={topic.image.crop}
-                      focalPoint={topic.image.focalPoint}
                     />
                   )}
                 </TopicHeaderVisualElementWrapper>

package/src/User/AuthModal.tsx

@@ -10,7 +10,6 @@ import React, { ReactElement, ReactNode } from 'react';
 import styled from '@emotion/styled';
 import { useTranslation } from 'react-i18next';
 import Modal, { ModalCloseButton } from '@ndla/modal';
-// @ts-ignore
 import Button from '@ndla/button';
 import { FeideText, LogIn, LogOut, HumanMaleBoard } from '@ndla/icons/common';
 import { fonts, spacing } from '@ndla/core';

package/src/index.ts

@@ -117,7 +117,7 @@ export { default as Breadcrumblist } from './Breadcrumblist';
 
 export { MessageBox, MessageBoxTag, MessageBoxType } from './MessageBox';
 
-export { CloseButton } from './CloseButton';
+export { default as CloseButton } from './CloseButton';
 export { default as AudioPlayer, initAudioPlayers } from './AudioPlayer';
 
 export { NavigationHeading, NavigationBox, NavigationTopicAbout } from './Navigation';

package/src/locale/messages-en.ts

@@ -474,6 +474,9 @@ const messages = {
     embed: 'Embed',
     embedCopied: 'Copied embed code!',
     copyText: {
+      now: 'now',
+      podcast: 'podcast',
+      by: 'by',
       internet: '[Internet]. ',
       noTitle: 'No title',
       downloadedFrom: 'Downloaded from: ',

package/src/locale/messages-nb.ts

@@ -395,6 +395,9 @@ const messages = {
     embed: 'Bygg inn',
     embedCopied: 'Kopierte innbyggingskode!',
     copyText: {
+      now: 'nå',
+      podcast: 'podkast',
+      by: 'av',
       internet: '[Internett]. ',
       noTitle: 'Uten tittel',
       downloadedFrom: 'Hentet fra: ',

package/src/locale/messages-nn.ts

@@ -396,6 +396,9 @@ const messages = {
     embed: 'Bygg inn',
     embedCopied: 'Kopierte innbyggingskode!',
     copyText: {
+      now: 'nå',
+      podcast: 'podkast',
+      by: 'av',
       internet: '[Internett]. ',
       noTitle: 'Utan tittel',
       downloadedFrom: 'Henta frå: ',