@ndla/ui 56.0.74-alpha.0 → 56.0.76-alpha.0

package/dist/panda.buildinfo.json

@@ -1,5 +1,5 @@
 {
-  "schemaVersion": "0.46.0",
+  "schemaVersion": "0.48.0",
   "styles": {
     "atomic": [
       "background]___[value:background.default",
@@ -56,6 +56,7 @@
       "padding]___[value:xsmall",
       "paddingBlock]___[value:xsmall]___[cond:&[data-has-image='true']<___>tablet",
       "paddingInline]___[value:medium]___[cond:&[data-has-image='true']<___>tablet",
+      "fontFamily]___[value:sans",
       "width]___[value:100%]___[cond:tabletWide",
       "justifyContent]___[value:space-between]___[cond:tabletWide",
       "borderBlockStart]___[value:1px solid",
@@ -171,26 +172,6 @@
       "width]___[value:surface.xsmall",
       "height]___[value:surface.xsmall",
       "fontFamily]___[value:serif",
-      "display]___[value:inline-flex",
-      "borderRadius]___[value:100%",
-      "color]___[value:var(--icon-color)",
-      "width]___[value:20px",
-      "height]___[value:20px",
-      "width]___[value:10px]___[cond:& svg",
-      "height]___[value:10px]___[cond:& svg",
-      "height]___[value:26px]___[cond:tablet",
-      "width]___[value:26px]___[cond:tablet",
-      "width]___[value:12px]___[cond:& svg<___>tablet",
-      "height]___[value:12px]___[cond:& svg<___>tablet",
-      "width]___[value:34px",
-      "height]___[value:34px",
-      "width]___[value:50px",
-      "height]___[value:50px",
-      "width]___[value:25px]___[cond:& svg",
-      "height]___[value:25px]___[cond:& svg",
-      "border]___[value:2px solid",
-      "borderColor]___[value:var(--icon-color)",
-      "backgroundColor]___[value:var(--background-color)",
       "opacity]___[value:1]___[cond:_hover<___>& [data-copy-button]",
       "cursor]___[value:pointer]___[cond:_hover<___>& [data-copy-button]",
       "position]___[value:absolute",
@@ -250,6 +231,7 @@
       "right]___[value:xsmall",
       "width]___[value:medium",
       "height]___[value:medium",
+      "border]___[value:2px solid",
       "borderColor]___[value:background.default",
       "transitionProperty]___[value:transform, background-color, color",
       "transitionDuration]___[value:normal",
@@ -349,6 +331,7 @@
       "color]___[value:text.subtle",
       "borderColor]___[value:stroke.error",
       "background]___[value:surface.dangerSubtle",
+      "display]___[value:inline-flex",
       "whiteSpace]___[value:pre-wrap",
       "display]___[value:grid]___[cond:mobileWideDown",
       "gridTemplateColumns]___[value:1fr auto]___[cond:mobileWideDown",

package/dist/styles.css

@@ -393,46 +393,6 @@
     height: var(--sizes-surface-xsmall);
 }
 
-  .d_inline-flex {
-    display: inline-flex;
-}
-
-  .bdr_100\% {
-    border-radius: 100%;
-}
-
-  .c_var\(--icon-color\) {
-    color: var(--icon-color);
-}
-
-  .w_20px {
-    width: 20px;
-}
-
-  .h_20px {
-    height: 20px;
-}
-
-  .w_34px {
-    width: 34px;
-}
-
-  .h_34px {
-    height: 34px;
-}
-
-  .w_50px {
-    width: 50px;
-}
-
-  .h_50px {
-    height: 50px;
-}
-
-  .bd_2px_solid {
-    border: 2px solid;
-}
-
   .pos_absolute {
     position: absolute;
 }
@@ -509,6 +469,10 @@
     height: var(--sizes-medium);
 }
 
+  .bd_2px_solid {
+    border: 2px solid;
+}
+
   .c_background\.default {
     color: var(--colors-background-default);
 }
@@ -577,6 +541,10 @@
     background: var(--colors-surface-danger-subtle);
 }
 
