@ndla/ui 56.0.94-alpha.0 → 56.0.96-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -22,9 +22,11 @@ export const ContentTypeBlockQuote = /*#__PURE__*/forwardRef((_ref, ref) => {
22
22
  contentType,
23
23
  ...props
24
24
  } = _ref;
25
+ const color = contentType ? contentTypeToVariantMapping[contentType] ?? "brand1" : "brand1";
26
+ const variantColor = variant === "colored" ? color : undefined;
25
27
  return /*#__PURE__*/_jsx(BlockQuote, {
26
28
  ...props,
27
- variant: variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined,
29
+ variant: variantColor,
28
30
  ref: ref
29
31
  });
30
32
  });
@@ -22,9 +22,11 @@ export const ContentTypeFramedContent = /*#__PURE__*/forwardRef((_ref, ref) => {
22
22
  contentType,
23
23
  ...props
24
24
  } = _ref;
25
+ const color = contentType ? contentTypeToVariantMapping[contentType] ?? "brand1" : "brand1";
26
+ const variantColor = variant === "colored" ? color : undefined;
25
27
  return /*#__PURE__*/_jsx(FramedContent, {
26
28
  ...props,
27
- colorTheme: variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined,
29
+ colorTheme: variantColor,
28
30
  ref: ref
29
31
  });
30
32
  });
@@ -6,7 +6,7 @@
6
6
  *
7
7
  */
8
8
 
9
- import { forwardRef, useCallback, useEffect, useId, useMemo, useState } from "react";
9
+ import React, { forwardRef, useCallback, useEffect, useId, useMemo, useState } from "react";
10
10
  import { useTranslation } from "react-i18next";
11
11
  import { ArrowDownShortLine } from "@ndla/icons";
12
12
  import { IconButton } from "@ndla/primitives";
@@ -116,10 +116,11 @@ const FactBox = /*#__PURE__*/forwardRef((_ref, ref) => {
116
116
  const [state, setState] = useState(defaultOpen ? "open" : "closed");
117
117
  const contentId = useId();
118
118
  // Inert has existed since early 2023. It allows us to disable tabindex inside the content if it is closed, allowing us to be accessible for users with newish browsers. React 18 removes this because it doesn't recognize the attribute. This is a workaround for that.
119
- // TODO: Remove this hack when we upgrade to React 19.
119
+ // When running in React 18, we need to use an empty string instead of true.
120
+ // TODO: Remove this hack once we upgrade to React 19 as a peer dep.
120
121
  const inertAttribute = useMemo(() => {
121
122
  return state === "closed" ? {
122
- inert: ""
123
+ inert: typeof React.use === "function" ? true : ""
123
124
  } : {};
124
125
  }, [state]);
125
126
  useEffect(() => {
@@ -1508,6 +1508,23 @@ const messages = {
1508
1508
  is360Video: "VR video",
1509
1509
  close: "Lukk"
1510
1510
  }
1511
+ },
1512
+ richTextEditor: {
1513
+ tooltip: {
1514
+ bold: "Bold ({{shortcut}})",
1515
+ code: "Code ({{shortcut}})",
1516
+ sub: "Subscript ({{shortcut}})",
1517
+ sup: "Superscript ({{shortcut}})",
1518
+ underlined: "Underlined ({{shortcut}})",
1519
+ italic: "Italic ({{shortcut}})",
1520
+ "numbered-list": "Numbered list ({{shortcut}})",
1521
+ "letter-list": "Alphabetical list ({{shortcut}})",
1522
+ "bulleted-list": "Bulleted list ({{shortcut}})",
1523
+ heading: "Heading {{level}} ({{shortcut}})",
1524
+ paragraph: "Paragraph ({{shortcut}})",
1525
+ section: "Section ({{shortcut}})",
1526
+ link: "Link ({{shortcut}})"
1527
+ }
1511
1528
  }
1512
1529
  };
1513
1530
  export default messages;
@@ -1508,6 +1508,23 @@ const messages = {
1508
1508
  is360Video: "VR-video",
1509
1509
  close: "Lukk"
1510
1510
  }
1511
+ },
1512
+ richTextEditor: {
1513
+ tooltip: {
1514
+ bold: "Fet ({{shortcut}})",
1515
+ code: "Kode ({{shortcut}})",
1516
+ sub: "Senket skrift ({{shortcut}})",
1517
+ sup: "Hevet skrift ({{shortcut}})",
1518
+ underlined: "Understreket ({{shortcut}})",
1519
+ italic: "Kursiv ({{shortcut}})",
1520
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1521
+ "letter-list": "Bokstavliste ({{shortcut}})",
1522
+ "bulleted-list": "Punktliste ({{shortcut}})",
1523
+ heading: "Overskrift {{level}} ({{shortcut}})",
1524
+ paragraph: "Paragraf ({{shortcut}})",
1525
+ section: "Seksjon ({{shortcut}})",
1526
+ link: "Lenke ({{shortcut}})"
1527
+ }
1511
1528
  }
1512
1529
  };
