@mitodl/smoot-design 1.2.0 → 2.0.1

package/README.md

@@ -12,6 +12,10 @@ To trigger a release, run the "Release" github action. Using [semantic-release](
 2. Determine whether the version bump should be major, minor, or patch based on commit types. Breaking changes (e.g., `feat!: remove Button variant 'outlined'`) will result in major version bumps.
 3. Publish the package to NPM and the repository's [Github Releases](https://github.com/mitodl/smoot-design/releases).
 
+## Installation
+
+Ensure `peerDependencies` are installed as well. See [`package.json`](./package.json).
+
 ## Documentation
 
 Documentation for `smoot-design` components is available at https://mitodl.github.io/smoot-design.

package/dist/cjs/components/Button/ActionButton.stories.js

@@ -7,7 +7,7 @@ const Grid2_1 = require("@mui/material/Grid2");
 const Stack_1 = require("@mui/material/Stack");
 const react_1 = require("@remixicon/react");
 const test_1 = require("@storybook/test");
-const story_utils_1 = require("@/story-utils");
+const story_utils_1 = require("../../story-utils");
 const ICONS = {
     None: undefined,
     ArrowBackIcon: React.createElement(react_1.RiArrowLeftLine, null),
@@ -20,9 +20,6 @@ const VARIANTS = (0, story_utils_1.enumValues)({
     tertiary: true,
     bordered: true,
     text: true,
-    unstable_noBorder: true,
-    unstable_inverted: true,
-    unstable_success: true,
 });
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"));
 const SIZES = (0, story_utils_1.enumValues)({

package/dist/cjs/components/Button/Button.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { LinkAdapterPropsOverrides } from "../LinkAdapter/LinkAdapter";
-type ButtonVariant = "primary" | "secondary" | "tertiary" | "text" | "bordered" | "unstable_noBorder" | "unstable_inverted" | "unstable_success";
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "text" | "bordered";
 type ButtonSize = "small" | "medium" | "large";
 type ButtonEdge = "circular" | "rounded" | "none";
 type ButtonStyleProps = {

package/dist/cjs/components/Button/Button.js

@@ -99,21 +99,6 @@ const buttonStyles = (props) => {
                 boxShadow: "none",
             },
         },
-        variant === "unstable_success" && {
-            backgroundColor: colors.darkGreen,
-            color: colors.white,
-            border: "none",
-            /* Shadow/04dp */
-            boxShadow: "0px 2px 4px 0px rgba(37, 38, 43, 0.10), 0px 3px 8px 0px rgba(37, 38, 43, 0.12)",
-            ":hover:not(:disabled)": {
-                backgroundColor: colors.darkGreen,
-                boxShadow: "none",
-            },
-            ":disabled": {
-                backgroundColor: colors.silverGray,
-                boxShadow: "none",
-            },
-        },
         variant === "secondary" && {
             color: colors.red,
             backgroundColor: "transparent",
@@ -153,18 +138,6 @@ const buttonStyles = (props) => {
                 color: colors.silverGrayDark,
             },
         },
-        variant === "unstable_noBorder" && {
-            backgroundColor: colors.white,
-            color: colors.darkGray2,
-            border: "none",
-            ":hover:not(:disabled)": {
-                // darkGray1 at 6% alpha
-                backgroundColor: "rgba(64, 70, 76, 0.06)",
-            },
-            ":disabled": {
-                color: colors.silverGray,
-            },
-        },
         variant === "tertiary" && {
             color: colors.darkGray2,
             border: "none",
@@ -177,12 +150,6 @@ const buttonStyles = (props) => {
                 color: colors.silverGrayLight,
             },
         },
-        variant === "unstable_inverted" && {
-            backgroundColor: colors.white,
-            color: colors.mitRed,
-            borderColor: colors.mitRed,
-            borderStyle: "solid",
-        },
         // edge
         edge === "rounded" && {
             borderRadius: "4px",

package/dist/cjs/components/Button/Button.stories.js

@@ -7,7 +7,7 @@ const Grid2_1 = require("@mui/material/Grid2");
 const Stack_1 = require("@mui/material/Stack");
 const react_1 = require("@remixicon/react");
 const test_1 = require("@storybook/test");
-const story_utils_1 = require("@/story-utils");
+const story_utils_1 = require("../../story-utils");
 const ICONS = {
     None: undefined,
     ArrowBackIcon: React.createElement(react_1.RiArrowLeftLine, null),
@@ -20,9 +20,6 @@ const VARIANTS = (0, story_utils_1.enumValues)({
     tertiary: true,
     bordered: true,
     text: true,
-    unstable_noBorder: true,
-    unstable_inverted: true,
-    unstable_success: true,
 });
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"));
 const SIZES = (0, story_utils_1.enumValues)({

package/dist/cjs/components/Input/Input.stories.js

@@ -7,7 +7,7 @@ const Stack_1 = require("@mui/material/Stack");
 const Grid2_1 = require("@mui/material/Grid2");
 const react_1 = require("@remixicon/react");
 const test_1 = require("@storybook/test");
-const story_utils_1 = require("@/story-utils");
+const story_utils_1 = require("../../story-utils");
 const Typography_1 = require("@mui/material/Typography");
 const SIZES = (0, story_utils_1.enumValues)({
     small: true,

package/dist/cjs/components/ScrollSnap/ScrollSnap.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ScrollSnap = void 0;
-const composeRefs_1 = require("@/utils/composeRefs");
+const composeRefs_1 = require("../../utils/composeRefs");
 const styled_1 = require("@emotion/styled");
 const React = require("react");
 /**
@@ -36,14 +36,16 @@ const ScrollSnap = React.forwardRef(function ScrollSnap({ children, threshold =
      * 3. Then scroll to bottom (if needed)
      *
      * In this way, we can measure the scroll position before the new content is set.
+     *
+     * In React 19, this started requiring useLayoutEffect.
      */
-    React.useEffect(() => {
+    React.useLayoutEffect(() => {
         if (!el.current)
             return;
         wasAtBottom.current = distanceFromBottom(el.current) < threshold;
         setContent(children);
     }, [children, threshold]);
-    React.useEffect(() => {
+    React.useLayoutEffect(() => {
         if (!el.current)
             return;
         const atBottom = distanceFromBottom(el.current) < threshold;

package/dist/cjs/components/ScrollSnap/ScrollSnap.stories.js

@@ -5,7 +5,7 @@ const React = require("react");
 const ScrollSnap_1 = require("./ScrollSnap");
 const styled_1 = require("@emotion/styled");
 const en_1 = require("@faker-js/faker/locale/en");
-const useInterval_1 = require("@/utils/useInterval");
+const useInterval_1 = require("../../utils/useInterval");
 const Slider_1 = require("@mui/material/Slider");
 const Stack_1 = require("@mui/material/Stack");
 const Typography_1 = require("@mui/material/Typography");

package/dist/cjs/components/SrAnnouncer/SrAnnouncer.js

@@ -4,7 +4,7 @@ exports.SrAnnouncer = void 0;
 const React = require("react");
 const VisuallyHidden_1 = require("../VisuallyHidden/VisuallyHidden");
 const react_1 = require("react");
-const useDevCheckStable_1 = require("@/utils/useDevCheckStable");
+const useDevCheckStable_1 = require("../../utils/useDevCheckStable");
 const DEFAULT_PROPS = {
     loadingMessages: [
         { delay: 1500, text: "Loading" },

package/dist/cjs/components/TextField/TextField.stories.js

@@ -8,7 +8,7 @@ const Stack_1 = require("@mui/material/Stack");
 const Grid_1 = require("@mui/material/Grid");
 const react_1 = require("@remixicon/react");
 const test_1 = require("@storybook/test");
-const story_utils_1 = require("@/story-utils");
+const story_utils_1 = require("../../story-utils");
 const SIZES = (0, story_utils_1.enumValues)({
     small: true,
     medium: true,

package/dist/cjs/components/ThemeProvider/ThemeProvider.d.ts

@@ -6,9 +6,7 @@ import type { ThemeOptions, Theme } from "@mui/material/styles";
  * See [ThemeProvider Docs](https://mitodl.github.io/smoot-design/?path=/docs/smoot-design-themeprovider--docs#further-customized-theme-with-createtheme)
  * for more.
  */
-declare const createTheme: (options?: {
-    custom: Partial<ThemeOptions["custom"]>;
-}) => Theme;
+declare const createTheme: (options?: ThemeOptions) => Theme;
 type ThemeProviderProps = {
     children?: React.ReactNode;
     theme?: Theme;

package/dist/cjs/components/ThemeProvider/ThemeProvider.js

@@ -7,6 +7,7 @@ const typography = require("./typography");
 const buttons = require("./buttons");
 const chips = require("./chips");
 const colors_1 = require("./colors");
+const deepmerge_1 = require("@mui/utils/deepmerge");
 const custom = {
     colors: colors_1.colors,
     dimensions: {
@@ -48,13 +49,6 @@ const defaultThemeOptions = {
     components: {
         MuiButtonBase: buttons.buttonBaseComponent,
         MuiTypography: typography.component,
-        MuiTabPanel: {
-            styleOverrides: {
-                root: {
-                    padding: "0px",
-                },
-            },
-        },
         MuiMenu: {
             styleOverrides: { paper: { borderRadius: "4px" } },
         },
@@ -76,7 +70,9 @@ const defaultThemeOptions = {
  * See [ThemeProvider Docs](https://mitodl.github.io/smoot-design/?path=/docs/smoot-design-themeprovider--docs#further-customized-theme-with-createtheme)
  * for more.
  */
-const createTheme = (options) => (0, styles_1.createTheme)(Object.assign(Object.assign({}, defaultThemeOptions), { custom: Object.assign(Object.assign({}, defaultThemeOptions.custom), options === null || options === void 0 ? void 0 : options.custom) }));
+const createTheme = (options) => {
+    return (0, styles_1.createTheme)((0, deepmerge_1.default)(defaultThemeOptions, options));
+};
 exports.createTheme = createTheme;
 const defaultTheme = createTheme();
 /**

package/dist/cjs/components/ThemeProvider/breakpoints.js

@@ -14,7 +14,6 @@ const BREAKPOINT_VALUES = {
 exports.BREAKPOINT_VALUES = BREAKPOINT_VALUES;
 const { breakpoints } = (0, styles_1.createTheme)({
     breakpoints: BREAKPOINT_VALUES,
-    // @ts-expect-error only using breakpoints
     custom: {},
 });
 exports.breakpoints = breakpoints;

package/dist/cjs/components/ThemeProvider/typography.js

@@ -168,7 +168,6 @@ const component = {
 exports.component = component;
 const { typography } = (0, styles_1.createTheme)({
     typography: globalSettings,
-    // @ts-expect-error: we only care about typography from this theme
     custom: {},
 });
 exports.typography = typography;

package/dist/cjs/components/internal/FormHelpers/FormHelpers.test.js

@@ -14,7 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const React = require("react");
 const react_1 = require("@testing-library/react");
 const FormHelpers_1 = require("./FormHelpers");
-const ThemeProvider_1 = require("@/components/ThemeProvider/ThemeProvider");
+const ThemeProvider_1 = require("../../../components/ThemeProvider/ThemeProvider");
 const en_1 = require("@faker-js/faker/locale/en");
 const assertDescription = ({ text, total, exists, }) => {
     var _a;

package/dist/cjs/index.d.ts

@@ -1,6 +1,5 @@
 export { default as styled } from "@emotion/styled";
 export { css, Global } from "@emotion/react";
-export { AppRouterCacheProvider as NextJsAppRouterCacheProvider } from "@mui/material-nextjs/v15-appRouter";
 export { ThemeProvider, createTheme, } from "./components/ThemeProvider/ThemeProvider";
 export { Button, ButtonLink } from "./components/Button/Button";
 export type { ButtonProps, ButtonLinkProps } from "./components/Button/Button";

package/dist/cjs/index.js

@@ -1,14 +1,12 @@
 "use strict";
 "use client";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.VisuallyHidden = exports.SrAnnouncer = exports.TextField = exports.Input = exports.ActionButtonLink = exports.ActionButton = exports.ButtonLink = exports.Button = exports.createTheme = exports.ThemeProvider = exports.NextJsAppRouterCacheProvider = exports.Global = exports.css = exports.styled = void 0;
+exports.VisuallyHidden = 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");
 Object.defineProperty(exports, "css", { enumerable: true, get: function () { return react_1.css; } });
 Object.defineProperty(exports, "Global", { enumerable: true, get: function () { return react_1.Global; } });
-var v15_appRouter_1 = require("@mui/material-nextjs/v15-appRouter");
-Object.defineProperty(exports, "NextJsAppRouterCacheProvider", { enumerable: true, get: function () { return v15_appRouter_1.AppRouterCacheProvider; } });
 var ThemeProvider_1 = require("./components/ThemeProvider/ThemeProvider");
 Object.defineProperty(exports, "ThemeProvider", { enumerable: true, get: function () { return ThemeProvider_1.ThemeProvider; } });
 Object.defineProperty(exports, "createTheme", { enumerable: true, get: function () { return ThemeProvider_1.createTheme; } });

package/dist/esm/components/Button/ActionButton.stories.js

@@ -4,7 +4,7 @@ import Grid from "@mui/material/Grid2";
 import Stack from "@mui/material/Stack";
 import { RiArrowLeftLine, RiDeleteBinLine, RiTestTubeLine, } from "@remixicon/react";
 import { fn } from "@storybook/test";
-import { enumValues } from "@/story-utils";
+import { enumValues } from "../../story-utils";
 const ICONS = {
     None: undefined,
     ArrowBackIcon: React.createElement(RiArrowLeftLine, null),
@@ -17,9 +17,6 @@ const VARIANTS = enumValues({
     tertiary: true,
     bordered: true,
     text: true,
-    unstable_noBorder: true,
-    unstable_inverted: true,
-    unstable_success: true,
 });
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"));
 const SIZES = enumValues({

package/dist/esm/components/Button/Button.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { LinkAdapterPropsOverrides } from "../LinkAdapter/LinkAdapter";
-type ButtonVariant = "primary" | "secondary" | "tertiary" | "text" | "bordered" | "unstable_noBorder" | "unstable_inverted" | "unstable_success";
+type ButtonVariant = "primary" | "secondary" | "tertiary" | "text" | "bordered";
 type ButtonSize = "small" | "medium" | "large";
 type ButtonEdge = "circular" | "rounded" | "none";
 type ButtonStyleProps = {

package/dist/esm/components/Button/Button.js

@@ -94,21 +94,6 @@ const buttonStyles = (props) => {
                 boxShadow: "none",
             },
         },
-        variant === "unstable_success" && {
-            backgroundColor: colors.darkGreen,
-            color: colors.white,
-            border: "none",
-            /* Shadow/04dp */
-            boxShadow: "0px 2px 4px 0px rgba(37, 38, 43, 0.10), 0px 3px 8px 0px rgba(37, 38, 43, 0.12)",
-            ":hover:not(:disabled)": {
-                backgroundColor: colors.darkGreen,
-                boxShadow: "none",
-            },
-            ":disabled": {
-                backgroundColor: colors.silverGray,
-                boxShadow: "none",
-            },
-        },
         variant === "secondary" && {
             color: colors.red,
             backgroundColor: "transparent",
@@ -148,18 +133,6 @@ const buttonStyles = (props) => {
                 color: colors.silverGrayDark,
             },
         },
-        variant === "unstable_noBorder" && {
-            backgroundColor: colors.white,
-            color: colors.darkGray2,
-            border: "none",
-            ":hover:not(:disabled)": {
-                // darkGray1 at 6% alpha
-                backgroundColor: "rgba(64, 70, 76, 0.06)",
-            },
-            ":disabled": {
-                color: colors.silverGray,
-            },
-        },
         variant === "tertiary" && {
             color: colors.darkGray2,
             border: "none",
@@ -172,12 +145,6 @@ const buttonStyles = (props) => {
                 color: colors.silverGrayLight,
             },
         },
-        variant === "unstable_inverted" && {
-            backgroundColor: colors.white,
-            color: colors.mitRed,
-            borderColor: colors.mitRed,
-            borderStyle: "solid",
-        },
         // edge
         edge === "rounded" && {
             borderRadius: "4px",

package/dist/esm/components/Button/Button.stories.js

@@ -4,7 +4,7 @@ import Grid from "@mui/material/Grid2";
 import Stack from "@mui/material/Stack";
 import { RiArrowLeftLine, RiDeleteBinLine, RiTestTubeLine, RiMailLine, } from "@remixicon/react";
 import { fn } from "@storybook/test";
-import { enumValues } from "@/story-utils";
+import { enumValues } from "../../story-utils";
 const ICONS = {
     None: undefined,
     ArrowBackIcon: React.createElement(RiArrowLeftLine, null),
@@ -17,9 +17,6 @@ const VARIANTS = enumValues({
     tertiary: true,
     bordered: true,
     text: true,
-    unstable_noBorder: true,
-    unstable_inverted: true,
-    unstable_success: true,
 });
 const STABLE_VARIANTS = VARIANTS.filter((v) => !v.startsWith("unstable"));
 const SIZES = enumValues({

package/dist/esm/components/Input/Input.stories.js

@@ -4,7 +4,7 @@ import Stack from "@mui/material/Stack";
 import Grid from "@mui/material/Grid2";
 import { RiCalendarLine, RiCloseLine, RiSearchLine } from "@remixicon/react";
 import { fn } from "@storybook/test";
-import { enumValues } from "@/story-utils";
+import { enumValues } from "../../story-utils";
 import Typography from "@mui/material/Typography";
 const SIZES = enumValues({
     small: true,

package/dist/esm/components/ScrollSnap/ScrollSnap.js

@@ -1,4 +1,4 @@
-import { composeRefs } from "@/utils/composeRefs";
+import { composeRefs } from "../../utils/composeRefs";
 import styled from "@emotion/styled";
 import * as React from "react";
 /**
@@ -33,14 +33,16 @@ const ScrollSnap = React.forwardRef(function ScrollSnap({ children, threshold =
      * 3. Then scroll to bottom (if needed)
      *
      * In this way, we can measure the scroll position before the new content is set.
+     *
+     * In React 19, this started requiring useLayoutEffect.
      */
-    React.useEffect(() => {
+    React.useLayoutEffect(() => {
         if (!el.current)
             return;
         wasAtBottom.current = distanceFromBottom(el.current) < threshold;
         setContent(children);
     }, [children, threshold]);
-    React.useEffect(() => {
+    React.useLayoutEffect(() => {
         if (!el.current)
             return;
         const atBottom = distanceFromBottom(el.current) < threshold;

package/dist/esm/components/ScrollSnap/ScrollSnap.stories.js

@@ -2,7 +2,7 @@ import * as React from "react";
 import { ScrollSnap } from "./ScrollSnap";
 import styled from "@emotion/styled";
 import { faker } from "@faker-js/faker/locale/en";
-import { useInterval } from "@/utils/useInterval";
+import { useInterval } from "../../utils/useInterval";
 import Slider from "@mui/material/Slider";
 import Stack from "@mui/material/Stack";
 import Typography from "@mui/material/Typography";

package/dist/esm/components/SrAnnouncer/SrAnnouncer.js

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden";
 import { useEffect } from "react";
-import { useDevCheckStable } from "@/utils/useDevCheckStable";
+import { useDevCheckStable } from "../../utils/useDevCheckStable";
 const DEFAULT_PROPS = {
     loadingMessages: [
         { delay: 1500, text: "Loading" },

package/dist/esm/components/TextField/TextField.stories.js

@@ -5,7 +5,7 @@ import Stack from "@mui/material/Stack";
 import Grid from "@mui/material/Grid";
 import { RiSearchLine, RiCalendarLine, RiCloseLine } from "@remixicon/react";
 import { fn } from "@storybook/test";
-import { enumValues } from "@/story-utils";
+import { enumValues } from "../../story-utils";
 const SIZES = enumValues({
     small: true,
     medium: true,

package/dist/esm/components/ThemeProvider/ThemeProvider.d.ts

@@ -6,9 +6,7 @@ import type { ThemeOptions, Theme } from "@mui/material/styles";
  * See [ThemeProvider Docs](https://mitodl.github.io/smoot-design/?path=/docs/smoot-design-themeprovider--docs#further-customized-theme-with-createtheme)
  * for more.
  */
-declare const createTheme: (options?: {
-    custom: Partial<ThemeOptions["custom"]>;
-}) => Theme;
+declare const createTheme: (options?: ThemeOptions) => Theme;
 type ThemeProviderProps = {
     children?: React.ReactNode;
     theme?: Theme;

package/dist/esm/components/ThemeProvider/ThemeProvider.js

@@ -4,6 +4,7 @@ import * as typography from "./typography";
 import * as buttons from "./buttons";
 import * as chips from "./chips";
 import { colors } from "./colors";
+import deepmerge from "@mui/utils/deepmerge";
 const custom = {
     colors,
     dimensions: {
@@ -45,13 +46,6 @@ const defaultThemeOptions = {
     components: {
         MuiButtonBase: buttons.buttonBaseComponent,
         MuiTypography: typography.component,
-        MuiTabPanel: {
-            styleOverrides: {
-                root: {
-                    padding: "0px",
-                },
-            },
-        },
         MuiMenu: {
             styleOverrides: { paper: { borderRadius: "4px" } },
         },
@@ -73,7 +67,9 @@ const defaultThemeOptions = {
  * See [ThemeProvider Docs](https://mitodl.github.io/smoot-design/?path=/docs/smoot-design-themeprovider--docs#further-customized-theme-with-createtheme)
  * for more.
  */
-const createTheme = (options) => muiCreateTheme(Object.assign(Object.assign({}, defaultThemeOptions), { custom: Object.assign(Object.assign({}, defaultThemeOptions.custom), options === null || options === void 0 ? void 0 : options.custom) }));
+const createTheme = (options) => {
+    return muiCreateTheme(deepmerge(defaultThemeOptions, options));
+};
 const defaultTheme = createTheme();
 /**
  *

package/dist/esm/components/ThemeProvider/breakpoints.js

@@ -10,7 +10,6 @@ const BREAKPOINT_VALUES = {
 };
 const { breakpoints } = createTheme({
     breakpoints: BREAKPOINT_VALUES,
-    // @ts-expect-error only using breakpoints
     custom: {},
 });
 export { BREAKPOINT_VALUES, breakpoints };

package/dist/esm/components/ThemeProvider/typography.js

@@ -162,7 +162,6 @@ const component = {
 };
 const { typography } = createTheme({
     typography: globalSettings,
-    // @ts-expect-error: we only care about typography from this theme
     custom: {},
 });
 export { globalSettings, component, pxToRem, typography };

package/dist/esm/components/internal/FormHelpers/FormHelpers.test.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import * as React from "react";
 import { render, screen } from "@testing-library/react";
 import { FormFieldWrapper } from "./FormHelpers";
-import { ThemeProvider } from "@/components/ThemeProvider/ThemeProvider";
+import { ThemeProvider } from "../../../components/ThemeProvider/ThemeProvider";
 import { faker } from "@faker-js/faker/locale/en";
 const assertDescription = ({ text, total, exists, }) => {
     var _a;

package/dist/esm/index.d.ts

@@ -1,6 +1,5 @@
 export { default as styled } from "@emotion/styled";
 export { css, Global } from "@emotion/react";
-export { AppRouterCacheProvider as NextJsAppRouterCacheProvider } from "@mui/material-nextjs/v15-appRouter";
 export { ThemeProvider, createTheme, } from "./components/ThemeProvider/ThemeProvider";
 export { Button, ButtonLink } from "./components/Button/Button";
 export type { ButtonProps, ButtonLinkProps } from "./components/Button/Button";

package/dist/esm/index.js

@@ -1,7 +1,6 @@
 "use client";
 export { default as styled } from "@emotion/styled";
 export { css, Global } from "@emotion/react";
-export { AppRouterCacheProvider as NextJsAppRouterCacheProvider } from "@mui/material-nextjs/v15-appRouter";
 export { ThemeProvider, createTheme, } from "./components/ThemeProvider/ThemeProvider";
 export { Button, ButtonLink } from "./components/Button/Button";
 export { ActionButton, ActionButtonLink, } from "./components/Button/ActionButton";