@ndla/ui 50.15.3 → 51.0.0

package/lib/Footer/FooterBlock.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) 2016-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+/// <reference types="react" />
+export declare const FooterBlock: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export default FooterBlock;

package/lib/Footer/FooterBlock.js

@@ -0,0 +1,24 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.FooterBlock = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _core = require("@ndla/core");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+/**
+ * Copyright (c) 2016-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const FooterBlock = exports.FooterBlock = /*#__PURE__*/(0, _base.default)("div", {
+  target: "eu3vydv0",
+  label: "FooterBlock"
+})("position:relative;display:flex;flex-direction:column;align-items:center;gap:", _core.spacing.large, ";color:", _core.colors.white, ";z-index:", _core.stackOrder.offsetSingle, ";padding:", _core.spacing.large, " ", _core.spacing.large, " ", _core.spacing.xlarge, ";background:", _core.colors.brand.dark, ";", _core.mq.range({
+  from: _core.breakpoints.wide
+}), "{padding:", _core.spacing.large, " 170px ", _core.spacing.xlarge, ";}>*{max-width:1100px;}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkZvb3RlckJsb2NrLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFXcUMiLCJmaWxlIjoiRm9vdGVyQmxvY2sudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMTYtcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IGJyZWFrcG9pbnRzLCBjb2xvcnMsIG1xLCBzcGFjaW5nLCBzdGFja09yZGVyIH0gZnJvbSBcIkBuZGxhL2NvcmVcIjtcblxuZXhwb3J0IGNvbnN0IEZvb3RlckJsb2NrID0gc3R5bGVkLmRpdmBcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogY29sdW1uO1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBnYXA6ICR7c3BhY2luZy5sYXJnZX07XG4gIGNvbG9yOiAke2NvbG9ycy53aGl0ZX07XG4gIHotaW5kZXg6ICR7c3RhY2tPcmRlci5vZmZzZXRTaW5nbGV9O1xuICBwYWRkaW5nOiAke3NwYWNpbmcubGFyZ2V9ICR7c3BhY2luZy5sYXJnZX0gJHtzcGFjaW5nLnhsYXJnZX07XG4gIGJhY2tncm91bmQ6ICR7Y29sb3JzLmJyYW5kLmRhcmt9O1xuICAke21xLnJhbmdlKHsgZnJvbTogYnJlYWtwb2ludHMud2lkZSB9KX0ge1xuICAgIHBhZGRpbmc6ICR7c3BhY2luZy5sYXJnZX0gMTcwcHggJHtzcGFjaW5nLnhsYXJnZX07XG4gIH1cbiAgPiAqIHtcbiAgICBtYXgtd2lkdGg6IDExMDBweDtcbiAgfVxuYDtcblxuZXhwb3J0IGRlZmF1bHQgRm9vdGVyQmxvY2s7XG4iXX0= */"));
+var _default = exports.default = FooterBlock;

package/lib/Footer/index.d.ts

@@ -5,7 +5,4 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import { EditorName } from "./EditorName";
-import Footer from "./Footer";
-import { FooterText } from "./FooterText";
-export { Footer, FooterText, EditorName };
+export { FooterBlock } from "./FooterBlock";

package/lib/Footer/index.js

@@ -3,25 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "EditorName", {
+Object.defineProperty(exports, "FooterBlock", {
   enumerable: true,
   get: function () {
-    return _EditorName.EditorName;
+    return _FooterBlock.FooterBlock;
   }
 });
-Object.defineProperty(exports, "Footer", {
-  enumerable: true,
-  get: function () {
-    return _Footer.default;
-  }
-});
-Object.defineProperty(exports, "FooterText", {
-  enumerable: true,
-  get: function () {
-    return _FooterText.FooterText;
-  }
-});
-var _EditorName = require("./EditorName");
-var _Footer = _interopRequireDefault(require("./Footer"));
-var _FooterText = require("./FooterText");
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _FooterBlock = require("./FooterBlock");

package/lib/Subject/index.d.ts

@@ -5,5 +5,4 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-export { default as SubjectHeader } from "./SubjectHeader";
 export { default as SubjectBanner } from "./SubjectBanner";

package/lib/Subject/index.js

@@ -9,12 +9,5 @@ Object.defineProperty(exports, "SubjectBanner", {
     return _SubjectBanner.default;
   }
 });
