@ndla/ui 3.3.13 → 3.3.17

package/lib/index-javascript.js

@@ -95,54 +95,6 @@ Object.defineProperty(exports, "ToggleSearchButton", {
     return _Search.ToggleSearchButton;
   }
 });
-Object.defineProperty(exports, "ContentTypeBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge["default"];
-  }
-});
-Object.defineProperty(exports, "SubjectMaterialBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.SubjectMaterialBadge;
-  }
-});
-Object.defineProperty(exports, "TasksAndActivitiesBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.TasksAndActivitiesBadge;
-  }
-});
-Object.defineProperty(exports, "AssessmentResourcesBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.AssessmentResourcesBadge;
-  }
-});
-Object.defineProperty(exports, "LearningPathBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.LearningPathBadge;
-  }
-});
-Object.defineProperty(exports, "SubjectBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.SubjectBadge;
-  }
-});
-Object.defineProperty(exports, "ExternalLearningResourcesBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.ExternalLearningResourcesBadge;
-  }
-});
-Object.defineProperty(exports, "SourceMaterialBadge", {
-  enumerable: true,
-  get: function get() {
-    return _ContentTypeBadge.SourceMaterialBadge;
-  }
-});
 Object.defineProperty(exports, "TopicIntroductionList", {
   enumerable: true,
   get: function get() {
@@ -191,42 +143,6 @@ Object.defineProperty(exports, "CompetenceGoalsDialog", {
     return _CompetenceGoals.CompetenceGoalsDialog;
   }
 });
-Object.defineProperty(exports, "MediaList", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaList;
-  }
-});
-Object.defineProperty(exports, "MediaListItem", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaListItem;
-  }
-});
-Object.defineProperty(exports, "MediaListItemBody", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaListItemBody;
-  }
-});
-Object.defineProperty(exports, "MediaListItemActions", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaListItemActions;
-  }
-});
-Object.defineProperty(exports, "MediaListItemImage", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaListItemImage;
-  }
-});
-Object.defineProperty(exports, "MediaListItemMeta", {
-  enumerable: true,
-  get: function get() {
-    return _MediaList.MediaListItemMeta;
-  }
-});
 Object.defineProperty(exports, "EmbeddedTwitter", {
   enumerable: true,
   get: function get() {
@@ -245,71 +161,21 @@ Object.defineProperty(exports, "EmbeddedFacebookPage", {
     return _Embedded.EmbeddedFacebookPage;
   }
 });
-Object.defineProperty(exports, "DisplayOnPageYOffset", {
-  enumerable: true,
-  get: function get() {
-    return _Animation.DisplayOnPageYOffset;
-  }
-});
-Object.defineProperty(exports, "FilmSlideshow", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.FilmSlideshow;
-  }
-});
-Object.defineProperty(exports, "MovieGrid", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.MovieGrid;
-  }
-});
-Object.defineProperty(exports, "AboutNdlaFilm", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.AboutNdlaFilm;
-  }
-});
-Object.defineProperty(exports, "FilmMovieSearch", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.FilmMovieSearch;
-  }
-});
-Object.defineProperty(exports, "FilmMovieList", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.FilmMovieList;
-  }
-});
-Object.defineProperty(exports, "AllMoviesAlphabetically", {
-  enumerable: true,
-  get: function get() {
-    return _NDLAFilm.AllMoviesAlphabetically;
-  }
-});
 
 var _Filter = require("./Filter");
 
 var _Search = require("./Search");
 
-var _ContentTypeBadge = _interopRequireWildcard(require("./ContentTypeBadge"));
-
 var _TopicIntroductionList = _interopRequireDefault(require("./TopicIntroductionList"));
 
 var _TopicMenu = _interopRequireWildcard(require("./TopicMenu"));
 
 var _CompetenceGoals = _interopRequireWildcard(require("./CompetenceGoals"));
 
-var _MediaList = require("./MediaList");
-
 var _Embedded = require("./Embedded");
 
-var _Animation = require("./Animation");
-
-var _NDLAFilm = require("./NDLAFilm");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
 function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/lib/index.d.ts

@@ -64,6 +64,10 @@ export type { BreadcrumbItemProps } from './Breadcrumblist/Breadcrumblist';
 export { i18nInstance, formatNestedMessages, formatMessage } from './i18n';
 export { default as ResourceGroup } from './ResourceGroup';
 export { default as LayoutItem, OneColumn, PageContainer, Content } from './Layout';