1513
1530
  export default messages;
@@ -1508,6 +1508,23 @@ const messages = {
1508
1508
  is360Video: "VR-video",
1509
1509
  close: "Lukk"
1510
1510
  }
1511
+ },
1512
+ richTextEditor: {
1513
+ tooltip: {
1514
+ bold: "Fet ({{shortcut}})",
1515
+ code: "Kode ({{shortcut}})",
1516
+ sub: "Senka skrift ({{shortcut}})",
1517
+ sup: "Heva skrift ({{shortcut}})",
1518
+ underlined: "Understreka ({{shortcut}})",
1519
+ italic: "Kursiv ({{shortcut}})",
1520
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1521
+ "letter-list": "Alfabetisk liste ({{shortcut}})",
1522
+ "bulleted-list": "Punktliste ({{shortcut}})",
1523
+ heading: "Overskrift {{level}} ({{shortcut}})",
1524
+ paragraph: "Paragraf ({{shortcut}})",
1525
+ section: "Seksjon ({{shortcut}})",
1526
+ link: "Lenke ({{shortcut}})"
1527
+ }
1511
1528
  }
1512
1529
  };
1513
1530
  export default messages;
@@ -1508,6 +1508,23 @@ const messages = {
1508
1508
  is360Video: "VR-video",
1509
1509
  close: "Lukk"
1510
1510
  }
1511
+ },
1512
+ richTextEditor: {
1513
+ tooltip: {
1514
+ bold: "Fet ({{shortcut}})",
1515
+ code: "Kode ({{shortcut}})",
1516
+ sub: "Senket skrift ({{shortcut}})",
1517
+ sup: "Hevet skrift ({{shortcut}})",
1518
+ underlined: "Understreket ({{shortcut}})",
1519
+ italic: "Kursiv ({{shortcut}})",
1520
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1521
+ "letter-list": "Bokstavliste ({{shortcut}})",
1522
+ "bulleted-list": "Punktliste ({{shortcut}})",
1523
+ heading: "Overskrift {{level}} ({{shortcut}})",
1524
+ paragraph: "Paragraf ({{shortcut}})",
1525
+ section: "Seksjon ({{shortcut}})",
1526
+ link: "Lenke ({{shortcut}})"
1527
+ }
1511
1528
  }
1512
1529
  };
1513
1530
  export default messages;
@@ -1508,6 +1508,23 @@ const messages = {
1508
1508
  is360Video: "VR-video",
1509
1509
  close: "Lukk"
1510
1510
  }
