@mitodl/smoot-design 0.0.0-a2e4e1e → 0.0.0-bafccd3

package/dist/cjs/components/AiChat/AiChatMarkdown.stories.js

@@ -0,0 +1,282 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UnexpectedList = exports.NestedUnorderedOrderedList = exports.NestedOrderedUnorderedList = exports.NestedUnorderedList = exports.NestedOrderedList = exports.SimpleUnorderedList = exports.SimpleOrderedList = exports.Math = exports.Textual = exports.Typical = void 0;
+const React = require("react");
+const AiChat_1 = require("./AiChat");
+const styled_1 = require("@emotion/styled");
+const api_1 = require("./test-utils/api");
+const better_react_mathjax_1 = require("better-react-mathjax");
+const TEST_API_STREAMING = "http://localhost:4567/streaming";
+const Container = styled_1.default.div({
+    width: "100%",
+    height: "500px",
+});
+const meta = {
+    title: "smoot-design/AI/AiChat Markdown",
+    component: AiChat_1.AiChat,
+    parameters: {
+        msw: { handlers: api_1.handlers },
+    },
+    render: (args) => React.createElement(AiChat_1.AiChat, Object.assign({}, args)),
+    decorators: (Story, context) => {
+        return (React.createElement(better_react_mathjax_1.MathJaxContext, null,
+            React.createElement(Container, null,
+                React.createElement(Story, { key: String(context.args.entryScreenEnabled) }))));
+    },
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        askTimTitle: "to recommend a course",
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A simple ordered list:
+1. Item 1
+2. Item 3
+3. Item 3`,
+            },
+        ],
+    },
+    argTypes: {
+        conversationStarters: {
+            control: { type: "object", disable: true },
+        },
+        initialMessages: {
+            control: { type: "object", disable: true },
+        },
+        requestOpts: {
+            control: { type: "object", disable: true },
+            table: { readonly: true }, // See above
+        },
+    },
+};
+exports.default = meta;
+exports.Typical = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "user",
+                content: "What is this course about?",
+            },
+            {
+                role: "assistant",
+                content: `Let me search for the core focus of this course.
+
+Based on the search results, this course (The Human Brain) focuses on studying how the human brain implements core perceptual and cognitive abilities of the mind. Here are the main aspects of what the course covers:
+
+Key Focus:
+- Examines how different parts of the brain carry out specific cognitive and perceptual functions
+- Studies the functional organization of the human brain and how it gives rise to mental abilities
+- Explores the relationship between mind and brain
+
+Specific Topics Covered:
+1. Visual perception (color, shape, motion)
+2. Recognition of faces, places, bodies, and words
+3. Scene perception and navigation
+4. Numerical understanding
+5. Speech and music perception
+6. Language comprehension
+7. Understanding other minds (social cognition)
+
+Main Approaches:
+- Examines each mental function by:
+  1. Understanding how it works in the mind (what is computed and how)
+  2. Studying its brain basis (specialized machinery, information representation, timing)
+- Uses multiple research methods including psychophysics, neuropsychology, fMRI, and other cognitive neuroscience techniques
+
+Important Note:
+The course emphasizes understanding principles rather than memorizing details, and takes students to the cutting edge of the field by having them read current research papers rather than textbooks. The professor notes that while it's called "The Human Brain," it focuses on cognitive neuroscience - understanding how the brain gives rise to mental functions, rather than purely biological aspects of the brain.
+
+The course aims to help students understand both the big questions in the field and the methods used to answer them, while bringing them to the current frontiers of cognitive neuroscience research.`,
+            },
+        ],
+    },
+};
+exports.Textual = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `Here is a longer paragraph and **bold text** and *italic text*. Lorem ipsum dolor sit amet, consectetur adipiscing elit
+sed do eiusmod tempor [incididunt](https://mit.edu) ut labore et dolore magna aliqua. Ut enim ad minim veniam.
+
+And some inline code, \`\`<inline></inline>\`\` and code block:
+\`\`\`
+def f(x):
+    print(x)
+\`\`\``,
+            },
+        ],
+    },
+};
+exports.Math = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `Some inline math: $x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}$
+
+And some block math:
+\n
+
+$$
+x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}
+$$
+
+Math is rendered using MathJax only if the \`useMathJax\` prop is set to true.`,
+            },
+        ],
+        useMathJax: true,
+    },
+};
+exports.SimpleOrderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A simple ordered list:
+1. Item 1
+2. Item 2
+3. Item 3`,
+            },
+        ],
+    },
+};
+exports.SimpleUnorderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A simple unordered list:
+- Item 1
+- Item 2
+- Item 3`,
+            },
+        ],
+    },
+};
+exports.NestedOrderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A nested ordered list:
+1. Item 1
+    1. Item 1.1
+    2. Item 1.2
+2. Item 2
+    1. Item 2.1
+    2. Item 2.2
+3. Item 3
+    1. Item 3.1
+    2. Item 3.2`,
+            },
+        ],
+    },
+};
+exports.NestedUnorderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A nested unordered list:
+- Item 1
+    - Item 1.1
+    - Item 1.2
+- Item 2
+    - Item 2.1
+    - Item 2.2
+- Item 3
+    - Item 3.1
+    - Item 3.2`,
+            },
+        ],
+    },
+};
+exports.NestedOrderedUnorderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A nested ordered and unordered list:
+1. Item 1
+    - Item 1.1
+    - Item 1.2
+2. Item 2
+    - Item 2.1
+    - Item 2.2
+3. Item 3
+    - Item 3.1
+    - Item 3.2`,
+            },
+        ],
+    },
+};
+exports.NestedUnorderedOrderedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `A nested unordered and ordered list:
+- Item 1
+    1. Item 1.1
+    2. Item 1.2
+- Item 2
+    1. Item 2.1
+    2. Item 2.2
+- Item 3
+    1. Item 3.1
+    2. Item 3.2`,
+            },
+        ],
+    },
+};
+exports.UnexpectedList = {
+    args: {
+        requestOpts: { apiUrl: TEST_API_STREAMING },
+        entryScreenEnabled: false,
+        conversationStarters: [],
+        initialMessages: [
+            {
+                role: "assistant",
+                content: `LLMs may produce lists that are semantically nested, but do not reliably indent the markdown for the nested list items,
+producing sibling ordered and unordered lists. We address this by assuming that if &lt;ul&gt; immediately follows &lt;ol&gt; in the DOM, it is a
+"semantic sublist" of the last list item, and we style accordingly:
+
+1. Item 1
+- Semantic subitem 1.1
+- Semantic subitem 1.2
+
+2. Item 2
+- Semantic subitem 2.1
+- Semantic subitem 2.2`,
+            },
+        ],
+    },
+};

package/dist/cjs/components/AiChat/Markdown.d.ts

@@ -0,0 +1,7 @@
+import * as React from "react";
+type MarkdownProps = {
+    children?: string;
+    enableMathjax?: boolean;
+};
+declare const Markdown: React.FC<MarkdownProps>;
+export default Markdown;

package/dist/cjs/components/AiChat/Markdown.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const React = require("react");
+const react_markdown_1 = require("react-markdown");
+const browser_1 = require("rehype-mathjax/browser");
+const remark_math_1 = require("remark-math");
+const better_react_mathjax_1 = require("better-react-mathjax");
+const Markdown = ({ children, enableMathjax }) => {
+    const remarkPlugins = enableMathjax ? [remark_math_1.default] : undefined;
+    const rehypePlugins = enableMathjax ? [browser_1.default] : undefined;
+    const markdown = (React.createElement(react_markdown_1.default, { skipHtml: true, remarkPlugins: remarkPlugins, rehypePlugins: rehypePlugins }, children));
+    return enableMathjax ? React.createElement(better_react_mathjax_1.MathJax, null, markdown) : markdown;
+};
+exports.default = Markdown;

package/dist/cjs/components/AiChat/test-utils/api.js

@@ -17,6 +17,15 @@ const SAMPLE_RESPONSES = [
 1. **[Machine Learning, Modeling, and Simulation Principles](https://xpro.mit.edu/courses/course-v1:xPRO+MLx1/)**: Offered by MIT xPRO, this course is part of the program "Machine Learning, Modeling, and Simulation: Engineering Problem-Solving in the Age of AI." It focuses on the principles of machine learning and how they can be applied to solve engineering problems, which is highly relevant for business applications of AI.
 
 This course is not free, but it provides a certification upon completion, which can be valuable for professionals looking to apply AI in business contexts. It covers essential concepts that can help you understand how AI can be leveraged to improve business processes and decision-making.
+Here is some inline  math: $x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}$
+
+And some block math:
+\n
+
+$$
+x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}
+$$
+
 <!-- Comment! -->
 `,
     `
@@ -27,6 +36,15 @@ To understand global warming, I recommend the following resources from MIT:
 2. **[Global Warming Science](https://openlearninglibrary.mit.edu/courses/course-v1:MITx+12.340x+1T2020/about)**: Another offering of the same course by MITx, available through the Open Learning Library. It provides the same in-depth exploration of the earth's climate system.
 
 These courses are free and provide a solid foundation in understanding the scientific aspects of global warming. They are suitable for anyone interested in the topic, regardless of prior knowledge.
+Here is some inline  math: $x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}$
+
+And some block math:
+\n
+
+$$
+x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}
+$$
+
 <!-- Comment! -->
 `,
     `
@@ -39,6 +57,16 @@ Here are some courses on linear algebra that you can explore:
 3. **[Quantum Information Science I, Part 1 (MITx)](https://openlearninglibrary.mit.edu/courses/course-v1:MITx+8.370.1x+1T2018/about)**: While primarily focused on quantum information science, this course requires some knowledge of linear algebra and is suitable for those interested in quantum mechanics. It is free and available through MITx.
 
 These courses provide a comprehensive introduction to linear algebra and its applications across various fields.
+
+Here is some inline  math: $x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}$
+
+And some block math:
+\n
+
+$$
+x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}
+$$
+
 <!-- Comment! -->
 `,
     `Here are some courses on quantum computing that offer certificates:
@@ -53,7 +81,18 @@ These courses provide a comprehensive introduction to linear algebra and its app
    - **Offered by**: MIT xPRO
    - **Instructors**: Isaac Chuang, William Oliver, Peter Shor, Aram Harrow
 
-These courses are part of professional certificate programs, and you can choose to complete the entire program or take individual courses for certification.`,
+These courses are part of professional certificate programs, and you can choose to complete the entire program or take individual courses for certification.
+
+
+Here is some inline  math: $x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}$
+
+And some block math:
+\n
+
+$$
+x = \\frac{-b\\pm\\sqrt{b^2-4ac}}{2a}
+$$
+`,
 ];
 const rand = (min, max) => {
     // min and max included

package/dist/cjs/components/AiChat/types.d.ts

@@ -20,12 +20,24 @@ type RequestOpts = {
     fetchOpts?: RequestInit;
     onFinish?: (message: AiChatMessage) => void;
 };
-type AiChatProps = {
+type AiChatContextProps = {
     /**
      * Changing the `chatId` will reset the chat. Changing the `chatId` to a
      * previously used value will restore the session state.
      */
     chatId?: string;
+    /**
+     * Options for making requests to the AI service.
+     */
+    requestOpts: RequestOpts;
+    parseContent?: (content: unknown) => string;
+    /**
+     * Initial messages to display on the chat. If not provided, the entry screen title will be used as the initial message.
+     */
+    initialMessages?: Omit<AiChatMessage, "id">[];
+    children?: React.ReactNode;
+};
+type AiChatDisplayProps = {
     /**
      * If provided, renders the "AskTIM" title motif followed by the text.
      */
@@ -44,21 +56,12 @@ type AiChatProps = {
      * Title to display on the entry screen, also the initial assistant message if not overridden by `initialMessages`.
      */
     entryScreenTitle?: string;
-    /**
-     * Initial messages to display on the chat. If not provided, the entry screen title will be used as the initial message.
-     */
-    initialMessages?: Omit<AiChatMessage, "id">[];
     /**
      * Prompt suggestions for the user, clickable on the entry screen or in the chat if the entry screen is not enabled.
      */
     conversationStarters?: {
         content: string;
     }[];
-    /**
-     * Options for making requests to the AI service.
-     */
-    requestOpts: RequestOpts;
-    parseContent?: (content: unknown) => string;
     /**
      * A message to display while the component is in a loading state.
      *
@@ -78,5 +81,16 @@ type AiChatProps = {
      * the AiChat will scroll to the bottom as chat messages are added.
      */
     scrollElement?: HTMLElement | null;
+    /**
+     * If true, the chat will display math equations using MathJax.
+     * Defaults to false.
+     */
+    useMathJax?: boolean;
+    /**
+     * If true, the chat input will be autofocused on load.
+     * Defaults to true.
+     */
+    autofocus?: boolean;
 } & RefAttributes<HTMLDivElement>;
-export type { RequestOpts, AiChatProps, AiChatMessage };
+type AiChatProps = AiChatContextProps & AiChatDisplayProps;
+export type { RequestOpts, AiChatMessage, AiChatContextProps, AiChatDisplayProps, AiChatProps, };

package/dist/cjs/components/AiChat/types.js

@@ -1,3 +1,3 @@
 "use strict";
-// Some of these are based on (compatible, but simplified / restricted) versions of ai/react types.
+// Some of these are based on (compatible, but simplified / restricted) versions of @ai-sdk/react types.
 Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/AiChat/utils.d.ts

@@ -1,4 +1,4 @@
-import { UseChatOptions } from "ai/react";
+import { UseChatOptions } from "@ai-sdk/react";
 import type { RequestOpts } from "./types";
 declare const useAiChat: (requestOpts: RequestOpts, opts: UseChatOptions) => import("@ai-sdk/react").UseChatHelpers & {
     addToolResult: ({ toolCallId, result, }: {

package/dist/cjs/components/AiChat/utils.js

@@ -10,7 +10,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useAiChat = void 0;
-const react_1 = require("ai/react");
+const react_1 = require("@ai-sdk/react");
 const react_2 = require("react");
 const identity = (x) => x;
 const getFetcher = (requestOpts) => (url, opts) => __awaiter(void 0, void 0, void 0, function* () {

package/dist/cjs/components/LinkAdapter/LinkAdapter.js

@@ -29,6 +29,6 @@ const LinkAdapter = React.forwardRef(function LinkAdapter(_a, ref) {
     var { Component } = _a, props = __rest(_a, ["Component"]);
     const theme = (0, react_1.useTheme)();
     const LinkComponent = Component !== null && Component !== void 0 ? Component : theme.custom.LinkAdapter;
-    return React.createElement(PlainLink, Object.assign({ as: LinkComponent, ref: ref }, props));
+    return (React.createElement(PlainLink, Object.assign({ as: LinkComponent, ref: ref }, props), props.children));
 });
 exports.LinkAdapter = LinkAdapter;

package/dist/cjs/components/TabButtons/TabButtonList.js

@@ -77,7 +77,7 @@ const TabButtonInner = React.forwardRef(
 TabButtonInner.displayName = "TabButtonInner";
 const TabLinkInner = React.forwardRef((props, ref) => {
     const { className } = props, others = __rest(props, ["className"]);
-    return React.createElement(TabLinkStyled, Object.assign({}, defaultTabButtonProps, others, { ref: ref }));
+    return (React.createElement(TabLinkStyled, Object.assign({}, defaultTabButtonProps, others, { ref: ref }), props.children));
 });
 TabLinkInner.displayName = "TabLinkInner";
 /**

package/dist/cjs/index.d.ts

@@ -13,4 +13,5 @@ export type { TextFieldProps } from "./components/TextField/TextField";
 export { SrAnnouncer } from "./components/SrAnnouncer/SrAnnouncer";
 export type { SrAnnouncerProps } from "./components/SrAnnouncer/SrAnnouncer";
 export { TabButton, TabButtonLink, TabButtonList, } from "./components/TabButtons/TabButtonList";
+export { VERSION } from "./VERSION";
 export { VisuallyHidden } from "./components/VisuallyHidden/VisuallyHidden";

package/dist/cjs/index.js

@@ -1,7 +1,7 @@
 "use strict";
 "use client";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VisuallyHidden = exports.TabButtonList = exports.TabButtonLink = exports.TabButton = exports.SrAnnouncer = exports.TextField = exports.Input = exports.ActionButtonLink = exports.ActionButton = exports.ButtonLink = exports.Button = exports.createTheme = exports.ThemeProvider = exports.Global = exports.css = exports.styled = void 0;
+exports.VisuallyHidden = exports.VERSION = exports.TabButtonList = exports.TabButtonLink = exports.TabButton = exports.SrAnnouncer = exports.TextField = exports.Input = exports.ActionButtonLink = exports.ActionButton = exports.ButtonLink = exports.Button = exports.createTheme = exports.ThemeProvider = exports.Global = exports.css = exports.styled = void 0;
 var styled_1 = require("@emotion/styled");
 Object.defineProperty(exports, "styled", { enumerable: true, get: function () { return styled_1.default; } });
 var react_1 = require("@emotion/react");
@@ -26,5 +26,7 @@ var TabButtonList_1 = require("./components/TabButtons/TabButtonList");
 Object.defineProperty(exports, "TabButton", { enumerable: true, get: function () { return TabButtonList_1.TabButton; } });
 Object.defineProperty(exports, "TabButtonLink", { enumerable: true, get: function () { return TabButtonList_1.TabButtonLink; } });
 Object.defineProperty(exports, "TabButtonList", { enumerable: true, get: function () { return TabButtonList_1.TabButtonList; } });
+var VERSION_1 = require("./VERSION");
+Object.defineProperty(exports, "VERSION", { enumerable: true, get: function () { return VERSION_1.VERSION; } });
 var VisuallyHidden_1 = require("./components/VisuallyHidden/VisuallyHidden");
 Object.defineProperty(exports, "VisuallyHidden", { enumerable: true, get: function () { return VisuallyHidden_1.VisuallyHidden; } });

package/dist/cjs/utils/retryingFetch.d.ts

@@ -0,0 +1,19 @@
+/**
+ * A wrapper around fetch that retries the request on certain error codes.
+ *
+ * By default:
+ *
+ * Requests will be retried if max retries not exceeded and :
+ *  - The status code is >= 400 AND NOT in the NO_RETRY_ERROR_CODES list,
+ *  - OR the request promise rejected (network error)
+ *
+ * The retry delay is exponential, 1s, 2s, 4s, 8s, ... maxing at 30s.
+ *
+ * Maximum retries is 3.
+ *
+ * NOTE:
+ *  - When NODE_ENV="test", the maximum retries is set 0 by default but can be
+ *  set via the TEST_ENV_MAX_RETRIES environment variable.
+ */
+declare const retryingFetch: ((input: RequestInfo | URL, init?: RequestInit) => Promise<Response>) & typeof globalThis.fetch;
+export default retryingFetch;

package/dist/cjs/utils/retryingFetch.js

@@ -0,0 +1,98 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const MAX_RETRIES = 3;
+const NO_RETRY_ERROR_CODES = [400, 401, 403, 404, 405, 409, 422];
+const BASE_RETRY_DELAY = process.env.NODE_ENV === "test" ? 10 : 1000;
+// This is a workaround to ensure retryingFetch uses MSW's fetch version in tests.
+// See https://github.com/jonbern/fetch-retry/issues/95#issuecomment-2613990480
+const fetch = (...args) => window.fetch(...args);
+// From https://github.com/jonbern/fetch-retry/blob/master/index.js
+const fetchRetry = (fetch, { retryDelay, retryOn }) => {
+    return (input, init) => {
+        return new Promise((resolve, reject) => {
+            const wrappedFetch = (attempt) => {
+                const _input = typeof Request !== "undefined" && input instanceof Request
+                    ? input.clone()
+                    : input;
+                fetch(_input, init)
+                    .then((response) => {
+                    try {
+                        Promise.resolve(retryOn(attempt, null, response))
+                            .then((retryOnResponse) => {
+                            if (retryOnResponse) {
+                                retry(attempt, null, response);
+                            }
+                            else {
+                                resolve(response);
+                            }
+                        })
+                            .catch(reject);
+                    }
+                    catch (error) {
+                        reject(error);
+                    }
+                })
+                    .catch((error) => {
+                    try {
+                        Promise.resolve(retryOn(attempt, error, null))
+                            .then((retryOnResponse) => {
+                            if (retryOnResponse) {
+                                retry(attempt, error, null);
+                            }
+                            else {
+                                reject(error);
+                            }
+                        })
+                            .catch((error) => {
+                            reject(error);
+                        });
+                    }
+                    catch (error) {
+                        reject(error);
+                    }
+                });
+            };
+            const retry = (attempt, error, response) => {
+                const delay = retryDelay(attempt, error, response);
+                setTimeout(() => {
+                    wrappedFetch(++attempt);
+                }, delay);
+            };
+            wrappedFetch(0);
+        });
+    };
+};
+/**
+ * A wrapper around fetch that retries the request on certain error codes.
+ *
+ * By default:
+ *
+ * Requests will be retried if max retries not exceeded and :
+ *  - The status code is >= 400 AND NOT in the NO_RETRY_ERROR_CODES list,
+ *  - OR the request promise rejected (network error)
+ *
+ * The retry delay is exponential, 1s, 2s, 4s, 8s, ... maxing at 30s.
+ *
+ * Maximum retries is 3.
+ *
+ * NOTE:
+ *  - When NODE_ENV="test", the maximum retries is set 0 by default but can be
+ *  set via the TEST_ENV_MAX_RETRIES environment variable.
+ */
+const retryingFetch = fetchRetry(fetch, {
+    retryDelay: (attempt, _error, _response) => {
+        return Math.min(BASE_RETRY_DELAY * Math.pow(2, attempt), 30000);
+    },
+    retryOn: (attempt, _error, response) => {
+        if (attempt >= MAX_RETRIES) {
+            return false;
+        }
+        if (response) {
+            if (response.status < 400)
+                return false;
+            return !NO_RETRY_ERROR_CODES.includes(response.status);
+        }
+        return true;
+    },
+});
+exports.default = retryingFetch;

package/dist/cjs/utils/retryingFetch.test.js

@@ -0,0 +1,48 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const retryingFetch_1 = require("./retryingFetch");
+const msw_1 = require("msw");
+const node_1 = require("msw/node");
+const counter = jest.fn(); // use jest.fn as counter because it resets on each test
+const NETWORK_SUCCESS_URL = "http://localhost:3456/success";
+const NETWORK_ERROR_URL = "http://localhost:3456/error";
+const server = (0, node_1.setupServer)(msw_1.http.get(NETWORK_SUCCESS_URL, (_a) => __awaiter(void 0, [_a], void 0, function* ({ request }) {
+    var _b;
+    counter();
+    const url = new URL(request.url);
+    const status = +((_b = url.searchParams.get("status")) !== null && _b !== void 0 ? _b : 200);
+    return msw_1.HttpResponse.text(`Status ${status}`, { status });
+})), msw_1.http.get(NETWORK_ERROR_URL, () => __awaiter(void 0, void 0, void 0, function* () {
+    counter();
+    return msw_1.HttpResponse.error();
+})));
+beforeAll(() => server.listen());
+afterEach(() => server.resetHandlers());
+afterAll(() => server.close());
+describe("retryingFetch", () => {
+    beforeAll(() => { });
+    test.each([200, 201, 202, 367, 400, 401, 403])("should not retry on %s", (status) => __awaiter(void 0, void 0, void 0, function* () {
+        const result = yield (0, retryingFetch_1.default)(`${NETWORK_SUCCESS_URL}?status=${status}`);
+        expect(yield result.text()).toBe(`Status ${status}`);
+        expect(counter).toHaveBeenCalledTimes(1);
+    }));
+    test.each([429, 500, 501, 502, 503])("should retry on %s", (status) => __awaiter(void 0, void 0, void 0, function* () {
+        const result = yield (0, retryingFetch_1.default)(`${NETWORK_SUCCESS_URL}?status=${status}`);
+        expect(yield result.text()).toBe(`Status ${status}`);
+        expect(counter).toHaveBeenCalledTimes(4);
+    }));
+    test("should retry on error", () => __awaiter(void 0, void 0, void 0, function* () {
+        const result = yield (0, retryingFetch_1.default)(NETWORK_ERROR_URL).catch((err) => err);
+        expect(result).toBeInstanceOf(Error);
+        expect(counter).toHaveBeenCalledTimes(4);
+    }));
+});