@mui/codemod 5.10.12 → 5.10.16

package/node/v5.0.0/styled-engine-provider.test/theme-provider.expected.js

@@ -1,24 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styles = require("@material-ui/core/styles");
-
 var _contexts = require("./contexts");
-
 var _pages = _interopRequireDefault(require("./pages"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _OtherProvider;
-
 const App = () => {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StyledEngineProvider, {
     injectFirst: true,
@@ -30,6 +22,5 @@ const App = () => {
     })
   });
 };
-
 var _default = App;
 exports.default = _default;

package/node/v5.0.0/table-props.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -17,14 +16,12 @@ function transformer(file, api, options) {
     node
   }) => {
     var _node$openingElement$;
-
     return (_node$openingElement$ = node.openingElement.name.name) == null ? void 0 : _node$openingElement$.match(/^(Table|TableCell)$/);
   }).forEach(({
     node
   }) => {
     node.openingElement.attributes.forEach(attr => {
       var _attr$name, _attr$value, _attr$value2, _attr$value2$expressi;
-
       if (((_attr$name = attr.name) == null ? void 0 : _attr$name.name) === 'padding' && (((_attr$value = attr.value) == null ? void 0 : _attr$value.value) === 'default' || ((_attr$value2 = attr.value) == null ? void 0 : (_attr$value2$expressi = _attr$value2.expression) == null ? void 0 : _attr$value2$expressi.value) === 'default')) {
         attr.value = j.literal('normal');
       }
@@ -35,15 +32,12 @@ function transformer(file, api, options) {
   }) => {
     node.openingElement.attributes.forEach(attr => {
       var _attr$name2, _attr$name3;
-
       if (attr.type === 'JSXAttribute' && attr.name.name === 'onChangeRowsPerPage') {
         attr.name.name = 'onRowsPerPageChange';
       }
-
       if (attr.type === 'JSXAttribute' && ((_attr$name2 = attr.name) == null ? void 0 : _attr$name2.name) === 'onChangePage') {
         attr.name.name = 'onPageChange';
       }
-
       if (attr.type === 'JSXAttribute' && ((_attr$name3 = attr.name) == null ? void 0 : _attr$name3.name) === 'classes') {
         (attr.value.expression.properties || []).forEach(subNode => {
           if (subNode.key.name === 'input') {

package/node/v5.0.0/table-props.test/actual.js

@@ -1,13 +1,9 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
     onChangeRowsPerPage: () => {},
     onChangePage: () => {}

package/node/v5.0.0/table-props.test/expected.js

@@ -1,13 +1,9 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TablePagination, {
     onRowsPerPageChange: () => {},
     onPageChange: () => {}

package/node/v5.0.0/tabs-scroll-buttons.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -21,9 +20,7 @@ function transformer(file, api, options) {
       if (attr.name && attr.name.name === 'scrollButtons') {
         if (attr.value) {
           var _attr$value$expressio, _attr$value$expressio2, _attr$value$expressio3, _attr$value$expressio4;
-
           prevScrollButtonValue = attr.value.value || ((_attr$value$expressio = attr.value.expression) == null ? void 0 : _attr$value$expressio.value);
-
           if (attr.value.value === 'on' || ((_attr$value$expressio2 = attr.value.expression) == null ? void 0 : _attr$value$expressio2.value) === 'on') {
             delete attr.value;
           } else if (attr.value.value === 'desktop' || ((_attr$value$expressio3 = attr.value.expression) == null ? void 0 : _attr$value$expressio3.value) === 'desktop') {
@@ -34,7 +31,6 @@ function transformer(file, api, options) {
         }
       }
     });
-
     if (prevScrollButtonValue === 'on') {
       node.openingElement.attributes.push(j.jsxAttribute(j.jsxIdentifier('allowScrollButtonsMobile')));
     }

package/node/v5.0.0/tabs-scroll-buttons.test/actual.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Tabs, {
     scrollButtons: "on"
   }), /*#__PURE__*/(0, _jsxRuntime.jsx)(Tabs, {

package/node/v5.0.0/tabs-scroll-buttons.test/expected.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(Tabs, {
     scrollButtons: true,
     allowScrollButtonsMobile: true

package/node/v5.0.0/textarea-minmax-rows.js

@@ -1,14 +1,11 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 var _renameProps = _interopRequireDefault(require("../util/renameProps"));
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api

package/node/v5.0.0/textarea-minmax-rows.test/actual.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)("div", {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TextField, {
     rowsMin: 3,
     rowsMax: 6

package/node/v5.0.0/textarea-minmax-rows.test/expected.js

@@ -1,9 +1,7 @@
 "use strict";
 
 var _jsxRuntime = require("react/jsx-runtime");
-
-/*#__PURE__*/
-(0, _jsxRuntime.jsxs)("div", {
+/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
   children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(TextField, {
     minRows: 3,
     maxRows: 6

package/node/v5.0.0/theme-augment.js

@@ -4,25 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
  */
+
 const template = `
 declare module '@material-ui/styles/defaultTheme' {
   // eslint-disable-next-line @typescript-eslint/no-empty-interface
   interface DefaultTheme extends Theme {}
 }
 `;
-
 function transformer(file, api, options) {
   const j = api.jscodeshift;
   const root = j(file.source);
   const printOptions = options.printOptions || {
     quote: 'single'
   };
-
   if (file.path.endsWith('.tsx')) {
     let hasTheme = false;
     let isRootFile = false;
@@ -32,12 +30,10 @@ function transformer(file, api, options) {
       if (node.imported.name === 'Theme') {
         hasTheme = true;
       }
-
       if (node.imported.name === 'ThemeProvider' || node.imported.nmae === 'MuiThemeProvider') {
         isRootFile = true;
       }
     });
-
     if (!hasTheme) {
       root.find(j.ImportSpecifier).filter(({
         node
@@ -45,7 +41,6 @@ function transformer(file, api, options) {
         path.insertAfter(j.importSpecifier(j.identifier('Theme')));
       });
     }
-
     if (!file.source.match(/declare module ['"]@material-ui\/styles\/defaultTheme['"]/gm)) {
       root.find(j.ImportDeclaration).at(-1).forEach(path => {
         if (isRootFile) {
@@ -53,9 +48,7 @@ function transformer(file, api, options) {
         }
       });
     }
-
     return root.toSource(printOptions);
   }
-
   return file.source;
 }

package/node/v5.0.0/theme-breakpoints-width.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  */

package/node/v5.0.0/theme-breakpoints.js

@@ -11,11 +11,11 @@ const map = {
   lg: 'xl',
   xl: 'xl'
 };
+
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
  */
-
 function transformer(file, api, options) {
   const j = api.jscodeshift;
   const root = j(file.source);
@@ -38,7 +38,6 @@ function transformer(file, api, options) {
   }).forEach(path => {
     path.node.arguments.forEach(node => {
       const replacementValue = map[node.value];
-
       if (replacementValue !== undefined) {
         node.value = replacementValue;
       }
@@ -60,7 +59,6 @@ function transformer(file, api, options) {
   }).forEach(path => {
     const node = path.node.arguments[1];
     const replacementValue = map[node.value];
-
     if (replacementValue !== undefined) {
       node.value = replacementValue;
     }

package/node/v5.0.0/theme-options.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  */

package/node/v5.0.0/theme-options.test/actual.js

@@ -1,5 +1,4 @@
 "use strict";
 
 var _core = require("@material-ui/core");
-
 var _styles = require("@material-ui/core/styles");

package/node/v5.0.0/theme-options.test/expected.js

@@ -1,5 +1,4 @@
 "use strict";
 
 var _core = require("@material-ui/core");
-
 var _styles = require("@material-ui/core/styles");

package/node/v5.0.0/theme-palette-mode.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  */

package/node/v5.0.0/theme-provider.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  * @param {import('jscodeshift').API} api
@@ -25,20 +24,17 @@ function transformer(file, api, options) {
         previousVarName = node.local.name;
         node.local.name = 'ThemeProvider';
       }
-
       if (node.imported && node.imported.name === 'MuiThemeProvider') {
         previousVarName = node.local.name;
         node.local = null;
         node.imported.name = 'ThemeProvider';
       }
     });
-
     if (previousVarName) {
       root.findJSXElements(previousVarName).forEach(({
         node
       }) => {
         node.openingElement.name.name = 'ThemeProvider';
-
         if (node.closingElement) {
           node.closingElement.name.name = 'ThemeProvider';
         }

package/node/v5.0.0/theme-provider.test/actual.js

@@ -1,11 +1,8 @@
 "use strict";
 
 var _styles = require("@material-ui/core/styles");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _div;
-
 function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.MuiThemeProvider, {
     theme: (0, _styles.createTheme)(),

package/node/v5.0.0/theme-provider.test/core-import.actual.js

@@ -1,11 +1,8 @@
 "use strict";
 
 var _core = require("@material-ui/core");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _div;
-
 function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_core.MuiThemeProvider, {
     theme: (0, _core.createTheme)(),

package/node/v5.0.0/theme-provider.test/core-import.expected.js

@@ -1,11 +1,8 @@
 "use strict";
 
 var _core = require("@material-ui/core");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _div;
-
 function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_core.ThemeProvider, {
     theme: (0, _core.createTheme)(),

package/node/v5.0.0/theme-provider.test/expected.js

@@ -1,11 +1,8 @@
 "use strict";
 
 var _styles = require("@material-ui/core/styles");
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _div;
-
 function App() {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.ThemeProvider, {
     theme: (0, _styles.createTheme)(),

package/node/v5.0.0/theme-spacing.js

@@ -4,19 +4,23 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = transformer;
-
 /* eslint-disable no-template-curly-in-string */
-
 /**
  * @param {import('jscodeshift').FileInfo} file
  */
 function transformer(file) {
-  return file.source.replace( // handle cases like: `-${theme.spacing(1)}px`
-  /`(-?)\${(-?)(theme\.spacing|spacing)\(([^{}]*)\)}px`/gm, '$3($1$2$4)').replace( // handle cases like: theme.spacing(gap) + 'px'
-  /((theme\.spacing|spacing)\(.*\))\s*\+\s*'px'/gm, '$1').replace( // handle cases like: theme.spacing(gap) + "px"
-  /((theme\.spacing|spacing)\(.*\))\s*\+\s*"px"/gm, '$1').replace( // handle cases like: `calc(${theme.spacing(2)} - 1px) 0`
-  /\${(theme\.spacing|spacing)(\([^)]+\))\s*([+-])\s*([\d.]+)\s*}px/gm, 'calc(${$1$2} $3 $4px)').replace( // handle cases like: calc(${theme.spacing(itemHorzPadding)} * 0.3)
-  /\${(theme\.spacing|spacing)(\([^)]+\))\s*([*/])\s*([\d.]+)\s*}px/gm, 'calc(${$1$2} $3 $4)').replace( // handle common cases like:
+  return file.source.replace(
+  // handle cases like: `-${theme.spacing(1)}px`
+  /`(-?)\${(-?)(theme\.spacing|spacing)\(([^{}]*)\)}px`/gm, '$3($1$2$4)').replace(
+  // handle cases like: theme.spacing(gap) + 'px'
+  /((theme\.spacing|spacing)\(.*\))\s*\+\s*'px'/gm, '$1').replace(
+  // handle cases like: theme.spacing(gap) + "px"
+  /((theme\.spacing|spacing)\(.*\))\s*\+\s*"px"/gm, '$1').replace(
+  // handle cases like: `calc(${theme.spacing(2)} - 1px) 0`
+  /\${(theme\.spacing|spacing)(\([^)]+\))\s*([+-])\s*([\d.]+)\s*}px/gm, 'calc(${$1$2} $3 $4px)').replace(
+  // handle cases like: calc(${theme.spacing(itemHorzPadding)} * 0.3)
+  /\${(theme\.spacing|spacing)(\([^)]+\))\s*([*/])\s*([\d.]+)\s*}px/gm, 'calc(${$1$2} $3 $4)').replace(
+  // handle common cases like:
   // `${theme.spacing(2)}px`
   // `${theme.spacing(2)}px ${theme.spacing(1)}px ${theme.spacing(2)}px ${theme.spacing(2)}px`
   /(spacing\([^)]+\)\})px(.)/gm, '$1$2');

package/node/v5.0.0/theme-spacing.test/actual.js

@@ -5,5 +5,4 @@ theme.spacing(gap) + 'px';
 spacing(gap) + 'px';
 theme.spacing(gap) + "px";
 spacing(gap) + "px"`calc(100% - ${spacing(itemHorzPadding * 2)}px)``calc(100% - ${theme.spacing(itemHorzPadding * 2)}px)`;
-
 padding: `${theme.spacing(2) - 1}px 0``calc(100% - ${theme.spacing(itemHorzPadding) * 0.3}px)``${-theme.spacing(1)}px``-${theme.spacing(1)}px``${theme.spacing(2)}px ${theme.spacing(1)}px ${theme.spacing(2)}px ${theme.spacing(2)}px`;

package/node/v5.0.0/theme-spacing.test/expected.js

@@ -8,8 +8,6 @@ theme.spacing(gap);
 spacing(gap);
 theme.spacing(gap);
 spacing(gap)`calc(100% - ${spacing(itemHorzPadding * 2)})``calc(100% - ${theme.spacing(itemHorzPadding * 2)})`;
-
 padding: `calc(${theme.spacing(2)} - 1px) 0``calc(100% - calc(${theme.spacing(itemHorzPadding)} * 0.3))`;
-
 theme.spacing(-1);
 theme.spacing(-1)`${theme.spacing(2)} ${theme.spacing(1)} ${theme.spacing(2)} ${theme.spacing(2)}`;

package/node/v5.0.0/theme-spacing.test/large-actual.js

@@ -1,66 +1,37 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = AppSearch;
-
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
 var React = _interopRequireWildcard(require("react"));
-
 var _reactDom = require("react-dom");
-
 var _helpers = require("docs/src/modules/utils/helpers");
-
 var _server = _interopRequireDefault(require("react-dom/server"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _link = _interopRequireDefault(require("next/link"));
-
 var _router = require("next/router");
-
 var _react2 = require("@docsearch/react");
-
 var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
-
 var _ArticleRounded = _interopRequireDefault(require("@mui/icons-material/ArticleRounded"));
-
 var _ToggleOffRounded = _interopRequireDefault(require("@mui/icons-material/ToggleOffRounded"));
-
 var _EditRounded = _interopRequireDefault(require("@mui/icons-material/EditRounded"));
-
 var _HandymanRounded = _interopRequireDefault(require("@mui/icons-material/HandymanRounded"));
-
 var _KeyboardArrowRightRounded = _interopRequireDefault(require("@mui/icons-material/KeyboardArrowRightRounded"));
-
 var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
-
 var _GlobalStyles = _interopRequireDefault(require("@mui/material/GlobalStyles"));
-
 var _styles = require("@mui/material/styles");
-
 var _constants = require("docs/src/modules/constants");
-
 var _Link = _interopRequireDefault(require("docs/src/modules/components/Link"));
-
 var _i18n = require("docs/src/modules/utils/i18n");
-
 var _useLazyCSS = _interopRequireDefault(require("docs/src/modules/utils/useLazyCSS"));
-
 var _getUrlProduct = _interopRequireDefault(require("docs/src/modules/utils/getUrlProduct"));
-
 var _jsxRuntime = require("react/jsx-runtime");
-
 var _ArticleRoundedIcon, _ToggleOffRoundedIcon, _EditRoundedIcon, _HandymanRoundedIcon, _KeyboardArrowRightRo, _NewStartScreen;
-
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
 const SearchButton = (0, _styles.styled)('button')(({
   theme
 }) => {
@@ -119,7 +90,6 @@ const Shortcut = (0, _styles.styled)('div')(({
     borderRadius: 5
   };
 });
-
 const NewStartScreen = () => {
   const startScreenOptions = [{
     category: {
@@ -216,34 +186,27 @@ const NewStartScreen = () => {
     }, category.name))
   });
 };
-
 function DocSearcHit(props) {
   const {
     children,
     hit
   } = props;
-
   function displayTag(pathname) {
     // does not need to show product label for MUI X because they are grouped by the product name in the search
     // ie. Data Grid, Date Picker
     if (!pathname.match(/^\/(material-ui|joy-ui|base)\//)) {
       return null;
     }
-
     let text = '';
-
     if (pathname.startsWith('/material-ui/')) {
       text = 'Material UI';
     }
-
     if (pathname.startsWith('/joy-ui/')) {
       text = 'Joy UI';
     }
-
     if (pathname.startsWith('/base/')) {
       text = 'MUI Base';
     }
-
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Chip.default, {
       label: text,
       size: "small",
@@ -253,7 +216,6 @@ function DocSearcHit(props) {
       }
     });
   }
-
   if (hit.pathname) {
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Link.default, {
       href: hit.pathname,
@@ -267,25 +229,22 @@ function DocSearcHit(props) {
       },
       children: [children, displayTag(hit.pathname)]
     });
-  } // DocSearch stores the old results in its cache
-  // hit.pathname won't be defined for them.
-
+  }
 
+  // DocSearch stores the old results in its cache
+  // hit.pathname won't be defined for them.
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Link.default, {
     href: hit.url,
     children: children
   });
 }
-
 process.env.NODE_ENV !== "production" ? DocSearcHit.propTypes = {
   children: _propTypes.default.node,
   hit: _propTypes.default.object.isRequired
 } : void 0;
-
 function AppSearch() {
   (0, _useLazyCSS.default)('https://cdn.jsdelivr.net/npm/@docsearch/css@3.0.0-alpha.40/dist/style.min.css', '#app-search');
   const FADE_DURATION = 100; // ms
-
   const t = (0, _i18n.useTranslate)();
   const userLanguage = (0, _i18n.useUserLanguage)();
   const searchButtonRef = React.useRef(null);
@@ -305,16 +264,13 @@ function AppSearch() {
       const as = item.userLanguage !== 'en' ? `/${item.userLanguage}${item.as}` : item.as;
       router.push(item.pathname, as);
     }
-
   };
   const onClose = React.useCallback(() => {
     const modal = document.querySelector('.DocSearch-Container');
-
     if (modal) {
       // fade out transition
       modal.style.opacity = 0;
     }
-
     setIsOpen(false); // DO NOT call setIsOpen inside a timeout (it causes scroll issue).
   }, [setIsOpen]);
   const onInput = React.useCallback(event => {
@@ -332,38 +288,31 @@ function AppSearch() {
     const addStartScreen = () => {
       const dropDown = document.querySelector('.DocSearch-Dropdown');
       const isExisting = document.querySelector('.DocSearch-NewStartScreen');
-
       if (dropDown && !isExisting) {
         dropDown.insertAdjacentHTML('beforeend', _server.default.renderToStaticMarkup(_NewStartScreen || (_NewStartScreen = /*#__PURE__*/(0, _jsxRuntime.jsx)(NewStartScreen, {}))));
       }
-    }; // add transition to Modal
-
-
+    };
+    // add transition to Modal
     if (isOpen) {
       const modal = document.querySelector('.DocSearch-Container');
       const searchInput = document.querySelector('.DocSearch-Input');
-
       if (modal) {
         modal.style.opacity = 1;
         addStartScreen();
       }
-
       if (searchInput) {
         const handleInput = event => {
           const newStartScreen = document.querySelector('.DocSearch-NewStartScreen');
-
           if (newStartScreen) {
             newStartScreen.style.display = event.target.value !== '' ? 'none' : 'grid';
           }
         };
-
         searchInput.addEventListener('input', handleInput);
         return () => {
           searchInput.removeEventListener('input', handleInput);
         };
       }
     }
-
     return () => {};
   }, [isOpen]);
   const search = `${t('algoliaSearch')}…`;