1511
+ },
1512
+ richTextEditor: {
1513
+ tooltip: {
1514
+ bold: "Fet ({{shortcut}})",
1515
+ code: "Kode ({{shortcut}})",
1516
+ sub: "Senket skrift ({{shortcut}})",
1517
+ sup: "Hevet skrift ({{shortcut}})",
1518
+ underlined: "Understreket ({{shortcut}})",
1519
+ italic: "Kursiv ({{shortcut}})",
1520
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1521
+ "letter-list": "Bokstavliste ({{shortcut}})",
1522
+ "bulleted-list": "Punktliste ({{shortcut}})",
1523
+ heading: "Overskrift {{level}} ({{shortcut}})",
1524
+ paragraph: "Paragraf ({{shortcut}})",
1525
+ section: "Seksjon ({{shortcut}})",
1526
+ link: "Lenke ({{shortcut}})"
1527
+ }
1511
1528
  }
1512
1529
  };
1513
1530
  export default messages;
@@ -28,9 +28,11 @@ const ContentTypeBlockQuote = exports.ContentTypeBlockQuote = /*#__PURE__*/(0, _
28
28
  contentType,
29
29
  ...props
30
30
  } = _ref;
31
+ const color = contentType ? contentTypeToVariantMapping[contentType] ?? "brand1" : "brand1";
32
+ const variantColor = variant === "colored" ? color : undefined;
31
33
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.BlockQuote, {
32
34
  ...props,
33
- variant: variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined,
35
+ variant: variantColor,
34
36
  ref: ref
35
37
  });
36
38
  });
@@ -28,9 +28,11 @@ const ContentTypeFramedContent = exports.ContentTypeFramedContent = /*#__PURE__*
28
28
  contentType,
29
29
  ...props
30
30
  } = _ref;
31
+ const color = contentType ? contentTypeToVariantMapping[contentType] ?? "brand1" : "brand1";
32
+ const variantColor = variant === "colored" ? color : undefined;
31
33
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.FramedContent, {
32
34
  ...props,
33
- colorTheme: variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined,
35
+ colorTheme: variantColor,
34
36
  ref: ref
35
37
  });
36
38
  });
@@ -5,12 +5,12 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  *
7
7
  */
8
- import { type ComponentProps, type ReactNode } from "react";
8
+ import React, { type ComponentProps, type ReactNode } from "react";
9
9
  interface Props extends ComponentProps<"aside"> {
10
10
  children?: ReactNode;
11
11
  defaultOpen?: boolean;
12
12
  open?: boolean;
13
13
  onOpenChange?: (open: boolean) => void;
14
14
  }
15
- declare const FactBox: import("react").ForwardRefExoticComponent<Omit<Props, "ref"> & import("react").RefAttributes<HTMLElement>>;
15
+ declare const FactBox: React.ForwardRefExoticComponent<Omit<Props, "ref"> & React.RefAttributes<HTMLElement>>;
16
16
  export default FactBox;
@@ -4,12 +4,14 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.default = void 0;
7
- var _react = require("react");
7
+ var _react = _interopRequireWildcard(require("react"));
8
8
  var _reactI18next = require("react-i18next");
9
9
  var _icons = require("@ndla/icons");
10
10
  var _primitives = require("@ndla/primitives");
11
11
  var _jsx2 = require("@ndla/styled-system/jsx");
12
12
  var _jsxRuntime = require("react/jsx-runtime");
