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

package/es/ContentLoader/index.js

@@ -1,82 +0,0 @@
-/**
- * Copyright (c) 2018-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 { uuid } from "@ndla/util";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const ContentLoader = _ref => {
-  let {
-    children,
-    width = 400,
-    height = 130,
-    preserveAspectRatio = "xMidYMid meet",
-    className = "",
-    primaryColor = "#f0f0f0",
-    secondaryColor = "#e0e0e0",
-    speed = 2,
-    viewBox: viewBoxProp,
-    ...rest
-  } = _ref;
-  const idClip = uuid();
-  const idGradient = uuid();
-  const viewBox = viewBoxProp === undefined ? `0 0 ${width} ${height}` : viewBoxProp;
-  return /*#__PURE__*/_jsxs("svg", {
-    viewBox: viewBox ?? undefined,
-    version: "1.1",
-    preserveAspectRatio: preserveAspectRatio,
-    className: className,
-    ...rest,
-    height: typeof height === "string" ? height : undefined,
-    width: typeof width === "string" ? width : undefined,
-    children: [/*#__PURE__*/_jsx("rect", {
-      style: {
-        fill: `url(#${idGradient})`
-      },
-      clipPath: `url(#${idClip})`,
-      x: "0",
-      y: "0",
-      width: width,
-      height: height
-    }), /*#__PURE__*/_jsxs("defs", {
-      children: [/*#__PURE__*/_jsx("clipPath", {
-        id: idClip,
-        children: children
-      }), /*#__PURE__*/_jsxs("linearGradient", {
-        id: idGradient,
-        children: [/*#__PURE__*/_jsx("stop", {
-          offset: "0%",
-          stopColor: primaryColor,
-          children: /*#__PURE__*/_jsx("animate", {
-            attributeName: "offset",
-            values: "-2; 1",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        }), /*#__PURE__*/_jsx("stop", {
-          offset: "50%",
-          stopColor: secondaryColor,
-          children: /*#__PURE__*/_jsx("animate", {
-            attributeName: "offset",
-            values: "-1.5; 1.5",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        }), /*#__PURE__*/_jsx("stop", {
-          offset: "100%",
-          stopColor: primaryColor,
-          children: /*#__PURE__*/_jsx("animate", {
-            attributeName: "offset",
-            values: "-1; 2",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        })]
-      })]
-    })]
-  });
-};
-export default ContentLoader;

package/es/ContentTypeBadge/ContentTypeBadgeNew.js

@@ -1,49 +0,0 @@
-/**
- * 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 { forwardRef } from "react";
-import { useTranslation } from "react-i18next";
-import { Badge } from "@ndla/primitives";
-import * as contentTypes from "../model/ContentType";
-import { jsx as _jsx } from "react/jsx-runtime";
-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"
-};
-export const ContentTypeBadge = /*#__PURE__*/forwardRef((_ref, ref) => {
-  let {
-    contentType,
-    children,
-    ...props
-  } = _ref;
-  const {
-    t
-  } = useTranslation();
-  return /*#__PURE__*/_jsx(Badge, {
-    colorTheme: contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"],
-    ...props,
-    ref: ref,
-    children: children ?? t(`contentTypes.${contentType}`)
-  });
-});

package/es/ContentTypeBadge/index.js

@@ -1,11 +0,0 @@
-/**
- * Copyright (c) 2018-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 { ContentTypeBadge } from "./ContentTypeBadge";
-export { SubjectMaterialBadge, TasksAndActivitiesBadge, AssessmentResourcesBadge, SubjectBadge, SourceMaterialBadge, LearningPathBadge, ConceptBadge } from "./ContentTypeBadge";
-export default ContentTypeBadge;

package/lib/ContentLoader/index.d.ts

@@ -1,16 +0,0 @@
-/**
- * Copyright (c) 2018-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 { ReactNode, SVGProps } from "react";
-interface Props extends Omit<SVGProps<SVGSVGElement>, "viewBox"> {
-    children?: ReactNode;
-    primaryColor?: string;
-    secondaryColor?: string;
-    viewBox?: string | null;
-}
-declare const ContentLoader: ({ children, width, height, preserveAspectRatio, className, primaryColor, secondaryColor, speed, viewBox: viewBoxProp, ...rest }: Props) => import("react/jsx-runtime").JSX.Element;
-export default ContentLoader;

package/lib/ContentLoader/index.js

@@ -1,88 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _util = require("@ndla/util");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * Copyright (c) 2018-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 ContentLoader = _ref => {
-  let {
-    children,
-    width = 400,
-    height = 130,
-    preserveAspectRatio = "xMidYMid meet",
-    className = "",
-    primaryColor = "#f0f0f0",
-    secondaryColor = "#e0e0e0",
-    speed = 2,
-    viewBox: viewBoxProp,
-    ...rest
-  } = _ref;
-  const idClip = (0, _util.uuid)();
-  const idGradient = (0, _util.uuid)();
-  const viewBox = viewBoxProp === undefined ? `0 0 ${width} ${height}` : viewBoxProp;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
-    viewBox: viewBox ?? undefined,
-    version: "1.1",
-    preserveAspectRatio: preserveAspectRatio,
-    className: className,
-    ...rest,
-    height: typeof height === "string" ? height : undefined,
-    width: typeof width === "string" ? width : undefined,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
-      style: {
-        fill: `url(#${idGradient})`
-      },
-      clipPath: `url(#${idClip})`,
-      x: "0",
-      y: "0",
-      width: width,
-      height: height
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("defs", {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("clipPath", {
-        id: idClip,
-        children: children
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("linearGradient", {
-        id: idGradient,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-          offset: "0%",
-          stopColor: primaryColor,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("animate", {
-            attributeName: "offset",
-            values: "-2; 1",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-          offset: "50%",
-          stopColor: secondaryColor,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("animate", {
-            attributeName: "offset",
-            values: "-1.5; 1.5",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)("stop", {
-          offset: "100%",
-          stopColor: primaryColor,
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)("animate", {
-            attributeName: "offset",
-            values: "-1; 2",
-            dur: `${speed}s`,
-            repeatCount: "indefinite"
-          })
-        })]
-      })]
-    })]
-  });
-};
-var _default = exports.default = ContentLoader;

package/lib/ContentTypeBadge/ContentTypeBadgeNew.d.ts

@@ -1,16 +0,0 @@
-/**
- * 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 { BadgeProps, type BadgeVariant } from "@ndla/primitives";
-import * as contentTypes from "../model/ContentType";
-export interface ContentTypeBadgeProps extends Omit<BadgeProps, "colorTheme"> {
-    contentType: ContentType | undefined;
-}
-export type StrictContentType = typeof contentTypes.SUBJECT_MATERIAL | typeof contentTypes.TASKS_AND_ACTIVITIES | typeof contentTypes.ASSESSMENT_RESOURCES | typeof contentTypes.SUBJECT | typeof contentTypes.SOURCE_MATERIAL | typeof contentTypes.LEARNING_PATH | typeof contentTypes.TOPIC | typeof contentTypes.MULTIDISCIPLINARY | typeof contentTypes.CONCEPT | typeof contentTypes.EXTERNAL | typeof contentTypes.IMAGE | typeof contentTypes.AUDIO | typeof contentTypes.VIDEO | typeof contentTypes.MISSING | typeof contentTypes.PODCAST | typeof contentTypes.GLOSS | typeof contentTypes.PROGRAMME | typeof contentTypes.PODCAST_SERIES;
-export type ContentType = StrictContentType | (string & {});
-export declare const contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant>;
-export declare const ContentTypeBadge: import("react").ForwardRefExoticComponent<ContentTypeBadgeProps & import("react").RefAttributes<HTMLDivElement>>;

package/lib/ContentTypeBadge/ContentTypeBadgeNew.js

@@ -1,57 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.contentTypeToBadgeVariantMap = exports.ContentTypeBadge = void 0;
-var _react = require("react");
-var _reactI18next = require("react-i18next");
-var _primitives = require("@ndla/primitives");
-var contentTypes = _interopRequireWildcard(require("../model/ContentType"));
-var _jsxRuntime = require("react/jsx-runtime");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/**
- * 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.
- *
- */
-
-const contentTypeToBadgeVariantMap = exports.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"
-};
-const ContentTypeBadge = exports.ContentTypeBadge = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    contentType,
-    children,
-    ...props
-  } = _ref;
-  const {
-    t
-  } = (0, _reactI18next.useTranslation)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Badge, {
-    colorTheme: contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"],
-    ...props,
-    ref: ref,
-    children: children ?? t(`contentTypes.${contentType}`)
-  });
-});

