@ndla/ui 56.0.14-alpha.0 → 56.0.16-alpha.0

package/lib/TreeStructure/helperFunctions.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.treestructureId = exports.flattenFolders = void 0;
+exports.flattenFolders = void 0;
 /**
  * Copyright (c) 2022-present, NDLA.
  *
@@ -33,8 +33,4 @@ const flattenFolders = (folders, openFolders) => {
     }, flattenFolders(subfolders, openFolders));
   }, []);
 };
-exports.flattenFolders = flattenFolders;
-const treestructureId = (type, modifier) => {
-  return `${type}-treestructure-${modifier}`;
-};
-exports.treestructureId = treestructureId;
+exports.flattenFolders = flattenFolders;

package/lib/TreeStructure/index.d.ts

@@ -5,6 +5,5 @@
  * LICENSE file in the root directory of this source tree.
  *
  */
-import TreeStructure from "./TreeStructure";
 export type { TreeStructureProps } from "./TreeStructure";
-export { TreeStructure };
+export { TreeStructure } from "./TreeStructure";

package/lib/TreeStructure/index.js

@@ -6,8 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "TreeStructure", {
   enumerable: true,
   get: function () {
-    return _TreeStructure.default;
+    return _TreeStructure.TreeStructure;
   }
 });
-var _TreeStructure = _interopRequireDefault(require("./TreeStructure"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _TreeStructure = require("./TreeStructure");

package/lib/TreeStructure/types.d.ts

@@ -6,28 +6,10 @@
  *
  */
 import { ReactNode } from "react";
-import { IFolder, IResource } from "@ndla/types-backend/myndla-api";
-export type TreeStructureType = "navigation" | "picker";
-export type OnCreatedFunc = (folder: IFolder | undefined, parentId: string) => void;
-export type NewFolderInputFunc = ({ onClose, parentId, onCreate, }: {
-    onClose: () => void;
+import { IFolder } from "@ndla/types-backend/myndla-api";
+export type OnCreatedFunc = (folder: IFolder | undefined) => void;
+export type NewFolderInputFunc = ({ onCancel, parentId, onCreate, }: {
+    onCancel: () => void;
     parentId: string;
     onCreate: OnCreatedFunc;
 }) => ReactNode;
-export interface CommonTreeStructureProps {
-    loading?: boolean;
-    targetResource?: IResource;
-    type: TreeStructureType;
-}
-export interface CommonFolderItemsProps extends CommonTreeStructureProps {
-    focusedFolder?: IFolder;
-    level: number;
-    maxLevel: number;
-    selectedFolder?: IFolder;
-    onCloseFolder: (id: string) => void;
-    onOpenFolder: (id: string) => void;
-    setFocusedFolder: (folder: IFolder) => void;
-    setSelectedFolder: (folder: IFolder) => void;
-    visibleFolders: IFolder[];
-    closeTree: () => void;
-}

package/lib/index.d.ts

@@ -7,7 +7,7 @@
  */
 export { ImageEmbed, getCrop, getFocalPoint, AudioEmbed, H5pEmbed, ExternalEmbed, IframeEmbed, FootnoteEmbed, BrightcoveEmbed, ContentLinkEmbed, RelatedContentEmbed, ConceptEmbed, ConceptListEmbed, UnknownEmbed, InlineConcept, BlockConcept, UuDisclaimerEmbed, CopyrightEmbed, CodeEmbed, } from "./Embed";
 export { LicenseLink, EmbedByline } from "./LicenseByline";
-export { ArticleByline, ArticleBylineAccordionItem, ArticleFootNotes, ArticleWrapper, Article, ArticleParagraph, ArticleFooter, ArticleHeader, ArticleContent, ArticleHGroup, ArticleActionWrapper, ArticleTitle, ArticlePadding, } from "./Article";
+export { ArticleByline, ArticleBylineAccordionItem, ArticleFootNotes, ArticleWrapper, Article, ArticleParagraph, ArticleFooter, ArticleHeader, ArticleContent, ArticleHGroup, ArticleTitle, } from "./Article";
 export { getPossiblyRelativeUrl } from "./utils/relativeUrl";
 export { default as ContentLoader } from "./ContentLoader";
 export { default as RelatedArticleList, RelatedArticle } from "./RelatedArticleList";

package/lib/index.js

@@ -9,12 +9,6 @@ Object.defineProperty(exports, "Article", {
     return _Article.Article;
   }
 });
-Object.defineProperty(exports, "ArticleActionWrapper", {
-  enumerable: true,
-  get: function () {
-    return _Article.ArticleActionWrapper;
-  }
-});
 Object.defineProperty(exports, "ArticleByline", {
   enumerable: true,
   get: function () {
@@ -57,12 +51,6 @@ Object.defineProperty(exports, "ArticleHeader", {
     return _Article.ArticleHeader;
   }
 });
-Object.defineProperty(exports, "ArticlePadding", {
-  enumerable: true,
-  get: function () {
-    return _Article.ArticlePadding;
-  }
-});
 Object.defineProperty(exports, "ArticleParagraph", {
   enumerable: true,
   get: function () {

package/lib/locale/messages-en.js

@@ -1075,9 +1075,9 @@ const messages = {
         },
         fetchMore: "Fetch more answers",
         deleted: "This post has been deleted by the author.",
-        upvote: "Upvote",
+        upvote: "Like",
         numberOfUpvotes: "{{ count }} people have upvoted this.",
-        removeUpvote: "Remove upvote",
+        removeUpvote: "Stop liking",
         reply: "Write a reply to {{ name }}"
       },
       flag: {
@@ -1239,7 +1239,7 @@ const messages = {
       loginTerms: "Log in with Feide to receive access. By logging on your accept your terms of service",
       loginResourcePitch: "Do you want to favorite this resource?",
       loginWelcome: "Welcome to My NDLA!",
-      deleteAccount: "Delete My NDLA",
+      deleteAccount: "Delete profile",
       loginPitch: "Welcome to My NDLA! Here you can save your favourite resources from NDLA, organize them and share them with others. Log in with your Feide account to get started.",
       loginPitchButton: "Log in to My NDLA",
       welcome: "Welcome to my NDLA! You can now save your favourite resources from NDLA and organise them in folders with tags",

package/lib/locale/messages-nb.js

@@ -1075,9 +1075,9 @@ const messages = {
         },
         fetchMore: "Hent flere svar",
         deleted: "Dette innlegget er slettet av forfatteren.",
-        upvote: "Stem opp",
+        upvote: "Liker",
         numberOfUpvotes: "{{ count }} personer har stemt opp denne.",
-        removeUpvote: "Fjern stemme",
+        removeUpvote: "Slutt å like",
         reply: "Skriv et svar til {{ name }}"
       },
       flag: {
@@ -1232,7 +1232,7 @@ const messages = {
       confirmDeleteAccount: "Er du sikker på at du vil slette kontoen?",
       confirmDeleteAccountButton: "Slett konto",
       myPage: "Min side",
-      deleteAccount: "Slett Min NDLA",
+      deleteAccount: "Slett brukerprofil",
       loginPitch: "Velkommen til Min NDLA! Her kan du lagre favorittressursene dine fra NDLA, organisere dem og dele dem med andre. Logg inn med din Feide-konto for å komme i gang.",
       loginPitchButton: "Logg inn i Min NDLA",
       logout: "Logg ut av Min NDLA",

package/lib/locale/messages-nn.js

@@ -1075,9 +1075,9 @@ const messages = {
         },
         fetchMore: "Hent fleire svar",
         deleted: "Dette innlegget er sletta av forfatteren.",
-        upvote: "Stem opp",
+        upvote: "Liker",
         numberOfUpvotes: "{{ count }} personar har stemt opp denne.",
-        removeUpvote: "Fjern stemme",
+        removeUpvote: "Slutt å like",
         reply: "Skriv eit svar til {{ name }}"
       },
       flag: {
@@ -1232,7 +1232,7 @@ const messages = {
       confirmDeleteAccount: "Er du sikker på at du vil slette kontoen?",
       confirmDeleteAccountButton: "Slett konto",
       myPage: "Mi side",
-      deleteAccount: "Slett Min NDLA",
+      deleteAccount: "Slett brukarprofil",
       loginPitch: "Velkommen til Min NDLA! Her kan du lagre favorittressursane dine frå NDLA, organisere dei og dele dei med andre. Logg inn med din Feide-konto for å komme i gang.",
       loginPitchButton: "Logg inn i Min NDLA",
       logout: "Logg ut av Min NDLA",

package/lib/locale/messages-se.js

@@ -1075,9 +1075,9 @@ const messages = {
         },
         fetchMore: "Hent flere svar",
         deleted: "Dette innlegget er slettet av forfatteren.",
-        upvote: "Stem opp",
+        upvote: "Liker",
         numberOfUpvotes: "{{ count }} personer har stemt opp denne.",
-        removeUpvote: "Fjern stemme",
+        removeUpvote: "Slutt å like",
         reply: "Skriv et svar til {{ name }}"
       },
       flag: {
@@ -1232,7 +1232,7 @@ const messages = {
       confirmDeleteAccount: "Er du sikker på at du vil slette kontoen?",
       confirmDeleteAccountButton: "Slett konto",
       myPage: "Min side",
-      deleteAccount: "Slett Min NDLA",
+      deleteAccount: "Slett brukerprofil",
       loginPitch: "Velkommen til Min NDLA! Her kan du lagre favorittressursene dine fra NDLA, organisere dem og dele dem med andre. Logg inn med din Feide-konto for å komme i gang.",
       loginPitchButton: "Logg inn i Min NDLA",
       logout: "Logg ut av Min NDLA",

package/lib/locale/messages-sma.js

@@ -1075,9 +1075,9 @@ const messages = {
         },
         fetchMore: "Hent flere svar",
         deleted: "Dette innlegget er slettet av forfatteren.",
-        upvote: "Stem opp",
+        upvote: "Liker",
         numberOfUpvotes: "{{ count }} personer har stemt opp denne.",
-        removeUpvote: "Fjern stemme",
+        removeUpvote: "Slutt å like",
         reply: "Skriv et svar til {{ name }}"
       },
       flag: {
@@ -1232,7 +1232,7 @@ const messages = {
       confirmDeleteAccount: "Er du sikker på at du vil slette kontoen?",
       confirmDeleteAccountButton: "Slett konto",
       myPage: "Min side",
-      deleteAccount: "Slett Min NDLA",
+      deleteAccount: "Slett brukerprofil",
       loginPitch: "Velkommen til Min NDLA! Her kan du lagre favorittressursene dine fra NDLA, organisere dem og dele dem med andre. Logg inn med din Feide-konto for å komme i gang.",
       loginPitchButton: "Logg inn i Min NDLA",
       logout: "Logg ut av Min NDLA",

package/lib/styles.css

@@ -85,34 +85,26 @@
 }
 }
 
-  .px_8\% {
-    padding-inline: 8%;
-}
-
-  .w_100\% {
-    width: 100%;
-}
-
-  .pbs_xsmall {
-    padding-block-start: var(--spacing-xsmall);
-}
-
-  .pbe_xsmall {
-    padding-block-end: var(--spacing-xsmall);
-}
-
-  .bg_surface\.default {
-    background: var(--colors-surface-default);
+  .bg_background\.default {
+    background: var(--colors-background-default);
 }
 
   .d_flex {
     display: flex;
 }
 
+  .gap_xxlarge {
+    gap: var(--spacing-xxlarge);
+}
+
   .c_text\.default {
     color: var(--colors-text-default);
 }
 
+  .w_100\% {
+    width: 100%;
+}
+
   .ov-wrap_break-word {
     overflow-wrap: break-word;
 }
@@ -121,26 +113,22 @@
     position: relative;
 }
 
-  .gap_xsmall {
-    gap: var(--spacing-xsmall);
-}
-
-  .pos_absolute {
-    position: absolute;
-}
-
   .gap_medium {
     gap: var(--spacing-medium);
 }
 
-  .gap_xxlarge {
-    gap: var(--spacing-xxlarge);
+  .pbs_xxlarge {
+    padding-block-start: var(--spacing-xxlarge);
 }
 
   .mbs_medium {
     margin-block-start: var(--spacing-medium);
 }
 
+  .pbs_xsmall {
+    padding-block-start: var(--spacing-xsmall);
+}
+
   .bd-t_1px_solid {
     border-top: 1px solid;
 }
@@ -153,8 +141,8 @@
     padding-block: var(--spacing-xsmall);
 }
 
-  .pbs_xxlarge {
-    padding-block-start: var(--spacing-xxlarge);
+  .gap_xsmall {
+    gap: var(--spacing-xsmall);
 }
 
   .li-s_none {
@@ -218,10 +206,6 @@
     border-bottom-right-radius: var(--radii-xsmall);
 }
 
-  .bg_background\.default {
-    background: var(--colors-background-default);
-}
-
   .px_medium {
     padding-inline: var(--spacing-medium);
 }
@@ -374,6 +358,10 @@
     padding: var(--spacing-medium);
 }
 
+  .bg_surface\.default {
+    background: var(--colors-surface-default);
+}
+
   .z_base {
     z-index: var(--z-index-base);
 }
@@ -426,6 +414,10 @@
     border: 2px solid;
 }
 
+  .pos_absolute {
+    position: absolute;
+}
+
   .op_0 {
     opacity: 0;
 }
@@ -611,6 +603,18 @@
     aspect-ratio: 1/1;
 }
 
+  .max-h_inherit {
+    max-height: inherit;
+}
+
+  .ov_auto {
+    overflow: auto;
+}
+
+  .gap_10px {
+    gap: 10px;
+}
+
   .flex-d_column {
     flex-direction: column;
 }
@@ -623,14 +627,6 @@
     align-items: flex-start;
 }
 
-  .right_8\% {
-    right: 8%;
-}
-
-  .top_xsmall {
-    top: var(--spacing-xsmall);
-}
-
   .bd-c_stroke\.subtle {
     border-color: var(--colors-stroke-subtle);
 }
@@ -682,6 +678,10 @@
     align-items: flex-end;
 }
 
+  .fw_bold {
+    font-weight: var(--font-weights-bold);
+}
+
   .as_center {
     align-self: center;
 }
@@ -722,10 +722,6 @@
     top: calc(var(--spacing-4xsmall) * -1);
 }
 
-  .fw_bold {
-    font-weight: var(--font-weights-bold);
-}
-
   .bg-c_surface\.disabled {
     background-color: var(--colors-surface-disabled);
 }
@@ -761,6 +757,10 @@
     transition-timing-function: ease-out;
 }
 
+  .top_xsmall {
+    top: var(--spacing-xsmall);
+}
+
   .right_xsmall {
     right: var(--spacing-xsmall);
 }
@@ -896,6 +896,10 @@
     overflow-wrap: anywhere;
 }
 
+  .\[\&_\>_\:is\(\:last-child\)\]\:pbe_5xlarge > :is(:last-child) {
+    padding-block-end: var(--spacing-5xlarge);
+}
+
   .\[\&\[data-align\=\"center\"\]\]\:ta_center[data-align="center"] {
     text-align: center;
 }
@@ -1171,6 +1175,14 @@
     text-decoration: underline;
 }
 
+  .\[\&_span\]\:ov_hidden span {
+    overflow: hidden;
+}
+
+  .\[\&_span\]\:tov_ellipsis span {
+    text-overflow: ellipsis;
+}
+
   .after\:content_0::after {
     content: 0;
 }
@@ -1436,6 +1448,9 @@
 }
 
   @media screen and (min-width: 29.75rem) {
+    .mobileWide\:h_340px {
+      height: 340px;
+}
     .mobileWide\:d_none {
       display: none;
 }
@@ -1448,12 +1463,6 @@
 }
 
   @media screen and (min-width: 37.5625rem) {
-    .tablet\:pbs_medium {
-      padding-block-start: var(--spacing-medium);
-}
-    .tablet\:pbe_medium {
-      padding-block-end: var(--spacing-medium);
-}
     .tablet\:px_medium {
       padding-inline: var(--spacing-medium);
 }
@@ -1468,9 +1477,6 @@
 }
     .tablet\:w_83\.333\% {
       width: 83.333%;
-}
-    .tablet\:top_medium {
-      top: var(--spacing-medium);
 }
     .tablet\:ai_unset {
       align-items: unset;
@@ -1537,6 +1543,27 @@
 }
     .tabletWide\:max-w_532px {
       max-width: 532px;
+}
+    .tabletWide\:w_auto {
+      width: auto;
+}
+    .tabletWide\:d_block {
+      display: block;
+}
+    .tabletWide\:ov_hidden {
+      overflow: hidden;
+}
+    .tabletWide\:pos_relative {
+      position: relative;
+}
+    .tabletWide\:lc_4 {
+      overflow: hidden;
+      display: -webkit-box;
+      -webkit-line-clamp: 4;
+      -webkit-box-orient: vertical;
+}
+    .tabletWide\:box-orient_vertical {
+      box-orient: vertical;
 }
     .tabletWide\:flex-d_row {
       flex-direction: row;
@@ -1547,23 +1574,11 @@
 }
 
   @media screen and (min-width: 61.3125rem) {
-    .desktop\:pbs_xxlarge {
-      padding-block-start: var(--spacing-xxlarge);
-}
-    .desktop\:pbe_xxlarge {
-      padding-block-end: var(--spacing-xxlarge);
-}
     .desktop\:w_260px {
       width: 260px;
 }
     .desktop\:h_260px {
       height: 260px;
-}
-    .desktop\:h_340px {
-      height: 340px;
-}
-    .desktop\:top_xxlarge {
-      top: var(--spacing-xxlarge);
 }
     .desktop\:grid-tc_repeat\(3\,_minmax\(0\,_1fr\)\) {
       grid-template-columns: repeat(3, minmax(0, 1fr));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "56.0.14-alpha.0",
+  "version": "56.0.16-alpha.0",
   "description": "UI component library for NDLA",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -33,13 +33,12 @@
     "types"
   ],
   "dependencies": {
-    "@ndla/button": "^15.0.9-alpha.0",
     "@ndla/core": "^5.0.2",
-    "@ndla/icons": "^8.0.9-alpha.0",
+    "@ndla/icons": "^8.0.11-alpha.0",
     "@ndla/licenses": "^8.0.1-alpha.0",
-    "@ndla/primitives": "^1.0.13-alpha.0",
-    "@ndla/safelink": "^7.0.13-alpha.0",
-    "@ndla/styled-system": "^0.0.11",
+    "@ndla/primitives": "^1.0.15-alpha.0",
+    "@ndla/safelink": "^7.0.15-alpha.0",
+    "@ndla/styled-system": "^0.0.13",
     "@ndla/util": "^4.1.0",
     "html-react-parser": "^5.1.8",
     "i18next-browser-languagedetector": "^7.1.0"
@@ -54,7 +53,7 @@
     "react-router-dom": "> 6.0.0"
   },
   "devDependencies": {
-    "@ndla/preset-panda": "^0.0.19",
+    "@ndla/preset-panda": "^0.0.21",
     "@ndla/types-backend": "^0.2.86",
     "@ndla/types-embed": "^5.0.1-alpha.0",
     "@pandacss/dev": "^0.44.0",
@@ -67,5 +66,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "d75660d97b97c191869b6b8a4893bb2bbdf132e6"
+  "gitHead": "b37f00c4b3c340890aa9729d74439fa84e2d2eed"
 }