@openedx/frontend-base 1.0.0-alpha.12 → 1.0.0-alpha.13

package/dist/runtime/react/hooks/theme/useTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/useTheme.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  useCallback, useEffect, useReducer, useState,\n} from 'react';\n\nimport { SELECTED_THEME_VARIANT_KEY } from '../../constants';\nimport { logError } from '../../../logging';\nimport { themeActions, themeReducer } from '../../reducers';\nimport { ThemeVariants, ThemeDefaults } from '../../../../types';\nimport { isEmptyObject } from './utils';\n\nimport useThemeCore from './useThemeCore';\nimport useThemeConfig from './useThemeConfig';\nimport useThemeVariants from './useThemeVariants';\n\n/**\n* Finds the default theme variant from the given theme variants object. If no default theme exists, the light theme\n* variant is returned as a fallback.\n*\n* It prioritizes:\n*   1. A persisted theme variant from localStorage.\n*   2. A system preference (`prefers-color-scheme`).\n*   3. The configured default theme variant.\n*\n* Returns the default theme variant, or `undefined` if no valid theme variant is found.\n*/\nexport const getDefaultThemeVariant = (themeVariants: ThemeVariants | undefined, themeDefaults: ThemeDefaults = {}) => {\n  if (!themeVariants) {\n    return undefined;\n  }\n\n  const themeVariantKeys = Object.keys(themeVariants);\n\n  // If there is only one theme variant, return it since it's the only one that may be used.\n  if (themeVariantKeys.length === 1) {\n    const themeVariantKey = themeVariantKeys[0];\n    return {\n      name: themeVariantKey,\n      metadata: themeVariants[themeVariantKey],\n    };\n  }\n\n  // Prioritize persisted localStorage theme variant preference.\n  const persistedSelectedThemeVariant = localStorage.getItem(SELECTED_THEME_VARIANT_KEY);\n  if (persistedSelectedThemeVariant && themeVariants[persistedSelectedThemeVariant]) {\n    return {\n      name: persistedSelectedThemeVariant,\n      metadata: themeVariants[persistedSelectedThemeVariant],\n    };\n  }\n\n  // Then, detect system preference via `prefers-color-scheme` media query and use\n  // the default dark theme variant, if one exists.\n  const hasDarkSystemPreference = !!window.matchMedia?.('(prefers-color-scheme: dark)')?.matches;\n  const defaultDarkThemeVariant = themeDefaults.dark ?? 'dark';\n  const darkThemeVariantMetadata = themeVariants[defaultDarkThemeVariant];\n\n  if (hasDarkSystemPreference && defaultDarkThemeVariant && darkThemeVariantMetadata) {\n    return {\n      name: defaultDarkThemeVariant,\n      metadata: darkThemeVariantMetadata,\n    };\n  }\n\n  const defaultLightThemeVariant = themeDefaults.light ?? 'light';\n  const lightThemeVariantMetadata = themeVariants[defaultLightThemeVariant];\n\n  // Handle edge case where the default light theme variant is not configured or provided.\n  if (!lightThemeVariantMetadata) {\n    return undefined;\n  }\n\n  // Otherwise, fallback to using the default light theme variant as configured.\n  return {\n    name: defaultLightThemeVariant,\n    metadata: lightThemeVariantMetadata,\n  };\n};\n\n/**\n * A custom React hook that manages the application's theme state and injects the appropriate CSS for the theme core\n * and theme variants (e.g., light and dark modes) into the HTML document. It handles dynamically loading the theme\n * CSS based on the current theme variant, and ensures that the theme variant's CSS is preloaded for runtime theme\n * switching. This is done using \"alternate\" stylesheets. That is, the browser will download the CSS for the\n * non-current theme variants with a lower priority than the current one.\n *\n * The hook also responds to system theme preference changes (e.g., via the `prefers-color-scheme` media query),\n * and can automatically switch the theme based on the system's dark mode or light mode preference.\n *\n * * @example\n * const [themeState, dispatch] = useTheme();\n * console.log(themeState.isThemeLoaded); // true when the theme has been successfully loaded.\n *\n * // Dispatch an action to change the theme variant\n * dispatch(themeActions.setThemeVariant('dark'));\n */\nconst useTheme = () => {\n  const themeConfig = useThemeConfig();\n  const {\n    core: themeCore,\n    defaults: themeVariantDefaults,\n    variants: themeVariants,\n  } = themeConfig;\n  const initialThemeState = {\n    isThemeLoaded: false,\n    themeVariant: getDefaultThemeVariant(themeVariants, themeVariantDefaults)?.name,\n  };\n  const [themeState, dispatch] = useReducer(themeReducer, initialThemeState);\n\n  const [isThemeCoreLoaded, setIsThemeCoreLoaded] = useState(false);\n  const onLoadThemeCore = useCallback(() => {\n    setIsThemeCoreLoaded(true);\n  }, []);\n\n  const [hasLoadedThemeVariants, setHasLoadedThemeVariants] = useState(false);\n  const onLoadThemeVariants = useCallback(() => {\n    setHasLoadedThemeVariants(true);\n  }, []);\n\n  // load the theme's core CSS\n  useThemeCore({\n    themeCore,\n    onComplete: onLoadThemeCore,\n  });\n\n  // respond to system preference changes with regard to `prefers-color-scheme: dark`.\n  const handleDarkModeSystemPreferenceChange = useCallback((prefersDarkMode: boolean) => {\n    // Ignore system preference change if the theme variant is already set in localStorage.\n    if (localStorage.getItem(SELECTED_THEME_VARIANT_KEY)) {\n      return;\n    }\n\n    if (prefersDarkMode && themeVariantDefaults?.dark) {\n      dispatch(themeActions.setThemeVariant(themeVariantDefaults.dark));\n    } else if (!prefersDarkMode && themeVariantDefaults?.light) {\n      dispatch(themeActions.setThemeVariant(themeVariantDefaults.light));\n    } else {\n      logError(`Could not set theme variant based on system preference (prefers dark mode: ${prefersDarkMode})`);\n    }\n  }, [themeVariantDefaults]);\n\n  // load the theme variant(s) CSS\n  useThemeVariants({\n    themeVariants,\n    onComplete: onLoadThemeVariants,\n    currentThemeVariant: themeState.themeVariant,\n    onDarkModeSystemPreferenceChange: handleDarkModeSystemPreferenceChange,\n  });\n\n  useEffect(() => {\n    // theme is already loaded, do nothing\n    if (themeState.isThemeLoaded) {\n      return;\n    }\n\n    const hasThemeConfig = (themeCore?.url && !isEmptyObject(themeVariants));\n    if (!hasThemeConfig) {\n      // no theme URLs to load, set loading to false.\n      dispatch(themeActions.setThemeLoaded(true));\n    }\n\n    // Return early if neither the core theme CSS nor any theme variant CSS is loaded.\n    if (!isThemeCoreLoaded || !hasLoadedThemeVariants) {\n      return;\n    }\n\n    // All application theme URLs are loaded\n    dispatch(themeActions.setThemeLoaded(true));\n  }, [\n    themeState.isThemeLoaded,\n    isThemeCoreLoaded,\n    hasLoadedThemeVariants,\n    themeCore?.url,\n    themeVariants,\n  ]);\n\n  return [themeState, dispatch];\n};\n\nexport default useTheme;\n"]}

package/dist/runtime/react/hooks/theme/useThemeConfig.d.ts

@@ -0,0 +1,16 @@
+import { Theme } from '../../../../types';
+/**
+ * Custom React hook that retrieves the theme configuration.
+ *
+ * Configuration is considered entirely invalid if it doesn't define at least one variant, including core.
+ *
+ * Example:
+ *
+ * const themeConfig = useThemeConfig();
+ * if (themeConfig) {
+ *   console.log(themeConfig.core.url); // Outputs the URL of theme's core CSS
+ *   console.log(themeConfig.variants['dark'].url); // Outputs the URL of the theme's dark variant CSS
+ * }
+ */
+declare const useThemeConfig: () => Theme;
+export default useThemeConfig;

package/{runtime/react/hooks/theme/useThemeConfig.ts → dist/runtime/react/hooks/theme/useThemeConfig.js}

@@ -1,9 +1,6 @@
 import { useMemo } from 'react';
-
-import { Theme } from '../../../../types';
 import { getSiteConfig } from '../../../config';
 import { isEmptyObject } from './utils';
-
 /**
  * Custom React hook that retrieves the theme configuration.
  *
@@ -17,18 +14,16 @@ import { isEmptyObject } from './utils';
  *   console.log(themeConfig.variants['dark'].url); // Outputs the URL of the theme's dark variant CSS
  * }
  */
-const useThemeConfig = (): Theme => useMemo(() => {
-  const { theme } = getSiteConfig();
-
-  if (!theme || (isEmptyObject(theme.core) && isEmptyObject(theme.variants))) {
-    return {};
-  }
-
-  return {
-    core: theme.core,
-    defaults: theme.defaults,
-    variants: theme.variants,
-  };
+const useThemeConfig = () => useMemo(() => {
+    const { theme } = getSiteConfig();
+    if (!theme || (isEmptyObject(theme.core) && isEmptyObject(theme.variants))) {
+        return {};
+    }
+    return {
+        core: theme.core,
+        defaults: theme.defaults,
+        variants: theme.variants,
+    };
 }, []);
-
 export default useThemeConfig;
+//# sourceMappingURL=useThemeConfig.js.map

package/dist/runtime/react/hooks/theme/useThemeConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeConfig.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/useThemeConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGhC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAExC;;;;;;;;;;;;GAYG;AACH,MAAM,cAAc,GAAG,GAAU,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE;IAC/C,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,EAAE,CAAC;IAElC,IAAI,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC;QAC3E,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO;QACL,IAAI,EAAE,KAAK,CAAC,IAAI;QAChB,QAAQ,EAAE,KAAK,CAAC,QAAQ;QACxB,QAAQ,EAAE,KAAK,CAAC,QAAQ;KACzB,CAAC;AACJ,CAAC,EAAE,EAAE,CAAC,CAAC;AAEP,eAAe,cAAc,CAAC","sourcesContent":["import { useMemo } from 'react';\n\nimport { Theme } from '../../../../types';\nimport { getSiteConfig } from '../../../config';\nimport { isEmptyObject } from './utils';\n\n/**\n * Custom React hook that retrieves the theme configuration.\n *\n * Configuration is considered entirely invalid if it doesn't define at least one variant, including core.\n *\n * Example:\n *\n * const themeConfig = useThemeConfig();\n * if (themeConfig) {\n *   console.log(themeConfig.core.url); // Outputs the URL of theme's core CSS\n *   console.log(themeConfig.variants['dark'].url); // Outputs the URL of the theme's dark variant CSS\n * }\n */\nconst useThemeConfig = (): Theme => useMemo(() => {\n  const { theme } = getSiteConfig();\n\n  if (!theme || (isEmptyObject(theme.core) && isEmptyObject(theme.variants))) {\n    return {};\n  }\n\n  return {\n    core: theme.core,\n    defaults: theme.defaults,\n    variants: theme.variants,\n  };\n}, []);\n\nexport default useThemeConfig;\n"]}

package/dist/runtime/react/hooks/theme/useThemeCore.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Custom React hook that manages the loading and updating of a theme's core
+ * CSS, ensuring the theme's core CSS is added to the document `<head>` as a
+ * `<link>` element.
+ */
+declare const useThemeCore: ({ themeCore, onComplete, }: {
+    themeCore: any;
+    onComplete: any;
+}) => void;
+export default useThemeCore;

package/dist/runtime/react/hooks/theme/useThemeCore.js

@@ -0,0 +1,40 @@
+import { useEffect, useState } from 'react';
+import { logError } from '../../../logging';
+import { removeExistingLinks } from './utils';
+/**
+ * Custom React hook that manages the loading and updating of a theme's core
+ * CSS, ensuring the theme's core CSS is added to the document `<head>` as a
+ * `<link>` element.
+ */
+const useThemeCore = ({ themeCore, onComplete, }) => {
+    const [isThemeCoreComplete, setIsThemeCoreComplete] = useState(false);
+    useEffect(() => {
+        if (isThemeCoreComplete) {
+            onComplete();
+        }
+    }, [isThemeCoreComplete, onComplete]);
+    useEffect(() => {
+        // If there is no theme core config, do nothing.
+        if (!(themeCore === null || themeCore === void 0 ? void 0 : themeCore.url)) {
+            setIsThemeCoreComplete(true);
+            return;
+        }
+        const themeCoreLink = document.createElement('link');
+        themeCoreLink.href = themeCore.url;
+        themeCoreLink.rel = 'stylesheet';
+        themeCoreLink.dataset.themeCore = 'true';
+        themeCoreLink.onload = () => {
+            setIsThemeCoreComplete(true);
+        };
+        themeCoreLink.onerror = () => {
+            setIsThemeCoreComplete(true);
+            const otherExistingLinks = document.head.querySelectorAll('link[data-theme-core="true"]');
+            removeExistingLinks(otherExistingLinks);
+            logError(`Failed to load core theme CSS from ${themeCore.url}. Aborting.`);
+            return;
+        };
+        document.head.insertAdjacentElement('beforeend', themeCoreLink);
+    }, [themeCore === null || themeCore === void 0 ? void 0 : themeCore.url, onComplete]);
+};
+export default useThemeCore;
+//# sourceMappingURL=useThemeCore.js.map

package/dist/runtime/react/hooks/theme/useThemeCore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeCore.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/useThemeCore.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAE9C;;;;GAIG;AACH,MAAM,YAAY,GAAG,CAAC,EACpB,SAAS,EACT,UAAU,GACX,EAAE,EAAE;IACH,MAAM,CAAC,mBAAmB,EAAE,sBAAsB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,mBAAmB,EAAE,CAAC;YACxB,UAAU,EAAE,CAAC;QACf,CAAC;IACH,CAAC,EAAE,CAAC,mBAAmB,EAAE,UAAU,CAAC,CAAC,CAAC;IAEtC,SAAS,CAAC,GAAG,EAAE;QACb,gDAAgD;QAChD,IAAI,CAAC,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,GAAG,CAAA,EAAE,CAAC;YACpB,sBAAsB,CAAC,IAAI,CAAC,CAAC;YAC7B,OAAO;QACT,CAAC;QAED,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QACrD,aAAa,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,CAAC;QACnC,aAAa,CAAC,GAAG,GAAG,YAAY,CAAC;QACjC,aAAa,CAAC,OAAO,CAAC,SAAS,GAAG,MAAM,CAAC;QACzC,aAAa,CAAC,MAAM,GAAG,GAAG,EAAE;YAC1B,sBAAsB,CAAC,IAAI,CAAC,CAAC;QAC/B,CAAC,CAAC;QACF,aAAa,CAAC,OAAO,GAAG,GAAG,EAAE;YAC3B,sBAAsB,CAAC,IAAI,CAAC,CAAC;YAC7B,MAAM,kBAAkB,GAAG,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,CAAC;YAC1F,mBAAmB,CAAC,kBAAkB,CAAC,CAAC;YACxC,QAAQ,CAAC,sCAAsC,SAAS,CAAC,GAAG,aAAa,CAAC,CAAC;YAC3E,OAAO;QACT,CAAC,CAAC;QAEF,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CACjC,WAAW,EACX,aAAa,CACd,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,GAAG,EAAE,UAAU,CAAC,CAAC,CAAC;AACnC,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { logError } from '../../../logging';\nimport { removeExistingLinks } from './utils';\n\n/**\n * Custom React hook that manages the loading and updating of a theme's core\n * CSS, ensuring the theme's core CSS is added to the document `<head>` as a\n * `<link>` element.\n */\nconst useThemeCore = ({\n  themeCore,\n  onComplete,\n}) => {\n  const [isThemeCoreComplete, setIsThemeCoreComplete] = useState(false);\n\n  useEffect(() => {\n    if (isThemeCoreComplete) {\n      onComplete();\n    }\n  }, [isThemeCoreComplete, onComplete]);\n\n  useEffect(() => {\n    // If there is no theme core config, do nothing.\n    if (!themeCore?.url) {\n      setIsThemeCoreComplete(true);\n      return;\n    }\n\n    const themeCoreLink = document.createElement('link');\n    themeCoreLink.href = themeCore.url;\n    themeCoreLink.rel = 'stylesheet';\n    themeCoreLink.dataset.themeCore = 'true';\n    themeCoreLink.onload = () => {\n      setIsThemeCoreComplete(true);\n    };\n    themeCoreLink.onerror = () => {\n      setIsThemeCoreComplete(true);\n      const otherExistingLinks = document.head.querySelectorAll('link[data-theme-core=\"true\"]');\n      removeExistingLinks(otherExistingLinks);\n      logError(`Failed to load core theme CSS from ${themeCore.url}. Aborting.`);\n      return;\n    };\n\n    document.head.insertAdjacentElement(\n      'beforeend',\n      themeCoreLink,\n    );\n  }, [themeCore?.url, onComplete]);\n};\n\nexport default useThemeCore;\n"]}

package/dist/runtime/react/hooks/theme/useThemeVariants.d.ts

@@ -0,0 +1,17 @@
+import { ThemeVariants } from '../../../../types';
+/**
+ * A custom React hook that manages the loading of theme variant CSS files dynamically.
+ * Adds/updates a `<link>` element in the HTML document to load each theme variant's CSS, setting the
+ * non-current theme variants as "alternate" stylesheets. That is, the browser will download
+ * the CSS for the non-current theme variants, but at a lower priority than the current one.
+ * This ensures that if the theme variant is changed at runtime, the new theme's CSS will already be loaded.
+ *
+ * The hook also listens for changes in the system's preference and triggers the provided callback accordingly.
+ */
+declare const useThemeVariants: ({ themeVariants, currentThemeVariant, onComplete, onDarkModeSystemPreferenceChange, }: {
+    themeVariants: ThemeVariants | undefined;
+    currentThemeVariant: string;
+    onComplete: () => void;
+    onDarkModeSystemPreferenceChange: (prefersDarkMode: boolean) => void;
+}) => void;
+export default useThemeVariants;

package/dist/runtime/react/hooks/theme/useThemeVariants.js

@@ -0,0 +1,90 @@
+import { useEffect, useState } from 'react';
+import { logError } from '../../../logging';
+/**
+ * A custom React hook that manages the loading of theme variant CSS files dynamically.
+ * Adds/updates a `<link>` element in the HTML document to load each theme variant's CSS, setting the
+ * non-current theme variants as "alternate" stylesheets. That is, the browser will download
+ * the CSS for the non-current theme variants, but at a lower priority than the current one.
+ * This ensures that if the theme variant is changed at runtime, the new theme's CSS will already be loaded.
+ *
+ * The hook also listens for changes in the system's preference and triggers the provided callback accordingly.
+ */
+const useThemeVariants = ({ themeVariants, currentThemeVariant, onComplete, onDarkModeSystemPreferenceChange, }) => {
+    const [isThemeVariantComplete, setIsThemeVariantComplete] = useState(false);
+    // Effect hook that listens for changes in the system's dark mode preference.
+    useEffect(() => {
+        var _a;
+        const changeColorScheme = (colorSchemeQuery) => {
+            onDarkModeSystemPreferenceChange(colorSchemeQuery.matches);
+        };
+        const colorSchemeQuery = (_a = window.matchMedia) === null || _a === void 0 ? void 0 : _a.call(window, '(prefers-color-scheme: dark)');
+        if (colorSchemeQuery) {
+            colorSchemeQuery.addEventListener('change', changeColorScheme);
+        }
+        return () => {
+            if (colorSchemeQuery) {
+                colorSchemeQuery.removeEventListener('change', changeColorScheme);
+            }
+        };
+    }, [onDarkModeSystemPreferenceChange]);
+    // Effect hook to set the theme current variant on the HTML element.
+    useEffect(() => {
+        var _a;
+        if (currentThemeVariant && (themeVariants === null || themeVariants === void 0 ? void 0 : themeVariants[currentThemeVariant])) {
+            const htmlDataThemeVariantAttr = 'data-theme-variant';
+            (_a = document.querySelector('html')) === null || _a === void 0 ? void 0 : _a.setAttribute(htmlDataThemeVariantAttr, currentThemeVariant);
+            return () => {
+                var _a;
+                (_a = document.querySelector('html')) === null || _a === void 0 ? void 0 : _a.removeAttribute(htmlDataThemeVariantAttr);
+            };
+        }
+        return () => { }; // Cleanup: no action needed when theme variant is not set
+    }, [themeVariants, currentThemeVariant]);
+    // Effect hook that calls `onComplete` when brand theme variant processing is complete.
+    useEffect(() => {
+        if (isThemeVariantComplete) {
+            onComplete();
+        }
+    }, [isThemeVariantComplete, onComplete]);
+    useEffect(() => {
+        if (!themeVariants) {
+            return;
+        }
+        /**
+         * Determines the value for the `rel` attribute for a given theme variant based
+         * on if its the currently applied variant.
+         */
+        const getActiveOrAlternateRel = (themeVariant) => (currentThemeVariant === themeVariant ? 'stylesheet' : 'alternate stylesheet');
+        // Iterate over each theme variant URLs and inject them into the HTML document, if each doesn't already exist.
+        Object.entries(themeVariants).forEach(([themeVariant, { url }]) => {
+            // If the config for the theme variant does not have a URL, set the variant to complete and continue.
+            if (!url) {
+                setIsThemeVariantComplete(true);
+                return;
+            }
+            const existingThemeVariantLink = document.head.querySelector(`link[href='${url}']`);
+            if (existingThemeVariantLink) {
+                existingThemeVariantLink.rel = getActiveOrAlternateRel(themeVariant);
+                existingThemeVariantLink.dataset.themeVariant = themeVariant;
+                return;
+            }
+            const themeVariantLink = document.createElement('link');
+            themeVariantLink.href = url;
+            themeVariantLink.rel = getActiveOrAlternateRel(themeVariant);
+            themeVariantLink.dataset.themeVariant = themeVariant;
+            themeVariantLink.onload = () => {
+                if (themeVariant === currentThemeVariant) {
+                    setIsThemeVariantComplete(true);
+                }
+            };
+            themeVariantLink.onerror = () => {
+                logError(`Failed to load theme variant (${themeVariant}) CSS from ${url}. Aborting.`);
+                setIsThemeVariantComplete(true);
+            };
+            document.head.insertAdjacentElement('beforeend', themeVariantLink);
+            setIsThemeVariantComplete(true);
+        });
+    }, [themeVariants, currentThemeVariant, onComplete]);
+};
+export default useThemeVariants;
+//# sourceMappingURL=useThemeVariants.js.map

package/dist/runtime/react/hooks/theme/useThemeVariants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeVariants.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/useThemeVariants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAI5C;;;;;;;;GAQG;AACH,MAAM,gBAAgB,GAAG,CAAC,EACxB,aAAa,EACb,mBAAmB,EACnB,UAAU,EACV,gCAAgC,GAMjC,EAAE,EAAE;IACH,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE5E,6EAA6E;IAC7E,SAAS,CAAC,GAAG,EAAE;;QACb,MAAM,iBAAiB,GAAG,CAAC,gBAAgB,EAAE,EAAE;YAC7C,gCAAgC,CAAC,gBAAgB,CAAC,OAAO,CAAC,CAAC;QAC7D,CAAC,CAAC;QACF,MAAM,gBAAgB,GAAG,MAAA,MAAM,CAAC,UAAU,uDAAG,8BAA8B,CAAC,CAAC;QAC7E,IAAI,gBAAgB,EAAE,CAAC;YACrB,gBAAgB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC;QACjE,CAAC;QACD,OAAO,GAAG,EAAE;YACV,IAAI,gBAAgB,EAAE,CAAC;gBACrB,gBAAgB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC;YACpE,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,gCAAgC,CAAC,CAAC,CAAC;IAEvC,oEAAoE;IACpE,SAAS,CAAC,GAAG,EAAE;;QACb,IAAI,mBAAmB,KAAI,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,mBAAmB,CAAC,CAAA,EAAE,CAAC;YAChE,MAAM,wBAAwB,GAAG,oBAAoB,CAAC;YACtD,MAAA,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,0CAAE,YAAY,CAAC,wBAAwB,EAAE,mBAAmB,CAAC,CAAC;YAC5F,OAAO,GAAG,EAAE;;gBACV,MAAA,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,0CAAE,eAAe,CAAC,wBAAwB,CAAC,CAAC;YAC5E,CAAC,CAAC;QACJ,CAAC;QACD,OAAO,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC,0DAA0D;IAC9E,CAAC,EAAE,CAAC,aAAa,EAAE,mBAAmB,CAAC,CAAC,CAAC;IAEzC,uFAAuF;IACvF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,sBAAsB,EAAE,CAAC;YAC3B,UAAU,EAAE,CAAC;QACf,CAAC;IACH,CAAC,EAAE,CAAC,sBAAsB,EAAE,UAAU,CAAC,CAAC,CAAC;IAEzC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,aAAa,EAAE,CAAC;YACnB,OAAO;QACT,CAAC;QAED;;;WAGG;QACH,MAAM,uBAAuB,GAAG,CAAC,YAAoB,EAAU,EAAE,CAAC,CAAC,mBAAmB,KAAK,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC;QAEjJ,8GAA8G;QAC9G,MAAM,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,YAAY,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE;YAChE,qGAAqG;YACrG,IAAI,CAAC,GAAG,EAAE,CAAC;gBACT,yBAAyB,CAAC,IAAI,CAAC,CAAC;gBAChC,OAAO;YACT,CAAC;YAED,MAAM,wBAAwB,GAA6B,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;YAC9G,IAAI,wBAAwB,EAAE,CAAC;gBAC7B,wBAAwB,CAAC,GAAG,GAAG,uBAAuB,CAAC,YAAY,CAAC,CAAC;gBACrE,wBAAwB,CAAC,OAAO,CAAC,YAAY,GAAG,YAAY,CAAC;gBAC7D,OAAO;YACT,CAAC;YAED,MAAM,gBAAgB,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;YACxD,gBAAgB,CAAC,IAAI,GAAG,GAAG,CAAC;YAC5B,gBAAgB,CAAC,GAAG,GAAG,uBAAuB,CAAC,YAAY,CAAC,CAAC;YAC7D,gBAAgB,CAAC,OAAO,CAAC,YAAY,GAAG,YAAY,CAAC;YAErD,gBAAgB,CAAC,MAAM,GAAG,GAAG,EAAE;gBAC7B,IAAI,YAAY,KAAK,mBAAmB,EAAE,CAAC;oBACzC,yBAAyB,CAAC,IAAI,CAAC,CAAC;gBAClC,CAAC;YACH,CAAC,CAAC;YAEF,gBAAgB,CAAC,OAAO,GAAG,GAAG,EAAE;gBAC9B,QAAQ,CAAC,iCAAiC,YAAY,cAAc,GAAG,aAAa,CAAC,CAAC;gBACtF,yBAAyB,CAAC,IAAI,CAAC,CAAC;YAClC,CAAC,CAAC;YAEF,QAAQ,CAAC,IAAI,CAAC,qBAAqB,CACjC,WAAW,EACX,gBAAgB,CACjB,CAAC;YAEF,yBAAyB,CAAC,IAAI,CAAC,CAAC;QAClC,CAAC,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,aAAa,EAAE,mBAAmB,EAAE,UAAU,CAAC,CAAC,CAAC;AACvD,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { logError } from '../../../logging';\n\nimport { ThemeVariants } from '../../../../types';\n\n/**\n * A custom React hook that manages the loading of theme variant CSS files dynamically.\n * Adds/updates a `<link>` element in the HTML document to load each theme variant's CSS, setting the\n * non-current theme variants as \"alternate\" stylesheets. That is, the browser will download\n * the CSS for the non-current theme variants, but at a lower priority than the current one.\n * This ensures that if the theme variant is changed at runtime, the new theme's CSS will already be loaded.\n *\n * The hook also listens for changes in the system's preference and triggers the provided callback accordingly.\n */\nconst useThemeVariants = ({\n  themeVariants,\n  currentThemeVariant,\n  onComplete,\n  onDarkModeSystemPreferenceChange,\n}: {\n  themeVariants: ThemeVariants | undefined,\n  currentThemeVariant: string,\n  onComplete: () => void,\n  onDarkModeSystemPreferenceChange: (prefersDarkMode: boolean) => void,\n}) => {\n  const [isThemeVariantComplete, setIsThemeVariantComplete] = useState(false);\n\n  // Effect hook that listens for changes in the system's dark mode preference.\n  useEffect(() => {\n    const changeColorScheme = (colorSchemeQuery) => {\n      onDarkModeSystemPreferenceChange(colorSchemeQuery.matches);\n    };\n    const colorSchemeQuery = window.matchMedia?.('(prefers-color-scheme: dark)');\n    if (colorSchemeQuery) {\n      colorSchemeQuery.addEventListener('change', changeColorScheme);\n    }\n    return () => {\n      if (colorSchemeQuery) {\n        colorSchemeQuery.removeEventListener('change', changeColorScheme);\n      }\n    };\n  }, [onDarkModeSystemPreferenceChange]);\n\n  // Effect hook to set the theme current variant on the HTML element.\n  useEffect(() => {\n    if (currentThemeVariant && themeVariants?.[currentThemeVariant]) {\n      const htmlDataThemeVariantAttr = 'data-theme-variant';\n      document.querySelector('html')?.setAttribute(htmlDataThemeVariantAttr, currentThemeVariant);\n      return () => {\n        document.querySelector('html')?.removeAttribute(htmlDataThemeVariantAttr);\n      };\n    }\n    return () => { }; // Cleanup: no action needed when theme variant is not set\n  }, [themeVariants, currentThemeVariant]);\n\n  // Effect hook that calls `onComplete` when brand theme variant processing is complete.\n  useEffect(() => {\n    if (isThemeVariantComplete) {\n      onComplete();\n    }\n  }, [isThemeVariantComplete, onComplete]);\n\n  useEffect(() => {\n    if (!themeVariants) {\n      return;\n    }\n\n    /**\n     * Determines the value for the `rel` attribute for a given theme variant based\n     * on if its the currently applied variant.\n     */\n    const getActiveOrAlternateRel = (themeVariant: string): string => (currentThemeVariant === themeVariant ? 'stylesheet' : 'alternate stylesheet');\n\n    // Iterate over each theme variant URLs and inject them into the HTML document, if each doesn't already exist.\n    Object.entries(themeVariants).forEach(([themeVariant, { url }]) => {\n      // If the config for the theme variant does not have a URL, set the variant to complete and continue.\n      if (!url) {\n        setIsThemeVariantComplete(true);\n        return;\n      }\n\n      const existingThemeVariantLink: HTMLAnchorElement | null = document.head.querySelector(`link[href='${url}']`);\n      if (existingThemeVariantLink) {\n        existingThemeVariantLink.rel = getActiveOrAlternateRel(themeVariant);\n        existingThemeVariantLink.dataset.themeVariant = themeVariant;\n        return;\n      }\n\n      const themeVariantLink = document.createElement('link');\n      themeVariantLink.href = url;\n      themeVariantLink.rel = getActiveOrAlternateRel(themeVariant);\n      themeVariantLink.dataset.themeVariant = themeVariant;\n\n      themeVariantLink.onload = () => {\n        if (themeVariant === currentThemeVariant) {\n          setIsThemeVariantComplete(true);\n        }\n      };\n\n      themeVariantLink.onerror = () => {\n        logError(`Failed to load theme variant (${themeVariant}) CSS from ${url}. Aborting.`);\n        setIsThemeVariantComplete(true);\n      };\n\n      document.head.insertAdjacentElement(\n        'beforeend',\n        themeVariantLink,\n      );\n\n      setIsThemeVariantComplete(true);\n    });\n  }, [themeVariants, currentThemeVariant, onComplete]);\n};\n\nexport default useThemeVariants;\n"]}

package/dist/runtime/react/hooks/theme/useTrackColorSchemeChoice.d.ts

@@ -0,0 +1,8 @@
+/**
+ * A React hook that tracks user's preferred color scheme (light or dark) and sends respective
+ * event to the tracking service.
+ *
+ * @memberof module:React
+ */
+declare const useTrackColorSchemeChoice: () => void;
+export default useTrackColorSchemeChoice;

package/dist/runtime/react/hooks/theme/useTrackColorSchemeChoice.js

@@ -0,0 +1,30 @@
+import { useEffect } from 'react';
+import { sendTrackEvent } from '../../../analytics';
+/**
+ * A React hook that tracks user's preferred color scheme (light or dark) and sends respective
+ * event to the tracking service.
+ *
+ * @memberof module:React
+ */
+const useTrackColorSchemeChoice = () => {
+    useEffect(() => {
+        var _a;
+        const trackColorSchemeChoice = ({ matches }) => {
+            const preferredColorScheme = matches ? 'dark' : 'light';
+            sendTrackEvent('openedx.ui.frontend-base.prefers-color-scheme.selected', { preferredColorScheme });
+        };
+        const colorSchemeQuery = (_a = window.matchMedia) === null || _a === void 0 ? void 0 : _a.call(window, '(prefers-color-scheme: dark)');
+        if (colorSchemeQuery) {
+            // send user's initial choice
+            trackColorSchemeChoice(colorSchemeQuery);
+            colorSchemeQuery.addEventListener('change', trackColorSchemeChoice);
+        }
+        return () => {
+            if (colorSchemeQuery) {
+                colorSchemeQuery.removeEventListener('change', trackColorSchemeChoice);
+            }
+        };
+    }, []);
+};
+export default useTrackColorSchemeChoice;
+//# sourceMappingURL=useTrackColorSchemeChoice.js.map

package/dist/runtime/react/hooks/theme/useTrackColorSchemeChoice.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTrackColorSchemeChoice.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/useTrackColorSchemeChoice.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD;;;;;GAKG;AACH,MAAM,yBAAyB,GAAG,GAAG,EAAE;IACrC,SAAS,CAAC,GAAG,EAAE;;QACb,MAAM,sBAAsB,GAAG,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE;YAC7C,MAAM,oBAAoB,GAAG,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC;YACxD,cAAc,CAAC,wDAAwD,EAAE,EAAE,oBAAoB,EAAE,CAAC,CAAC;QACrG,CAAC,CAAC;QACF,MAAM,gBAAgB,GAAG,MAAA,MAAM,CAAC,UAAU,uDAAG,8BAA8B,CAAC,CAAC;QAC7E,IAAI,gBAAgB,EAAE,CAAC;YACrB,6BAA6B;YAC7B,sBAAsB,CAAC,gBAAgB,CAAC,CAAC;YACzC,gBAAgB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;QACtE,CAAC;QACD,OAAO,GAAG,EAAE;YACV,IAAI,gBAAgB,EAAE,CAAC;gBACrB,gBAAgB,CAAC,mBAAmB,CAAC,QAAQ,EAAE,sBAAsB,CAAC,CAAC;YACzE,CAAC;QACH,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;AACT,CAAC,CAAC;AAEF,eAAe,yBAAyB,CAAC","sourcesContent":["import { useEffect } from 'react';\nimport { sendTrackEvent } from '../../../analytics';\n\n/**\n * A React hook that tracks user's preferred color scheme (light or dark) and sends respective\n * event to the tracking service.\n *\n * @memberof module:React\n */\nconst useTrackColorSchemeChoice = () => {\n  useEffect(() => {\n    const trackColorSchemeChoice = ({ matches }) => {\n      const preferredColorScheme = matches ? 'dark' : 'light';\n      sendTrackEvent('openedx.ui.frontend-base.prefers-color-scheme.selected', { preferredColorScheme });\n    };\n    const colorSchemeQuery = window.matchMedia?.('(prefers-color-scheme: dark)');\n    if (colorSchemeQuery) {\n      // send user's initial choice\n      trackColorSchemeChoice(colorSchemeQuery);\n      colorSchemeQuery.addEventListener('change', trackColorSchemeChoice);\n    }\n    return () => {\n      if (colorSchemeQuery) {\n        colorSchemeQuery.removeEventListener('change', trackColorSchemeChoice);\n      }\n    };\n  }, []);\n};\n\nexport default useTrackColorSchemeChoice;\n"]}

package/dist/runtime/react/hooks/theme/utils.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Iterates through each given `<link>` element and removes it from the DOM.
+ * @param {HTMLLinkElement[]} existingLinks
+ */
+export declare const removeExistingLinks: (existingLinks: any) => void;
+export declare const isEmptyObject: (obj: any) => boolean;

package/{runtime/react/hooks/theme/utils.ts → dist/runtime/react/hooks/theme/utils.js}

@@ -3,9 +3,9 @@
  * @param {HTMLLinkElement[]} existingLinks
  */
 export const removeExistingLinks = (existingLinks) => {
-  existingLinks.forEach((link) => {
-    link.remove();
-  });
+    existingLinks.forEach((link) => {
+        link.remove();
+    });
 };
-
 export const isEmptyObject = (obj) => !obj || Object.keys(obj).length === 0;
+//# sourceMappingURL=utils.js.map

package/dist/runtime/react/hooks/theme/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../runtime/react/hooks/theme/utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC,aAAa,EAAE,EAAE;IACnD,aAAa,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE;QAC7B,IAAI,CAAC,MAAM,EAAE,CAAC;IAChB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC","sourcesContent":["/**\n * Iterates through each given `<link>` element and removes it from the DOM.\n * @param {HTMLLinkElement[]} existingLinks\n */\nexport const removeExistingLinks = (existingLinks) => {\n  existingLinks.forEach((link) => {\n    link.remove();\n  });\n};\n\nexport const isEmptyObject = (obj) => !obj || Object.keys(obj).length === 0;\n"]}

package/dist/runtime/react/hooks/useActiveRoles.d.ts

@@ -0,0 +1,2 @@
+declare const useActiveRoles: () => string[];
+export default useActiveRoles;

package/{runtime/react/hooks/useActiveRoles.ts → dist/runtime/react/hooks/useActiveRoles.js}

@@ -2,14 +2,12 @@ import { useState } from 'react';
 import { getActiveRoles } from '../../config';
 import { ACTIVE_ROLES_CHANGED } from '../../constants';
 import useSiteEvent from './useSiteEvent';
-
 const useActiveRoles = () => {
-  const [roles, setRoles] = useState<string[]>(getActiveRoles());
-  useSiteEvent(ACTIVE_ROLES_CHANGED, () => {
-    setRoles(getActiveRoles());
-  });
-
-  return roles;
+    const [roles, setRoles] = useState(getActiveRoles());
+    useSiteEvent(ACTIVE_ROLES_CHANGED, () => {
+        setRoles(getActiveRoles());
+    });
+    return roles;
 };
-
 export default useActiveRoles;
+//# sourceMappingURL=useActiveRoles.js.map

package/dist/runtime/react/hooks/useActiveRoles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useActiveRoles.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useActiveRoles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAW,cAAc,EAAE,CAAC,CAAC;IAC/D,YAAY,CAAC,oBAAoB,EAAE,GAAG,EAAE;QACtC,QAAQ,CAAC,cAAc,EAAE,CAAC,CAAC;IAC7B,CAAC,CAAC,CAAC;IAEH,OAAO,KAAK,CAAC;AACf,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import { useState } from 'react';\nimport { getActiveRoles } from '../../config';\nimport { ACTIVE_ROLES_CHANGED } from '../../constants';\nimport useSiteEvent from './useSiteEvent';\n\nconst useActiveRoles = () => {\n  const [roles, setRoles] = useState<string[]>(getActiveRoles());\n  useSiteEvent(ACTIVE_ROLES_CHANGED, () => {\n    setRoles(getActiveRoles());\n  });\n\n  return roles;\n};\n\nexport default useActiveRoles;\n"]}

package/dist/runtime/react/hooks/useActiveRouteRoleWatcher.d.ts

@@ -0,0 +1,2 @@
+declare const useActiveRouteRoleWatcher: () => void;
+export default useActiveRouteRoleWatcher;

package/dist/runtime/react/hooks/useActiveRouteRoleWatcher.js

@@ -0,0 +1,26 @@
+import { useCallback, useEffect } from 'react';
+import { useMatches } from 'react-router';
+import { setActiveRouteRoles } from '../../config';
+import { isRoleRouteObject } from '../../routing';
+const useActiveRouteRoleWatcher = () => {
+    const matches = useMatches();
+    // We create this callback so we can use it right away to populate the default state value.
+    const findActiveRouteRoles = useCallback(() => {
+        // Starts with the widget roles and adds the others in.
+        const roles = [];
+        // Route roles
+        for (const match of matches) {
+            if (isRoleRouteObject(match)) {
+                if (!roles.includes(match.handle.role)) {
+                    roles.push(match.handle.role);
+                }
+            }
+        }
+        return roles;
+    }, [matches]);
+    useEffect(() => {
+        setActiveRouteRoles(findActiveRouteRoles());
+    }, [matches, findActiveRouteRoles]);
+};
+export default useActiveRouteRoleWatcher;
+//# sourceMappingURL=useActiveRouteRoleWatcher.js.map

package/dist/runtime/react/hooks/useActiveRouteRoleWatcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useActiveRouteRoleWatcher.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useActiveRouteRoleWatcher.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAElD,MAAM,yBAAyB,GAAG,GAAG,EAAE;IACrC,MAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAE7B,2FAA2F;IAC3F,MAAM,oBAAoB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5C,uDAAuD;QACvD,MAAM,KAAK,GAAa,EAAE,CAAC;QAE3B,cAAc;QACd,KAAK,MAAM,KAAK,IAAI,OAAO,EAAE,CAAC;YAC5B,IAAI,iBAAiB,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC7B,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;oBACvC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;gBAChC,CAAC;YACH,CAAC;QACH,CAAC;QAED,OAAO,KAAK,CAAC;IACf,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,SAAS,CAAC,GAAG,EAAE;QACb,mBAAmB,CAAC,oBAAoB,EAAE,CAAC,CAAC;IAC9C,CAAC,EAAE,CAAC,OAAO,EAAE,oBAAoB,CAAC,CAAC,CAAC;AACtC,CAAC,CAAC;AAEF,eAAe,yBAAyB,CAAC","sourcesContent":["import { useCallback, useEffect } from 'react';\nimport { useMatches } from 'react-router';\nimport { setActiveRouteRoles } from '../../config';\nimport { isRoleRouteObject } from '../../routing';\n\nconst useActiveRouteRoleWatcher = () => {\n  const matches = useMatches();\n\n  // We create this callback so we can use it right away to populate the default state value.\n  const findActiveRouteRoles = useCallback(() => {\n    // Starts with the widget roles and adds the others in.\n    const roles: string[] = [];\n\n    // Route roles\n    for (const match of matches) {\n      if (isRoleRouteObject(match)) {\n        if (!roles.includes(match.handle.role)) {\n          roles.push(match.handle.role);\n        }\n      }\n    }\n\n    return roles;\n  }, [matches]);\n\n  useEffect(() => {\n    setActiveRouteRoles(findActiveRouteRoles());\n  }, [matches, findActiveRouteRoles]);\n};\n\nexport default useActiveRouteRoleWatcher;\n"]}

package/dist/runtime/react/hooks/useAppConfig.d.ts

@@ -0,0 +1,2 @@
+declare const useAppConfig: () => import("../../..").AppConfig;
+export default useAppConfig;

package/{runtime/react/hooks/useAppConfig.ts → dist/runtime/react/hooks/useAppConfig.js}

@@ -1,9 +1,8 @@
 import { useContext } from 'react';
 import CurrentAppContext from '../CurrentAppContext';
-
 const useAppConfig = () => {
-  const { appConfig } = useContext(CurrentAppContext);
-  return appConfig;
+    const { appConfig } = useContext(CurrentAppContext);
+    return appConfig;
 };
-
 export default useAppConfig;
+//# sourceMappingURL=useAppConfig.js.map

package/dist/runtime/react/hooks/useAppConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAppConfig.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useAppConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,iBAAiB,MAAM,sBAAsB,CAAC;AAErD,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,EAAE,SAAS,EAAE,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IACpD,OAAO,SAAS,CAAC;AACnB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { useContext } from 'react';\nimport CurrentAppContext from '../CurrentAppContext';\n\nconst useAppConfig = () => {\n  const { appConfig } = useContext(CurrentAppContext);\n  return appConfig;\n};\n\nexport default useAppConfig;\n"]}

package/dist/runtime/react/hooks/useAuthenticatedUser.d.ts

@@ -0,0 +1,2 @@
+declare const useAuthenticatedUser: () => import("../../..").User | null;
+export default useAuthenticatedUser;

package/{runtime/react/hooks/useAuthenticatedUser.ts → dist/runtime/react/hooks/useAuthenticatedUser.js}

@@ -1,9 +1,8 @@
 import { useContext } from 'react';
 import SiteContext from '../SiteContext';
-
 const useAuthenticatedUser = () => {
-  const { authenticatedUser } = useContext(SiteContext);
-  return authenticatedUser;
+    const { authenticatedUser } = useContext(SiteContext);
+    return authenticatedUser;
 };
-
 export default useAuthenticatedUser;
+//# sourceMappingURL=useAuthenticatedUser.js.map

package/dist/runtime/react/hooks/useAuthenticatedUser.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAuthenticatedUser.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useAuthenticatedUser.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAEzC,MAAM,oBAAoB,GAAG,GAAG,EAAE;IAChC,MAAM,EAAE,iBAAiB,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IACtD,OAAO,iBAAiB,CAAC;AAC3B,CAAC,CAAC;AAEF,eAAe,oBAAoB,CAAC","sourcesContent":["import { useContext } from 'react';\nimport SiteContext from '../SiteContext';\n\nconst useAuthenticatedUser = () => {\n  const { authenticatedUser } = useContext(SiteContext);\n  return authenticatedUser;\n};\n\nexport default useAuthenticatedUser;\n"]}

package/dist/runtime/react/hooks/useSiteConfig.d.ts

@@ -0,0 +1,2 @@
+declare const useSiteConfig: () => import("../../..").SiteConfig;
+export default useSiteConfig;

package/{runtime/react/hooks/useSiteConfig.ts → dist/runtime/react/hooks/useSiteConfig.js}

@@ -1,9 +1,8 @@
 import { useContext } from 'react';
 import SiteContext from '../SiteContext';
-
 const useSiteConfig = () => {
-  const { siteConfig } = useContext(SiteContext);
-  return siteConfig;
+    const { siteConfig } = useContext(SiteContext);
+    return siteConfig;
 };
-
 export default useSiteConfig;
+//# sourceMappingURL=useSiteConfig.js.map

package/dist/runtime/react/hooks/useSiteConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSiteConfig.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useSiteConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,WAAW,MAAM,gBAAgB,CAAC;AAEzC,MAAM,aAAa,GAAG,GAAG,EAAE;IACzB,MAAM,EAAE,UAAU,EAAE,GAAG,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/C,OAAO,UAAU,CAAC;AACpB,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useContext } from 'react';\nimport SiteContext from '../SiteContext';\n\nconst useSiteConfig = () => {\n  const { siteConfig } = useContext(SiteContext);\n  return siteConfig;\n};\n\nexport default useSiteConfig;\n"]}

package/dist/runtime/react/hooks/useSiteEvent.d.ts

@@ -0,0 +1,12 @@
+/**
+ * A React hook that allows functional components to subscribe to application events.  This should
+ * be used sparingly - for the most part, Context should be used higher-up in the application to
+ * provide necessary data to a given component, rather than utilizing a non-React-like Pub/Sub
+ * mechanism.
+ *
+ * @memberof module:React
+ * @param {string} type
+ * @param {function} callback
+ */
+declare const useSiteEvent: (type: any, callback: any) => void;
+export default useSiteEvent;

package/{runtime/react/hooks/useSiteEvent.ts → dist/runtime/react/hooks/useSiteEvent.js}

@@ -1,6 +1,5 @@
 import { useEffect } from 'react';
 import { subscribe, unsubscribe } from '../../subscriptions';
-
 /**
  * A React hook that allows functional components to subscribe to application events.  This should
  * be used sparingly - for the most part, Context should be used higher-up in the application to
@@ -12,13 +11,12 @@ import { subscribe, unsubscribe } from '../../subscriptions';
  * @param {function} callback
  */
 const useSiteEvent = (type, callback) => {
-  useEffect(() => {
-    subscribe(type, callback);
-
-    return () => {
-      unsubscribe(type, callback);
-    };
-  }, [callback, type]);
+    useEffect(() => {
+        subscribe(type, callback);
+        return () => {
+            unsubscribe(type, callback);
+        };
+    }, [callback, type]);
 };
-
 export default useSiteEvent;
+//# sourceMappingURL=useSiteEvent.js.map

package/dist/runtime/react/hooks/useSiteEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSiteEvent.js","sourceRoot":"","sources":["../../../../runtime/react/hooks/useSiteEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAE7D;;;;;;;;;GASG;AACH,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,SAAS,CAAC,GAAG,EAAE;QACb,SAAS,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;QAE1B,OAAO,GAAG,EAAE;YACV,WAAW,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;QAC9B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAC;AACvB,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { useEffect } from 'react';\nimport { subscribe, unsubscribe } from '../../subscriptions';\n\n/**\n * A React hook that allows functional components to subscribe to application events.  This should\n * be used sparingly - for the most part, Context should be used higher-up in the application to\n * provide necessary data to a given component, rather than utilizing a non-React-like Pub/Sub\n * mechanism.\n *\n * @memberof module:React\n * @param {string} type\n * @param {function} callback\n */\nconst useSiteEvent = (type, callback) => {\n  useEffect(() => {\n    subscribe(type, callback);\n\n    return () => {\n      unsubscribe(type, callback);\n    };\n  }, [callback, type]);\n};\n\nexport default useSiteEvent;\n"]}

package/{runtime/react/index.ts → dist/runtime/react/index.d.ts}

@@ -5,7 +5,6 @@
  *
  * @module React
  */
-
 export { default as CurrentAppContext } from './CurrentAppContext';
 export { default as CurrentAppProvider } from './CurrentAppProvider';
 export { default as SiteContext } from './SiteContext';

package/dist/runtime/react/index.js

@@ -0,0 +1,19 @@
+/**
+ * #### Import members from **@openedx/frontend-base** React
+ * The React module provides a variety of React components, hooks, and contexts for use in an
+ * application.
+ *
+ * @module React
+ */
+export { default as CurrentAppContext } from './CurrentAppContext';
+export { default as CurrentAppProvider } from './CurrentAppProvider';
+export { default as SiteContext } from './SiteContext';
+export { default as SiteProvider } from './SiteProvider';
+export { default as AuthenticatedPageRoute } from './AuthenticatedPageRoute';
+export { default as Divider } from './Divider';
+export { default as ErrorBoundary } from './ErrorBoundary';
+export { default as ErrorPage } from './ErrorPage';
+export { useSiteEvent, useAuthenticatedUser, useSiteConfig, useAppConfig } from './hooks';
+export { default as LoginRedirect } from './LoginRedirect';
+export { default as PageWrap } from './PageWrap';
+//# sourceMappingURL=index.js.map

package/dist/runtime/react/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../runtime/react/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EAAE,OAAO,IAAI,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,oBAAoB,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC","sourcesContent":["/**\n * #### Import members from **@openedx/frontend-base** React\n * The React module provides a variety of React components, hooks, and contexts for use in an\n * application.\n *\n * @module React\n */\n\nexport { default as CurrentAppContext } from './CurrentAppContext';\nexport { default as CurrentAppProvider } from './CurrentAppProvider';\nexport { default as SiteContext } from './SiteContext';\nexport { default as SiteProvider } from './SiteProvider';\nexport { default as AuthenticatedPageRoute } from './AuthenticatedPageRoute';\nexport { default as Divider } from './Divider';\nexport { default as ErrorBoundary } from './ErrorBoundary';\nexport { default as ErrorPage } from './ErrorPage';\nexport { useSiteEvent, useAuthenticatedUser, useSiteConfig, useAppConfig } from './hooks';\nexport { default as LoginRedirect } from './LoginRedirect';\nexport { default as PageWrap } from './PageWrap';\n"]}

package/dist/runtime/react/reducers.d.ts

@@ -0,0 +1,11 @@
+export declare function themeReducer(state: any, action: any): any;
+export declare const themeActions: {
+    setThemeVariant: (payload: any) => {
+        type: string;
+        payload: any;
+    };
+    setThemeLoaded: (payload: any) => {
+        type: string;
+        payload: any;
+    };
+};

package/dist/runtime/react/reducers.js

@@ -0,0 +1,28 @@
+import { SET_THEME_VARIANT, SET_IS_THEME_LOADED, } from './constants';
+export function themeReducer(state, action) {
+    switch (action.type) {
+        case SET_THEME_VARIANT: {
+            const requestedThemeVariant = action.payload;
+            return Object.assign(Object.assign({}, state), { themeVariant: requestedThemeVariant });
+        }
+        case SET_IS_THEME_LOADED: {
+            const requestedIsThemeLoaded = action.payload;
+            return Object.assign(Object.assign({}, state), { isThemeLoaded: requestedIsThemeLoaded });
+        }
+        default:
+            return state;
+    }
+}
+const setThemeVariant = (payload) => ({
+    type: SET_THEME_VARIANT,
+    payload,
+});
+const setThemeLoaded = (payload) => ({
+    type: SET_IS_THEME_LOADED,
+    payload,
+});
+export const themeActions = {
+    setThemeVariant,
+    setThemeLoaded,
+};
+//# sourceMappingURL=reducers.js.map