@ndla/article-converter 6.5.7 → 7.0.0

package/es/plugins/asidePlugin.js

@@ -7,19 +7,13 @@
  */
 
 import { domToReact } from "html-react-parser";
-import { Aside, FactBox } from "@ndla/ui";
+import { FactBox } from "@ndla/ui";
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 export const asidePlugin = (node, opts) => {
   if (node.attribs["data-type"] === "factAside") {
     return _jsx(FactBox, {
       children: domToReact(node.children, opts)
     });
-  } else if (node.attribs["data-type"] === "rightAside") {
-    return _jsx(Aside, {
-      wideScreen: true,
-      alwaysShow: true,
-      children: domToReact(node.children, opts)
-    });
   }
   return null;
 };

package/es/plugins/copyParagraphPlugin.js

@@ -12,7 +12,7 @@ import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 export const copyParagraphPlugin = (node, converterOpts, opts) => {
   var _parent$attribs;
   const parent = node.parent;
-  if ((parent === null || parent === void 0 ? void 0 : parent.name) === "section" || (parent === null || parent === void 0 ? void 0 : parent.name) === "div" && Object.keys((_parent$attribs = parent.attribs) !== null && _parent$attribs !== void 0 ? _parent$attribs : {}).length === 0) {
+  if ((parent === null || parent === void 0 ? void 0 : parent.name) === "section" || (parent === null || parent === void 0 ? void 0 : parent.name) === "div" && Object.keys((_parent$attribs = parent.attribs) !== null && _parent$attribs !== void 0 ? _parent$attribs : {}).length === 0 || (parent === null || parent === void 0 ? void 0 : parent.name) === "ndlaembed" && parent.attribs["data-resource"] === "uu-disclaimer") {
     return _jsx(CopyParagraphButton, {
       copyText: node.attribs["data-text"],
       lang: opts.articleLanguage,

package/es/plugins/divPlugin.js

@@ -21,7 +21,8 @@ export const divPlugin = (node, opts) => {
       ...props,
       children: domToReact(node.children, opts)
     });
-  } else if (node.attribs["data-type"] === "file" && node.childNodes.length) {
+  }
+  if (node.attribs["data-type"] === "file" && node.childNodes.length) {
     const elements = node.childNodes.filter(c => c.type === "tag" && c.name === "ndlaembed" && c.attribs["data-resource"] === "file");
     const [pdfs, files] = elements.reduce((acc, el) => {
       const arr = el.attribs["data-type"] === "pdf" && el.attribs["data-display"] === "block" ? acc[0] : acc[1];
@@ -33,7 +34,8 @@ export const divPlugin = (node, opts) => {
         children: domToReact(files, opts)
       }) : undefined, domToReact(pdfs, opts)]
     });
-  } else if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
+  }
+  if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
     const props = attributesToProps(node.attribs);
     const columns = props["data-columns"];
     const border = props["data-border"];
@@ -47,7 +49,8 @@ export const divPlugin = (node, opts) => {
       ...props,
       children: domToReact(node.children, opts)
     });
-  } else if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
+  }
+  if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
     return _jsx(GridParallaxItem, {
       children: domToReact(node.children, opts)
     });

package/es/plugins/embed/fileEmbedPlugin.js

@@ -23,12 +23,11 @@ export const fileEmbedPlugin = element => {
       title: title,
       url: url
     });
-  } else {
-    return _jsx(File, {
-      url: url,
-      title: title,
-      fileExists: data.status === "success" ? !!data.data.exists : false,
-      fileType: type
-    });
   }
+  return _jsx(File, {
+    url: url,
+    title: title,
+    fileExists: data.status === "success" ? !!data.data.exists : false,
+    fileType: type
+  });
 };

package/es/plugins/h3Plugin.js