13
+ 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); }
14
+ 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; }
13
15
  /**
14
16
  * Copyright (c) 2016-present, NDLA.
15
17
  *
@@ -122,10 +124,11 @@ const FactBox = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
122
124
  const [state, setState] = (0, _react.useState)(defaultOpen ? "open" : "closed");
123
125
  const contentId = (0, _react.useId)();
124
126
  // Inert has existed since early 2023. It allows us to disable tabindex inside the content if it is closed, allowing us to be accessible for users with newish browsers. React 18 removes this because it doesn't recognize the attribute. This is a workaround for that.
125
- // TODO: Remove this hack when we upgrade to React 19.
127
+ // When running in React 18, we need to use an empty string instead of true.
128
+ // TODO: Remove this hack once we upgrade to React 19 as a peer dep.
126
129
  const inertAttribute = (0, _react.useMemo)(() => {
127
130
  return state === "closed" ? {
128
- inert: ""
131
+ inert: typeof _react.default.use === "function" ? true : ""
129
132
  } : {};
130
133
  }, [state]);
131
134
  (0, _react.useEffect)(() => {
@@ -1465,5 +1465,22 @@ declare const messages: {
1465
1465
  close: string;
1466
1466
  };
1467
1467
  };
1468
+ richTextEditor: {
1469
+ tooltip: {
1470
+ bold: string;
1471
+ code: string;
1472
+ sub: string;
1473
+ sup: string;
1474
+ underlined: string;
1475
+ italic: string;
1476
+ "numbered-list": string;
1477
+ "letter-list": string;
1478
+ "bulleted-list": string;
1479
+ heading: string;
1480
+ paragraph: string;
1481
+ section: string;
1482
+ link: string;
1483
+ };
1484
+ };
1468
1485
  };
1469
1486
  export default messages;
@@ -1515,6 +1515,23 @@ const messages = {
1515
1515
  is360Video: "VR video",
1516
1516
  close: "Lukk"
1517
1517
  }
1518
+ },
1519
+ richTextEditor: {
1520
+ tooltip: {
1521
+ bold: "Bold ({{shortcut}})",
1522
+ code: "Code ({{shortcut}})",
1523
+ sub: "Subscript ({{shortcut}})",
1524
+ sup: "Superscript ({{shortcut}})",
1525
+ underlined: "Underlined ({{shortcut}})",
1526
+ italic: "Italic ({{shortcut}})",
1527
+ "numbered-list": "Numbered list ({{shortcut}})",
1528
+ "letter-list": "Alphabetical list ({{shortcut}})",
1529
+ "bulleted-list": "Bulleted list ({{shortcut}})",
1530
+ heading: "Heading {{level}} ({{shortcut}})",
1531
+ paragraph: "Paragraph ({{shortcut}})",
1532
+ section: "Section ({{shortcut}})",
1533
+ link: "Link ({{shortcut}})"
1534
+ }
1518
1535
  }
1519
1536
  };
1520
1537
  var _default = exports.default = messages;
@@ -1465,5 +1465,22 @@ declare const messages: {
1465
1465
  close: string;
1466
1466
  };
1467
1467
  };
1468
+ richTextEditor: {
1469
+ tooltip: {
1470
+ bold: string;
1471
+ code: string;
1472
+ sub: string;
1473
+ sup: string;
1474
+ underlined: string;
1475
+ italic: string;
1476
+ "numbered-list": string;
1477
+ "letter-list": string;
1478
+ "bulleted-list": string;
1479
+ heading: string;
1480
+ paragraph: string;
1481
+ section: string;
1482
+ link: string;
1483
+ };
1484
+ };
1468
1485
  };
1469
1486
  export default messages;
@@ -1515,6 +1515,23 @@ const messages = {
1515
1515
  is360Video: "VR-video",
1516
1516
  close: "Lukk"
1517
1517
  }
1518
+ },
1519
+ richTextEditor: {
1520
+ tooltip: {
1521
+ bold: "Fet ({{shortcut}})",
1522
+ code: "Kode ({{shortcut}})",
1523
+ sub: "Senket skrift ({{shortcut}})",
1524
+ sup: "Hevet skrift ({{shortcut}})",
1525
+ underlined: "Understreket ({{shortcut}})",
1526
+ italic: "Kursiv ({{shortcut}})",
1527
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1528
+ "letter-list": "Bokstavliste ({{shortcut}})",
1529
+ "bulleted-list": "Punktliste ({{shortcut}})",
1530
+ heading: "Overskrift {{level}} ({{shortcut}})",
1531
+ paragraph: "Paragraf ({{shortcut}})",
1532
+ section: "Seksjon ({{shortcut}})",
1533
+ link: "Lenke ({{shortcut}})"
1534
+ }
1518
1535
  }
1519
1536
  };
1520
1537
  var _default = exports.default = messages;
@@ -1465,5 +1465,22 @@ declare const messages: {
1465
1465
  close: string;
1466
1466
  };
1467
1467
  };
1468
+ richTextEditor: {
1469
+ tooltip: {
1470
+ bold: string;
1471
+ code: string;
1472
+ sub: string;
1473
+ sup: string;
1474
+ underlined: string;
1475
+ italic: string;
1476
+ "numbered-list": string;
1477
+ "letter-list": string;
1478
+ "bulleted-list": string;
1479
+ heading: string;
1480
+ paragraph: string;
1481
+ section: string;
1482
+ link: string;
1483
+ };
1484
+ };
1468
1485
  };
1469
1486
  export default messages;
@@ -1515,6 +1515,23 @@ const messages = {
1515
1515
  is360Video: "VR-video",
1516
1516
  close: "Lukk"
1517
1517
  }
1518
+ },
1519
+ richTextEditor: {
1520
+ tooltip: {
1521
+ bold: "Fet ({{shortcut}})",
1522
+ code: "Kode ({{shortcut}})",
1523
+ sub: "Senka skrift ({{shortcut}})",
1524
+ sup: "Heva skrift ({{shortcut}})",
1525
+ underlined: "Understreka ({{shortcut}})",
1526
+ italic: "Kursiv ({{shortcut}})",
1527
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1528
+ "letter-list": "Alfabetisk liste ({{shortcut}})",
1529
+ "bulleted-list": "Punktliste ({{shortcut}})",
1530
+ heading: "Overskrift {{level}} ({{shortcut}})",
1531
+ paragraph: "Paragraf ({{shortcut}})",
1532
+ section: "Seksjon ({{shortcut}})",
1533
+ link: "Lenke ({{shortcut}})"
1534
+ }
1518
1535
  }
1519
1536
  };
1520
1537
  var _default = exports.default = messages;
@@ -1465,5 +1465,22 @@ declare const messages: {
1465
1465
  close: string;
1466
1466
  };
1467
1467
  };
1468
+ richTextEditor: {
1469
+ tooltip: {
1470
+ bold: string;
1471
+ code: string;
1472
+ sub: string;
1473
+ sup: string;
1474
+ underlined: string;
1475
+ italic: string;
1476
+ "numbered-list": string;
1477
+ "letter-list": string;
1478
+ "bulleted-list": string;
1479
+ heading: string;
1480
+ paragraph: string;
1481
+ section: string;
1482
+ link: string;
1483
+ };
1484
+ };
1468
1485
  };
1469
1486
  export default messages;
@@ -1515,6 +1515,23 @@ const messages = {
1515
1515
  is360Video: "VR-video",
1516
1516
  close: "Lukk"
1517
1517
  }
1518
+ },
1519
+ richTextEditor: {
1520
+ tooltip: {
1521
+ bold: "Fet ({{shortcut}})",
1522
+ code: "Kode ({{shortcut}})",
1523
+ sub: "Senket skrift ({{shortcut}})",
1524
+ sup: "Hevet skrift ({{shortcut}})",
1525
+ underlined: "Understreket ({{shortcut}})",
1526
+ italic: "Kursiv ({{shortcut}})",
1527
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1528
+ "letter-list": "Bokstavliste ({{shortcut}})",
1529
+ "bulleted-list": "Punktliste ({{shortcut}})",
1530
+ heading: "Overskrift {{level}} ({{shortcut}})",
1531
+ paragraph: "Paragraf ({{shortcut}})",
1532
+ section: "Seksjon ({{shortcut}})",
1533
+ link: "Lenke ({{shortcut}})"
1534
+ }
1518
1535
  }
1519
1536
  };
1520
1537
  var _default = exports.default = messages;
@@ -1465,5 +1465,22 @@ declare const messages: {
1465
1465
  close: string;
1466
1466
  };
1467
1467
  };
1468
+ richTextEditor: {
1469
+ tooltip: {
1470
+ bold: string;
1471
+ code: string;
1472
+ sub: string;
1473
+ sup: string;
1474
+ underlined: string;
1475
+ italic: string;
1476
+ "numbered-list": string;
1477
+ "letter-list": string;
1478
+ "bulleted-list": string;
1479
+ heading: string;
1480
+ paragraph: string;
1481
+ section: string;
1482
+ link: string;
1483
+ };
1484
+ };
1468
1485
  };
1469
1486
  export default messages;
@@ -1515,6 +1515,23 @@ const messages = {
1515
1515
  is360Video: "VR-video",
1516
1516
  close: "Lukk"
1517
1517
  }
1518
+ },
1519
+ richTextEditor: {
1520
+ tooltip: {
1521
+ bold: "Fet ({{shortcut}})",
1522
+ code: "Kode ({{shortcut}})",
1523
+ sub: "Senket skrift ({{shortcut}})",
1524
+ sup: "Hevet skrift ({{shortcut}})",
1525
+ underlined: "Understreket ({{shortcut}})",
1526
+ italic: "Kursiv ({{shortcut}})",
1527
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1528
+ "letter-list": "Bokstavliste ({{shortcut}})",
1529
+ "bulleted-list": "Punktliste ({{shortcut}})",
1530
+ heading: "Overskrift {{level}} ({{shortcut}})",
1531
+ paragraph: "Paragraf ({{shortcut}})",
1532
+ section: "Seksjon ({{shortcut}})",
1533
+ link: "Lenke ({{shortcut}})"
1534
+ }
1518
1535
  }
1519
1536
  };
1520
1537
  var _default = exports.default = messages;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ndla/ui",
3
- "version": "56.0.94-alpha.0",
3
+ "version": "56.0.96-alpha.0",
4
4
  "description": "UI component library for NDLA",
5
5
  "license": "GPL-3.0",
6
6
  "main": "lib/index.js",
@@ -35,8 +35,8 @@
35
35
  "@ndla/core": "^5.0.3",
36
36
  "@ndla/icons": "^8.0.50-alpha.0",
37
37
  "@ndla/licenses": "^8.0.6-alpha.0",
38
- "@ndla/primitives": "^1.0.71-alpha.0",
39
- "@ndla/safelink": "^7.0.72-alpha.0",
38
+ "@ndla/primitives": "^1.0.72-alpha.0",
39
+ "@ndla/safelink": "^7.0.73-alpha.0",
40
40
  "@ndla/styled-system": "^0.0.30",
41
41
  "@ndla/util": "^5.0.5-alpha.0",
42
42
  "html-react-parser": "^5.1.19",
@@ -58,5 +58,5 @@
58
58
  "publishConfig": {
59
59
  "access": "public"
60
60
  },
61
- "gitHead": "ee44caa84045f796a9d85a0fd51d1df7bd740dd2"
61
+ "gitHead": "2157834f629fe65d702d09a80ffe1f888616ac37"
62
62
  }
@@ -26,11 +26,7 @@ interface Props extends Omit<BlockQuoteProps, "variant"> {
26
26
  }
27
27
 
28
28
  export const ContentTypeBlockQuote = forwardRef<HTMLQuoteElement, Props>(({ variant, contentType, ...props }, ref) => {
29
- return (
30
- <BlockQuote
31
- {...props}
32
- variant={variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined}
33
- ref={ref}
34
- />
35
- );
29
+ const color = contentType ? (contentTypeToVariantMapping[contentType] ?? "brand1") : "brand1";
30
+ const variantColor = variant === "colored" ? color : undefined;
31
+ return <BlockQuote {...props} variant={variantColor} ref={ref} />;
36
32
  });
@@ -27,12 +27,8 @@ interface Props extends FramedContentProps {
27
27
 
28
28
  export const ContentTypeFramedContent = forwardRef<HTMLDivElement, Props>(
29
29
  ({ variant = "neutral", contentType, ...props }, ref) => {
30
- return (
31
- <FramedContent
32
- {...props}
33
- colorTheme={variant === "colored" && contentType ? contentTypeToVariantMapping[contentType] : undefined}
34
- ref={ref}
35
- />
36
- );
30
+ const color = contentType ? (contentTypeToVariantMapping[contentType] ?? "brand1") : "brand1";
31
+ const variantColor = variant === "colored" ? color : undefined;
32
+ return <FramedContent {...props} colorTheme={variantColor} ref={ref} />;
37
33
  },
38
34
  );
@@ -6,7 +6,7 @@
6
6
  *
7
7
  */
