@blerp/design 1.4.5 → 1.4.6

package/dist/esm/PurchaseModals/CheckoutModal.js

@@ -1,5 +1,5 @@
-import { Stack } from '../index.js';
 import React from 'react';
+import { Stack } from '../neo-components/Stack.js';
 
 const NeedToReplace = props => {
   return /*#__PURE__*/React.createElement(Stack, {
@@ -30,4 +30,6 @@ const NeedToReplace = props => {
   }, "Need to replace to remove payment dependencies");
 };
 
-export { NeedToReplace as default };
+var NeedToReplace$1 = NeedToReplace;
+
+export { NeedToReplace$1 as default };

package/dist/esm/PurchaseModals/PremiumBlerpCheckoutModal.js

@@ -1,5 +1,5 @@
-import { Stack } from '../index.js';
 import React from 'react';
+import { Stack } from '../neo-components/Stack.js';
 
 const NeedToReplace = props => {
   return /*#__PURE__*/React.createElement(Stack, {
@@ -30,4 +30,6 @@ const NeedToReplace = props => {
   }, "Need to replace to remove payment dependencies");
 };
 
-export { NeedToReplace as default };
+var NeedToReplace$1 = NeedToReplace;
+
+export { NeedToReplace$1 as default };

package/dist/esm/PurchaseModals/PremiumCollectionCheckoutModal.js

@@ -1,5 +1,5 @@
-import { Stack } from '../index.js';
 import React from 'react';
+import { Stack } from '../neo-components/Stack.js';
 
 const NeedToReplace = props => {
   return /*#__PURE__*/React.createElement(Stack, {
@@ -30,4 +30,6 @@ const NeedToReplace = props => {
   }, "Need to replace to remove payment dependencies");
 };
 
-export { NeedToReplace as default };
+var NeedToReplace$1 = NeedToReplace;
+
+export { NeedToReplace$1 as default };

package/dist/esm/PurchaseModals/PremiumSubscriptionCheckoutModal.js

@@ -1,5 +1,5 @@
-import { Stack } from '../index.js';
 import React from 'react';
+import { Stack } from '../neo-components/Stack.js';
 
 const NeedToReplace = props => {
   return /*#__PURE__*/React.createElement(Stack, {
@@ -30,4 +30,6 @@ const NeedToReplace = props => {
   }, "Need to replace to remove payment dependencies");
 };
 
-export { NeedToReplace as default };
+var NeedToReplace$1 = NeedToReplace;
+
+export { NeedToReplace$1 as default };

package/dist/esm/ReactionButtons.js

@@ -1,6 +1,7 @@
 import React from 'react';
-import { Grid, Tooltip } from './index.js';
 import { useBlerpTheme } from './Theme.js';
+import { Grid } from './neo-components/Grid.js';
+import { Tooltip } from './neo-components/Misc.js';
 
 const reactionIconUrls = {
   FUNNY: "https://cdn.blerp.com/blerp_products/Icons/Funny%403x.svg",
@@ -69,4 +70,6 @@ const ReactionButtons = _ref => {
   }));
 };
 
-export { ReactionButtons as default };
+var ReactionButtons$1 = ReactionButtons;
+
+export { ReactionButtons$1 as default };

package/dist/esm/Theme.js

@@ -1,30 +1,9 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import React, { useContext, useMemo, createContext } from 'react';
+import React, { useMemo, useContext, createContext } from 'react';
 import icons from './icons.js';
 import colors, { lightColors, lightPalette, darkColors, darkPalette } from './colors.js';
 import { SnackbarProvider } from './SnackbarContextProvider.js';
 import { ThemeProvider } from './neo-components/ThemeProvider.js';
-import '@babel/runtime/helpers/extends';
-import '@babel/runtime/helpers/objectWithoutProperties';
-import './neo-components/Box.js';
-import './neo-components/Stack.js';
-import './neo-components/Grid.js';
-import './neo-components/Container.js';
-import './neo-components/Text.js';
-import './neo-components/Button.js';
-import './neo-components/IconButton.js';
-import './neo-components/Fab.js';
-import './neo-components/ToggleButton.js';
-import './neo-components/Input.js';
-import './neo-components/FormControls.js';
-import './neo-components/Autocomplete.js';
-import './neo-components/Paper.js';
-import './neo-components/Dialog.js';
-import './neo-components/Navigation.js';
-import './neo-components/BottomNavigation.js';
-import './neo-components/Stepper.js';
-import './neo-components/Misc.js';
-import './neo-components/Layout.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -90,6 +69,19 @@ const mainTheme = {
 };
 const fonts = "@font-face {\n  font-family: \"Odudo\";\n  font-weight: normal;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: lighter;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: 300;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Light.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: 400;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Regular.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: bolder;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: 600;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/Odudo%20V1.3/WEB/odudo-semibold-webfont.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: bold;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.woff\")\n      format(\"woff\");\n}\n\n@font-face {\n  font-family: \"Odudo\";\n  font-weight: 700;\n  font-display: swap;\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.eot\");\n  src: url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.woff2\")\n      format(\"woff2\"),\n    url(\"https://cdn.blerp.com/blerp-web-images/fonts/web/Odudo-Bold.woff\")\n      format(\"woff\");\n}"; // Try to load MUI dynamically, but don't fail if it's not installed
 
+let createTheme = null;
+let MuiThemeProvider = null;
+
+try {
+  const mui = require("@mui/material/styles");
+
+  createTheme = mui.createTheme;
+  MuiThemeProvider = mui.ThemeProvider;
+} catch (e) {// MUI not installed, that's fine
+  // console.log("MUI not detected - using lightweight theme mode");
+} // Try to load styled-components, but don't fail if it's not installed
+
+
 let StyledThemeProvider = null;
 
 try {
@@ -119,7 +111,7 @@ const darkThemeConfig = _objectSpread({
   palette: darkPalette
 }, mainTheme); // MUI themes (only created if MUI is available)
 
-({
+const muiThemeConfig = {
   typography: {
     fontFamily: "Odudo, Arial"
   },
@@ -222,9 +214,84 @@ const darkThemeConfig = _objectSpread({
       styleOverrides: fonts
     }
   }
-});
-const theme = lightThemeConfig;
-const darkTheme = darkThemeConfig; // Create a context for theme access (legacy - for styled-components)
+};
+const theme = createTheme ? createTheme(_objectSpread(_objectSpread({}, muiThemeConfig), {}, {
+  mode: "light",
+  colors: lightColors,
+  icons: icons,
+  palette: lightPalette
+})) : lightThemeConfig;
+const darkTheme = createTheme ? createTheme(_objectSpread(_objectSpread({}, muiThemeConfig), {}, {
+  components: _objectSpread(_objectSpread({}, muiThemeConfig.components), {}, {
+    MuiTypography: {
+      styleOverrides: {
+        root: {
+          color: colors.white
+        }
+      }
+    },
+    MuiFilledInput: {
+      styleOverrides: {
+        root: {
+          color: colors.white,
+          backgroundColor: colors.grey7,
+          "& textarea": {
+            color: colors.white
+          },
+          ":hover": {
+            backgroundColor: colors.grey7
+          },
+          ":before": {
+            borderColor: colors.waxwing
+          },
+          ":hover:before": {
+            borderColor: "".concat(colors.white, " !important")
+          }
+        }
+      }
+    },
+    MuiInput: {
+      styleOverrides: {
+        root: {
+          color: colors.white,
+          borderColor: colors.white,
+          ":before": {
+            borderColor: colors.waxwing
+          },
+          ":hover:before": {
+            borderColor: "".concat(colors.white, " !important")
+          }
+        }
+      }
+    },
+    MuiInputLabel: {
+      styleOverrides: {
+        root: {
+          color: colors.white
+        }
+      }
+    },
+    MuiSvgIcon: {
+      styleOverrides: {
+        root: {
+          color: colors.white
+        }
+      }
+    },
+    MuiBackdrop: {
+      styleOverrides: {
+        root: {
+          backgroundColor: "".concat(colors.grey5, "70"),
+          backdropFilter: "blur(4px)"
+        }
+      }
+    }
+  }),
+  mode: "dark",
+  colors: darkColors,
+  icons: icons,
+  palette: darkPalette
+})) : darkThemeConfig; // Create a context for theme access (legacy - for styled-components)
 
 const BlerpThemeContext = /*#__PURE__*/createContext(null);
 const useBlerpTheme = () => {
@@ -238,7 +305,7 @@ const useBlerpTheme = () => {
 };
 /**
  * BlerpTheme - Main theme provider
- *
+ * 
  * FIXED: Now accepts and passes through customColors to NewThemeProvider
  * This allows ExtensionTheme and other consumers to override extension colors
  */
@@ -265,7 +332,9 @@ const BlerpTheme = _ref => {
     theme: themeValue
   }, innerContent) : innerContent; // Wrap with MUI ThemeProvider if available
 
-  const withMuiTheme = withStyledTheme; // CRITICAL FIX: Pass customColors through to NewThemeProvider
+  const withMuiTheme = MuiThemeProvider ? /*#__PURE__*/React.createElement(MuiThemeProvider, {
+    theme: currentTheme
+  }, withStyledTheme) : withStyledTheme; // CRITICAL FIX: Pass customColors through to NewThemeProvider
   // This ensures neo-components get the extension color overrides
 
   return /*#__PURE__*/React.createElement(ThemeProvider, {
@@ -274,4 +343,6 @@ const BlerpTheme = _ref => {
   }, withMuiTheme);
 };
 
-export { darkTheme, darkThemeConfig, BlerpTheme as default, fonts, lightThemeConfig, theme, useBlerpTheme };
+var BlerpTheme$1 = BlerpTheme; // Export fonts for manual injection if needed
+
+export { darkTheme, darkThemeConfig, BlerpTheme$1 as default, fonts, lightThemeConfig, theme, useBlerpTheme };

package/dist/esm/Toggle.js

@@ -1,6 +1,6 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import React from 'react';
-import { EllipsisLoader } from './EllipsisLoader.js';
+import EllipsisLoader from './EllipsisLoader.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 

package/dist/esm/UserCard.js

@@ -1,5 +1,6 @@
 import React from 'react';
-import { Stack, Text } from './index.js';
+import { Stack } from './neo-components/Stack.js';
+import { Typography } from './neo-components/Text.js';
 
 const UserCard = _ref => {
   var _user$twitchChannelIn, _user$profileImage, _user$profileImage$or;
@@ -57,7 +58,7 @@ const UserCard = _ref => {
       flex: 1,
       marginLeft: "20px"
     }
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     sx: {
       fontSize: "18px",
       fontWeight: "300",
@@ -85,12 +86,12 @@ const UserCard = _ref => {
       cursor: "pointer"
     },
     onClick: onFollowerClick
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     sx: {
       fontSize: "14px",
       fontWeight: "400"
     }
-  }, followerCount), /*#__PURE__*/React.createElement(Text, {
+  }, followerCount), /*#__PURE__*/React.createElement(Typography, {
     sx: {
       fontSize: "12px",
       fontWeight: "300",
@@ -102,12 +103,12 @@ const UserCard = _ref => {
       cursor: "pointer"
     },
     onClick: onCreatedClick
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     sx: {
       fontSize: "14px",
       fontWeight: "400"
     }
-  }, createdCount), /*#__PURE__*/React.createElement(Text, {
+  }, createdCount), /*#__PURE__*/React.createElement(Typography, {
     sx: {
       fontSize: "12px",
       fontWeight: "300",

package/dist/esm/UserPage/LibraryControls.js

@@ -1,7 +1,14 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { Stack, Text, Box, Input, Button, Popover, IconButton, Divider } from '../index.js';
 import React, { useState, useRef } from 'react';
 import { useWindowSize } from '../ScreenSizeHook.js';
+import { Stack } from '../neo-components/Stack.js';
+import { Typography } from '../neo-components/Text.js';
+import { Box } from '../neo-components/Box.js';
+import { TextField } from '../neo-components/Input.js';
+import { Button } from '../neo-components/Button.js';
+import { Popover } from '../neo-components/Navigation.js';
+import { IconButton } from '../neo-components/IconButton.js';
+import { Divider } from '../neo-components/Misc.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -159,12 +166,12 @@ const LibraryControls = _ref9 => {
     marginTop: size.width <= 675 && "20px"
   }, activeBoard && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(IconPerson, {
     color: iconColor
-  }), /*#__PURE__*/React.createElement(Text, null, activeBoard === null || activeBoard === void 0 ? void 0 : (_activeBoard$ownerObj = activeBoard.ownerObject) === null || _activeBoard$ownerObj === void 0 ? void 0 : _activeBoard$ownerObj.username)), !hideSearch && /*#__PURE__*/React.createElement(Box, {
+  }), /*#__PURE__*/React.createElement(Typography, null, activeBoard === null || activeBoard === void 0 ? void 0 : (_activeBoard$ownerObj = activeBoard.ownerObject) === null || _activeBoard$ownerObj === void 0 ? void 0 : _activeBoard$ownerObj.username)), !hideSearch && /*#__PURE__*/React.createElement(Box, {
     sx: {
       display: "flex",
       alignItems: "flex-end"
     }
-  }, /*#__PURE__*/React.createElement(Input, {
+  }, /*#__PURE__*/React.createElement(TextField, {
     id: "user-library-search-input",
     placeholder: "Search User Library",
     variant: "standard",
@@ -255,7 +262,7 @@ const LibraryControls = _ref9 => {
         color: "white.override"
       }
     }
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     margin: "0 15px",
     fontSize: "18px"
   }, "Alphabetical")), /*#__PURE__*/React.createElement(Stack, {
@@ -269,7 +276,7 @@ const LibraryControls = _ref9 => {
         color: "white.override"
       }
     }
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     margin: "0 15px",
     fontSize: "18px"
   }, "Newest")), /*#__PURE__*/React.createElement(Stack, {
@@ -283,14 +290,14 @@ const LibraryControls = _ref9 => {
         color: "white.override"
       }
     }
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     margin: "0 15px",
     fontSize: "18px"
   }, "Oldest"))), !hideLayoutButtons && /*#__PURE__*/React.createElement(React.Fragment, null, size.width >= 1000 ? /*#__PURE__*/React.createElement(React.Fragment, null, !activeBoard && /*#__PURE__*/React.createElement(Button, {
     color: "notBlack",
     ref: filterRef,
     onClick: () => setFilterAnchor(filterRef.current)
-  }, /*#__PURE__*/React.createElement(Text, null, "Sort"), /*#__PURE__*/React.createElement(IconSort, {
+  }, /*#__PURE__*/React.createElement(Typography, null, "Sort"), /*#__PURE__*/React.createElement(IconSort, {
     color: iconColor
   })), /*#__PURE__*/React.createElement(IconButton, null, /*#__PURE__*/React.createElement(IconMenu, {
     color: iconColor
@@ -342,7 +349,7 @@ const LibraryControls = _ref9 => {
     }
   }, /*#__PURE__*/React.createElement(IconMenu, {
     color: iconColor
-  }), /*#__PURE__*/React.createElement(Text, {
+  }), /*#__PURE__*/React.createElement(Typography, {
     color: "notBlack.main",
     margin: "0 15px",
     fontSize: "18px"
@@ -359,7 +366,7 @@ const LibraryControls = _ref9 => {
     }
   }, /*#__PURE__*/React.createElement(IconGrid, {
     color: iconColor
-  }), /*#__PURE__*/React.createElement(Text, {
+  }), /*#__PURE__*/React.createElement(Typography, {
     color: "notBlack.main",
     margin: "0 15px",
     fontSize: "18px"
@@ -383,7 +390,7 @@ const LibraryControls = _ref9 => {
     direction: "row"
   }, /*#__PURE__*/React.createElement(IconSort, {
     color: iconColor
-  }), /*#__PURE__*/React.createElement(Text, {
+  }), /*#__PURE__*/React.createElement(Typography, {
     fontSize: "18px",
     color: "notBlack.main",
     margin: "0 15px"
@@ -392,4 +399,6 @@ const LibraryControls = _ref9 => {
   }))))));
 };
 
-export { LibraryControls as default };
+var LibraryControls$1 = LibraryControls;
+
+export { LibraryControls$1 as default };

package/dist/esm/UserPage/UserLibraryHeader.js

@@ -1,8 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import React from 'react';
-import { Box, Stack, Button } from '../index.js';
 import { useWindowSize } from '../ScreenSizeHook.js';
 import LibraryControls from './LibraryControls.js';
+import { Box } from '../neo-components/Box.js';
+import { Stack } from '../neo-components/Stack.js';
+import { Button } from '../neo-components/Button.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -92,4 +94,6 @@ const UserLibraryHeader = _ref => {
   }))));
 };
 
