Merge branch 'v5/main' into feat/main-nav-change-order

.github/actions/check-pr-status/package.json

@@ -1,6 +1,6 @@
 {
   "name": "check-pr-status",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "license": "MIT",
   "main": "dist/index.js",

docs/docs/docs/01-core/content-manager/hooks/use-drag-and-drop.mdx

@@ -53,7 +53,7 @@ const MyComponent = ({ onMoveItem }) => {
       ) : (
         <Flex ref={composedRefs} data-handler-id={handlerId}>
           <IconButton
-            forwardedAs="div"
+            tag="div"
             role="button"
             tabIndex={0}
             aria-label="Drag"
@@ -99,7 +99,7 @@ const MyComponent = ({ onDropItem }) => {
       {isOverDropTarget && <Placeholder direction={direction} />}
       <Flex ref={composedRefs} data-handler-id={handlerId}>
         <IconButton
-          forwardedAs="div"
+          tag="div"
           role="button"
           tabIndex={0}
           aria-label="Drag"
@@ -153,7 +153,7 @@ const MyComponent = ({ onMoveItem }) => {
       ) : (
         <Flex ref={composedRefs} data-handler-id={handlerId}>
           <IconButton
-            forwardedAs="div"
+            tag="div"
             role="button"
             tabIndex={0}
             aria-label="Drag"
@@ -252,7 +252,7 @@ You might notice in the [basic usage](#basic-usage) section this piece of code:
 
 ```jsx
 <IconButton
-  forwardedAs="div"
+  tag="div"
   role="button"
   tabIndex={0}
   aria-label="Drag"

examples/getstarted/package.json

@@ -1,6 +1,6 @@
 {
   "name": "getstarted",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "description": "A Strapi application.",
   "license": "SEE LICENSE IN LICENSE",
@@ -13,16 +13,16 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/icons": "2.0.0-beta.2",
-    "@strapi/plugin-color-picker": "5.0.0-beta.6",
-    "@strapi/plugin-documentation": "5.0.0-beta.6",
-    "@strapi/plugin-graphql": "5.0.0-beta.6",
-    "@strapi/plugin-sentry": "5.0.0-beta.6",
-    "@strapi/plugin-users-permissions": "5.0.0-beta.6",
-    "@strapi/provider-email-mailgun": "5.0.0-beta.6",
-    "@strapi/provider-upload-aws-s3": "5.0.0-beta.6",
-    "@strapi/provider-upload-cloudinary": "5.0.0-beta.6",
-    "@strapi/strapi": "5.0.0-beta.6",
+    "@strapi/icons": "2.0.0-beta.3",
+    "@strapi/plugin-color-picker": "5.0.0-beta.7",
+    "@strapi/plugin-documentation": "5.0.0-beta.7",
+    "@strapi/plugin-graphql": "5.0.0-beta.7",
+    "@strapi/plugin-sentry": "5.0.0-beta.7",
+    "@strapi/plugin-users-permissions": "5.0.0-beta.7",
+    "@strapi/provider-email-mailgun": "5.0.0-beta.7",
+    "@strapi/provider-upload-aws-s3": "5.0.0-beta.7",
+    "@strapi/provider-upload-cloudinary": "5.0.0-beta.7",
+    "@strapi/strapi": "5.0.0-beta.7",
     "better-sqlite3": "9.4.3",
     "lodash": "4.17.21",
     "mysql2": "3.6.2",
@@ -33,7 +33,7 @@
     "react-intl": "6.6.2",
     "react-router-dom": "6.22.3",
     "strapi-plugin-workspace-plugin": "workspace:*",
-    "styled-components": "5.3.11"
+    "styled-components": "6.1.8"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

examples/getstarted/src/plugins/local-plugin/admin/src/index.js

@@ -1,5 +1,6 @@
+import { PuzzlePiece } from '@strapi/icons';
+
 import { prefixPluginTranslations } from './utils/prefixPluginTranslations';
-import PluginIcon from './components/PluginIcon';
 import pluginPkg from '../../package.json';
 import pluginId from './pluginId';
 
@@ -9,7 +10,7 @@ export default {
   register(app) {
     app.addMenuLink({
       to: `plugins/${pluginId}`,
-      icon: PluginIcon,
+      icon: PuzzlePiece,
       intlLabel: {
         id: `${pluginId}.plugin.name`,
         defaultMessage: 'My plugin',
@@ -57,7 +58,7 @@ export default {
           defaultMessage: `custom${upcasedType}`,
         },
         components: {
-          Input: async () => import('./components/PluginIcon'),
+          Input: PuzzlePiece,
         },
       };
 

examples/kitchensink-ts/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchensink-ts",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "description": "A Strapi application",
   "license": "MIT",
@@ -14,13 +14,13 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/plugin-users-permissions": "5.0.0-beta.6",
-    "@strapi/strapi": "5.0.0-beta.6",
+    "@strapi/plugin-users-permissions": "5.0.0-beta.7",
+    "@strapi/strapi": "5.0.0-beta.7",
     "better-sqlite3": "9.4.3",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "6.22.3",
-    "styled-components": "5.3.11"
+    "styled-components": "6.1.8"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

examples/kitchensink/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kitchensink",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "description": "A Strapi application.",
   "license": "SEE LICENSE IN LICENSE",
@@ -13,10 +13,10 @@
     "strapi": "strapi"
   },
   "dependencies": {
-    "@strapi/provider-email-mailgun": "5.0.0-beta.6",
-    "@strapi/provider-upload-aws-s3": "5.0.0-beta.6",
-    "@strapi/provider-upload-cloudinary": "5.0.0-beta.6",
-    "@strapi/strapi": "5.0.0-beta.6",
+    "@strapi/provider-email-mailgun": "5.0.0-beta.7",
+    "@strapi/provider-upload-aws-s3": "5.0.0-beta.7",
+    "@strapi/provider-upload-cloudinary": "5.0.0-beta.7",
+    "@strapi/strapi": "5.0.0-beta.7",
     "better-sqlite3": "9.4.3",
     "lodash": "4.17.21",
     "mysql2": "3.6.2",
@@ -25,7 +25,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-router-dom": "6.22.3",
-    "styled-components": "5.3.11"
+    "styled-components": "6.1.8"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

examples/plugins/workspace-plugin/admin/src/index.js

@@ -1,4 +1,5 @@
-import PluginIcon from './components/PluginIcon';
+import { PuzzlePiece } from '@strapi/icons';
+
 import pluginPkg from '../../package.json';
 import pluginId from './pluginId';
 
@@ -8,7 +9,7 @@ export default {
   register(app) {
     app.addMenuLink({
       to: `/plugins/${pluginId}`,
-      icon: PluginIcon,
+      icon: PuzzlePiece,
       intlLabel: {
         id: `${pluginId}.plugin.name`,
         defaultMessage: 'My plugin',

examples/plugins/workspace-plugin/package.json

@@ -1,6 +1,6 @@
 {
   "name": "strapi-plugin-workspace-plugin",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "description": "This is the description of my plugin.",
   "exports": {

lerna.json

@@ -1,4 +1,4 @@
 {
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "npmClient": "yarn"
 }

packages/admin-test-utils/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@strapi/admin-test-utils",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "private": true,
   "description": "Test utilities for the Strapi administration panel",
   "license": "MIT",
@@ -81,9 +81,9 @@
     "@reduxjs/toolkit": "1.9.7",
     "@strapi/pack-up": "5.0.0",
     "@testing-library/jest-dom": "5.16.5",
-    "eslint-config-custom": "5.0.0-beta.6",
+    "eslint-config-custom": "5.0.0-beta.7",
     "jest-environment-jsdom": "29.6.1",
-    "tsconfig": "5.0.0-beta.6"
+    "tsconfig": "5.0.0-beta.7"
   },
   "peerDependencies": {
     "@reduxjs/toolkit": "^1.9.7",

packages/cli/create-strapi-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-strapi-app",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "description": "Generate a new Strapi application.",
   "keywords": [
     "create-strapi-app",
@@ -43,14 +43,14 @@
     "watch": "pack-up watch"
   },
   "dependencies": {
-    "@strapi/generate-new": "5.0.0-beta.6",
+    "@strapi/generate-new": "5.0.0-beta.7",
     "commander": "8.3.0",
     "inquirer": "8.2.5"
   },
   "devDependencies": {
     "@strapi/pack-up": "5.0.0",
-    "eslint-config-custom": "5.0.0-beta.6",
-    "tsconfig": "5.0.0-beta.6"
+    "eslint-config-custom": "5.0.0-beta.7",
+    "tsconfig": "5.0.0-beta.7"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

packages/cli/create-strapi-starter/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-strapi-starter",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "description": "Generate a new Strapi application.",
   "keywords": [
     "create-strapi-starter",
@@ -43,7 +43,7 @@
     "watch": "pack-up watch"
   },
   "dependencies": {
-    "@strapi/generate-new": "5.0.0-beta.6",
+    "@strapi/generate-new": "5.0.0-beta.7",
     "chalk": "4.1.2",
     "ci-info": "4.0.0",
     "commander": "8.3.0",
@@ -55,8 +55,8 @@
   "devDependencies": {
     "@strapi/pack-up": "5.0.0",
     "@types/fs-extra": "11.0.4",
-    "eslint-config-custom": "5.0.0-beta.6",
-    "tsconfig": "5.0.0-beta.6"
+    "eslint-config-custom": "5.0.0-beta.7",
+    "tsconfig": "5.0.0-beta.7"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

packages/cli/create-strapi/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-strapi",
-  "version": "5.0.0-beta.6",
+  "version": "5.0.0-beta.7",
   "description": "Generate a new Strapi application.",
   "keywords": [
     "create-strapi",
@@ -36,7 +36,7 @@
     "bin/"
   ],
   "dependencies": {
-    "create-strapi-app": "5.0.0-beta.6"
+    "create-strapi-app": "5.0.0-beta.7"
   },
   "engines": {
     "node": ">=18.0.0 <=20.x.x",

packages/core/admin/admin/src/components/ContentBox.tsx

@@ -1,5 +1,11 @@
-import { Flex, FlexProps, Typography } from '@strapi/design-system';
-import styled from 'styled-components';
+import {
+  Flex,
+  FlexComponent,
+  FlexProps,
+  Typography,
+  TypographyComponent,
+} from '@strapi/design-system';
+import { styled } from 'styled-components';
 
 interface ContentBoxProps {
   title?: string;
@@ -40,7 +46,7 @@ const ContentBox = ({
   );
 };
 
-const IconWrapper = styled(Flex)`
+const IconWrapper = styled<FlexComponent>(Flex)`
   margin-right: ${({ theme }) => theme.spaces[6]};
 
   svg {
@@ -49,7 +55,8 @@ const IconWrapper = styled(Flex)`
   }
 `;
 
-const TypographyWordBreak = styled(Typography)`
+const TypographyWordBreak = styled<TypographyComponent>(Typography)`
+  color: ${({ theme }) => theme.colors.neutral800};
   word-break: break-all;
 `;
 

packages/core/admin/admin/src/components/ErrorElement.tsx

@@ -1,8 +1,16 @@
-import { Alert, Button, Flex, Main, Typography, Link } from '@strapi/design-system';
+import {
+  Alert,
+  Button,
+  Flex,
+  Main,
+  Typography,
+  Link,
+  TypographyComponent,
+} from '@strapi/design-system';
 import { Duplicate, WarningCircle } from '@strapi/icons';
 import { useIntl } from 'react-intl';
 import { useRouteError } from 'react-router-dom';
-import styled from 'styled-components';
+import { styled } from 'styled-components';
 
 import { useClipboard } from '../hooks/useClipboard';
 
@@ -98,7 +106,7 @@ const StyledAlert = styled(Alert)`
   }
 `;
 
-const ErrorType = styled(Typography)`
+const ErrorType = styled<TypographyComponent>(Typography)`
   word-break: break-all;
   color: ${({ theme }) => theme.colors.danger600};
 `;

packages/core/admin/admin/src/components/Form.tsx

@@ -738,7 +738,7 @@ const Blocker = ({ onProceed = () => {}, onCancel = () => {} }: BlockerProps) =>
         <DialogBody>
           <Flex direction="column" gap={2}>
             <WarningCircle width="24px" height="24px" fill="danger600" />
-            <Typography as="p" variant="omega" textAlign="center">
+            <Typography tag="p" variant="omega" textAlign="center">
               {formatMessage({
                 id: 'global.prompt.unsaved',
                 defaultMessage: 'You have unsaved changes, are you sure you want to leave?',