@ndla/ui 3.2.7 → 3.3.2

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

@@ -19,6 +19,7 @@ declare const messages: {
         loggedInAsButton: string;
         role: {
             employee: string;
+            staff: string;
             student: string;
         };
         buttonLogIn: string;

package/lib/locale/messages-en.js

@@ -335,7 +335,7 @@ var messages = _objectSpread(_objectSpread({
     competenceTopicSearchText: 'Find resources',
     competenceSubjectSearchText: 'Go to topic page',
     competenceGoalClose: 'Close',
-    competenceGoalTitle: 'The goal is for the student to be able to:',
+    competenceGoalTitle: 'The pupil is expected to be able to:',
     competenceTabLK06label: 'Competence goal (LK06)',
     competenceTabLK20label: 'Competence goal (LK20)',
     competenceTabCorelabel: 'Core element',
@@ -671,18 +671,18 @@ var messages = _objectSpread(_objectSpread({
   },
   blogPosts: {
     blog1: {
-      text: 'Hva skjer med fagfornyelsen på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland'
     },
     blog2: {
       text: 'Aktiviser elevane med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen'
     }
   },
   editor: {
@@ -815,6 +815,7 @@ var messages = _objectSpread(_objectSpread({
     loggedInAsButton: 'You are logged in as {{role}}',
     role: {
       employee: 'Teacher',
+      staff: 'Staff',
       student: 'Student'
     },
     buttonLogIn: 'Log in with Feide',

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

@@ -19,6 +19,7 @@ declare const messages: {
         loggedInAsButton: string;
         role: {
             employee: string;
+            staff: string;
             student: string;
         };
         buttonLogIn: string;

package/lib/locale/messages-nb.js

@@ -671,18 +671,18 @@ var messages = _objectSpread(_objectSpread({
   },
   blogPosts: {
     blog1: {
-      text: 'Hva skjer med fagfornyelsen på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland'
     },
     blog2: {
       text: 'Aktiviser elevene med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen'
     }
   },
   editor: {
@@ -815,6 +815,7 @@ var messages = _objectSpread(_objectSpread({
     loggedInAsButton: 'Du er pålogget som {{role}}',
     role: {
       employee: 'Lærer',
+      staff: 'Ansatt',
       student: 'Elev'
     },
     buttonLogIn: 'Logg inn med Feide',

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

@@ -19,6 +19,7 @@ declare const messages: {
         loggedInAsButton: string;
         role: {
             employee: string;
+            staff: string;
             student: string;
         };
         buttonLogIn: string;

package/lib/locale/messages-nn.js

@@ -335,7 +335,7 @@ var messages = _objectSpread(_objectSpread({
     competenceTopicSearchText: 'Søk ressursar for tema',
     competenceSubjectSearchText: 'Gå til fagsiden',
     competenceGoalClose: 'Lukk',
-    competenceGoalTitle: 'Målet er at eleven skal kunna:',
+    competenceGoalTitle: 'Målet er at eleven skal kunne:',
     competenceTabLK06label: 'Kompetansemål (LK06)',
     competenceTabLK20label: 'Kompetansemål (LK20)',
     competenceTabCorelabel: 'Kjerneelement',
@@ -671,18 +671,18 @@ var messages = _objectSpread(_objectSpread({
   },
   blogPosts: {
     blog1: {
-      text: 'Kva skjer med fagfornyinga på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland'
     },
     blog2: {
       text: 'Aktiviser elevane med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no'
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen'
     }
   },
   editor: {
@@ -814,7 +814,8 @@ var messages = _objectSpread(_objectSpread({
     loggedInAs: 'Du er pålogga som {{role}}.',
     loggedInAsButton: 'Du er pålogga som {{role}}',
     role: {
-      employee: 'Lærer',
+      employee: 'Lærar',
+      staff: 'Ansatt',
       student: 'Elev'
     },
     buttonLogIn: 'Logg inn med Feide',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "3.2.7",
+  "version": "3.3.2",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -34,15 +34,15 @@
     "@ndla/button": "^1.1.1",
     "@ndla/carousel": "^1.0.6",
     "@ndla/core": "^0.7.2",
-    "@ndla/hooks": "^1.0.6",
+    "@ndla/hooks": "^1.0.7",
     "@ndla/icons": "^1.3.1",
-    "@ndla/licenses": "^1.0.7",
-    "@ndla/modal": "^1.1.14",
-    "@ndla/safelink": "^1.0.5",
+    "@ndla/licenses": "^1.1.0",
+    "@ndla/modal": "^1.1.15",
+    "@ndla/safelink": "^1.0.6",
     "@ndla/switch": "^0.0.32",
-    "@ndla/tabs": "^1.0.11",
+    "@ndla/tabs": "^1.0.12",
     "@ndla/tooltip": "^0.2.49",
-    "@ndla/util": "^2.0.0",
+    "@ndla/util": "^2.0.1",
     "@reach/menu-button": "^0.12.1",
     "@reach/slider": "^0.12.1",
     "@types/hoist-non-react-statics": "^3.3.1",
@@ -92,5 +92,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f06b1ac4310c75ac713fc3ef149a31c9748f4017"
+  "gitHead": "e13324b6d11ce0527ff2e15c4dd9c905ed07e307"
 }

package/src/CopyParagraphButton/CopyParagraphButton.tsx

@@ -6,7 +6,7 @@
  *
  */
 
-import React, { useEffect, useState } from 'react';
+import React, { ReactNode, useEffect, useState } from 'react';
 
 import styled from '@emotion/styled';
 import { Link } from '@ndla/icons/common';
@@ -47,9 +47,27 @@ const ContainerDiv = styled.div`
 interface Props {
   title?: string | null;
   content?: string | null;
+  hydrate?: boolean;
 }
 
-const CopyParagraphButton = ({ title, content }: Props) => {
+interface WrapperProps {
+  title: string;
+  hydrate?: boolean;
+  children: ReactNode;
+}
+
+const WrapperComponent = ({ title, hydrate, children }: WrapperProps) => {
+  if (hydrate) {
+    return <>{children}</>;
+  }
+  return (
+    <ContainerDiv data-header-copy-container data-title={title}>
+      {children}
+    </ContainerDiv>
+  );
+};
+
+const CopyParagraphButton = ({ title, content, hydrate }: Props) => {
   const { t } = useTranslation();
   const [hasCopied, setHasCopied] = useState(false);
   useEffect(() => {
@@ -73,15 +91,16 @@ const CopyParagraphButton = ({ title, content }: Props) => {
 
   const sanitizedTitle = encodeURIComponent(title.replace(/ /g, '-'));
   const tooltip = hasCopied ? t('article.copyPageLinkCopied') : t('article.copyHeaderLink');
+
   return (
-    <ContainerDiv data-header-copy-container data-title={title}>
+    <WrapperComponent hydrate={hydrate} title={title}>
       <IconButton onClick={onCopyClick} data-title={sanitizedTitle}>
         <Tooltip tooltip={tooltip}>
           <Link title={''} />
         </Tooltip>
       </IconButton>
       <h2 id={sanitizedTitle} tabIndex={0} dangerouslySetInnerHTML={{ __html: content || '' }}></h2>
-    </ContainerDiv>
+    </WrapperComponent>
   );
 };
 

package/src/CopyParagraphButton/initCopyParagraphButtons.tsx

@@ -19,8 +19,7 @@ const forEachElement = (selector: string, callback: Function) => {
 const initCopyParagraphButtons = () => {
   forEachElement('[data-header-copy-container]', (el: HTMLElement) => {
     const title = el.getAttribute('data-title');
-    const content = el.innerHTML;
-    ReactDOM.hydrate(<CopyParagraphButton title={title} content={content} />, el);
+    ReactDOM.hydrate(<CopyParagraphButton title={title} content={title} hydrate={true} />, el);
   });
 };
 

package/src/Image/Image.tsx

@@ -7,7 +7,6 @@
  */
 
 import React, { ReactNode } from 'react';
-import defined from 'defined';
 import styled from '@emotion/styled';
 import LazyLoadImage from './LazyLoadImage';
 export interface ImageCrop {
@@ -67,8 +66,8 @@ const Image = ({
   expandButton,
   ...rest
 }: Props) => {
-  const srcSet = defined(rest.srcSet, getSrcSet(src, crop, focalPoint));
-  const fallbackWidth = defined(rest.fallbackWidth, 1024);
+  const srcSet = rest.srcSet ?? getSrcSet(src, crop, focalPoint);
+  const fallbackWidth = rest.fallbackWidth ?? 1024;
   const queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
 
   if (contentType && contentType === 'image/gif') {

package/src/Table/component.tables.scss

@@ -6,7 +6,7 @@
 
 .c-table {
   $scrollbar-height: 8px;
-  margin: 0;
+  margin: 0 0 $spacing--medium 0;
 
   &::-webkit-scrollbar {
     height: $scrollbar-height;
@@ -84,22 +84,12 @@
 
   &__left-shadow {
     left: 0;
-    background: radial-gradient(
-        ellipse at left,
-        rgba(0, 0, 0, 0.2) 0%,
-        rgba(0, 0, 0, 0) 75%
-      )
-      0 center;
+    background: radial-gradient(ellipse at left, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0 center;
   }
 
   &__right-shadow {
     right: 0;
-    background: radial-gradient(
-        ellipse at right,
-        rgba(0, 0, 0, 0.2) 0%,
-        rgba(0, 0, 0, 0) 75%
-      )
-      0 center;
+    background: radial-gradient(ellipse at right, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0) 75%) 0 center;
   }
 }
 

package/src/locale/messages-en.ts

@@ -359,7 +359,7 @@ const messages = {
     competenceTopicSearchText: 'Find resources',
     competenceSubjectSearchText: 'Go to topic page',
     competenceGoalClose: 'Close',
-    competenceGoalTitle: 'The goal is for the student to be able to:',
+    competenceGoalTitle: 'The pupil is expected to be able to:',
     competenceTabLK06label: 'Competence goal (LK06)',
     competenceTabLK20label: 'Competence goal (LK20)',
     competenceTabCorelabel: 'Core element',
@@ -700,18 +700,18 @@ const messages = {
   },
   blogPosts: {
     blog1: {
-      text: 'Hva skjer med fagfornyelsen på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland',
     },
     blog2: {
       text: 'Aktiviser elevane med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen',
     },
   },
   editor: {
@@ -844,6 +844,7 @@ const messages = {
     loggedInAsButton: 'You are logged in as {{role}}',
     role: {
       employee: 'Teacher',
+      staff: 'Staff',
       student: 'Student',
     },
     buttonLogIn: 'Log in with Feide',

package/src/locale/messages-nb.ts

@@ -699,18 +699,18 @@ const messages = {
   },
   blogPosts: {
     blog1: {
-      text: 'Hva skjer med fagfornyelsen på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland',
     },
     blog2: {
       text: 'Aktiviser elevene med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen',
     },
   },
   editor: {
@@ -843,6 +843,7 @@ const messages = {
     loggedInAsButton: 'Du er pålogget som {{role}}',
     role: {
       employee: 'Lærer',
+      staff: 'Ansatt',
       student: 'Elev',
     },
     buttonLogIn: 'Logg inn med Feide',

package/src/locale/messages-nn.ts

@@ -359,7 +359,7 @@ const messages = {
     competenceTopicSearchText: 'Søk ressursar for tema',
     competenceSubjectSearchText: 'Gå til fagsiden',
     competenceGoalClose: 'Lukk',
-    competenceGoalTitle: 'Målet er at eleven skal kunna:',
+    competenceGoalTitle: 'Målet er at eleven skal kunne:',
     competenceTabLK06label: 'Kompetansemål (LK06)',
     competenceTabLK20label: 'Kompetansemål (LK20)',
     competenceTabCorelabel: 'Kjerneelement',
@@ -700,18 +700,18 @@ const messages = {
   },
   blogPosts: {
     blog1: {
-      text: 'Kva skjer med fagfornyinga på NDLA?',
-      externalLink: 'https://blogg.ndla.no/2019/11/hva-skjer-med-fagfornyelsen-pa-ndla/',
+      text: 'Nye fag på NDLA',
+      externalLink: 'https://blogg.ndla.no/2021/12/nye-fag-pa-ndla/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Vibeke Klungland',
     },
     blog2: {
       text: 'Aktiviser elevane med digitale verktøy',
       externalLink: 'https://blogg.ndla.no/2021/09/aktiviser-elevane-med-digitale-verktoy/',
       linkText: 'Fagblogg',
-      license: 'CC-BY-NC-SA-4.0',
-      licenseAuthor: 'Scanpix.no',
+      license: 'CC-BY-SA-4.0',
+      licenseAuthor: 'Tom Knudsen',
     },
   },
   editor: {
@@ -843,7 +843,8 @@ const messages = {
     loggedInAs: 'Du er pålogga som {{role}}.',
     loggedInAsButton: 'Du er pålogga som {{role}}',
     role: {
-      employee: 'Lærer',
+      employee: 'Lærar',
+      staff: 'Ansatt',
       student: 'Elev',
     },
     buttonLogIn: 'Logg inn med Feide',