+  .d_inline-flex {
+    display: inline-flex;
+}
+
   .white-space_pre-wrap {
     white-space: pre-wrap;
 }
@@ -637,6 +605,10 @@
     border-color: var(--colors-stroke-default);
 }
 
+  .ff_sans {
+    font-family: var(--fonts-sans);
+}
+
   .as_flex-start {
     align-self: flex-start;
 }
@@ -685,14 +657,6 @@
     font-family: var(--fonts-serif);
 }
 
-  .bd-c_var\(--icon-color\) {
-    border-color: var(--icon-color);
-}
-
-  .bg-c_var\(--background-color\) {
-    background-color: var(--background-color);
-}
-
   .left_-xxlarge {
     left: calc(var(--spacing-xxlarge) * -1);
 }
@@ -911,22 +875,6 @@
     z-index: var(--z-index-hide);
 }
 
-  .\[\&_svg\]\:w_10px svg {
-    width: 10px;
-}
-
-  .\[\&_svg\]\:h_10px svg {
-    height: 10px;
-}
-
-  .\[\&_svg\]\:w_25px svg {
-    width: 25px;
-}
-
-  .\[\&_svg\]\:h_25px svg {
-    height: 25px;
-}
-
   .\[\&_\>_\*\:not\(\:where\(\:first-child\)\)\]\:mbs_xsmall > *:not(:where(:first-child)) {
     margin-block-start: var(--spacing-xsmall);
 }
@@ -1351,12 +1299,6 @@
 }
     .tablet\:box-orient_vertical {
       box-orient: vertical;
-}
-    .tablet\:h_26px {
-      height: 26px;
-}
-    .tablet\:w_26px {
-      width: 26px;
 }
     .tablet\:ai_unset {
       align-items: unset;
@@ -1375,12 +1317,6 @@
 }
     .\[\&\[data-has-image\=\'true\'\]\]\:tablet\:px_medium[data-has-image='true'] {
       padding-inline: var(--spacing-medium);
-}
-    .\[\&_svg\]\:tablet\:w_12px svg {
-      width: 12px;
-}
-    .\[\&_svg\]\:tablet\:h_12px svg {
-      height: 12px;
 }
 }
 

package/es/Article/Article.js

@@ -11,7 +11,7 @@ import { ark } from "@ark-ui/react";
 import { Heading, Text } from "@ndla/primitives";
 import { cx } from "@ndla/styled-system/css";
 import { Stack, styled } from "@ndla/styled-system/jsx";
