@ndla/ui 56.0.18-alpha.0 → 56.0.19-alpha.0

package/es/styles.css

@@ -93,10 +93,6 @@
     display: flex;
 }
 
-  .gap_xxlarge {
-    gap: var(--spacing-xxlarge);
-}
-
   .c_text\.default {
     color: var(--colors-text-default);
 }
@@ -121,6 +117,10 @@
     padding-block-start: var(--spacing-xxlarge);
 }
 
+  .gap_xxlarge {
+    gap: var(--spacing-xxlarge);
+}
+
   .min-h_xxlarge {
     min-height: var(--sizes-xxlarge);
 }
@@ -326,10 +326,18 @@
     text-decoration: underline;
 }
 
+  .d_grid {
+    display: grid;
+}
+
   .h_215px {
     height: 215px;
 }
 
+  .min-w_270px {
+    min-width: 270px;
+}
+
   .bd-l_4px_solid {
     border-left: 4px solid;
 }
@@ -438,6 +446,10 @@
     width: var(--sizes-surface-xlarge);
 }
 
+  .max-h_50vh {
+    max-height: 50vh;
+}
+
   .c_text\.error {
     color: var(--colors-text-error);
 }
@@ -539,14 +551,6 @@
     margin-block-start: var(--spacing-3xsmall);
 }
 
-  .d_grid {
-    display: grid;
-}
-
-  .max-w_surface\.4xlarge {
-    max-width: var(--sizes-surface-4xlarge);
-}
-
   .w_surface\.3xsmall {
     width: var(--sizes-surface-3xsmall);
 }
@@ -678,12 +682,12 @@
     align-items: flex-end;
 }
 