-export { UserLibraryHeader as default };
+var UserLibraryHeader$1 = UserLibraryHeader;
+
+export { UserLibraryHeader$1 as default };

package/dist/esm/UserPage/UserProfileHeader.js

@@ -2,10 +2,15 @@ import _extends from '@babel/runtime/helpers/extends';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import React, { useState, useEffect } from 'react';
-import { Stack, IconButton, Box, Text, Divider, Button } from '../index.js';
 import { useWindowSize } from '../ScreenSizeHook.js';
 import { extractDominantColor } from '../helpers.js';
 import { useBlerpTheme } from '../Theme.js';
+import { Stack } from '../neo-components/Stack.js';
+import { IconButton } from '../neo-components/IconButton.js';
+import { Box } from '../neo-components/Box.js';
+import { Typography } from '../neo-components/Text.js';
+import { Divider } from '../neo-components/Misc.js';
+import { Button } from '../neo-components/Button.js';
 import { TwitchIcon } from '../Icons/Icons.js';
 
 const _excluded = ["path", "sx", "size"];
@@ -236,7 +241,7 @@ const UserProfileHeader = _ref2 => {
     marginLeft: "20px"
   }, /*#__PURE__*/React.createElement(Stack, {
     direction: "row"
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     noWrap: true,
     maxWidth: "200px",
     color: "white.override",
@@ -252,10 +257,10 @@ const UserProfileHeader = _ref2 => {
         margin: "5px"
       }
     })