-import { ContentTypeBadgeNew } from "..";
+import { ContentTypeBadge } from "..";
 import { ArticleByline } from "./ArticleByline";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const StyledArticleContent = styled(ark.section, {}, {
@@ -118,7 +118,7 @@ export const ArticleTitle = _ref2 => {
         align: "center",
         direction: "row",
         gap: "small",
-        children: [!!contentType && /*#__PURE__*/_jsx(ContentTypeBadgeNew, {
+        children: [!!contentType && /*#__PURE__*/_jsx(ContentTypeBadge, {
           contentType: contentType,
           children: contentTypeLabel
         }), heartButton]

package/es/Article/ArticleByline.js

@@ -9,7 +9,7 @@
 import { forwardRef, useCallback, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useLocation } from "react-router-dom";
-import { ArrowDownShortLine } from "@ndla/icons/common";
+import { ArrowDownShortLine } from "@ndla/icons";
 import { AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionItemTrigger, AccordionRoot, Heading } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { ArticleFootNotes } from "./ArticleFootNotes";

package/es/AudioPlayer/AudioPlayer.js

@@ -80,6 +80,7 @@ const TitleWrapper = styled("div", {
     display: "flex",
     flexDirection: "column",
     gap: "xsmall",
+    fontFamily: "sans",
     tabletWide: {
       width: "100%",
       flexDirection: "row",

package/es/AudioPlayer/Controls.js

@@ -9,9 +9,7 @@
 import { useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { createListCollection } from "@ark-ui/react";
-import { Replay15Line, Forward15Line } from "@ndla/icons/action";
-import { PlayFill, PauseLine, VolumeUpFill } from "@ndla/icons/common";
-import { CheckLine } from "@ndla/icons/editor";
+import { Replay15Line, Forward15Line, PlayFill, PauseLine, VolumeUpFill, CheckLine } from "@ndla/icons";
 import { Button, FieldRoot, IconButton, PopoverContent, PopoverRoot, PopoverTrigger, SelectContent, SelectControl, SelectItem, SelectItemIndicator, SelectItemText, SelectLabel, SelectRoot, SelectTrigger, SliderControl, SliderHiddenInput, SliderLabel, SliderRange, SliderRoot, SliderThumb, SliderTrack, Text } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { visuallyHidden } from "@ndla/styled-system/patterns";

package/es/AudioPlayer/SpeechControl.js

@@ -8,7 +8,7 @@
 
 import { useRef } from "react";
 import { useTranslation } from "react-i18next";
-import { VolumeUpFill } from "@ndla/icons/common";
+import { VolumeUpFill } from "@ndla/icons";
 import { TooltipRoot, TooltipTrigger, TooltipContent, IconButton } from "@ndla/primitives";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const SpeechControl = _ref => {

package/es/Breadcrumb/BreadcrumbItem.js

@@ -7,7 +7,7 @@
  */
 
 import { useRef, useImperativeHandle, forwardRef } from "react";
-import { ArrowRightShortLine } from "@ndla/icons/common";
+import { ArrowRightShortLine } from "@ndla/icons";
 import { SafeLink } from "@ndla/safelink";
 import { styled } from "@ndla/styled-system/jsx";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";

package/es/Breadcrumb/HomeBreadcrumb.js

@@ -6,7 +6,7 @@
  *
  */
 
-import { ArrowRightShortLine, HomeLine } from "@ndla/icons/common";
+import { ArrowRightShortLine, HomeLine } from "@ndla/icons";
 import { SafeLink } from "@ndla/safelink";
 import { styled } from "@ndla/styled-system/jsx";
 import Breadcrumb from "./Breadcrumb";

package/es/CampaignBlock/CampaignBlock.js

@@ -7,7 +7,7 @@
  */
 
 import parse from "html-react-parser";
-import { ArrowRightLine } from "@ndla/icons/common";
+import { ArrowRightLine } from "@ndla/icons";
 import { Text } from "@ndla/primitives";
 import { SafeLinkButton } from "@ndla/safelink";
 import { styled } from "@ndla/styled-system/jsx";

package/es/ContentTypeBadge/ContentTypeBadge.js

@@ -1,228 +1,50 @@
 /**
- * Copyright (c) 2018-present, NDLA.
+ * Copyright (c) 2024-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 { useMemo } from "react";
-import { colors } from "@ndla/core";
-import { BookmarkLine, SubtractLine } from "@ndla/icons/action";
-import { BookReadFill, ShareFill, VoicePrintLine } from "@ndla/icons/common";
-import { MenuSearchLine, LearningPath, SharedResource, TasksAndActivities } from "@ndla/icons/contentType";
-import { ChatLine, FileListLine, LinkMedium, ImageLine, MovieLine } from "@ndla/icons/editor";
-import { styled } from "@ndla/styled-system/jsx";
+import { forwardRef } from "react";
+import { useTranslation } from "react-i18next";
+import { Badge } from "@ndla/primitives";
 import * as contentTypes from "../model/ContentType";
-
-// TODO: Remove this component
 import { jsx as _jsx } from "react/jsx-runtime";
-const StyledContentTypeBadge = styled("div", {
-  base: {
-    display: "inline-flex",
-    alignItems: "center",
-    justifyContent: "center",
-    borderRadius: "100%",
-    color: "var(--icon-color)"
-  },
-  defaultVariants: {
-    size: "small",
-    border: true,
-    background: false
-  },
-  variants: {
-    size: {
-      "xx-small": {
-        width: "20px",
-        height: "20px",
-        border: "1px solid",
-        "& svg": {
-          width: "10px",
-          height: "10px"
-        }
-      },
-      "x-small": {
-        width: "20px",
-        height: "20px",
-        border: "1px solid",
-        tablet: {
-          height: "26px",
-          width: "26px"
-        },
-        "& svg": {
-          width: "10px",
-          height: "10px",
-          tablet: {
-            width: "12px",
-            height: "12px"
-          }
-        }
-      },
-      small: {
-        width: "34px",
-        height: "34px"
-      },
-      large: {
-        width: "50px",
-        height: "50px",
-        "& svg": {
-          width: "25px",
-          height: "25px"
-        }
-      }
-    },
-    border: {
-      true: {
-        border: "2px solid",
-        borderColor: "var(--icon-color)"
-      },
-      false: {}
-    },
-    background: {
-      true: {
-        backgroundColor: "var(--background-color)"
-      }
-    }
-  }
-});
-const iconMap = {
-  [contentTypes.SUBJECT_MATERIAL]: {
-    icon: FileListLine,
-    iconColor: colors.subjectMaterial.dark,
-    backgroundColor: colors.subjectMaterial.light
-  },
-  [contentTypes.TASKS_AND_ACTIVITIES]: {
-    icon: TasksAndActivities,
-    iconColor: colors.tasksAndActivities.dark,
-    backgroundColor: colors.tasksAndActivities.light
-  },
-  [contentTypes.ASSESSMENT_RESOURCES]: {
-    icon: MenuSearchLine,
-    iconColor: colors.assessmentResource.dark,
-    backgroundColor: colors.assessmentResource.light
-  },
-  [contentTypes.SUBJECT]: {
-    icon: BookReadFill,
-    iconColor: colors.subject.dark,
-    backgroundColor: colors.subject.light
-  },
-  [contentTypes.SOURCE_MATERIAL]: {
-    icon: SharedResource,
-    iconColor: colors.sourceMaterial.dark,
-    backgroundColor: colors.sourceMaterial.light
-  },
-  [contentTypes.LEARNING_PATH]: {
-    icon: LearningPath,
-    iconColor: colors.learningPath.dark,
-    backgroundColor: colors.learningPath.light
-  },
-  [contentTypes.TOPIC]: {
-    icon: BookmarkLine,
-    iconColor: colors.subject.dark,
-    backgroundColor: colors.subject.light
-  },
-  [contentTypes.MULTIDISCIPLINARY]: {
-    icon: ShareFill,
-    backgroundColor: "#b9b37b"
-  },
-  [contentTypes.CONCEPT]: {
-    icon: ChatLine,
-    iconColor: colors.concept.text,
-    backgroundColor: colors.concept.light
-  },
-  [contentTypes.EXTERNAL]: {
-    icon: LinkMedium,
-    iconColor: colors.external.dark,
-    backgroundColor: colors.external.light
-  },
-  [contentTypes.resourceEmbedTypeMapping.image]: {
-    icon: ImageLine,
-    iconColor: colors.brand.grey,
-    backgroundColor: colors.brand.greyLight
-  },
-  [contentTypes.resourceEmbedTypeMapping.audio]: {
-    icon: VoicePrintLine,
-    iconColor: colors.brand.grey,
-    backgroundColor: colors.brand.greyLight
-  },
-  [contentTypes.resourceEmbedTypeMapping.video]: {
-    icon: MovieLine,
-    iconColor: colors.brand.grey,
-    backgroundColor: colors.brand.greyLight
-  },
-  [contentTypes.MISSING]: {
-    icon: SubtractLine,
-    iconColor: colors.brand.grey,
-    backgroundColor: colors.brand.greyLight
-  }
+export const contentTypeToBadgeVariantMap = {
+  [contentTypes.SUBJECT_MATERIAL]: "brand1",
+  [contentTypes.TASKS_AND_ACTIVITIES]: "brand2",
+  [contentTypes.ASSESSMENT_RESOURCES]: "brand2",
+  [contentTypes.SUBJECT]: "neutral",
+  [contentTypes.SOURCE_MATERIAL]: "brand1",
+  [contentTypes.LEARNING_PATH]: "brand3",
+  [contentTypes.TOPIC]: "neutral",
+  [contentTypes.MULTIDISCIPLINARY]: "neutral",
+  [contentTypes.CONCEPT]: "brand1",
+  [contentTypes.EXTERNAL]: "brand2",
+  [contentTypes.IMAGE]: "brand1",
+  [contentTypes.AUDIO]: "brand1",
+  [contentTypes.PODCAST]: "brand1",
+  [contentTypes.VIDEO]: "brand1",
+  [contentTypes.MISSING]: "neutral",
+  [contentTypes.PODCAST_SERIES]: "brand1",
+  [contentTypes.GLOSS]: "brand1",
+  [contentTypes.PROGRAMME]: "neutral",
+  [contentTypes.FRONTPAGE_ARTICLE]: "brand2"
 };
-export const ContentTypeBadge = _ref => {
+export const ContentTypeBadge = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {
-    type,
-    background,
-    title,
-    size = "small",
-    border = true,
-    className,
-    ...rest
+    contentType,
+    children,
+    ...props
   } = _ref;
   const {
-    Icon,
-    style
-  } = useMemo(() => {
-    const fromMap = iconMap[type];
-    const style = {
-      "--icon-color": fromMap.iconColor,
-      "--background-color": fromMap.backgroundColor
-    };
-    return {
-      Icon: fromMap.icon,
-      style
-    };
-  }, [type]);
-  return /*#__PURE__*/_jsx(StyledContentTypeBadge, {
-    title: title,
-    background: background,
-    size: size,
-    border: border,
-    style: style,
-    "aria-label": title,
-    className: className,
-    "data-badge": "",
-    "data-type": type,
-    ...rest,
-    children: /*#__PURE__*/_jsx(Icon, {})
+    t
+  } = useTranslation();
+  return /*#__PURE__*/_jsx(Badge, {
+    colorTheme: contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"],
+    ...props,
+    ref: ref,
+    children: children ?? t(`contentTypes.${contentType}`)
   });
-};
-export const SubjectMaterialBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.SUBJECT_MATERIAL
-});
-export const TasksAndActivitiesBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.TASKS_AND_ACTIVITIES
-});
-export const AssessmentResourcesBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.ASSESSMENT_RESOURCES
-});
-export const SubjectBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.SUBJECT
-});
-export const SourceMaterialBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.SOURCE_MATERIAL
-});
-export const LearningPathBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.LEARNING_PATH
-});
-export const MultidisciplinaryTopicBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.MULTIDISCIPLINARY
-});
-export const ConceptBadge = props => /*#__PURE__*/_jsx(ContentTypeBadge, {
-  ...props,
-  type: contentTypes.CONCEPT
 });