package/lib/ContentTypeBadge/index.d.ts

@@ -1,10 +0,0 @@
-/**
- * Copyright (c) 2018-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 { ContentTypeBadge } from "./ContentTypeBadge";
-export { SubjectMaterialBadge, TasksAndActivitiesBadge, AssessmentResourcesBadge, SubjectBadge, SourceMaterialBadge, LearningPathBadge, ConceptBadge, } from "./ContentTypeBadge";
-export default ContentTypeBadge;

package/lib/ContentTypeBadge/index.js

@@ -1,57 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "AssessmentResourcesBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.AssessmentResourcesBadge;
-  }
-});
-Object.defineProperty(exports, "ConceptBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.ConceptBadge;
-  }
-});
-Object.defineProperty(exports, "LearningPathBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.LearningPathBadge;
-  }
-});
-Object.defineProperty(exports, "SourceMaterialBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.SourceMaterialBadge;
-  }
-});
-Object.defineProperty(exports, "SubjectBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.SubjectBadge;
-  }
-});
-Object.defineProperty(exports, "SubjectMaterialBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.SubjectMaterialBadge;
-  }
-});
-Object.defineProperty(exports, "TasksAndActivitiesBadge", {
-  enumerable: true,
-  get: function () {
-    return _ContentTypeBadge.TasksAndActivitiesBadge;
-  }
-});
-exports.default = void 0;
-var _ContentTypeBadge = require("./ContentTypeBadge");
-/**
- * Copyright (c) 2018-present, NDLA.
- *
- * This source code is licensed under the GPLv3 license found in the
- * LICENSE file in the root directory of this source tree.
- *
- */
-var _default = exports.default = _ContentTypeBadge.ContentTypeBadge;