-Object.defineProperty(exports, "SubjectHeader", {
-  enumerable: true,
-  get: function () {
-    return _SubjectHeader.default;
-  }
-});
-var _SubjectHeader = _interopRequireDefault(require("./SubjectHeader"));
 var _SubjectBanner = _interopRequireDefault(require("./SubjectBanner"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/index.d.ts

@@ -7,7 +7,7 @@
  */
 export { ExpandableBox, ExpandableBoxSummary } from "./ExpandableBox";
 export { default as FramedContent } from "./FramedContent";
-export { ConceptNotionV2, ImageEmbed, AudioEmbed, H5pEmbed, ExternalEmbed, IframeEmbed, FootnoteEmbed, BrightcoveEmbed, ContentLinkEmbed, RelatedContentEmbed, ConceptEmbed, ConceptListEmbed, UnknownEmbed, InlineConcept, BlockConcept, UuDisclaimerEmbed, CopyrightEmbed, CodeEmbed, } from "./Embed";
+export { ConceptNotionV2, ImageEmbed, getCrop, getFocalPoint, AudioEmbed, H5pEmbed, ExternalEmbed, IframeEmbed, FootnoteEmbed, BrightcoveEmbed, ContentLinkEmbed, RelatedContentEmbed, ConceptEmbed, ConceptListEmbed, UnknownEmbed, InlineConcept, BlockConcept, UuDisclaimerEmbed, CopyrightEmbed, CodeEmbed, } from "./Embed";
 export { LicenseLink } from "./LicenseByline";
 export { ArticleByline, ArticleFootNotes, ArticleIntroduction, ArticleTitle, ArticleWrapper, ArticleHeaderWrapper, default as Article, } from "./Article";
 export { getPossiblyRelativeUrl } from "./utils/relativeUrl";
@@ -26,7 +26,7 @@ export type { ImageCrop, ImageFocalPoint } from "./Image";
 export type { HeroContentType } from "./Hero";
 export { SubjectMaterialHero, TasksAndActivitiesHero, AssessmentResourcesHero, SubjectHero, SourceMaterialHero, Hero, NdlaFilmHero, ConceptHero, HeroContent, } from "./Hero";
 export { FilterButtons, ToggleItem } from "./Filter";
-export { Footer, EditorName, FooterText } from "./Footer";
+export { FooterBlock } from "./Footer";
 export { Figure } from "./Figure";
 export type { FigureType } from "./Figure";
 export { LanguageSelector } from "./LanguageSelector";
@@ -62,7 +62,7 @@ export { FilmSlideshow, MovieGrid, FilmMovieSearch, FilmMovieList, AllMoviesAlph
 export { MediaList, MediaListItem, MediaListItemBody, MediaListItemActions, MediaListItemImage, MediaListItemMeta, } from "./MediaList";
 export type { ItemType } from "./MediaList";
 export { default as ContentTypeBadge, SubjectMaterialBadge, TasksAndActivitiesBadge, AssessmentResourcesBadge, LearningPathBadge, SubjectBadge, SourceMaterialBadge, ConceptBadge, } from "./ContentTypeBadge";
-export { SubjectHeader, SubjectBanner } from "./Subject";
+export { SubjectBanner } from "./Subject";
 export { default as CopyParagraphButton } from "./CopyParagraphButton";
 export { default as ContentPlaceholder } from "./ContentPlaceholder";
 export { Notion } from "./Notion";

package/lib/index.js

@@ -255,12 +255,6 @@ Object.defineProperty(exports, "DefinitionTerm", {
     return _DefinitionList.DefinitionTerm;
   }
 });
-Object.defineProperty(exports, "EditorName", {
-  enumerable: true,
-  get: function () {
-    return _Footer.EditorName;
-  }
-});
 Object.defineProperty(exports, "ErrorMessage", {
   enumerable: true,
   get: function () {
@@ -357,16 +351,10 @@ Object.defineProperty(exports, "FolderInput", {
     return _MyNdla.FolderInput;
   }
 });
-Object.defineProperty(exports, "Footer", {
-  enumerable: true,
-  get: function () {
-    return _Footer.Footer;
-  }
-});
-Object.defineProperty(exports, "FooterText", {
+Object.defineProperty(exports, "FooterBlock", {
   enumerable: true,
   get: function () {
-    return _Footer.FooterText;
+    return _Footer.FooterBlock;
   }
 });
 Object.defineProperty(exports, "FootnoteEmbed", {
@@ -855,12 +843,6 @@ Object.defineProperty(exports, "SubjectBanner", {
     return _Subject.SubjectBanner;
   }
 });
-Object.defineProperty(exports, "SubjectHeader", {
-  enumerable: true,
-  get: function () {
-    return _Subject.SubjectHeader;
-  }
-});
 Object.defineProperty(exports, "SubjectHero", {
   enumerable: true,
   get: function () {
@@ -969,6 +951,18 @@ Object.defineProperty(exports, "formatNestedMessages", {
     return _i18n.formatNestedMessages;
   }
 });
+Object.defineProperty(exports, "getCrop", {
+  enumerable: true,
+  get: function () {
+    return _Embed.getCrop;
+  }
+});
+Object.defineProperty(exports, "getFocalPoint", {
+  enumerable: true,
+  get: function () {
+    return _Embed.getFocalPoint;
+  }
+});
 Object.defineProperty(exports, "getMastheadHeight", {
   enumerable: true,
   get: function () {

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

@@ -520,6 +520,7 @@ declare const messages: {
             tips: string;
             vacancies: string;
         };
+        otherLanguages: string;
     };
     contentTypes: {
         all: string;

package/lib/locale/messages-en.js

@@ -536,7 +536,8 @@ const messages = {
       blog: "Blog",
       tips: "Tips to students",
       vacancies: "Vacancies"
-    }
+    },
+    otherLanguages: "Other languages"
   },
   contentTypes: {
     all: "All",

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

@@ -520,6 +520,7 @@ declare const messages: {
             tips: string;
             vacancies: string;
         };
+        otherLanguages: string;
     };
     contentTypes: {
         all: string;

package/lib/locale/messages-nb.js

@@ -536,7 +536,8 @@ const messages = {
       blog: "Fagblogg",
       tips: "Tips til elever",
       vacancies: "Ledige stillinger"
-    }
+    },
+    otherLanguages: "Andre språk"
   },
   contentTypes: {
     all: "Alle",

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

@@ -520,6 +520,7 @@ declare const messages: {
             tips: string;
             vacancies: string;
         };
+        otherLanguages: string;
     };
     contentTypes: {
         all: string;

package/lib/locale/messages-nn.js

@@ -536,7 +536,8 @@ const messages = {
       blog: "Fagblogg",
       tips: "Tips til elevar",
       vacancies: "Ledige stillingar"
-    }
+    },
+    otherLanguages: "Andre språk"
   },
   contentTypes: {
     all: "Alle",

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

@@ -520,6 +520,7 @@ declare const messages: {
             tips: string;
             vacancies: string;
         };
+        otherLanguages: string;
     };
     contentTypes: {
         all: string;

package/lib/locale/messages-se.js

@@ -536,7 +536,8 @@ const messages = {
       blog: "Fágablogga",
       tips: "Cavgileapmi ohppiide",
       vacancies: "Rabas virggit"
-    }
+    },
+    otherLanguages: "Andre språk"
   },
   contentTypes: {
     all: "Buot",

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

@@ -520,6 +520,7 @@ declare const messages: {
             tips: string;
             vacancies: string;
         };
+        otherLanguages: string;
     };
     contentTypes: {
         all: string;

package/lib/locale/messages-sma.js

@@ -536,7 +536,8 @@ const messages = {
       blog: "Faageblogge",
       tips: "Tipsh learoehkidie",
       vacancies: "Gaavnoes barkoeh"
-    }
+    },
+    otherLanguages: "Andre språk"
   },
   contentTypes: {
     all: "Alle",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "50.15.3",
+  "version": "51.0.0",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -82,5 +82,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "18d8228e549466cbe95555b84e66960ad4c2e590"
+  "gitHead": "4c02a36e29e56aef17cf835b383799a1898b99e3"
 }

package/src/Embed/ImageEmbed.tsx

@@ -279,6 +279,7 @@ const ExpandButton = ({ size, expanded, bylineHidden, onExpand, onHideByline }:
       <button
         type="button"
         css={figureActionIndicatorStyle}
+        data-byline-button=""
         aria-label={t(`license.images.itemImage.zoom${expanded ? "Out" : ""}ImageButtonLabel`)}
         onClick={onExpand}
       >

package/src/Embed/index.ts

@@ -6,7 +6,7 @@
  *
  */
 
-export { default as ImageEmbed } from "./ImageEmbed";
+export { default as ImageEmbed, getCrop, getFocalPoint } from "./ImageEmbed";
 export { default as AudioEmbed } from "./AudioEmbed";
 export { default as H5pEmbed } from "./H5pEmbed";
 export { default as ExternalEmbed } from "./ExternalEmbed";

package/src/Footer/Footer.stories.tsx

@@ -7,81 +7,12 @@
  */
 
 import { Meta, StoryObj } from "@storybook/react";
-import { EmailOutline, Facebook, Instagram, LinkedIn, Share, Youtube } from "@ndla/icons/common";
-import { EditorName } from "./EditorName";
-import Footer from "./Footer";
-import { FooterText } from "./FooterText";
-
-const mockCommonLinks = [
-  {
-    to: "https://ndla.no/about/om-ndla",
-    text: "Om NDLA",
-    external: false,
-  },
-  {
-    to: "https://ndla.no/about/about-ndla",
-    text: "About NDLA",
-    external: false,
-  },
-  {
-    to: "https://blogg.ndla.no/",
-    text: "NDLA fagblogg",
-    external: true,
-  },
-];
-
-const mockFooterLinks = [
-  {
-    to: "https://www.facebook.com/ndla.no",
-    text: "NDLA på Facebook",
-    icon: <Facebook />,
-  },
-  {
-    to: "https://instagram.com/ndla_no/",
-    text: "NDLA på Instagram",
-    icon: <Instagram />,
-  },
-  {
-    to: "https://www.linkedin.com/company/ndla/",
-    text: "NDLA på LinkedIn",
-    icon: <LinkedIn />,
-  },
-  {
-    to: "https://www.youtube.com/channel/UCBlt6T8B0mmvDh3k5q7EhsA",
-    text: "NDLA på YouTube",
-    icon: <Youtube />,
-  },
-  {
-    to: "https://ndla.us6.list-manage.com/subscribe?u=99d41bbb28de0128915adebed&id=9a1d3ad1ea",
-    text: "Meld deg på vårt nyhetsbrev",
-    icon: <EmailOutline />,
-  },
-  {
-    to: "#",
-    text: "Del denne siden",
-    icon: <Share />,
-  },
-];
-
-const privacyLinks = [
-  {
-    label: "Personvernerklæring",
-    url: "https://ndla.no/article/personvernerklaering",
-  },
-  {
-    label: "Erklæring om informasjonskapsler",
-    url: "https://ndla.no/article/erklaering-for-informasjonskapsler",
-  },
-  {
-    label: "Tilgjengelighetserklæring",
-    url: "https://uustatus.no/nn/erklaringer/publisert/8cefdf3d-3272-402a-907b-689ddfc9bba7",
-  },
-];
+import FooterBlock from "./FooterBlock";
 
 export default {
-  title: "Components/Footer",
+  title: "Components/FooterBlock",
   tags: ["autodocs"],
-  component: Footer,
+  component: FooterBlock,
   parameters: {
     inlineStories: true,
   },
@@ -89,10 +20,7 @@ export default {
   args: {
     children: (
       <>
-        <FooterText>
-          <EditorName title="Ansvarlig redaktør:" name="Sigurd Trageton" />
-        </FooterText>
-        <FooterText>Nettstedet er utarbeidet av NDLA med åpen kildekode.</FooterText>
+        <p>Litt tekst i footer!</p>
       </>
     ),
   },
@@ -101,33 +29,7 @@ export default {
     languageSelector: { control: false },
     auth: { control: false },
   },
-  render: (args) => <Footer {...args}></Footer>,
-} as Meta<typeof Footer>;
-
-export const Default: StoryObj<typeof Footer> = {};
-
-export const WithContentAndLinks: StoryObj<typeof Footer> = {
-  args: {
-    privacyLinks: privacyLinks,
-    commonLinks: mockCommonLinks,
-    links: mockFooterLinks,
-  },
-};
-
-export const WithoutContent: StoryObj<typeof Footer> = {
-  args: {
-    children: undefined,
-    commonLinks: mockCommonLinks,
-    links: mockFooterLinks,
-    privacyLinks: privacyLinks,
-  },
-};
+  render: (args) => <FooterBlock {...args}></FooterBlock>,
+} as Meta<typeof FooterBlock>;
 
-export const WithAuthBlock: StoryObj<typeof Footer> = {
-  args: {
-    privacyLinks: privacyLinks,
-    commonLinks: mockCommonLinks,
-    links: mockFooterLinks,
-    auth: <div>Auth info can be placed down here</div>,
-  },
-};
+export const Default: StoryObj<typeof FooterBlock> = {};

package/src/Footer/FooterBlock.tsx

@@ -0,0 +1,30 @@
+/**
+ * Copyright (c) 2016-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 styled from "@emotion/styled";
+import { breakpoints, colors, mq, spacing, stackOrder } from "@ndla/core";
+
+export const FooterBlock = styled.div`
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: ${spacing.large};
+  color: ${colors.white};
+  z-index: ${stackOrder.offsetSingle};
+  padding: ${spacing.large} ${spacing.large} ${spacing.xlarge};
+  background: ${colors.brand.dark};
+  ${mq.range({ from: breakpoints.wide })} {
+    padding: ${spacing.large} 170px ${spacing.xlarge};
+  }
+  > * {
+    max-width: 1100px;
+  }
+`;
+
+export default FooterBlock;

package/src/Footer/index.ts

@@ -6,8 +6,4 @@
  *
  */
 
-import { EditorName } from "./EditorName";
-import Footer from "./Footer";
-import { FooterText } from "./FooterText";
-
-export { Footer, FooterText, EditorName };
+export { FooterBlock } from "./FooterBlock";

package/src/Subject/index.ts

@@ -6,5 +6,4 @@
  *
  */
 
-export { default as SubjectHeader } from "./SubjectHeader";
 export { default as SubjectBanner } from "./SubjectBanner";

package/src/index.ts

@@ -14,6 +14,8 @@ export { default as FramedContent } from "./FramedContent";
 export {
   ConceptNotionV2,
   ImageEmbed,
+  getCrop,
+  getFocalPoint,
   AudioEmbed,
   H5pEmbed,
   ExternalEmbed,
@@ -84,7 +86,7 @@ export {
 
 export { FilterButtons, ToggleItem } from "./Filter";
 
-export { Footer, EditorName, FooterText } from "./Footer";
+export { FooterBlock } from "./Footer";
 
 export { Figure } from "./Figure";
 export type { FigureType } from "./Figure";
@@ -179,7 +181,7 @@ export {
   ConceptBadge,
 } from "./ContentTypeBadge";
 
-export { SubjectHeader, SubjectBanner } from "./Subject";
+export { SubjectBanner } from "./Subject";
 
 export { default as CopyParagraphButton } from "./CopyParagraphButton";
 

package/src/locale/messages-en.ts

@@ -540,6 +540,7 @@ const messages = {
       tips: "Tips to students",
       vacancies: "Vacancies",
     },
+    otherLanguages: "Other languages",
   },
   contentTypes: {
     all: "All",

package/src/locale/messages-nb.ts

@@ -540,6 +540,7 @@ const messages = {
       tips: "Tips til elever",
       vacancies: "Ledige stillinger",
     },
+    otherLanguages: "Andre språk",
   },
   contentTypes: {
     all: "Alle",

package/src/locale/messages-nn.ts

@@ -540,6 +540,7 @@ const messages = {
       tips: "Tips til elevar",
       vacancies: "Ledige stillingar",
     },
+    otherLanguages: "Andre språk",
   },
   contentTypes: {
     all: "Alle",

package/src/locale/messages-se.ts

@@ -542,6 +542,7 @@ const messages = {
       tips: "Cavgileapmi ohppiide",
       vacancies: "Rabas virggit",
     },
+    otherLanguages: "Andre språk",
   },
   contentTypes: {
     all: "Buot",

package/src/locale/messages-sma.ts

@@ -544,6 +544,7 @@ const messages = {
       tips: "Tipsh learoehkidie",
       vacancies: "Gaavnoes barkoeh",
     },
+    otherLanguages: "Andre språk",
   },
   contentTypes: {
     all: "Alle",

package/es/Footer/EditorName.js

@@ -1,20 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
-/**
- * Copyright (c) 2019-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 const EditorName = _ref => {
-  let {
-    title,
-    name
-  } = _ref;
-  return _jsxs("span", {
-    children: [_jsx("strong", {
-      children: title
-    }), " ".concat(name)]
-  });
-};