-  .fw_bold {
-    font-weight: var(--font-weights-bold);
+  .grid-tc_1fr {
+    grid-template-columns: 1fr;
 }
 
-  .as_center {
-    align-self: center;
+  .fw_bold {
+    font-weight: var(--font-weights-bold);
 }
 
   .bd-l-c_stroke\.default {
@@ -722,6 +726,10 @@
     top: calc(var(--spacing-4xsmall) * -1);
 }
 
+  .ov-y_auto {
+    overflow-y: auto;
+}
+
   .bg-c_surface\.disabled {
     background-color: var(--colors-surface-disabled);
 }
@@ -900,14 +908,6 @@
     padding-block-end: var(--spacing-5xlarge);
 }
 
-  .\[\&\[data-align\=\"center\"\]\]\:ta_center[data-align="center"] {
-    text-align: center;
-}
-
-  .\[\&\:has\(span\[dir\=\"rtl\"\]\)\]\:direction_rtl:has(span[dir="rtl"]) {
-    direction: rtl;
-}
-
   .\[\&_img\]\:w_100\% img {
     width: 100%;
 }
@@ -1448,9 +1448,6 @@
 }
 
   @media screen and (min-width: 29.75rem) {
-    .mobileWide\:h_340px {
-      height: 340px;
-}
     .mobileWide\:d_none {
       display: none;
 }
@@ -1465,6 +1462,9 @@
   @media screen and (min-width: 37.5625rem) {
     .tablet\:px_medium {
       padding-inline: var(--spacing-medium);
+}
+    .tablet\:h_265px {
+      height: 265px;
 }
     .tablet\:h_26px {
       height: 26px;
@@ -1544,8 +1544,8 @@
     .tabletWide\:max-w_532px {
       max-width: 532px;
 }
-    .tabletWide\:w_auto {
-      width: auto;
+    .tabletWide\:h_340px {
+      height: 340px;
 }
     .tabletWide\:d_block {
       display: block;
@@ -1570,6 +1570,12 @@
 }
     .tabletWide\:jc_space-between {
       justify-content: space-between;
+}
+    .tabletWide\:grid-tc_minmax\(230px\,_455px\)_auto {
+      grid-template-columns: minmax(230px, 455px) auto;
+}
+    .tabletWide\:grid-tc_auto_minmax\(230px\,_455px\) {
+      grid-template-columns: auto minmax(230px, 455px);
 }
 }
 

package/es/utils/licenseAttributes.js

@@ -0,0 +1,18 @@
+/**
+ * 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 { getLicenseByAbbreviation, isCreativeCommonsLicense } from "@ndla/licenses";
+export const licenseAttributes = (license, lang, url) => {
+  const licenseAbbr = getLicenseByAbbreviation(license ? license : "", lang);
+  const licenseProps = isCreativeCommonsLicense(licenseAbbr.rights) ? {
+    "xmlns:cc": "https://creativecommons.org/ns#",
+    "xmlns:dct": "http://purl.org/dc/terms/",
+    about: url ?? undefined
+  } : {};
+  return licenseProps;
+};

package/lib/Article/Article.js

@@ -39,7 +39,6 @@ const StyledArticleWrapper = (0, _jsx2.styled)(_react2.ark.article, {
     background: "background.default",
     display: "flex",
     flexDirection: "column",
-    gap: "xxlarge",
     color: "text.default",
     alignItems: "center",
     width: "100%",
@@ -118,7 +117,7 @@ const ArticleTitle = _ref2 => {
   } = _ref2;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(ArticleHeader, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ArticleHGroup, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledStack, {
+      children: [(!!contentType || !!heartButton) && /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledStack, {
         justify: "space-between",
         align: "center",
         direction: "row",
@@ -127,9 +126,10 @@ const ArticleTitle = _ref2 => {
           contentType: contentType
         }), heartButton]
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Heading, {
-        textStyle: "heading.large",
+        textStyle: "heading.medium",
         id: id,
         lang: lang,
+        property: "dct:title",
         children: title
       })]
     }), !!introduction && /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Text, {

package/lib/Article/ArticleByline.js

@@ -31,9 +31,6 @@ const Wrapper = (0, _jsx2.styled)("div", {
     borderColor: "stroke.subtle"
   }
 });
-
-// TODO: This is designed with 24px of inline padding. If you do this, most bylines will break into two lines.
-// Should reconsider.
 const TextWrapper = (0, _jsx2.styled)("div", {
   base: {
     display: "flex",
@@ -136,7 +133,11 @@ const ArticleByline = _ref => {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(LicenseWrapper, {
         children: [license && /*#__PURE__*/(0, _jsxRuntime.jsx)(_LicenseLink.LicenseLink, {
           license: license
-        }), showPrimaryContributors && /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+        }), showPrimaryContributors &&
+        /*#__PURE__*/
+        //eslint-disable-next-line react/no-unknown-property
+        (0, _jsxRuntime.jsxs)("span", {
+          property: "cc:attributionName",
           children: [authors.length > 0 && `${t("article.authorsLabel", {
             names: renderContributors(authors, t),
             interpolation: {

package/lib/Article/index.d.ts

@@ -8,4 +8,3 @@
 export { Article, ArticleWrapper, ArticleHeader, ArticleFooter, ArticleTitle, ArticleHGroup, ArticleContent, } from "./Article";
 export { ArticleByline, ArticleBylineAccordionItem } from "./ArticleByline";
 export { ArticleFootNotes } from "./ArticleFootNotes";
-export { ArticleParagraph } from "./ArticleParagraph";

package/lib/Article/index.js

@@ -51,12 +51,6 @@ Object.defineProperty(exports, "ArticleHeader", {
     return _Article.ArticleHeader;
   }
 });
-Object.defineProperty(exports, "ArticleParagraph", {
-  enumerable: true,
-  get: function () {
-    return _ArticleParagraph.ArticleParagraph;
-  }
-});
 Object.defineProperty(exports, "ArticleTitle", {
   enumerable: true,
   get: function () {
@@ -71,5 +65,4 @@ Object.defineProperty(exports, "ArticleWrapper", {
 });
 var _Article = require("./Article");
 var _ArticleByline = require("./ArticleByline");
-var _ArticleFootNotes = require("./ArticleFootNotes");
-var _ArticleParagraph = require("./ArticleParagraph");
+var _ArticleFootNotes = require("./ArticleFootNotes");

package/lib/AudioPlayer/AudioPlayer.js

@@ -180,7 +180,7 @@ const AudioPlayer = _ref => {
           }), !!textVersion && !img && textVersionButton]
         }), description && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Text, {
           textStyle: "body.medium",
-          children: [showFullDescription || description.length < DESCRIPTION_MAX_LENGTH ? description : `${truncatedDescription}...`, /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Button, {
+          children: [showFullDescription || description.length < DESCRIPTION_MAX_LENGTH ? description : `${truncatedDescription}...`, description.length > DESCRIPTION_MAX_LENGTH && /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Button, {
             variant: "link",
             onClick: () => setShowFullDescription(p => !p),
             children: t(`audio.${showFullDescription ? "readLessDescriptionLabel" : "readMoreDescriptionLabel"}`)

package/lib/CampaignBlock/CampaignBlock.js

@@ -22,20 +22,32 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 
 const Container = (0, _jsx2.styled)("div", {
   base: {
-    width: "100%",
-    display: "flex",
+    display: "grid",
+    gridTemplateColumns: "1fr",
     gap: "medium",
-    flexDirection: "column",
     border: "1px solid",
     borderColor: "stroke.default",
     backgroundColor: "background.default",
     borderRadius: "xsmall",
     boxShadow: "full",
-    marginBlockEnd: "4xsmall",
-    overflow: "hidden",
-    tabletWide: {
-      flexDirection: "row"
+    overflow: "hidden"
+  },
+  variants: {
+    imageSide: {
+      left: {
+        tabletWide: {
+          gridTemplateColumns: "minmax(230px, 455px) auto" //required for campaign block in myNdla
+        }
+      },
+      right: {
+        tabletWide: {
+          gridTemplateColumns: "auto minmax(230px, 455px)" //required for campaign block in myNdla
+        }
+      }
     }
+  },
+  defaultVariants: {
+    imageSide: "left"
   }
 });
 const LinkText = (0, _jsx2.styled)(_primitives.Text, {
@@ -61,29 +73,28 @@ const LinkHeader = (0, _jsx2.styled)(_primitives.Text, {
 });
 const StyledImg = (0, _jsx2.styled)("img", {
   base: {
-    alignSelf: "center",
     objectFit: "cover",
     width: "100%",
     height: "215px",
-    mobileWide: {
-      height: "340px"
+    tablet: {
+      height: "265px"
     },
     tabletWide: {
-      width: "auto"
+      height: "340px"
     }
   }
 });
 const ContentWrapper = (0, _jsx2.styled)("div", {
   base: {
     width: "100%",
-    position: "relative",
     display: "flex",
     flexDirection: "column",
     gap: "medium",
     alignItems: "flex-start",
     justifyContent: "center",
     paddingBlock: "medium",
-    paddingInline: "medium"
+    paddingInline: "medium",
+    minWidth: "270px" //required for campaign block in myNdla
   }
 });
 const StyledText = (0, _jsx2.styled)(_primitives.Text, {
@@ -135,6 +146,7 @@ const CampaignBlock = _ref2 => {
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
     className: className,
     "data-embed-type": "campaign-block",
+    imageSide: imageSide,
     children: [imageSide === "left" && imageComponent, /*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(MaybeLinkText, {
         url: url?.url,

package/lib/Concept/Concept.d.ts

@@ -14,5 +14,6 @@ export interface ConceptProps extends ComponentPropsWithRef<"figure"> {
     lang?: string;
     title?: string;
     children?: ReactNode;
+    source?: string;
 }
 export declare const Concept: import("react").ForwardRefExoticComponent<Omit<ConceptProps, "ref"> & import("react").RefAttributes<HTMLElement>>;

package/lib/Concept/Concept.js

@@ -9,6 +9,7 @@ var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _Embed = require("../Embed");
 var _EmbedByline = require("../LicenseByline/EmbedByline");
+var _licenseAttributes = require("../utils/licenseAttributes");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Copyright (c) 2024-present, NDLA.
@@ -44,11 +45,14 @@ const Concept = exports.Concept = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref
     lang,
     children,
     title,
+    source,
     ...rest
   } = _ref;
+  const licenseProps = (0, _licenseAttributes.licenseAttributes)(copyright?.license?.license, lang, source);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledFigure, {
     ref: ref,
     ...rest,
+    ...licenseProps,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ContentWrapper, {
       lang: lang,
       children: [!!title && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {

package/lib/ContactBlock/ContactBlock.js

@@ -43,7 +43,6 @@ const StyledWrapper = (0, _jsx2.styled)("div", {
     alignItems: "center",
     justifyContent: "space-between",
     boxShadow: "full",
-    marginBlockEnd: "4xsmall",
     border: "1px solid",
     gap: "medium",
     position: "relative",

package/lib/ContentTypeBadge/ContentTypeBadgeNew.js

@@ -27,12 +27,9 @@ const contentTypeToBadgeVariantMap = exports.contentTypeToBadgeVariantMap = {
   [contentTypes.SOURCE_MATERIAL]: "brand1",
   [contentTypes.LEARNING_PATH]: "brand3",
   [contentTypes.TOPIC]: "neutral",
-  // TODO: Verify this color
   [contentTypes.MULTIDISCIPLINARY]: "neutral",
   [contentTypes.CONCEPT]: "brand1",
-  // TODO: Verify this color
   [contentTypes.EXTERNAL]: "brand2",
-  // TODO: Verify resourceEmbedTypeMapping colors
   [contentTypes.IMAGE]: "brand1",
   [contentTypes.AUDIO]: "brand1",
   [contentTypes.PODCAST]: "brand1",

package/lib/ContentTypeHero/ContentTypeHero.js

@@ -18,23 +18,18 @@ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e;
  *
  */
 
-// TODO: Figure out what to do with frontpage articles. If anything...
-// Also, verify all of these colors.
 const contentTypeToHeroMap = exports.contentTypeToHeroMap = {
   [contentTypes.SUBJECT_MATERIAL]: "primary",
-  [contentTypes.TASKS_AND_ACTIVITIES]: "brand2Strong",
+  [contentTypes.TASKS_AND_ACTIVITIES]: "brand2Bold",
   [contentTypes.ASSESSMENT_RESOURCES]: "brand2",
   // This will never happen
   [contentTypes.SUBJECT]: "primary",
   [contentTypes.SOURCE_MATERIAL]: "brand1",
   // This will never happen
   [contentTypes.LEARNING_PATH]: "primary",
-  // TODO: This needs a color
   [contentTypes.TOPIC]: "neutral",
-  // TODO: This is just taken from thin air.
-  [contentTypes.MULTIDISCIPLINARY]: "brand4",
+  [contentTypes.MULTIDISCIPLINARY]: "primary",
   [contentTypes.CONCEPT]: "brand1Subtle",
-  // TODO: No clue what this'll be. Maybe unused?
   [contentTypes.EXTERNAL]: "primary",
   [contentTypes.IMAGE]: "primary",
   [contentTypes.AUDIO]: "primary",

package/lib/Embed/AudioEmbed.js

@@ -8,6 +8,7 @@ var _primitives = require("@ndla/primitives");
 var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
 var _AudioPlayer = _interopRequireDefault(require("../AudioPlayer"));
 var _LicenseByline = require("../LicenseByline");
+var _licenseAttributes = require("../utils/licenseAttributes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
@@ -51,9 +52,11 @@ const AudioEmbed = _ref => {
     url: coverPhoto.url,
     alt: coverPhoto.altText
   };
+  const licenseProps = (0, _licenseAttributes.licenseAttributes)(data.copyright.license.license, lang, embedData.url);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Figure, {
     lang: lang,
     "data-embed-type": type,
+    ...licenseProps,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_AudioPlayer.default, {
       description: data.podcastMeta?.introduction ?? "",
       img: img,

package/lib/Embed/BrightcoveEmbed.d.ts

@@ -10,8 +10,9 @@ import { RenderContext } from "./types";
 interface Props {
     embed: BrightcoveMetaData;
     renderContext?: RenderContext;
+    lang?: string;
 }
 export declare const makeIframeString: (url: string, width: string | number, height: string | number, title?: string) => string;
 export declare const isNumeric: (value: any) => boolean;
-declare const BrightcoveEmbed: ({ embed, renderContext }: Props) => import("react/jsx-runtime").JSX.Element;
+declare const BrightcoveEmbed: ({ embed, renderContext, lang }: Props) => import("react/jsx-runtime").JSX.Element;
 export default BrightcoveEmbed;

package/lib/Embed/BrightcoveEmbed.js

@@ -11,6 +11,7 @@ var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
 var _LicenseByline = require("../LicenseByline");
+var _licenseAttributes = require("../utils/licenseAttributes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
@@ -58,7 +59,8 @@ const getIframeProps = (data, sources) => {
 const BrightcoveEmbed = _ref => {
   let {
     embed,
-    renderContext = "article"
+    renderContext = "article",
+    lang
   } = _ref;
   const [showOriginalVideo, setShowOriginalVideo] = (0, _react.useState)(true);
   const {
@@ -107,8 +109,10 @@ const BrightcoveEmbed = _ref => {
     ...embedData,
     videoid: linkedVideoId
   }, data.sources) : undefined;
+  const licenseProps = (0, _licenseAttributes.licenseAttributes)(data?.copyright?.license.license, lang, embedData.pageUrl);
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Figure, {
     "data-embed-type": "brightcove",
+    ...licenseProps,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       className: "brightcove-video",
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BrightcoveIframe, {

package/lib/Embed/ConceptEmbed.d.ts

@@ -19,6 +19,7 @@ interface Props extends BaseProps {
 export declare const ConceptEmbed: ({ embed, renderContext, lang }: Props) => import("react/jsx-runtime").JSX.Element;
 export interface InlineConceptProps extends ConceptProps, BaseProps {
     linkText?: string;
+    source?: string;
 }
 export declare const InlineConcept: import("react").ForwardRefExoticComponent<Omit<InlineConceptProps, "ref"> & import("react").RefAttributes<HTMLSpanElement>>;
 export interface BlockConceptProps extends ConceptProps {

package/lib/Embed/ConceptEmbed.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.InlineConcept = exports.ConceptEmbed = exports.BlockConcept = void 0;
 var _htmlReactParser = _interopRequireDefault(require("html-react-parser"));
 var _react = require("react");
+var _react2 = require("@ark-ui/react");
 var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
@@ -24,7 +25,9 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
 
 const StyledPopoverContent = (0, _jsx2.styled)(_primitives.PopoverContent, {
   base: {
-    width: "surface.xlarge"
+    width: "surface.xlarge",
+    maxHeight: "50vh",
+    overflowY: "auto"
   }
 });
 const ConceptEmbed = _ref => {
@@ -65,6 +68,7 @@ const ConceptEmbed = _ref => {
       visualElement: visualElement,
       lang: lang,
       title: concept.title.title,
+      source: concept.source,
       children: parsedContent
     });
   }
@@ -73,6 +77,7 @@ const ConceptEmbed = _ref => {
     visualElement: visualElement,
     lang: lang,
     title: renderContext === "embed" ? undefined : concept.title.title,
+    source: concept.source,
     children: parsedContent
   });
 };
@@ -85,23 +90,27 @@ const InlineConcept = exports.InlineConcept = /*#__PURE__*/(0, _react.forwardRef
     lang,
     children,
     title,
+    source,
     ...rest
   } = _ref2;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.PopoverRoot, {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.PopoverTrigger, {
       asChild: true,
+      ref: ref,
+      ...rest,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_InlineTriggerButton.InlineTriggerButton, {
-        ...rest,
-        ref: ref,
         children: linkText
       })
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledPopoverContent, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Concept.Concept, {
-        copyright: copyright,
-        visualElement: visualElement,
-        lang: lang,
-        title: title,
-        children: children
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Portal, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledPopoverContent, {
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Concept.Concept, {
+          copyright: copyright,
+          visualElement: visualElement,
+          lang: lang,
+          title: title,
+          source: source,
+          children: children
+        })
       })
     })]
   });

package/lib/Embed/ConceptListEmbed.js

@@ -69,7 +69,8 @@ const ConceptListEmbed = _ref => {
                 content: concept.content.content,
                 copyright: concept.copyright,
                 visualElement: visualElement,
-                lang: lang
+                lang: lang,
+                source: concept.source
               })
             }, concept.id);
           })

package/lib/Embed/ImageEmbed.js

@@ -13,6 +13,7 @@ var _primitives = require("@ndla/primitives");
 var _jsx2 = require("@ndla/styled-system/jsx");
 var _EmbedErrorPlaceholder = _interopRequireDefault(require("./EmbedErrorPlaceholder"));
 var _LicenseByline = require("../LicenseByline");
+var _licenseAttributes = require("../utils/licenseAttributes");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
@@ -233,12 +234,14 @@ const ImageEmbed = _ref => {
   const toggleImageSize = () => {
     setImageSizes(sizes => !sizes ? expandedSizes : undefined);
   };
+  const licenseProps = (0, _licenseAttributes.licenseAttributes)(data.copyright.license.license, lang, embedData.url);
 
   // TODO: Check how this works with `children`. Will only be important for ED
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledFigure, {
     float: figureProps?.float,
     size: imageSizes ? "full" : figureProps?.size ?? "medium",
     "data-embed-type": "image",
+    ...licenseProps,
     children: [children, /*#__PURE__*/(0, _jsxRuntime.jsxs)(ImageWrapper, {
       border: embedData.border === "true",
       expandable: !!figureProps?.float,

package/lib/Embed/index.d.ts

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

package/lib/Embed/index.js

@@ -87,6 +87,12 @@ Object.defineProperty(exports, "InlineConcept", {
     return _ConceptEmbed.InlineConcept;
   }
 });
+Object.defineProperty(exports, "InlineTriggerButton", {
+  enumerable: true,
+  get: function () {
+    return _InlineTriggerButton.InlineTriggerButton;
+  }
+});
 Object.defineProperty(exports, "RelatedContentEmbed", {
   enumerable: true,
   get: function () {
@@ -118,6 +124,7 @@ Object.defineProperty(exports, "getFocalPoint", {
   }
 });
 var _ImageEmbed = _interopRequireWildcard(require("./ImageEmbed"));
+var _InlineTriggerButton = require("./InlineTriggerButton");
 var _AudioEmbed = _interopRequireDefault(require("./AudioEmbed"));
 var _H5pEmbed = _interopRequireDefault(require("./H5pEmbed"));
 var _ExternalEmbed = _interopRequireDefault(require("./ExternalEmbed"));

package/lib/FileList/FileList.d.ts

@@ -9,6 +9,8 @@ import { ComponentPropsWithoutRef } from "react";
 interface Props extends ComponentPropsWithoutRef<"div"> {
 }
 export declare const FileListWrapper: import("@ndla/styled-system/types").StyledComponent<"div", {}>;
-export declare const FileListItem: import("@ndla/styled-system/types").StyledComponent<"li", {}>;
+export declare const FileListItem: import("@ndla/styled-system/types").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
+} & import("@ark-ui/react").PolymorphicProps>, {}>;
 export declare const FileListEmbed: ({ children, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};