package/src/ContentLoader/ContentLoader.stories.tsx

@@ -1,62 +0,0 @@
-/**
- * Copyright (c) 2018-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 { Meta, StoryObj } from "@storybook/react";
-import ContentLoader from ".";
-
-export default {
-  title: "Components/ContentLoader",
-  tags: ["autodocs"],
-  parameters: {
-    inlineStories: true,
-  },
-  args: {
-    speed: 2,
-  },
-  argTypes: {
-    children: { control: false },
-  },
-  component: ContentLoader,
-} as Meta<typeof ContentLoader>;
-
-export const ImageOrVideo: StoryObj<typeof ContentLoader> = {
-  args: {
-    width: 1000,
-    height: 750,
-    children: (
-      <>
-        <rect x="0" y="0" rx="3" ry="3" width="800" height="600" />
-        <rect x="20" y="610" rx="3" ry="3" width="600" height="30" />
-        <rect x="20" y="650" rx="3" ry="3" width="400" height="30" />
-        <circle cx="30" cy="700" r="15" fill="purple" />
-        <circle cx="70" cy="700" r="15" fill="purple" />
-        <circle cx="110" cy="700" r="15" fill="purple" />
-      </>
-    ),
-  },
-};
-
-export const Article: StoryObj<typeof ContentLoader> = {
-  args: {
-    width: 1000,
-    height: 1050,
-    children: (
-      <>
-        <rect x="100" y="0" rx="3" ry="3" width="800" height="60" />
-        <rect x="100" y="100" rx="3" ry="3" width="800" height="25" />
-        <rect x="100" y="140" rx="3" ry="3" width="800" height="25" />
-        <rect x="100" y="180" rx="3" ry="3" width="400" height="25" />
-        <rect x="0" y="260" rx="3" ry="3" width="1000" height="600" />
-        <rect x="100" y="900" rx="3" ry="3" width="800" height="20" />
-        <rect x="100" y="930" rx="3" ry="3" width="800" height="20" />
-        <rect x="100" y="970" rx="3" ry="3" width="800" height="20" />
-        <rect x="100" y="1000" rx="3" ry="3" width="600" height="20" />
-      </>
-    ),
-  },
-};

package/src/ContentLoader/index.tsx

@@ -1,73 +0,0 @@
-/**
- * Copyright (c) 2018-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 { ReactNode, SVGProps } from "react";
-import { uuid } from "@ndla/util";
-
-interface Props extends Omit<SVGProps<SVGSVGElement>, "viewBox"> {
-  children?: ReactNode;
-  primaryColor?: string;
-  secondaryColor?: string;
-  viewBox?: string | null;
-}
-
-const ContentLoader = ({
-  children,
-  width = 400,
-  height = 130,
-  preserveAspectRatio = "xMidYMid meet",
-  className = "",
-  primaryColor = "#f0f0f0",
-  secondaryColor = "#e0e0e0",
-  speed = 2,
-  viewBox: viewBoxProp,
-  ...rest
-}: Props) => {
-  const idClip = uuid();
-  const idGradient = uuid();
-  const viewBox = viewBoxProp === undefined ? `0 0 ${width} ${height}` : viewBoxProp;
-
-  return (
-    <svg
-      viewBox={viewBox ?? undefined}
-      version="1.1"
-      preserveAspectRatio={preserveAspectRatio}
-      className={className}
-      {...rest}
-      height={typeof height === "string" ? height : undefined}
-      width={typeof width === "string" ? width : undefined}
-    >
-      <rect
-        style={{ fill: `url(#${idGradient})` }}
-        clipPath={`url(#${idClip})`}
-        x="0"
-        y="0"
-        width={width}
-        height={height}
-      />
-
-      <defs>
-        <clipPath id={idClip}>{children}</clipPath>
-
-        <linearGradient id={idGradient}>
-          <stop offset="0%" stopColor={primaryColor}>
-            <animate attributeName="offset" values="-2; 1" dur={`${speed}s`} repeatCount="indefinite" />
-          </stop>
-          <stop offset="50%" stopColor={secondaryColor}>
-            <animate attributeName="offset" values="-1.5; 1.5" dur={`${speed}s`} repeatCount="indefinite" />
-          </stop>
-          <stop offset="100%" stopColor={primaryColor}>
-            <animate attributeName="offset" values="-1; 2" dur={`${speed}s`} repeatCount="indefinite" />
-          </stop>
-        </linearGradient>
-      </defs>
-    </svg>
-  );
-};
-
-export default ContentLoader;

package/src/ContentTypeBadge/ContentTypeBadgeNew.stories.tsx

@@ -1,70 +0,0 @@
-/**
- * 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 { useTranslation } from "react-i18next";
-import { Meta, StoryFn, StoryObj } from "@storybook/react";
-import { MovieLine } from "@ndla/icons/editor";
-import { HStack, styled } from "@ndla/styled-system/jsx";
-import { ContentTypeBadge } from "./ContentTypeBadgeNew";
-
-export default {
-  title: "Components/ContentTypeBadgeNew",
-  component: ContentTypeBadge,
-  tags: ["autodocs"],
-  parameters: {
-    inlineStories: true,
-  },
-  args: {
-    contentType: "subject-material",
-  },
-} satisfies Meta<typeof ContentTypeBadge>;
-
-export const Default: StoryObj<typeof ContentTypeBadge> = {};
-
-const StyledHStack = styled(HStack, {
-  base: {
-    flexWrap: "wrap",
-  },
-});
-
-export const AllBadges: StoryFn<typeof ContentTypeBadge> = () => (
-  <StyledHStack gap="3xsmall">
-    <ContentTypeBadge contentType="subject-material" />
-    <ContentTypeBadge contentType="tasks-and-activities" />
-    <ContentTypeBadge contentType="assessment-resources" />
-    <ContentTypeBadge contentType="subject" />
-    <ContentTypeBadge contentType="source-material" />
-    <ContentTypeBadge contentType="learning-path" />
-    <ContentTypeBadge contentType="topic" />
-    <ContentTypeBadge contentType="multidisciplinary" />
-    <ContentTypeBadge contentType="concept" />
-    <ContentTypeBadge contentType="external" />
-    <ContentTypeBadge contentType="image" />
-    <ContentTypeBadge contentType="audio" />
-    <ContentTypeBadge contentType="video" />
-    <ContentTypeBadge contentType="missing" />
-  </StyledHStack>
-);
-
-const StyledContentTypeBadge = styled(ContentTypeBadge, {
-  base: {
-    display: "flex",
-    gap: "4xsmall",
-    alignItems: "center",
-  },
-});
-
-export const ContentOverride: StoryFn<typeof ContentTypeBadge> = () => {
-  const { t } = useTranslation();
-  return (
-    <StyledContentTypeBadge contentType="video">
-      <MovieLine size="small" />
-      {t("contentTypes.video")}
-    </StyledContentTypeBadge>
-  );
-};

package/src/ContentTypeBadge/ContentTypeBadgeNew.tsx

@@ -1,77 +0,0 @@
-/**
- * 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 { forwardRef } from "react";
-import { useTranslation } from "react-i18next";
-import { Badge, BadgeProps, type BadgeVariant } from "@ndla/primitives";
-import * as contentTypes from "../model/ContentType";
-
-export interface ContentTypeBadgeProps extends Omit<BadgeProps, "colorTheme"> {
-  contentType: ContentType | undefined;
-}
-
-export type StrictContentType =
-  | typeof contentTypes.SUBJECT_MATERIAL
-  | typeof contentTypes.TASKS_AND_ACTIVITIES
-  | typeof contentTypes.ASSESSMENT_RESOURCES
-  | typeof contentTypes.SUBJECT
-  | typeof contentTypes.SOURCE_MATERIAL
-  | typeof contentTypes.LEARNING_PATH
-  | typeof contentTypes.TOPIC
-  | typeof contentTypes.MULTIDISCIPLINARY
-  | typeof contentTypes.CONCEPT
-  | typeof contentTypes.EXTERNAL
-  | typeof contentTypes.IMAGE
-  | typeof contentTypes.AUDIO
-  | typeof contentTypes.VIDEO
-  | typeof contentTypes.MISSING
-  | typeof contentTypes.PODCAST
-  | typeof contentTypes.GLOSS
-  | typeof contentTypes.PROGRAMME
-  | typeof contentTypes.PODCAST_SERIES;
-
-export type ContentType =
-  | StrictContentType
-  // This allows for us to fallback to string without getting a ts error, while still keeping intellisense
-  | (string & {});
-
-export const contentTypeToBadgeVariantMap: Record<ContentType, BadgeVariant> = {
-  [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",
-};
-
-export const ContentTypeBadge = forwardRef<HTMLDivElement, ContentTypeBadgeProps>(
-  ({ contentType, children, ...props }, ref) => {
-    const { t } = useTranslation();
-    return (
-      <Badge
-        colorTheme={contentTypeToBadgeVariantMap[contentType ?? "missing"] ?? contentTypeToBadgeVariantMap["missing"]}
-        {...props}
-        ref={ref}
-      >
-        {children ?? t(`contentTypes.${contentType}`)}
-      </Badge>
-    );
-  },
-);