@transferwise/components 0.0.0-experimental-32cf8db → 0.0.0-experimental-68c810c

package/build/index.js

@@ -7489,47 +7489,48 @@ InputWithDisplayFormat.propTypes = {
 };
 var InputWithDisplayFormat$1 = InputWithDisplayFormat;
 
-const InstructionsList = props => {
-  const {
-    isModern
-  } = componentsTheming.useTheme();
-  const {
-    dos,
-    donts
-  } = props;
-  const DontIcon = isModern ? icons.CrossCircleFill : icons.CrossCircle;
-  const DoIcon = isModern ? icons.CheckCircleFill : icons.CheckCircle;
+const InstructionsList = ({
+  dos,
+  donts
+}) => {
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "tw-instructions",
     children: [dos && dos.map((doThis, index) =>
     /*#__PURE__*/
     // eslint-disable-next-line react/no-array-index-key
-    jsxRuntime.jsxs("div", {
-      className: "instruction",
-      children: [/*#__PURE__*/jsxRuntime.jsx(DoIcon, {
-        size: 24,
-        className: "do"
-      }), /*#__PURE__*/jsxRuntime.jsx(Body, {
-        className: "text-primary",
-        type: exports.Typography.BODY_LARGE,
-        children: doThis
-      })]
+    jsxRuntime.jsx(Instruction, {
+      item: doThis,
+      type: "do"
     }, index)), donts && donts.map((dont, index) =>
     /*#__PURE__*/
     // eslint-disable-next-line react/no-array-index-key
-    jsxRuntime.jsxs("div", {
-      className: "instruction",
-      children: [/*#__PURE__*/jsxRuntime.jsx(DontIcon, {
-        size: 24,
-        className: "dont"
-      }), /*#__PURE__*/jsxRuntime.jsx(Body, {
-        className: "text-primary",
-        type: exports.Typography.BODY_LARGE,
-        children: dont
-      })]
+    jsxRuntime.jsx(Instruction, {
+      item: dont,
+      type: "dont"
     }, index))]
   });
 };
+function Instruction({
+  item,
+  type
+}) {
+  const isInstructionNode = typeof item === 'object' && item !== null && 'content' in item && 'aria-label' in item;
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    className: "instruction",
+    "aria-label": isInstructionNode ? item['aria-label'] : undefined,
+    children: [type === 'do' ? /*#__PURE__*/jsxRuntime.jsx(icons.CheckCircleFill, {
+      size: 24,
+      className: type
+    }) : /*#__PURE__*/jsxRuntime.jsx(icons.CrossCircleFill, {
+      size: 24,
+      className: type
+    }), /*#__PURE__*/jsxRuntime.jsx(Body, {
+      className: "text-primary",
+      type: exports.Typography.BODY_LARGE,
+      children: isInstructionNode ? item.content : item
+    })]
+  });
+}
 var InstructionsList$1 = InstructionsList;
 
 const Loader = ({