package/es/ContentTypeHero/ContentTypeHero.js

@@ -32,7 +32,8 @@ export const contentTypeToHeroMap = {
   // this will never happen
   [contentTypes.PROGRAMME]: "primary",
   // this will never happen
-  [contentTypes.PODCAST_SERIES]: "primary"
+  [contentTypes.PODCAST_SERIES]: "primary",
+  [contentTypes.FRONTPAGE_ARTICLE]: "primary"
 };
 export const ContentTypeHero = /*#__PURE__*/forwardRef((_ref, ref) => {
   let {

package/es/CopyParagraphButton/CopyParagraphButton.js

@@ -8,7 +8,7 @@
 
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { LinkMedium } from "@ndla/icons/editor";
+import { LinkMedium } from "@ndla/icons";
 import { IconButton } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { copyTextToClipboard } from "@ndla/util";

package/es/Embed/CodeEmbed.js

@@ -8,8 +8,7 @@
 
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { FileCopyLine } from "@ndla/icons/action";
-import { CheckLine } from "@ndla/icons/editor";
+import { FileCopyLine, CheckLine } from "@ndla/icons";
 import { Button, Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { copyTextToClipboard } from "@ndla/util";

package/es/Embed/EmbedErrorPlaceholder.js

@@ -6,7 +6,7 @@
  *
  */
 
-import { Report } from "@ndla/icons/common";
+import { ErrorWarningLine } from "@ndla/icons";
 import { Figure } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { EmbedByline } from "../LicenseByline";
@@ -48,7 +48,7 @@ const EmbedErrorPlaceholder = _ref => {
     "data-embed-type": type,
     children: [children ?? /*#__PURE__*/_jsx(ErrorPlaceholder, {
       "data-embed-type": type,
-      children: /*#__PURE__*/_jsx(Report, {})
+      children: /*#__PURE__*/_jsx(ErrorWarningLine, {})
     }), /*#__PURE__*/_jsx(EmbedByline, {
       error: true,
       type: type

package/es/Embed/ImageEmbed.js

@@ -9,7 +9,7 @@
 import parse from "html-react-parser";
 import { useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { AddLine } from "@ndla/icons/action";
+import { AddLine } from "@ndla/icons";
 import { Figure, Image } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import EmbedErrorPlaceholder from "./EmbedErrorPlaceholder";

package/es/Embed/UuDisclaimerEmbed.js

@@ -6,7 +6,7 @@
  *
  */
 
-import { InformationLine } from "@ndla/icons/common";
+import { InformationLine } from "@ndla/icons";
 import { MessageBox } from "@ndla/primitives";
 import { SafeLink } from "@ndla/safelink";
 import { styled } from "@ndla/styled-system/jsx";

package/es/ErrorMessage/ErrorResourceAccessDenied.js

@@ -7,7 +7,7 @@
  */
 
 import { useTranslation } from "react-i18next";
-import { PresentationLine, LoginBoxLine } from "@ndla/icons/common";
+import { PresentationLine, LoginBoxLine } from "@ndla/icons";
 import { Button } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import ErrorMessage from "./ErrorMessage";

package/es/FactBox/FactBox.js

@@ -8,7 +8,7 @@
 
 import { forwardRef, useCallback, useEffect, useId, useMemo, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { ArrowDownShortLine } from "@ndla/icons/common";
+import { ArrowDownShortLine } from "@ndla/icons";
 import { IconButton } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";

package/es/FileList/File.js

@@ -8,7 +8,7 @@
 
 import { forwardRef } from "react";
 import { useTranslation } from "react-i18next";
-import { DownloadLine } from "@ndla/icons/common";
+import { DownloadLine } from "@ndla/icons";
 import { Text } from "@ndla/primitives";
 import { SafeLink } from "@ndla/safelink";
 import { HStack, styled } from "@ndla/styled-system/jsx";

package/es/Gloss/Gloss.js

@@ -9,7 +9,7 @@
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 import { AccordionItemTrigger } from "@ark-ui/react";
-import { ArrowDownShortLine } from "@ndla/icons/common";
+import { ArrowDownShortLine } from "@ndla/icons";
 import { AccordionItem, AccordionItemContent, AccordionItemIndicator, AccordionRoot, IconButton, Text } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";
 import GlossExample from "./GlossExample";

package/es/LicenseByline/EmbedByline.js

@@ -8,7 +8,7 @@
 
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { AlertLine } from "@ndla/icons/common";
+import { AlertLine } from "@ndla/icons";
 import { getLicenseByAbbreviation, getLicenseCredits } from "@ndla/licenses";
 import { Button, Text } from "@ndla/primitives";
 import { styled } from "@ndla/styled-system/jsx";