@ndla/ui 30.0.6 → 30.0.8

package/lib/locale/messages-nn.d.ts

@@ -96,12 +96,14 @@ declare const messages: {
         addToFavourites: string;
         alreadyFavourited: string;
         alreadyInFolder: string;
+        noFolderSelected: string;
         help: string;
         more: string;
         listView: string;
         detailView: string;
         shortView: string;
         myPage: {
+            imageAlt: string;
             confirmDeleteAccount: string;
             confirmDeleteAccountButton: string;
             myPage: string;

package/lib/locale/messages-nn.js

@@ -1024,13 +1024,15 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favorittar',
     addToFavourites: 'Legg til i mine favorittar',
     alreadyFavourited: 'Allereie lagt til i mine favorittar',
-    alreadyInFolder: 'Finst allereie i mappa',
+    alreadyInFolder: 'Finst allereie i mappa. Du kan fortsatt lagre nye emneknaggar.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Hjelp',
     more: 'Fleire val',
     listView: 'Listevisning',
     detailView: 'Detaljert listevisning',
     shortView: 'Kortvisning',
     myPage: {
+      imageAlt: 'Halvnært bilete av jente som held eit nettbrett i hendene. Oppå nettbrettet ligg det ei samling fargeprøver i ulike former og fargar. Grafikk.',
       confirmDeleteAccount: 'Er du sikker på at du vil slette kontoen?',
       confirmDeleteAccountButton: 'Slett konto',
       myPage: 'Mi side',
@@ -1076,7 +1078,7 @@ var messages = _objectSpread(_objectSpread({
       }
     },
     resource: {
-      add: 'Legg til mappe/tag',
+      add: 'Legg til mappe/emneknagg',
       remove: 'Fjern',
       removeTitle: 'Fjern ressurs',
       confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen frå denne mappa?',

package/lib/locale/messages-se.d.ts

@@ -96,12 +96,14 @@ declare const messages: {
         addToFavourites: string;
         alreadyFavourited: string;
         alreadyInFolder: string;
+        noFolderSelected: string;
         help: string;
         more: string;
         listView: string;
         detailView: string;
         shortView: string;
         myPage: {
+            imageAlt: string;
             confirmDeleteAccount: string;
             confirmDeleteAccountButton: string;
             myPage: string;

package/lib/locale/messages-se.js

@@ -1024,13 +1024,15 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Oiddohat',
     addToFavourites: 'Bija mu oiddohiid searvái',
     alreadyFavourited: 'Lea juo biddjon oiddohin',
-    alreadyInFolder: 'Gávdno juo máhpas',
+    alreadyInFolder: 'Finnes allerede i mappen. Du kan fortsatt lagre nye emneknagger.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Veahkki',
     more: 'Eanet válljejumit',
     listView: 'Oppalašlistu',
     detailView: 'Bienalaš oppalašlistu',
     shortView: 'Oanehis listu',
     myPage: {
+      imageAlt: 'Halvnært bilde av jente som holder et nettbrett i hendene. Oppå nettbrettet ligger det ei samling fargeprøver i ulike former og farger. Grafikk.',
       confirmDeleteAccount: 'Leat go sihkar ahte dáhtut sihkkut kontu?',
       confirmDeleteAccountButton: 'Sihko kontu',
       myPage: 'Mu siidu',

package/lib/locale/messages-sma.d.ts

@@ -96,12 +96,14 @@ declare const messages: {
         addToFavourites: string;
         alreadyFavourited: string;
         alreadyInFolder: string;
+        noFolderSelected: string;
         help: string;
         more: string;
         listView: string;
         detailView: string;
         shortView: string;
         myPage: {
+            imageAlt: string;
             confirmDeleteAccount: string;
             confirmDeleteAccountButton: string;
             myPage: string;

package/lib/locale/messages-sma.js

@@ -1024,13 +1024,15 @@ var messages = _objectSpread(_objectSpread({
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
-    alreadyInFolder: 'Finnes allerede i mappen',
+    alreadyInFolder: 'Finnes allerede i mappen. Du kan fortsatt lagre nye emneknagger.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
     detailView: 'Detaljert listevisning',
     shortView: 'Kort visning',
     myPage: {
+      imageAlt: 'Halvnært bilde av jente som holder et nettbrett i hendene. Oppå nettbrettet ligger det ei samling fargeprøver i ulike former og farger. Grafikk.',
       confirmDeleteAccount: 'Er du sikker på at du vil slette kontoen?',
       confirmDeleteAccountButton: 'Slett konto',
       myPage: 'Min side',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "30.0.6",
+  "version": "30.0.8",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -31,22 +31,22 @@
     "types"
   ],
   "dependencies": {
-    "@ndla/article-scripts": "^3.0.7",
-    "@ndla/button": "^4.0.5",
+    "@ndla/article-scripts": "^3.0.8",
+    "@ndla/button": "^5.0.0",
     "@ndla/carousel": "^2.0.5",
     "@ndla/core": "^3.0.0",
-    "@ndla/forms": "^4.0.5",
-    "@ndla/hooks": "^1.1.11",
+    "@ndla/forms": "^4.0.6",
+    "@ndla/hooks": "^1.1.12",
     "@ndla/icons": "^2.0.5",
     "@ndla/licenses": "^6.0.5",
     "@ndla/modal": "^2.0.5",
-    "@ndla/notion": "^4.0.5",
-    "@ndla/safelink": "^3.0.5",
+    "@ndla/notion": "^4.0.6",
+    "@ndla/safelink": "^3.0.6",
     "@ndla/switch": "^1.0.0",
-    "@ndla/tabs": "^2.0.5",
+    "@ndla/tabs": "^2.0.6",
     "@ndla/tooltip": "^3.0.1",
     "@ndla/types-learningpath-api": "^0.0.13",
-    "@ndla/util": "^3.1.5",
+    "@ndla/util": "^3.1.6",
     "@reach/menu-button": "^0.16.2",
     "@reach/slider": "^0.16.0",
     "focus-trap-react": "^8.9.2",
@@ -86,5 +86,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "e62f69c71e7b72b1e346508e8ad483afd36eeffd"
+  "gitHead": "5cb8d6b7fce98737fda299e7f52b70bc3af35d1d"
 }

package/src/Article/Article.tsx

@@ -19,7 +19,6 @@ import { Article as ArticleType, Locale } from '../types';
 import ArticleFootNotes from './ArticleFootNotes';
 import ArticleContent from './ArticleContent';
 import ArticleByline from './ArticleByline';
-import ArticleFavoritesButton from './ArticleFavoritesButton';
 import LayoutItem from '../Layout';
 import ArticleHeaderWrapper from './ArticleHeaderWrapper';
 import ArticleNotions, { NotionRelatedContent } from './ArticleNotions';
@@ -116,6 +115,7 @@ const ArticleFavoritesButtonWrapper = styled.div`
 `;
 
 type Props = {
+  heartButton?: ReactNode;
   article: ArticleType;
   icon?: ReactNode;
   licenseBox?: ReactNode;
@@ -135,8 +135,6 @@ type Props = {
   printUrl?: string;
   notions?: { list: ConceptNotionType[]; related: NotionRelatedContent[] };
   accessMessage?: string;
-  isFavorite?: boolean;
-  onToggleAddToFavorites?: (id: string, add: boolean) => void;
 };
 
 const getArticleContent = (content: any, locale: Locale) => {
@@ -167,8 +165,7 @@ export const Article = ({
   printUrl,
   renderMarkdown,
   accessMessage,
-  onToggleAddToFavorites,
-  isFavorite,
+  heartButton,
 }: Props) => {
   const [articleRef, { entry }] = useIntersectionObserver({
     root: null,
@@ -218,15 +215,8 @@ export const Article = ({
             </MSGboxWrapper>
           )}
           <ArticleHeaderWrapper competenceGoals={competenceGoals} competenceGoalTypes={competenceGoalTypes}>
-            {onToggleAddToFavorites && (
-              <ArticleFavoritesButtonWrapper>
-                <ArticleFavoritesButton
-                  articleId={id}
-                  isFavorite={isFavorite}
-                  onToggleAddToFavorites={onToggleAddToFavorites}
-                />
-              </ArticleFavoritesButtonWrapper>
-            )}
+            {heartButton ? <ArticleFavoritesButtonWrapper>{heartButton}</ArticleFavoritesButtonWrapper> : null}
+
             <ArticleTitle icon={icon} label={messages.label}>
               {title}
             </ArticleTitle>

package/src/Article/index.ts

@@ -12,7 +12,6 @@ import ArticleContent from './ArticleContent';
 import ArticleFootNotes from './ArticleFootNotes';
 import ArticleHeaderWrapper from './ArticleHeaderWrapper';
 import ArticleSideBar from './ArticleSideBar';
-import ArticleFavoritesButton from './ArticleFavoritesButton';
 
 export {
   ArticleByline,
@@ -23,6 +22,5 @@ export {
   ArticleTitle,
   ArticleIntroduction,
   ArticleWrapper,
-  ArticleFavoritesButton,
 };
 export default Article;

package/src/LearningPaths/LearningPathMenu.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React, { useState } from 'react';
+import React, { ReactNode, useState } from 'react';
 import styled from '@emotion/styled';
 import { css } from '@emotion/react';
 import { useTranslation } from 'react-i18next';
@@ -76,7 +76,7 @@ export type StepProps = {
 };
 
 interface Props {
-  onToggleAddToFavorites?: () => void;
+  heartButton?: ReactNode;
   learningsteps: StepProps[];
   name: string;
   lastUpdated: string;
@@ -110,7 +110,7 @@ const LearningPathMenu = ({
   learningPathURL,
   invertedStyle,
   cookies,
-  onToggleAddToFavorites,
+  heartButton,
 }: Props) => {
   const { t } = useTranslation();
   const [isOpen, toggleOpenState] = useState(false);
@@ -136,7 +136,7 @@ const LearningPathMenu = ({
               name={name}
               invertedStyle={invertedStyle}
               id={learningPathId}
-              onToggleAddToFavorites={onToggleAddToFavorites}
+              heartButton={heartButton}
             />
             <LearningPathMenuContent
               learningsteps={learningsteps}

package/src/LearningPaths/LearningPathMenuIntro.tsx

@@ -6,12 +6,11 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import styled from '@emotion/styled';
 import { css } from '@emotion/react';
 import { useTranslation } from 'react-i18next';
 import { colors, spacing, spacingUnit, fonts, typography, mq, breakpoints, animations } from '@ndla/core';
-import { ArticleFavoritesButton } from '../Article';
 
 const StyledInfoHeader = styled.p`
   ${typography.smallHeading}
@@ -104,20 +103,18 @@ interface Props {
   isOpen: boolean;
   invertedStyle?: boolean;
   name: string;
-  onToggleAddToFavorites?: () => void;
   id: number;
+  heartButton?: ReactNode;
 }
 
-const LearningPathMenuIntro = ({ isOpen, name, invertedStyle, onToggleAddToFavorites, id }: Props) => {
+const LearningPathMenuIntro = ({ isOpen, name, invertedStyle, heartButton }: Props) => {
   const { t } = useTranslation();
   return (
     <StyledMenuIntro isOpen={isOpen} invertedStyle={invertedStyle}>
       <div>
         <StyledRow>
           <StyledInfoHeader>{t('learningPath.youAreInALearningPath')}</StyledInfoHeader>
-          {onToggleAddToFavorites && (
-            <ArticleFavoritesButton onToggleAddToFavorites={onToggleAddToFavorites} articleId={id.toString()} />
-          )}
+          {heartButton}
         </StyledRow>
         <StyledIntroHeader>{name}</StyledIntroHeader>
       </div>

package/src/ResourceGroup/ResourceGroup.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import styled from '@emotion/styled';
 import { fonts, spacing } from '@ndla/core';
 
@@ -36,8 +36,7 @@ const StyledHeading = styled.h1`
 type Props = {
   invertedStyle?: boolean;
   toggleAdditionalResources: () => void;
-  onToggleAddToFavorites: (id: string) => void;
-  showAddToFavoriteButton: boolean;
+  heartButton?: (path: string) => ReactNode;
 };
 
 const ResourceGroup = ({
@@ -47,8 +46,7 @@ const ResourceGroup = ({
   toggleAdditionalResources,
   contentType,
   invertedStyle,
-  onToggleAddToFavorites,
-  showAddToFavoriteButton = false,
+  heartButton,
 }: Props & ResourceListProps) => (
   <Wrapper>
     {title && (
@@ -63,8 +61,7 @@ const ResourceGroup = ({
         showAdditionalResources={showAdditionalResources}
         contentType={contentType}
         resources={resources}
-        onToggleAddToFavorites={onToggleAddToFavorites}
-        showAddToFavoriteButton={showAddToFavoriteButton}
+        heartButton={heartButton}
       />
     ) : null}
   </Wrapper>

package/src/ResourceGroup/ResourceItem.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { useTranslation } from 'react-i18next';
 import styled from '@emotion/styled';
 import { css } from '@emotion/react';
@@ -15,7 +15,6 @@ import SafeLink from '@ndla/safelink';
 import { Additional, Core, HumanMaleBoard } from '@ndla/icons/common';
 import { breakpoints, colors, fonts, mq, spacing } from '@ndla/core';
 import Tooltip from '@ndla/tooltip';
-import { ArticleFavoritesButton } from '../Article';
 import { Resource } from '../types';
 import ContentTypeBadge from '../ContentTypeBadge';
 import * as contentTypes from '../model/ContentType';
@@ -228,9 +227,7 @@ type Props = {
   extraBottomMargin?: boolean;
   showAdditionalResources?: boolean;
   access?: 'teacher';
-  isFavorite?: boolean;
-  onToggleAddToFavorites: (id: string) => void;
-  showAddToFavoriteButton: boolean;
+  heartButton?: (path: string) => ReactNode;
 };
 
 const ResourceItem = ({
@@ -245,9 +242,7 @@ const ResourceItem = ({
   extraBottomMargin,
   showAdditionalResources,
   access,
-  onToggleAddToFavorites,
-  isFavorite,
-  showAddToFavoriteButton,
+  heartButton,
 }: Props & Resource) => {
   const { t } = useTranslation();
   const hidden = additional ? !showAdditionalResources : false;
@@ -310,13 +305,7 @@ const ResourceItem = ({
             )}
           </>
         )}
-        {showAddToFavoriteButton && (
-          <ArticleFavoritesButton
-            isFavorite={isFavorite}
-            articleId={id}
-            onToggleAddToFavorites={() => onToggleAddToFavorites(id)}
-          />
-        )}
+        {heartButton?.(path)}
       </TypeWrapper>
     </ListElement>
   );

package/src/ResourceGroup/ResourceList.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React from 'react';
+import React, { ReactNode } from 'react';
 import styled from '@emotion/styled';
 import { css } from '@emotion/react';
 import { keyframes } from '@emotion/react';
@@ -44,22 +44,20 @@ const StyledResourceList = styled.ul<StyledListProps>`
 
 export type ResourceListProps = {
   resources: Resource[];
-  onClick: () => void;
+  onClick?: () => void;
   contentType?: string;
   title?: string;
   showAdditionalResources?: boolean;
-  onToggleAddToFavorites: (id: string) => void;
-  showAddToFavoriteButton: boolean;
+  heartButton?: (path: string) => ReactNode;
 };
 
 const ResourceList = ({
   resources,
   onClick,
-  onToggleAddToFavorites,
   contentType,
   title,
   showAdditionalResources,
-  showAddToFavoriteButton,
+  heartButton,
 }: ResourceListProps) => {
   const { t } = useTranslation();
   const renderAdditionalResourceTrigger =
@@ -76,8 +74,7 @@ const ResourceList = ({
             key={id}
             contentType={contentType}
             showAdditionalResources={showAdditionalResources}
-            showAddToFavoriteButton={showAddToFavoriteButton}
-            onToggleAddToFavorites={onToggleAddToFavorites}
+            heartButton={heartButton}
             {...resource}
             contentTypeDescription={
               resource.additional ? t('resource.tooltipAdditionalTopic') : t('resource.tooltipCoreTopic')

package/src/TagSelector/Control.tsx

@@ -19,6 +19,7 @@ const StyledTagSelectorControl = styled.div`
   align-items: center;
   margin: ${spacing.xxsmall};
 
+  overflow: auto;
   overflow: overlay;
   ${utils.scrollbar}
 `;

package/src/TagSelector/MenuList.tsx

@@ -13,6 +13,7 @@ import { MenuListProps } from 'react-select';
 import { TagType } from './types';
 
 export const StyledMenuList = styled.div`
+  overflow: auto;
   overflow: overlay;
   ${utils.scrollbar}
   display: flex;

package/src/TreeStructure/TreeStructure.tsx

@@ -61,6 +61,7 @@ const ScrollableDiv = styled.div<ScrollableDivProps>`
   ${({ type }) =>
     type === 'picker' &&
     css`
+      overflow: auto;
       overflow: overlay;
       ${utils.scrollbar}
     `}

package/src/index.ts

@@ -24,7 +24,6 @@ export {
   ArticleHeaderWrapper,
   ArticleSideBar,
   default as Article,
-  ArticleFavoritesButton,
 } from './Article';
 
 export { CompetenceGoalsDialog } from './CompetenceGoals';

package/src/locale/messages-en.ts

@@ -1065,13 +1065,16 @@ const messages = {
     favourites: 'Favourites',
     addToFavourites: 'Add to my favourites',
     alreadyFavourited: 'Already in my favourites',
-    alreadyInFolder: 'Already in folder',
+    alreadyInFolder: 'Already in folder. You can still save new tags.',
+    noFolderSelected: 'Select or create a new folder to save the resource.',
     help: 'Help',
     more: 'More options',
     listView: 'List view',
     detailView: 'Detailed listview',
     shortView: 'Card view',
     myPage: {
+      imageAlt:
+        'Medium close-up of girl holding a tablet. On top of the tablet there are colour samples in different shapes and colours. Graphic image.',
       confirmDeleteAccount: 'Are you sure you want to delete your account?',
       confirmDeleteAccountButton: 'Delete account',
       myPage: 'My page',

package/src/locale/messages-nb.ts

@@ -1062,13 +1062,16 @@ const messages = {
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
-    alreadyInFolder: 'Finnes allerede i mappen',
+    alreadyInFolder: 'Finnes allerede i mappen. Du kan fortsatt lagre nye emneknagger.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
     detailView: 'Detaljert listevisning',
     shortView: 'Kort visning',
     myPage: {
+      imageAlt:
+        'Halvnært bilde av jente som holder et nettbrett i hendene. Oppå nettbrettet ligger det ei samling fargeprøver i ulike former og farger. Grafikk.',
       confirmDeleteAccount: 'Er du sikker på at du vil slette kontoen?',
       confirmDeleteAccountButton: 'Slett konto',
       myPage: 'Min side',

package/src/locale/messages-nn.ts

@@ -1063,13 +1063,16 @@ const messages = {
     favourites: 'Favorittar',
     addToFavourites: 'Legg til i mine favorittar',
     alreadyFavourited: 'Allereie lagt til i mine favorittar',
-    alreadyInFolder: 'Finst allereie i mappa',
+    alreadyInFolder: 'Finst allereie i mappa. Du kan fortsatt lagre nye emneknaggar.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Hjelp',
     more: 'Fleire val',
     listView: 'Listevisning',
     detailView: 'Detaljert listevisning',
     shortView: 'Kortvisning',
     myPage: {
+      imageAlt:
+        'Halvnært bilete av jente som held eit nettbrett i hendene. Oppå nettbrettet ligg det ei samling fargeprøver i ulike former og fargar. Grafikk.',
       confirmDeleteAccount: 'Er du sikker på at du vil slette kontoen?',
       confirmDeleteAccountButton: 'Slett konto',
       myPage: 'Mi side',
@@ -1112,7 +1115,7 @@ const messages = {
       },
     },
     resource: {
-      add: 'Legg til mappe/tag',
+      add: 'Legg til mappe/emneknagg',
       remove: 'Fjern',
       removeTitle: 'Fjern ressurs',
       confirmRemove: 'Er du sikker på at du ønsker å fjerne ressursen frå denne mappa?',

package/src/locale/messages-se.ts

@@ -1063,7 +1063,8 @@ const messages = {
     favourites: 'Oiddohat',
     addToFavourites: 'Bija mu oiddohiid searvái',
     alreadyFavourited: 'Lea juo biddjon oiddohin',
-    alreadyInFolder: 'Gávdno juo máhpas',
+    alreadyInFolder: 'Finnes allerede i mappen. Du kan fortsatt lagre nye emneknagger.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Veahkki',
     more: 'Eanet válljejumit',
     listView: 'Oppalašlistu',
@@ -1071,6 +1072,8 @@ const messages = {
     shortView: 'Oanehis listu',
 
     myPage: {
+      imageAlt:
+        'Halvnært bilde av jente som holder et nettbrett i hendene. Oppå nettbrettet ligger det ei samling fargeprøver i ulike former og farger. Grafikk.',
       confirmDeleteAccount: 'Leat go sihkar ahte dáhtut sihkkut kontu?',
       confirmDeleteAccountButton: 'Sihko kontu',
       myPage: 'Mu siidu',

package/src/locale/messages-sma.ts

@@ -1064,13 +1064,16 @@ const messages = {
     favourites: 'Favoritter',
     addToFavourites: 'Legg til i mine favoritter',
     alreadyFavourited: 'Allerede lagt til i mine favoritter',
-    alreadyInFolder: 'Finnes allerede i mappen',
+    alreadyInFolder: 'Finnes allerede i mappen. Du kan fortsatt lagre nye emneknagger.',
+    noFolderSelected: 'Velg eller opprett ny mappe for å lagre ressursen',
     help: 'Hjelp',
     more: 'Flere valg',
     listView: 'Listevisning',
     detailView: 'Detaljert listevisning',
     shortView: 'Kort visning',
     myPage: {
+      imageAlt:
+        'Halvnært bilde av jente som holder et nettbrett i hendene. Oppå nettbrettet ligger det ei samling fargeprøver i ulike former og farger. Grafikk.',
       confirmDeleteAccount: 'Er du sikker på at du vil slette kontoen?',
       confirmDeleteAccountButton: 'Slett konto',
       myPage: 'Min side',

package/es/Article/ArticleFavoritesButton.js

@@ -1,42 +0,0 @@
-import { jsx as _jsx } from "@emotion/react/jsx-runtime";
-
-/**
- * Copyright (c) 2022-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-import React from 'react';
-import { IconButtonDualStates } from '@ndla/button';
-import { Heart, HeartOutline } from '@ndla/icons/action';
-import Tooltip from '@ndla/tooltip';
-import { useTranslation } from 'react-i18next';
-export var ArticleFavoritesButton = function ArticleFavoritesButton(_ref) {
-  var isFavorite = _ref.isFavorite,
-      onToggleAddToFavorites = _ref.onToggleAddToFavorites,
-      articleId = _ref.articleId;
-
-  var _useTranslation = useTranslation(),
-      t = _useTranslation.t;
-
-  var removeFromFavoritesLabel = t('myNdla.resource.addToMyNdla');
-  var addToFavoritesLabel = t('myNdla.resource.addedToMyNdla');
-  return _jsx(Tooltip, {
-    tooltip: isFavorite ? addToFavoritesLabel : removeFromFavoritesLabel,
-    children: _jsx(IconButtonDualStates, {
-      ariaLabelActive: t('myNdla.alreadyFavourited'),
-      ariaLabelInActive: t('myNdla.addToFavourites'),
-      activeIcon: _jsx(Heart, {}),
-      inactiveIcon: _jsx(HeartOutline, {}),
-      active: isFavorite,
-      size: "small",
-      colorTheme: "light",
-      variant: "ghost",
-      onClick: function onClick() {
-        return onToggleAddToFavorites(articleId, !isFavorite);
-      }
-    })
-  });
-};
-export default ArticleFavoritesButton;

package/lib/Article/ArticleFavoritesButton.d.ts

@@ -1,14 +0,0 @@
-/**
- * Copyright (c) 2022-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-export interface Props {
-    isFavorite?: boolean;
-    onToggleAddToFavorites: (id: string, add: boolean) => void;
-    articleId: string;
-}
-export declare const ArticleFavoritesButton: ({ isFavorite, onToggleAddToFavorites, articleId }: Props) => import("@emotion/react/types/jsx-namespace").EmotionJSX.Element;
-export default ArticleFavoritesButton;