Merge remote-tracking branch 'upstream/master' into baseui-css-classes

mui · Jan 3, 2024 · 3e0fb5e · 3e0fb5e
2 parents 469eb0d + 14391d3
commit 3e0fb5e
Show file tree

Hide file tree

Showing 264 changed files with 5,399 additions and 2,740 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -675,7 +675,7 @@ jobs:
             DANGER_COMMAND: prepareBundleSizeReport
       - run:
           name: build @mui packages
-          command: yarn lerna run --ignore @mui/icons-material --concurrency 8 --scope "@mui/*" build
+          command: yarn lerna run --ignore @mui/icons-material --concurrency 6 --scope "@mui/*" build
       - run:
           name: create @mui/material canary distributable
           command: |

diff --git a/.github/ISSUE_TEMPLATE/1.bug.yml b/.github/ISSUE_TEMPLATE/1.bug.yml
@@ -8,13 +8,13 @@ body:
         Please provide a searchable summary of the issue in the title above ⬆️.
 
         Thanks for contributing by creating an issue! ❤️
-  - type: checkboxes
+  - type: input
     attributes:
-      label: Duplicates
-      description: Please [search the history](https://github.com/mui/material-ui/issues) to see if an issue already exists for the same problem.
-      options:
-        - label: I have searched the existing issues
-          required: true
+      label: Search keywords
+      description: Your issue may have already been reported! List the keywords you've used to search the [existing issues](https://github.com/mui/material-ui/issues). This will also make your issue searchable for others.
+      placeholder: e.g. tooltip color
+    validations:
+      required: true
   - type: checkboxes
     attributes:
       label: Latest version
@@ -24,34 +24,33 @@ body:
           required: true
   - type: textarea
     attributes:
-      label: Steps to reproduce 🕹
+      label: Steps to reproduce
       description: |
-        **⚠️ Issues that we can't reproduce will be closed.**
+        **⚠️ Issues that we can't reproduce can't be fixed.**
 
         Please provide a link to a live example and an unambiguous set of steps to reproduce this bug. As a starting point, we recommend you browse our [documentation](https://mui.com/material-ui/getting-started/installation/), and [select](https://mui.com/static/docs/forking-an-example.png) the closest example to your use case. Or you can use the [official template](https://mui.com/r/issue-template) to build a reproduction case.
       value: |
-        Link to live example:
+        Link to live example: (required)
 
         Steps:
-
         1.
         2.
         3.
   - type: textarea
     attributes:
-      label: Current behavior 😯
+      label: Current behavior
       description: Describe what happens instead of the expected behavior.
   - type: textarea
     attributes:
-      label: Expected behavior 🤔
+      label: Expected behavior
       description: Describe what should happen.
   - type: textarea
     attributes:
-      label: Context 🔦
+      label: Context
       description: What are you trying to accomplish? How has this issue affected you? Providing context helps us come up with a solution that is more useful in the real world.
   - type: textarea
     attributes:
-      label: Your environment 🌎
+      label: Your environment
       description: Run `npx @mui/envinfo` and post the results. If you encounter issues with TypeScript please include the used tsconfig.
       value: |
         <details>

diff --git a/.github/workflows/issue-cleanup.yml b/.github/workflows/issue-cleanup.yml
@@ -0,0 +1,52 @@
+name: Cleanup issue comment
+
+on:
+  issues:
+    types:
+      - opened
+
+permissions: {}
+
+jobs:
+  issue_cleanup:
+    runs-on: ubuntu-latest
+    permissions:
+      issues: write
+    steps:
+      - uses: actions/github-script@d7906e4ad0b1822421a7e6a35d5ca353c962f410 # v6
+        with:
+          script: |
+            const issue = await github.rest.issues.get({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: context.issue.number,
+            })
+
+            const lines = issue.data.body.split('\n')
+
+            const _ = extractInputSection(lines, 'Latest version')
+            const searchKeywords = extractInputSection(lines, 'Search keywords')
+            const orderID = extractInputSection(lines, 'Order ID or Support key')
+
+            lines.push('')
+            lines.push('**Search keywords**: ' + searchKeywords)
+            if (orderID !== '' && orderID !== '_No response_') {
+              lines.push('**Order ID**: ' + orderID)
+            }
+
+            const body = lines.join('\n')
+
+            await github.rest.issues.update({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: context.issue.number,
+              body,
+            })
+
+            function extractInputSection(lines, title) {
+              const index = lines.findIndex(line => line.startsWith('###') && line.includes(title))
+              if (index === -1) {
+                return ''
+              }
+              return lines.splice(index, 4)[2].trim()
+            }
diff --git a/.gitignore b/.gitignore
@@ -40,3 +40,4 @@ docs/public/static/blog/feed/*
 # vale downloaded config
 .github/styles/Google
 .github/styles/write-good
+.nx/cache
diff --git a/apps/zero-runtime-next-app/package.json b/apps/zero-runtime-next-app/package.json
@@ -21,7 +21,7 @@
     "@mui/zero-tag-processor": "file:../../packages/zero-tag-processor/build",
     "@mui/zero-next-plugin": "file:../../packages/zero-next-plugin/build",
     "@types/node": "20.5.7",
-    "@types/react": "18.2.42",
+    "@types/react": "18.2.45",
     "@types/react-dom": "18.2.18",
     "typescript": "5.3.3"
   },

diff --git a/...agination/TableCustomized/system/index.js → ...nents/table-pagination/TableCustomized.js b/...agination/TableCustomized/system/index.js → ...nents/table-pagination/TableCustomized.js
@@ -4,6 +4,10 @@ import {
   TablePagination,
   tablePaginationClasses as classes,
 } from '@mui/base/TablePagination';
+import FirstPageRoundedIcon from '@mui/icons-material/FirstPageRounded';
+import LastPageRoundedIcon from '@mui/icons-material/LastPageRounded';
+import ChevronLeftRoundedIcon from '@mui/icons-material/ChevronLeftRounded';
+import ChevronRightRoundedIcon from '@mui/icons-material/ChevronRightRounded';
 
 export default function TableCustomized() {
   const [page, setPage] = React.useState(0);
@@ -69,6 +73,12 @@ export default function TableCustomized() {
                 actions: {
                   showFirstButton: true,
                   showLastButton: true,
+                  slots: {
+                    firstPageIcon: FirstPageRoundedIcon,
+                    lastPageIcon: LastPageRoundedIcon,
+                    nextPageIcon: ChevronRightRoundedIcon,
+                    backPageIcon: ChevronLeftRoundedIcon,
+                  },
                 },
               }}
               onPageChange={handleChangePage}
@@ -123,23 +133,26 @@ const grey = {
 
 const Root = styled('div')(
   ({ theme }) => `
+  border-radius: 12px;
+  border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
+  overflow: clip;
+
   table {
     font-family: 'IBM Plex Sans', sans-serif;
     font-size: 0.875rem;
     border-collapse: collapse;
-    width: 100%;
+    border: none;
+    width: 500px;
+    margin: -1px;
   }
 
   td,
   th {
     border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
     text-align: left;
-    padding: 6px;
+    padding: 8px;
   }
 
-  th {
-    background-color: ${theme.palette.mode === 'dark' ? blue[900] : blue[50]};
-  }
   `,
 );
 
@@ -153,7 +166,8 @@ const CustomTablePagination = styled(TablePagination)(
     display: flex;
     flex-direction: column;
     align-items: flex-start;
-    gap: 10px;
+    gap: 8px;
+    padding: 4px 0;
 
     @media (min-width: 768px) {
       flex-direction: row;
@@ -166,17 +180,22 @@ const CustomTablePagination = styled(TablePagination)(
   }
 
   & .${classes.select}{
-    padding: 2px;
+    font-family: 'IBM Plex Sans', sans-serif;
+    padding: 2px 0 2px 4px;
     border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
-    border-radius: 50px;
+    border-radius: 6px; 
     background-color: transparent;
+    color: ${theme.palette.mode === 'dark' ? grey[300] : grey[900]};
+    transition: all 100ms ease;
 
     &:hover {
       background-color: ${theme.palette.mode === 'dark' ? grey[800] : grey[50]};
+      border-color: ${theme.palette.mode === 'dark' ? grey[600] : grey[300]};
     }
 
     &:focus {
-      outline: 1px solid ${theme.palette.mode === 'dark' ? blue[400] : blue[200]};
+      outline: 3px solid ${theme.palette.mode === 'dark' ? blue[400] : blue[200]};
+      border-color: ${blue[400]};
     }
   }
 
@@ -189,24 +208,43 @@ const CustomTablePagination = styled(TablePagination)(
   }
 
   & .${classes.actions} {
-    padding: 2px;
-    border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
-    border-radius: 50px;
+    display: flex;
+    gap: 6px;
+    border: transparent;
     text-align: center;
   }
 
   & .${classes.actions} > button {
-    margin: 0 8px;
+    display: flex;
+    align-items: center;
+    padding: 0;
     border: transparent;
-    border-radius: 2px;
+    border-radius: 50%;
     background-color: transparent;
+    border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
+    color: ${theme.palette.mode === 'dark' ? grey[300] : grey[900]};
+    transition: all 120ms ease;
+
+    > svg {
+      font-size: 22px;
+    }
 
     &:hover {
       background-color: ${theme.palette.mode === 'dark' ? grey[800] : grey[50]};
+      border-color: ${theme.palette.mode === 'dark' ? grey[600] : grey[300]};
     }
 
     &:focus {
-      outline: 1px solid ${theme.palette.mode === 'dark' ? blue[400] : blue[200]};
+      outline: 3px solid ${theme.palette.mode === 'dark' ? blue[400] : blue[200]};
+      border-color: ${blue[400]};
+    }
+
+    &:disabled {
+      opacity: 0.3;
+      &:hover {
+        border: 1px solid ${theme.palette.mode === 'dark' ? grey[800] : grey[200]};
+        background-color: transparent;
+      }
     }
   }
   `,