+export { FilmSlideshow, MovieGrid, AboutNdlaFilm, FilmMovieSearch, FilmMovieList, AllMoviesAlphabetically, } from './NDLAFilm';
+export { DisplayOnPageYOffset } from './Animation';
+export { MediaList, MediaListItem, MediaListItemBody, MediaListItemActions, MediaListItemImage, MediaListItemMeta, } from './MediaList';
+export { default as ContentTypeBadge, SubjectMaterialBadge, TasksAndActivitiesBadge, AssessmentResourcesBadge, LearningPathBadge, SubjectBadge, ExternalLearningResourcesBadge, SourceMaterialBadge, } from './ContentTypeBadge';
 export { SubjectAbout, SubjectArchive, SubjectCarousel, SubjectChildContent, SubjectContent, SubjectFilter, SubjectFlexChild, SubjectFlexWrapper, SubjectHeader, SubjectLinks, SubjectNewContent, SubjectSecondaryContent, SubjectSectionTitle, SubjectShortcuts, SubjectSidebarWrapper, SubjectSocialContent, SubjectSocialSection, SubjectTopics, SubjectBanner, } from './Subject';
 export { default as ContentCard } from './ContentCard';
 export { default as CopyParagraphButton } from './CopyParagraphButton';

package/lib/index.js

@@ -124,6 +124,27 @@ var _exportNames = {
   OneColumn: true,
   PageContainer: true,
   Content: true,
+  FilmSlideshow: true,
+  MovieGrid: true,
+  AboutNdlaFilm: true,
+  FilmMovieSearch: true,
+  FilmMovieList: true,
+  AllMoviesAlphabetically: true,
+  DisplayOnPageYOffset: true,
+  MediaList: true,
+  MediaListItem: true,
+  MediaListItemBody: true,
+  MediaListItemActions: true,
+  MediaListItemImage: true,
+  MediaListItemMeta: true,
+  ContentTypeBadge: true,
+  SubjectMaterialBadge: true,
+  TasksAndActivitiesBadge: true,
+  AssessmentResourcesBadge: true,
+  LearningPathBadge: true,
+  SubjectBadge: true,
+  ExternalLearningResourcesBadge: true,
+  SourceMaterialBadge: true,
   SubjectAbout: true,
   SubjectArchive: true,
   SubjectCarousel: true,
@@ -854,6 +875,132 @@ Object.defineProperty(exports, "Content", {
     return _Layout.Content;
   }
 });