@@ -14,7 +14,6 @@ export const h3Plugin = (node, converterOpts, opts) => {
     // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
     _jsx("h3", {
       ...props,
-      tabIndex: 0,
       lang: opts.articleLanguage,
       children: domToReact(node.children, converterOpts)
     })

package/es/plugins/olPlugin.js

@@ -13,7 +13,7 @@ export const olPlugin = (node, converterOpts, opts) => {
   var _node$attribs$class;
   const props = attributesToProps(node.attribs);
   const letterClass = node.attribs["data-type"] === "letters" ? "ol-list--roman" : false;
-  const num = node.attribs["start"];
+  const num = node.attribs.start;
   const numClass = num ? "ol-reset-".concat(num) : false;
   const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : false, letterClass, numClass].filter(c => !!c).join(" ");
   return _jsx(OrderedList, {

package/es/plugins/paragraphPlugin.js

@@ -7,21 +7,11 @@
  */
 
 import { attributesToProps, domToReact } from "html-react-parser";
+import { ArticleParagraph } from "@ndla/ui";
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 export const paragraphPlugin = (node, converterOpts, opts) => {
   const props = attributesToProps(node.attribs);
-  if (node.attribs["data-align"] === "center") {
-    var _node$attribs$class;
-    const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : "", "u-text-center"].filter(c => !!c).join(" ");
-    return _jsx("p", {
-      ...props,
-      lang: opts.articleLanguage,
-      "data-align": undefined,
-      className: classes,
-      children: domToReact(node.children, converterOpts)
-    });
-  }
-  return _jsx("p", {
+  return _jsx(ArticleParagraph, {
     ...props,
     lang: opts.articleLanguage,
     children: domToReact(node.children, converterOpts)

package/es/plugins/ulPlugin.js

@@ -10,12 +10,10 @@ import { attributesToProps, domToReact } from "html-react-parser";
 import { UnOrderedList } from "@ndla/ui";
 import { jsx as _jsx } from "@emotion/react/jsx-runtime";
 export const ulPlugin = (node, converterOpts, opts) => {
-  var _node$attribs$class;
   const props = attributesToProps(node.attribs);
-  const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : "", node.attribs["data-type"] === "two-column" ? "o-list--two-columns" : ""].filter(c => !!c).join(" ");
   return _jsx(UnOrderedList, {
     ...props,
-    className: classes,
+    className: node.attribs.class,
     lang: opts.articleLanguage,
     children: domToReact(node.children, converterOpts)
   });

package/es/transform.js

@@ -24,12 +24,11 @@ const transform = (content, opts) => {
       if (node.name === "ndlaembed") {
         if (embedPlugins[node.attribs["data-resource"]]) {
           return embedPlugins[node.attribs["data-resource"]](node, options, opts);
-        } else {
-          const embed = JSON.parse(node.attribs["data-json"]);
-          return _jsx(UnknownEmbed, {
-            embed: embed
-          });
         }
+        const embed = JSON.parse(node.attribs["data-json"]);
+        return _jsx(UnknownEmbed, {
+          embed: embed
+        });
       }
     }
   };

package/lib/plugins/asidePlugin.js

@@ -20,12 +20,6 @@ const asidePlugin = (node, opts) => {
     return (0, _jsxRuntime.jsx)(_ui.FactBox, {
       children: (0, _htmlReactParser.domToReact)(node.children, opts)
     });
-  } else if (node.attribs["data-type"] === "rightAside") {
-    return (0, _jsxRuntime.jsx)(_ui.Aside, {
-      wideScreen: true,
-      alwaysShow: true,
-      children: (0, _htmlReactParser.domToReact)(node.children, opts)
-    });
   }
   return null;
 };

package/lib/plugins/copyParagraphPlugin.js

@@ -18,7 +18,7 @@ var _jsxRuntime = require("@emotion/react/jsx-runtime");
 const copyParagraphPlugin = (node, converterOpts, opts) => {
   var _parent$attribs;
   const parent = node.parent;
-  if ((parent === null || parent === void 0 ? void 0 : parent.name) === "section" || (parent === null || parent === void 0 ? void 0 : parent.name) === "div" && Object.keys((_parent$attribs = parent.attribs) !== null && _parent$attribs !== void 0 ? _parent$attribs : {}).length === 0) {
+  if ((parent === null || parent === void 0 ? void 0 : parent.name) === "section" || (parent === null || parent === void 0 ? void 0 : parent.name) === "div" && Object.keys((_parent$attribs = parent.attribs) !== null && _parent$attribs !== void 0 ? _parent$attribs : {}).length === 0 || (parent === null || parent === void 0 ? void 0 : parent.name) === "ndlaembed" && parent.attribs["data-resource"] === "uu-disclaimer") {
     return (0, _jsxRuntime.jsx)(_ui.CopyParagraphButton, {
       copyText: node.attribs["data-text"],
       lang: opts.articleLanguage,

package/lib/plugins/divPlugin.js

@@ -27,7 +27,8 @@ const divPlugin = (node, opts) => {
       ...props,
       children: (0, _htmlReactParser.domToReact)(node.children, opts)
     });
-  } else if (node.attribs["data-type"] === "file" && node.childNodes.length) {
+  }
+  if (node.attribs["data-type"] === "file" && node.childNodes.length) {
     const elements = node.childNodes.filter(c => c.type === "tag" && c.name === "ndlaembed" && c.attribs["data-resource"] === "file");
     const [pdfs, files] = elements.reduce((acc, el) => {
       const arr = el.attribs["data-type"] === "pdf" && el.attribs["data-display"] === "block" ? acc[0] : acc[1];
@@ -39,7 +40,8 @@ const divPlugin = (node, opts) => {
         children: (0, _htmlReactParser.domToReact)(files, opts)
       }) : undefined, (0, _htmlReactParser.domToReact)(pdfs, opts)]
     });
-  } else if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
+  }
+  if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
     const props = (0, _htmlReactParser.attributesToProps)(node.attribs);
     const columns = props["data-columns"];
     const border = props["data-border"];
@@ -53,7 +55,8 @@ const divPlugin = (node, opts) => {
       ...props,
       children: (0, _htmlReactParser.domToReact)(node.children, opts)
     });
-  } else if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
+  }
+  if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
     return (0, _jsxRuntime.jsx)(_ui.GridParallaxItem, {
       children: (0, _htmlReactParser.domToReact)(node.children, opts)
     });

package/lib/plugins/embed/fileEmbedPlugin.js

@@ -29,13 +29,12 @@ const fileEmbedPlugin = element => {
       title: title,
       url: url
     });
-  } else {
-    return (0, _jsxRuntime.jsx)(_ui.File, {
-      url: url,
-      title: title,
-      fileExists: data.status === "success" ? !!data.data.exists : false,
-      fileType: type
-    });
   }