8
8
 
9
- import {
9
+ import React, {
10
10
  type ComponentProps,
11
11
  type ReactNode,
12
12
  forwardRef,
@@ -126,9 +126,10 @@ const FactBox = forwardRef<HTMLElement, Props>(
126
126
  const [state, setState] = useState<"open" | "closed">(defaultOpen ? "open" : "closed");
127
127
  const contentId = useId();
128
128
  // Inert has existed since early 2023. It allows us to disable tabindex inside the content if it is closed, allowing us to be accessible for users with newish browsers. React 18 removes this because it doesn't recognize the attribute. This is a workaround for that.
129
- // TODO: Remove this hack when we upgrade to React 19.
129
+ // When running in React 18, we need to use an empty string instead of true.
130
+ // TODO: Remove this hack once we upgrade to React 19 as a peer dep.
130
131
  const inertAttribute = useMemo(() => {
131
- return state === "closed" ? { inert: "" } : {};
132
+ return state === "closed" ? { inert: typeof React.use === "function" ? true : "" } : {};
132
133
  }, [state]) as { inert?: boolean };
133
134
 
134
135
  useEffect(() => {
@@ -1539,6 +1539,23 @@ const messages = {
1539
1539
  close: "Lukk",
1540
1540
  },
1541
1541
  },
1542
+ richTextEditor: {
1543
+ tooltip: {
1544
+ bold: "Bold ({{shortcut}})",
1545
+ code: "Code ({{shortcut}})",
1546
+ sub: "Subscript ({{shortcut}})",
1547
+ sup: "Superscript ({{shortcut}})",
1548
+ underlined: "Underlined ({{shortcut}})",
1549
+ italic: "Italic ({{shortcut}})",
1550
+ "numbered-list": "Numbered list ({{shortcut}})",
1551
+ "letter-list": "Alphabetical list ({{shortcut}})",
1552
+ "bulleted-list": "Bulleted list ({{shortcut}})",
1553
+ heading: "Heading {{level}} ({{shortcut}})",
1554
+ paragraph: "Paragraph ({{shortcut}})",
1555
+ section: "Section ({{shortcut}})",
1556
+ link: "Link ({{shortcut}})",
1557
+ },
1558
+ },
1542
1559
  };
1543
1560
 
1544
1561
  export default messages;
@@ -1540,6 +1540,23 @@ const messages = {
1540
1540
  close: "Lukk",
1541
1541
  },
1542
1542
  },
1543
+ richTextEditor: {
1544
+ tooltip: {
1545
+ bold: "Fet ({{shortcut}})",
1546
+ code: "Kode ({{shortcut}})",
1547
+ sub: "Senket skrift ({{shortcut}})",
1548
+ sup: "Hevet skrift ({{shortcut}})",
1549
+ underlined: "Understreket ({{shortcut}})",
1550
+ italic: "Kursiv ({{shortcut}})",
1551
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1552
+ "letter-list": "Bokstavliste ({{shortcut}})",
1553
+ "bulleted-list": "Punktliste ({{shortcut}})",
1554
+ heading: "Overskrift {{level}} ({{shortcut}})",
1555
+ paragraph: "Paragraf ({{shortcut}})",
1556
+ section: "Seksjon ({{shortcut}})",
1557
+ link: "Lenke ({{shortcut}})",
1558
+ },
1559
+ },
1543
1560
  };
1544
1561
 
1545
1562
  export default messages;
@@ -1539,6 +1539,23 @@ const messages = {
1539
1539
  close: "Lukk",
1540
1540
  },
1541
1541
  },
