@mitodl/smoot-design 1.2.0 → 1.2.1

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),

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),

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/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/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),

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),

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/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;