+  return (0, _jsxRuntime.jsx)(_ui.File, {
+    url: url,
+    title: title,
+    fileExists: data.status === "success" ? !!data.data.exists : false,
+    fileType: type
+  });
 };
 exports.fileEmbedPlugin = fileEmbedPlugin;

package/lib/plugins/h3Plugin.js

@@ -20,7 +20,6 @@ const h3Plugin = (node, converterOpts, opts) => {
     // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
     (0, _jsxRuntime.jsx)("h3", {
       ...props,
-      tabIndex: 0,
       lang: opts.articleLanguage,
       children: (0, _htmlReactParser.domToReact)(node.children, converterOpts)
     })

package/lib/plugins/olPlugin.js

@@ -19,7 +19,7 @@ const olPlugin = (node, converterOpts, opts) => {
   var _node$attribs$class;
   const props = (0, _htmlReactParser.attributesToProps)(node.attribs);
   const letterClass = node.attribs["data-type"] === "letters" ? "ol-list--roman" : false;
-  const num = node.attribs["start"];
+  const num = node.attribs.start;
   const numClass = num ? "ol-reset-".concat(num) : false;
   const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : false, letterClass, numClass].filter(c => !!c).join(" ");
   return (0, _jsxRuntime.jsx)(_ui.OrderedList, {

package/lib/plugins/paragraphPlugin.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.paragraphPlugin = void 0;
 var _htmlReactParser = require("html-react-parser");
+var _ui = require("@ndla/ui");
 var _jsxRuntime = require("@emotion/react/jsx-runtime");
 /**
  * Copyright (c) 2023-present, NDLA.
@@ -16,18 +17,7 @@ var _jsxRuntime = require("@emotion/react/jsx-runtime");
 
 const paragraphPlugin = (node, converterOpts, opts) => {
   const props = (0, _htmlReactParser.attributesToProps)(node.attribs);
-  if (node.attribs["data-align"] === "center") {
-    var _node$attribs$class;
-    const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : "", "u-text-center"].filter(c => !!c).join(" ");
-    return (0, _jsxRuntime.jsx)("p", {
-      ...props,
-      lang: opts.articleLanguage,
-      "data-align": undefined,
-      className: classes,
-      children: (0, _htmlReactParser.domToReact)(node.children, converterOpts)
-    });
-  }
-  return (0, _jsxRuntime.jsx)("p", {
+  return (0, _jsxRuntime.jsx)(_ui.ArticleParagraph, {
     ...props,
     lang: opts.articleLanguage,
     children: (0, _htmlReactParser.domToReact)(node.children, converterOpts)

package/lib/plugins/ulPlugin.js

@@ -16,12 +16,10 @@ var _jsxRuntime = require("@emotion/react/jsx-runtime");
  */
 
 const ulPlugin = (node, converterOpts, opts) => {
-  var _node$attribs$class;
   const props = (0, _htmlReactParser.attributesToProps)(node.attribs);
-  const classes = [(_node$attribs$class = node.attribs.class) !== null && _node$attribs$class !== void 0 ? _node$attribs$class : "", node.attribs["data-type"] === "two-column" ? "o-list--two-columns" : ""].filter(c => !!c).join(" ");
   return (0, _jsxRuntime.jsx)(_ui.UnOrderedList, {
     ...props,
-    className: classes,
+    className: node.attribs.class,
     lang: opts.articleLanguage,
     children: (0, _htmlReactParser.domToReact)(node.children, converterOpts)
   });

package/lib/transform.js

@@ -31,12 +31,11 @@ const transform = (content, opts) => {
       if (node.name === "ndlaembed") {
         if (_embed.embedPlugins[node.attribs["data-resource"]]) {
           return _embed.embedPlugins[node.attribs["data-resource"]](node, options, opts);
-        } else {
-          const embed = JSON.parse(node.attribs["data-json"]);
-          return (0, _jsxRuntime.jsx)(_ui.UnknownEmbed, {
-            embed: embed
-          });
         }
+        const embed = JSON.parse(node.attribs["data-json"]);
+        return (0, _jsxRuntime.jsx)(_ui.UnknownEmbed, {
+          embed: embed
+        });
       }
     }
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/article-converter",
-  "version": "6.5.7",
+  "version": "7.0.0",
   "description": "Transforms NDLA articles into extended html versions",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -31,21 +31,20 @@
     "@ndla/types-embed": "^4.1.6"
   },
   "dependencies": {
-    "@ndla/code": "^5.0.57",
-    "@ndla/ui": "^50.15.3",
+    "@ndla/ui": "^52.0.0",
     "html-react-parser": "^5.1.8"
   },
   "peerDependencies": {
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
-    "i18next": ">= 23.0.0",
+    "i18next": ">= 23.11.5",
     "react": ">= 16.8.0",
     "react-dom": ">= 16.8.0",
-    "react-i18next": "^13.3.0",
+    "react-i18next": "^14.1.1",
     "react-router-dom": ">= 6.0.0"
   },
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "18d8228e549466cbe95555b84e66960ad4c2e590"
+  "gitHead": "dab99b8c9bf77c2ee7690d348b2ae811af81bd3d"
 }

package/src/plugins/asidePlugin.tsx

@@ -7,18 +7,11 @@
  */
 
 import { DOMNode, domToReact } from "html-react-parser";
-import { Aside, FactBox } from "@ndla/ui";
+import { FactBox } from "@ndla/ui";
 import { PluginType } from "./types";
 export const asidePlugin: PluginType = (node, opts) => {
   if (node.attribs["data-type"] === "factAside") {
     return <FactBox>{domToReact(node.children as DOMNode[], opts)}</FactBox>;
-  } else if (node.attribs["data-type"] === "rightAside") {
-    return (
-      <Aside wideScreen alwaysShow>
-        {domToReact(node.children as DOMNode[], opts)}
-      </Aside>
-    );
   }
-
   return null;
 };

package/src/plugins/copyParagraphPlugin.tsx

@@ -11,7 +11,11 @@ import { CopyParagraphButton } from "@ndla/ui";
 import { PluginType } from "./types";
 export const copyParagraphPlugin: PluginType = (node, converterOpts, opts) => {
   const parent = node.parent as Element | undefined;
-  if (parent?.name === "section" || (parent?.name === "div" && Object.keys(parent.attribs ?? {}).length === 0)) {
+  if (
+    parent?.name === "section" ||
+    (parent?.name === "div" && Object.keys(parent.attribs ?? {}).length === 0) ||
+    (parent?.name === "ndlaembed" && parent.attribs["data-resource"] === "uu-disclaimer")
+  ) {
     return (
       <CopyParagraphButton copyText={node.attribs["data-text"]} lang={opts.articleLanguage}>
         {domToReact(node.children as DOMNode[], converterOpts)}

package/src/plugins/divPlugin.tsx

@@ -23,7 +23,8 @@ export const divPlugin: PluginType = (node, opts) => {
         {domToReact(node.children, opts)}
       </RelatedArticleList>
     );
-  } else if (node.attribs["data-type"] === "file" && node.childNodes.length) {
+  }
+  if (node.attribs["data-type"] === "file" && node.childNodes.length) {
     const elements = node.childNodes.filter(
       (c): c is Element => c.type === "tag" && c.name === "ndlaembed" && c.attribs["data-resource"] === "file",
     );
@@ -42,7 +43,8 @@ export const divPlugin: PluginType = (node, opts) => {
         {domToReact(pdfs, opts)}
       </>
     );
-  } else if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
+  }
+  if (node.attribs["data-type"] === "grid" && node.children.length > 0) {
     const props = attributesToProps(node.attribs);
     const columns = props["data-columns"] as GridType["columns"];
     const border = props["data-border"] as GridType["border"];
@@ -54,7 +56,8 @@ export const divPlugin: PluginType = (node, opts) => {
         {domToReact(node.children, opts)}
       </Grid>
     );
-  } else if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
+  }
+  if (node.attribs["data-parallax-cell"] === "true" && node.children.length) {
     return <GridParallaxItem>{domToReact(node.children as DOMNode[], opts)}</GridParallaxItem>;
   }
   return null;

package/src/plugins/embed/fileEmbedPlugin.tsx

@@ -17,14 +17,8 @@ export const fileEmbedPlugin: PluginType = (element) => {
   const { type, title, url, display } = data.embedData;
   if (type === "pdf" && display === "block") {
     return <PdfFile title={title} url={url} />;
-  } else {
-    return (
-      <File
-        url={url}
-        title={title}
-        fileExists={data.status === "success" ? !!data.data.exists : false}
-        fileType={type}
-      />
-    );
   }
+  return (
+    <File url={url} title={title} fileExists={data.status === "success" ? !!data.data.exists : false} fileType={type} />
+  );
 };

package/src/plugins/h3Plugin.tsx

@@ -12,7 +12,7 @@ export const h3Plugin: PluginType = (node, converterOpts, opts) => {
   const props = attributesToProps(node.attribs);
   return (
     // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    <h3 {...props} tabIndex={0} lang={opts.articleLanguage}>
+    <h3 {...props} lang={opts.articleLanguage}>
       {domToReact(node.children as DOMNode[], converterOpts)}
     </h3>
   );

package/src/plugins/olPlugin.tsx

@@ -12,7 +12,7 @@ import { PluginType } from "./types";
 export const olPlugin: PluginType = (node, converterOpts, opts) => {
   const props = attributesToProps(node.attribs);
   const letterClass = node.attribs["data-type"] === "letters" ? "ol-list--roman" : false;
-  const num = node.attribs["start"];
+  const num = node.attribs.start;
   const numClass = num ? `ol-reset-${num}` : false;
   const classes = [node.attribs.class ?? false, letterClass, numClass].filter((c): c is string => !!c).join(" ");
 

package/src/plugins/paragraphPlugin.tsx

@@ -7,20 +7,14 @@
  */
 
 import { DOMNode, attributesToProps, domToReact } from "html-react-parser";
+import { ArticleParagraph } from "@ndla/ui";
 import { PluginType } from "./types";
+
 export const paragraphPlugin: PluginType = (node, converterOpts, opts) => {
   const props = attributesToProps(node.attribs);
-  if (node.attribs["data-align"] === "center") {
-    const classes = [node.attribs.class ?? "", "u-text-center"].filter((c) => !!c).join(" ");
-    return (
-      <p {...props} lang={opts.articleLanguage} data-align={undefined} className={classes}>
-        {domToReact(node.children as DOMNode[], converterOpts)}
-      </p>
-    );
-  }
   return (
-    <p {...props} lang={opts.articleLanguage}>
+    <ArticleParagraph {...props} lang={opts.articleLanguage}>
       {domToReact(node.children as DOMNode[], converterOpts)}
-    </p>
+    </ArticleParagraph>
   );
 };

package/src/plugins/ulPlugin.tsx

@@ -11,11 +11,8 @@ import { UnOrderedList } from "@ndla/ui";
 import { PluginType } from "./types";
 export const ulPlugin: PluginType = (node, converterOpts, opts) => {
   const props = attributesToProps(node.attribs);
-  const classes = [node.attribs.class ?? "", node.attribs["data-type"] === "two-column" ? "o-list--two-columns" : ""]
-    .filter((c) => !!c)
-    .join(" ");
   return (
-    <UnOrderedList {...props} className={classes} lang={opts.articleLanguage}>
+    <UnOrderedList {...props} className={node.attribs.class} lang={opts.articleLanguage}>
       {domToReact(node.children as DOMNode[], converterOpts)}
     </UnOrderedList>
   );

package/src/transform.tsx

@@ -26,10 +26,9 @@ const transform = (content: string, opts: TransformOptions) => {
       if (node.name === "ndlaembed") {
         if (embedPlugins[node.attribs["data-resource"]]) {
           return embedPlugins[node.attribs["data-resource"]](node, options, opts);
-        } else {
-          const embed = JSON.parse(node.attribs["data-json"]) as MetaData<any, any>;
-          return <UnknownEmbed embed={embed} />;
         }
+        const embed = JSON.parse(node.attribs["data-json"]) as MetaData<any, any>;
+        return <UnknownEmbed embed={embed} />;
       }
     },
   };