-  }, /*#__PURE__*/React.createElement(Text, {
+  }, /*#__PURE__*/React.createElement(Typography, {
     color: "white.override",
     fontSize: "16px"
-  }, userData === null || userData === void 0 ? void 0 : userData.followerCount, " Followers"), /*#__PURE__*/React.createElement(Text, {
+  }, userData === null || userData === void 0 ? void 0 : userData.followerCount, " Followers"), /*#__PURE__*/React.createElement(Typography, {
     color: "white.override",
     fontSize: "16px"
   }, userData === null || userData === void 0 ? void 0 : userData.followingCount, " Following"))))), /*#__PURE__*/React.createElement(Stack, {
@@ -286,4 +291,6 @@ const UserProfileHeader = _ref2 => {
   })) : /*#__PURE__*/React.createElement(React.Fragment, null), renderSocialLinks()))));
 };
 
-export { UserProfileHeader as default };
+var UserProfileHeader$1 = UserProfileHeader;
+
+export { UserProfileHeader$1 as default };

package/dist/esm/UsernameWithPopout.js

@@ -1,7 +1,9 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import React, { useState } from 'react';
-import { Stack, Popover, Text } from './index.js';
 import { UserCard } from './UserCard.js';
+import { Stack } from './neo-components/Stack.js';
+import { Popover } from './neo-components/Navigation.js';
+import { Typography } from './neo-components/Text.js';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -67,7 +69,7 @@ const UsernameWithPopout = _ref => {
     onCreatedClick: onCreatedClick,
     collapsed: collapsed,
     user: user
-  })), /*#__PURE__*/React.createElement(Text, {
+  })), /*#__PURE__*/React.createElement(Typography, {
     sx: _objectSpread({
       fontWeight: "300",
       fontSize: "12px",

package/dist/esm/colors.js

@@ -358,5 +358,6 @@ const darkPalette = {
     main: colors.popnYellow
   }
 };
+var colors$1 = colors;
 
-export { darkColors, darkPalette, colors as default, lightColors, lightPalette, overrideColors };
+export { darkColors, darkPalette, colors$1 as default, lightColors, lightPalette, overrideColors };

package/dist/esm/icons.js

@@ -155,5 +155,6 @@ const icons = {
     tabView: "https://cdn.blerp.com/blerp_products/Icons/Tabview-Starling.svg"
   }
 };
+var icons$1 = icons;
 
-export { icons as default };
+export { icons$1 as default };