1542
+ richTextEditor: {
1543
+ tooltip: {
1544
+ bold: "Fet ({{shortcut}})",
1545
+ code: "Kode ({{shortcut}})",
1546
+ sub: "Senka skrift ({{shortcut}})",
1547
+ sup: "Heva skrift ({{shortcut}})",
1548
+ underlined: "Understreka ({{shortcut}})",
1549
+ italic: "Kursiv ({{shortcut}})",
1550
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1551
+ "letter-list": "Alfabetisk liste ({{shortcut}})",
1552
+ "bulleted-list": "Punktliste ({{shortcut}})",
1553
+ heading: "Overskrift {{level}} ({{shortcut}})",
1554
+ paragraph: "Paragraf ({{shortcut}})",
1555
+ section: "Seksjon ({{shortcut}})",
1556
+ link: "Lenke ({{shortcut}})",
1557
+ },
1558
+ },
1542
1559
  };
1543
1560
 
1544
1561
  export default messages;
@@ -1541,6 +1541,23 @@ const messages = {
1541
1541
  close: "Lukk",
1542
1542
  },
1543
1543
  },
1544
+ richTextEditor: {
1545
+ tooltip: {
1546
+ bold: "Fet ({{shortcut}})",
1547
+ code: "Kode ({{shortcut}})",
1548
+ sub: "Senket skrift ({{shortcut}})",
1549
+ sup: "Hevet skrift ({{shortcut}})",
1550
+ underlined: "Understreket ({{shortcut}})",
1551
+ italic: "Kursiv ({{shortcut}})",
1552
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1553
+ "letter-list": "Bokstavliste ({{shortcut}})",
1554
+ "bulleted-list": "Punktliste ({{shortcut}})",
1555
+ heading: "Overskrift {{level}} ({{shortcut}})",
1556
+ paragraph: "Paragraf ({{shortcut}})",
1557
+ section: "Seksjon ({{shortcut}})",
1558
+ link: "Lenke ({{shortcut}})",
1559
+ },
1560
+ },
1544
1561
  };
1545
1562
 
1546
1563
  export default messages;
@@ -1543,6 +1543,23 @@ const messages = {
1543
1543
  close: "Lukk",
1544
1544
  },
1545
1545
  },
1546
+ richTextEditor: {
1547
+ tooltip: {
1548
+ bold: "Fet ({{shortcut}})",
1549
+ code: "Kode ({{shortcut}})",
1550
+ sub: "Senket skrift ({{shortcut}})",
1551
+ sup: "Hevet skrift ({{shortcut}})",
1552
+ underlined: "Understreket ({{shortcut}})",
1553
+ italic: "Kursiv ({{shortcut}})",
1554
+ "numbered-list": "Nummerert liste ({{shortcut}})",
1555
+ "letter-list": "Bokstavliste ({{shortcut}})",
1556
+ "bulleted-list": "Punktliste ({{shortcut}})",
1557
+ heading: "Overskrift {{level}} ({{shortcut}})",
1558
+ paragraph: "Paragraf ({{shortcut}})",
1559
+ section: "Seksjon ({{shortcut}})",
1560
+ link: "Lenke ({{shortcut}})",
1561
+ },
1562
+ },
1546
1563
  };
1547
1564
 
1548
1565
  export default messages;