+Object.defineProperty(exports, "FilmSlideshow", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.FilmSlideshow;
+  }
+});
+Object.defineProperty(exports, "MovieGrid", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.MovieGrid;
+  }
+});
+Object.defineProperty(exports, "AboutNdlaFilm", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.AboutNdlaFilm;
+  }
+});
+Object.defineProperty(exports, "FilmMovieSearch", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.FilmMovieSearch;
+  }
+});
+Object.defineProperty(exports, "FilmMovieList", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.FilmMovieList;
+  }
+});
+Object.defineProperty(exports, "AllMoviesAlphabetically", {
+  enumerable: true,
+  get: function get() {
+    return _NDLAFilm.AllMoviesAlphabetically;
+  }
+});
+Object.defineProperty(exports, "DisplayOnPageYOffset", {
+  enumerable: true,
+  get: function get() {
+    return _Animation.DisplayOnPageYOffset;
+  }
+});
+Object.defineProperty(exports, "MediaList", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaList;
+  }
+});
+Object.defineProperty(exports, "MediaListItem", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaListItem;
+  }
+});
+Object.defineProperty(exports, "MediaListItemBody", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaListItemBody;
+  }
+});
+Object.defineProperty(exports, "MediaListItemActions", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaListItemActions;
+  }
+});
+Object.defineProperty(exports, "MediaListItemImage", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaListItemImage;
+  }
+});
+Object.defineProperty(exports, "MediaListItemMeta", {
+  enumerable: true,
+  get: function get() {
+    return _MediaList.MediaListItemMeta;
+  }
+});
+Object.defineProperty(exports, "ContentTypeBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge["default"];
+  }
+});
+Object.defineProperty(exports, "SubjectMaterialBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.SubjectMaterialBadge;
+  }
+});
+Object.defineProperty(exports, "TasksAndActivitiesBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.TasksAndActivitiesBadge;
+  }
+});
+Object.defineProperty(exports, "AssessmentResourcesBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.AssessmentResourcesBadge;
+  }
+});
+Object.defineProperty(exports, "LearningPathBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.LearningPathBadge;
+  }
+});
+Object.defineProperty(exports, "SubjectBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.SubjectBadge;
+  }
+});
+Object.defineProperty(exports, "ExternalLearningResourcesBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.ExternalLearningResourcesBadge;
+  }
+});
+Object.defineProperty(exports, "SourceMaterialBadge", {
+  enumerable: true,
+  get: function get() {
+    return _ContentTypeBadge.SourceMaterialBadge;
+  }
+});
 Object.defineProperty(exports, "SubjectAbout", {
   enumerable: true,
   get: function get() {
@@ -1102,6 +1249,14 @@ var _ResourceGroup = _interopRequireDefault(require("./ResourceGroup"));
 
 var _Layout = _interopRequireWildcard(require("./Layout"));
 
+var _NDLAFilm = require("./NDLAFilm");
+
+var _Animation = require("./Animation");
+
+var _MediaList = require("./MediaList");
+
+var _ContentTypeBadge = _interopRequireWildcard(require("./ContentTypeBadge"));
+
 var _Subject = require("./Subject");
 
 var _ContentCard = _interopRequireDefault(require("./ContentCard"));

package/lib/locale/LocaleProvider.d.ts

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import React from 'react';
+import { ReactNode } from 'react';
 import { Locale } from '../types';
 declare type Props = {
     locale: Locale;
-    children: React.ReactNode;
+    children: ReactNode;
 };
 declare const LocaleProvider: ({ locale, children }: Props) => JSX.Element;
 export default LocaleProvider;

package/lib/shapes.js

@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.CompetenceGoalShape = exports.ContentTypeResultShape = exports.ContentTypeShape = exports.ShortcutShape = exports.ResourceShape = exports.ArticleShape = exports.ContributorShape = exports.FootNoteShape = exports.TopicShape = exports.SubjectShape = exports.LicenseShape = exports.LicenseRightShape = void 0;
+exports.CompetenceGoalShape = exports.ContentTypeResultShape = exports.ContentTypeShape = exports.ResourceShape = exports.ArticleShape = exports.ContributorShape = exports.FootNoteShape = exports.TopicShape = exports.SubjectShape = exports.LicenseShape = exports.LicenseRightShape = void 0;
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -100,15 +100,6 @@ var ResourceShape = _propTypes["default"].shape({
 
 exports.ResourceShape = ResourceShape;
 
-var ShortcutShape = _propTypes["default"].shape({
-  tooltip: _propTypes["default"].string.isRequired,
-  contentType: _propTypes["default"].string.isRequired,
-  url: _propTypes["default"].string.isRequired,
-  count: _propTypes["default"].number.isRequired
-});
-
-exports.ShortcutShape = ShortcutShape;
-
 var ContentTypeShape = _propTypes["default"].oneOf([contentTypes.SUBJECT_MATERIAL, contentTypes.TASKS_AND_ACTIVITIES, contentTypes.ASSESSMENT_RESOURCES, contentTypes.SUBJECT, contentTypes.EXTERNAL_LEARNING_RESOURCES, contentTypes.SOURCE_MATERIAL, contentTypes.LEARNING_PATH, contentTypes.TOPIC, 'beta', 'ndla-film', 'ndla-film has-image']);
 
 exports.ContentTypeShape = ContentTypeShape;

package/lib/types.d.ts

@@ -5,6 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
+import { ReactNode } from 'react';
 declare const locales: readonly ["nb", "nn", "en"];
 export declare type Locale = typeof locales[number];
 export declare type Link = {
@@ -97,6 +98,6 @@ export declare type CompetenceGoalsItemType = {
 };
 export declare type NotionMedia = {
     type: 'video' | 'other';
-    element: React.ReactNode;
+    element: ReactNode;
 };
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "3.3.13",
+  "version": "3.3.17",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -31,18 +31,18 @@
     "types"
   ],
   "dependencies": {
-    "@ndla/button": "^1.1.4",
-    "@ndla/carousel": "^1.1.2",
-    "@ndla/core": "^0.7.2",
-    "@ndla/hooks": "^1.0.7",
-    "@ndla/icons": "^1.4.1",
-    "@ndla/licenses": "^1.1.6",
-    "@ndla/modal": "^1.1.18",
-    "@ndla/safelink": "^1.0.9",
-    "@ndla/switch": "^0.0.32",
-    "@ndla/tabs": "^1.0.15",
-    "@ndla/tooltip": "^0.2.49",
-    "@ndla/util": "^2.0.1",
+    "@ndla/button": "^1.1.7",
+    "@ndla/carousel": "^1.1.5",
+    "@ndla/core": "^0.7.3",
+    "@ndla/hooks": "^1.0.8",
+    "@ndla/icons": "^1.5.0",
+    "@ndla/licenses": "^1.1.9",
+    "@ndla/modal": "^1.1.22",
+    "@ndla/safelink": "^1.0.11",
+    "@ndla/switch": "^0.0.34",
+    "@ndla/tabs": "^1.0.18",
+    "@ndla/tooltip": "^0.2.51",
+    "@ndla/util": "^2.0.2",
     "@reach/menu-button": "^0.12.1",
     "@reach/slider": "^0.12.1",
     "@types/hoist-non-react-statics": "^3.3.1",
@@ -59,7 +59,7 @@
     "jump.js": "^1.0.2",
     "lodash": "^4.17.20",
     "react-bem-helper": "1.4.1",
-    "react-device-detect": "^1.6.2",
+    "react-device-detect": "^2.1.2",
     "react-facebook": "^6.0.15",
     "react-prop-types": "0.4.0",
     "react-sticky-el": "^2.0.6",
@@ -92,5 +92,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "15388cbdbe3dae57fef57a86f58380437b8264fc"
+  "gitHead": "63132efa78e4835f583b9f5bf65f1479effb884a"
 }

package/src/Article/Article.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React, { ComponentType, ReactNode, useEffect, useRef, useState } from 'react';
+import React, { ComponentType, ReactNode, useEffect, useRef, useState, forwardRef, MouseEventHandler } from 'react';
 import BEMHelper from 'react-bem-helper';
 import isString from 'lodash/isString';
 import parse from 'html-react-parser';
@@ -36,7 +36,7 @@ type ArticleWrapperProps = {
   children: ReactNode;
 };
 
-export const ArticleWrapper = React.forwardRef<HTMLElement, ArticleWrapperProps>(({ children, modifier, id }, ref) => (
+export const ArticleWrapper = forwardRef<HTMLElement, ArticleWrapperProps>(({ children, modifier, id }, ref) => (
   <article id={id} {...classes(undefined, modifier)} ref={ref}>
     {children}
   </article>
@@ -115,7 +115,7 @@ type Props = {
   copyPageUrlLink?: string;
   printUrl?: string;
   notions?: { list: NotionProps[]; related: NotionRelatedContent[] };
-  onReferenceClick?: React.MouseEventHandler;
+  onReferenceClick?: MouseEventHandler;
   accessMessage?: string;
 };
 

package/src/Article/ArticleByline.tsx

@@ -6,9 +6,8 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import styled from '@emotion/styled';
-// @ts-ignore
 import Modal, { ModalHeader, ModalBody, ModalCloseButton } from '@ndla/modal';
 // @ts-ignore
 import Button, { CopyButton } from '@ndla/button';
@@ -57,7 +56,7 @@ type Props = {
   suppliers?: SupplierProps[];
   published: string;
   license: string;
-  licenseBox?: React.ReactNode;
+  licenseBox?: ReactNode;
   copyPageUrlLink?: string;
   printUrl?: string;
   locale?: string;

package/src/Article/ArticleNotions.tsx

@@ -6,11 +6,9 @@
  *
  */
 
-import React from 'react';
+import React, { MouseEventHandler } from 'react';
 import styled from '@emotion/styled';
 import { useTranslation } from 'react-i18next';
-
-// @ts-ignore
 import Modal, { ModalHeader, ModalCloseButton, ModalBody } from '@ndla/modal';
 import { mq, breakpoints } from '@ndla/core';
 import { Explanation } from '@ndla/icons/common';
@@ -162,7 +160,7 @@ export type NotionRelatedContent = {
 type ArticleNotionsProps = {
   locale: Locale;
   notions: NotionProps[];
-  onReferenceClick?: React.MouseEventHandler<HTMLButtonElement>;
+  onReferenceClick?: MouseEventHandler<HTMLButtonElement>;
   relatedContent?: NotionRelatedContent[];
   renderMarkdown?: (text: string) => string;
   buttonOffsetRight: number;

package/src/Article/ArticleSideBar.tsx

@@ -1,10 +1,9 @@
-import React from 'react';
+import React, { MouseEvent, ReactNode, RefObject, useEffect, useState } from 'react';
 // @ts-ignore
 import Button, { CopyButton } from '@ndla/button';
 import styled from '@emotion/styled';
 import SafeLink from '@ndla/safelink';
 import { fonts } from '@ndla/core';
-// @ts-ignore
 import Modal, { ModalHeader, ModalBody, ModalCloseButton } from '@ndla/modal';
 import { copyTextToClipboard } from '@ndla/util';
 import { useTranslation } from 'react-i18next';
@@ -47,10 +46,10 @@ const LinkText = styled.div`
 
 type Props = {
   linkToResources?: string;
-  onLinkToResourcesClick?: (e: React.MouseEvent<HTMLElement>) => void;
+  onLinkToResourcesClick?: (e: MouseEvent<HTMLElement>) => void;
   copyPageUrlLink?: string;
-  licenseBox?: React.ReactNode;
-  resourcesRef?: React.RefObject<HTMLElement>;
+  licenseBox?: ReactNode;
+  resourcesRef?: RefObject<HTMLElement>;
 };
 const ArticleSideBar = ({
   linkToResources,
@@ -66,8 +65,8 @@ const ArticleSideBar = ({
     }
   };
 
-  const [hide, setHide] = React.useState(Boolean(false));
-  React.useEffect(() => {
+  const [hide, setHide] = useState(Boolean(false));
+  useEffect(() => {
     window.onscroll = function () {
       if (!resourcesRef?.current) {
         return;
@@ -119,7 +118,7 @@ const ArticleSideBar = ({
           <LinkText>
             <SafeLink
               to={linkToResources}
-              onClick={(e: React.MouseEvent<HTMLElement>) => onLinkToResourcesClick && onLinkToResourcesClick(e)}>
+              onClick={(e: MouseEvent<HTMLElement>) => onLinkToResourcesClick && onLinkToResourcesClick(e)}>
               Hopp til fagressursene
             </SafeLink>
           </LinkText>

package/src/Aside/Aside.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import PropTypes from 'prop-types';
 import BEMHelper from 'react-bem-helper';
 
@@ -19,7 +19,7 @@ interface Props {
   dangerouslySetInnerHTML?: {
     __html: string;
   };
-  children?: React.ReactNode;
+  children?: ReactNode;
   narrowScreen?: boolean;
   wideScreen?: boolean;
 }

package/src/AudioPlayer/AudioPlayer.tsx

@@ -11,7 +11,6 @@ import styled from '@emotion/styled';
 import { breakpoints, colors, fonts, mq, spacing } from '@ndla/core';
 // @ts-ignore
 import Button from '@ndla/button';
-// @ts-ignore
 import { Cross as CrossIcon } from '@ndla/icons/action';
 import { useTranslation } from 'react-i18next';
 import SafeLink from '@ndla/safelink';

package/src/AudioPlayer/SpeechControl.tsx

@@ -9,7 +9,6 @@
 import React, { useRef } from 'react';
 import styled from '@emotion/styled';
 import { colors } from '@ndla/core';
-// @ts-ignore
 import { VolumeUp } from '@ndla/icons/common';
 
 const SpeechPlayButton = styled.button`

package/src/BlogPosts/BlogPost.tsx

@@ -10,9 +10,7 @@ import React from 'react';
 import styled from '@emotion/styled';
 import { LinkProps } from 'react-router-dom';
 import { spacing, colors, fonts, breakpoints, mq, misc, spacingUnit } from '@ndla/core';
-// @ts-ignore
 import { getLicenseByAbbreviation, LicenseByline } from '@ndla/licenses';
-// @ts-ignore
 import { Launch as LaunchIcon } from '@ndla/icons/common';
 import SafeLink from '@ndla/safelink';
 
@@ -164,7 +162,7 @@ type Props = {
   lightLicense?: boolean;
 };
 
-export const BlogPost: React.FunctionComponent<Props> = ({
+export const BlogPost = ({
   text,
   externalLink,
   linkText,
@@ -174,7 +172,7 @@ export const BlogPost: React.FunctionComponent<Props> = ({
   locale,
   oneColumn,
   lightLicense = true,
-}) => {
+}: Props) => {
   const { rights } = getLicenseByAbbreviation(license || '', 'nb');
   return (
     <>

package/src/BlogPosts/BlogPostWrapper.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import styled from '@emotion/styled';
 import { spacing, mq, breakpoints } from '@ndla/core';
 
@@ -38,11 +38,11 @@ const StyledGrid = styled.div<StyledGridProps>`
 `;
 
 interface Props {
-  children: React.ReactNode;
+  children: ReactNode;
   oneColumn?: boolean;
 }
 
-export const BlogPostWrapper: React.FunctionComponent<Props> = ({ children, oneColumn }) => (
+export const BlogPostWrapper = ({ children, oneColumn }: Props) => (
   <StyledGrid oneColumn={oneColumn}>{children}</StyledGrid>
 );