@strapi/admin 5.0.0-rc.8 → 5.0.0

package/dist/admin/{index-3GWFhGv_.js → index-we0DbzVF.js}

@@ -8,15 +8,13 @@ const isFunction = require('lodash/isFunction');
 const merge = require('lodash/merge');
 const pick = require('lodash/pick');
 const reactRouterDom = require('react-router-dom');
-const Theme = require('./Theme-7W0we6BI.js');
+const Theme = require('./Theme-y_rWTknM.js');
 const reactRedux = require('react-redux');
 const React = require('react');
 const reactQuery = require('react-query');
 const icons = require('@strapi/icons');
 const immer = require('immer');
 const reactIntl = require('react-intl');
-const get = require('lodash/get');
-const set = require('lodash/set');
 const styledComponents = require('styled-components');
 const symbols = require('@strapi/icons/symbols');
 const useEnterprise = require('./useEnterprise-DUs6BYlP.js');
@@ -57,8 +55,6 @@ const isFunction__default = /*#__PURE__*/_interopDefault(isFunction);
 const merge__default = /*#__PURE__*/_interopDefault(merge);
 const pick__default = /*#__PURE__*/_interopDefault(pick);
 const React__namespace = /*#__PURE__*/_interopNamespace(React);
-const get__default = /*#__PURE__*/_interopDefault(get);
-const set__default = /*#__PURE__*/_interopDefault(set);
 const camelCase__default = /*#__PURE__*/_interopDefault(camelCase);
 const yup__namespace = /*#__PURE__*/_interopNamespace(yup);
 const isEqual__default = /*#__PURE__*/_interopDefault(isEqual);
@@ -114,7 +110,7 @@ const getEERoutes$1 = () => window.strapi.isEE ? [
   {
     path: "auth/login/:authResponse",
     lazy: async () => {
-      const { AuthResponse } = await Promise.resolve().then(() => require('./AuthResponse-KlTDmm2i.js'));
+      const { AuthResponse } = await Promise.resolve().then(() => require('./AuthResponse-R8kR_yqS.js'));
       return {
         Component: AuthResponse
       };
@@ -238,6 +234,10 @@ const ADMIN_PERMISSIONS_CE = {
     "project-settings": {
       read: [{ action: "admin::project-settings.read", subject: null }],
       update: [{ action: "admin::project-settings.update", subject: null }]
+    },
+    plugins: {
+      main: [{ action: "admin::marketplace.read", subject: null }],
+      read: [{ action: "admin::marketplace.read", subject: null }]
     }
   }
 };
@@ -289,6 +289,14 @@ const SETTINGS_LINKS_CE = () => ({
       to: "/settings/transfer-tokens?sort=name:ASC",
       id: "transfer-tokens"
     },
+    {
+      intlLabel: {
+        id: "global.plugins",
+        defaultMessage: "Plugins"
+      },
+      to: "/settings/list-plugins",
+      id: "plugins"
+    },
     // If the Enterprise/Cloud feature is not enabled and if the config doesn't disable it, we promote the Enterprise/Cloud feature by displaying them in the settings menu.
     // Disable this by adding "promoteEE: false" to your `./config/admin.js` file
     ...!window.strapi.features.isEnabled(window.strapi.features.SSO) && window.strapi?.flags?.promoteEE ? [
@@ -465,7 +473,7 @@ const [Provider, useHistory] = Theme.createContext("History", {
 const HistoryProvider = ({ children }) => {
   const location = reactRouterDom.useLocation();
   const navigate = reactRouterDom.useNavigate();
-  const [state, dispatch] = React__namespace.useReducer(reducer$2, {
+  const [state, dispatch] = React__namespace.useReducer(reducer$1, {
     history: [],
     currentLocationIndex: 0,
     currentLocation: "",
@@ -505,7 +513,7 @@ const HistoryProvider = ({ children }) => {
   }, [dispatch, location.pathname, location.search]);
   return /* @__PURE__ */ jsxRuntime.jsx(Provider, { pushState, goBack, ...state, children });
 };
-const reducer$2 = (state, action) => immer.produce(state, (draft) => {
+const reducer$1 = (state, action) => immer.produce(state, (draft) => {
   switch (action.type) {
     case "PUSH_STATE": {
       const path = `${action.payload.to}${action.payload.search}`;
@@ -557,173 +565,6 @@ const BackButton = React__namespace.forwardRef(({ disabled }, ref) => {
   );
 });
 
-const GUIDED_TOUR_COMPLETED_STEPS = "GUIDED_TOUR_COMPLETED_STEPS";
-const GUIDED_TOUR_CURRENT_STEP = "GUIDED_TOUR_CURRENT_STEP";
-const GUIDED_TOUR_SKIPPED = "GUIDED_TOUR_SKIPPED";
-const [GuidedTourProviderImpl, useGuidedTour] = Theme.createContext("GuidedTour");
-const GuidedTourProvider = ({ children }) => {
-  const [{ currentStep, guidedTourState, isGuidedTourVisible, isSkipped }, dispatch] = React__namespace.useReducer(reducer$1, initialState, initialiseState);
-  const setCurrentStep = (step) => {
-    if (step !== null) {
-      const isStepAlreadyDone = get__default.default(guidedTourState, step);
-      const [sectionName, stepName] = step.split(".");
-      const sectionArray = Object.entries(guidedTourState[sectionName]);
-      const currentStepIndex = sectionArray.findIndex(([key]) => key === stepName);
-      const previousSteps = sectionArray.slice(0, currentStepIndex);
-      const isStepToShow = previousSteps.every(([, sectionValue]) => sectionValue);
-      if (isStepAlreadyDone || isSkipped || !isStepToShow) {
-        return null;
-      }
-    }
-    window.localStorage.setItem(GUIDED_TOUR_CURRENT_STEP, JSON.stringify(null));
-    return dispatch({
-      type: "SET_CURRENT_STEP",
-      step
-    });
-  };
-  const setGuidedTourVisibility = (value) => {
-    dispatch({
-      type: "SET_GUIDED_TOUR_VISIBILITY",
-      value
-    });
-  };
-  const setStepState = (currentStep2, value) => {
-    addCompletedStep(currentStep2);
-    dispatch({
-      type: "SET_STEP_STATE",
-      currentStep: currentStep2,
-      value
-    });
-  };
-  const startSection = (sectionName) => {
-    const sectionSteps = guidedTourState[sectionName];
-    if (sectionSteps) {
-      const guidedTourArray = Object.entries(guidedTourState);
-      const currentSectionIndex = guidedTourArray.findIndex(([key]) => key === sectionName);
-      const previousSections = guidedTourArray.slice(0, currentSectionIndex);
-      const isSectionToShow = previousSections.every(
-        ([, sectionValue]) => Object.values(sectionValue).every(Boolean)
-      );
-      const [firstStep] = Object.keys(sectionSteps);
-      const isFirstStepDone = sectionSteps[firstStep];
-      if (isSectionToShow && !currentStep && !isFirstStepDone) {
-        setCurrentStep(`${sectionName}.${firstStep}`);
-      }
-    }
-  };
-  const setSkipped = (value) => {
-    window.localStorage.setItem(GUIDED_TOUR_SKIPPED, JSON.stringify(value));
-    dispatch({
-      type: "SET_SKIPPED",
-      value
-    });
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    GuidedTourProviderImpl,
-    {
-      guidedTourState,
-      currentStep,
-      setCurrentStep,
-      setGuidedTourVisibility,
-      setSkipped,
-      setStepState,
-      startSection,
-      isGuidedTourVisible,
-      isSkipped,
-      children
-    }
-  );
-};
-const initialState = {
-  currentStep: null,
-  guidedTourState: {
-    contentTypeBuilder: {
-      create: false,
-      success: false
-    },
-    contentManager: {
-      create: false,
-      success: false
-    },
-    apiTokens: {
-      create: false,
-      success: false
-    },
-    transferTokens: {
-      create: false,
-      success: false
-    }
-  },
-  isGuidedTourVisible: false,
-  isSkipped: false
-};
-const reducer$1 = (state = initialState, action) => immer.produce(state, (draftState) => {
-  switch (action.type) {
-    case "SET_CURRENT_STEP": {
-      draftState.currentStep = action.step;
-      break;
-    }
-    case "SET_STEP_STATE": {
-      const [section, step] = action.currentStep.split(".");
-      draftState.guidedTourState[section][step] = action.value;
-      break;
-    }
-    case "SET_SKIPPED": {
-      draftState.isSkipped = action.value;
-      break;
-    }
-    case "SET_GUIDED_TOUR_VISIBILITY": {
-      draftState.isGuidedTourVisible = action.value;
-      break;
-    }
-    default: {
-      return draftState;
-    }
-  }
-});
-const initialiseState = (initialState2) => {
-  const copyInitialState = { ...initialState2 };
-  const guidedTourLocaleStorage = JSON.parse(
-    window.localStorage.getItem(GUIDED_TOUR_COMPLETED_STEPS) ?? "[]"
-  );
-  const currentStepLocaleStorage = JSON.parse(
-    window.localStorage.getItem(GUIDED_TOUR_CURRENT_STEP) ?? "null"
-  );
-  const skippedLocaleStorage = JSON.parse(
-    window.localStorage.getItem(GUIDED_TOUR_SKIPPED) ?? "false"
-  );
-  if (Array.isArray(guidedTourLocaleStorage)) {
-    guidedTourLocaleStorage.forEach((step) => {
-      const [sectionName, stepName] = step.split(".");
-      set__default.default(copyInitialState, ["guidedTourState", sectionName, stepName], true);
-    });
-  }
-  if (currentStepLocaleStorage) {
-    const [sectionName, stepName] = currentStepLocaleStorage.split(".");
-    set__default.default(copyInitialState, ["guidedTourState", sectionName, stepName], true);
-    addCompletedStep(currentStepLocaleStorage);
-    window.localStorage.setItem(GUIDED_TOUR_CURRENT_STEP, JSON.stringify(null));
-  }
-  if (skippedLocaleStorage !== null) {
-    set__default.default(copyInitialState, "isSkipped", skippedLocaleStorage);
-  }
-  return copyInitialState;
-};
-const addCompletedStep = (completedStep) => {
-  const currentSteps = JSON.parse(window.localStorage.getItem(GUIDED_TOUR_COMPLETED_STEPS) ?? "[]");
-  if (!Array.isArray(currentSteps)) {
-    return;
-  }
-  const isAlreadyStored = currentSteps.includes(completedStep);
-  if (isAlreadyStored) {
-    return;
-  }
-  window.localStorage.setItem(
-    GUIDED_TOUR_COMPLETED_STEPS,
-    JSON.stringify([...currentSteps, completedStep])
-  );
-};
-
 const queryClient = new reactQuery.QueryClient({
   defaultOptions: {
     queries: {
@@ -747,7 +588,7 @@ const Providers = ({ children, strapi, store }) => {
       runHookWaterfall: (name, initialValue) => strapi.runHookWaterfall(name, initialValue, store),
       runHookSeries: strapi.runHookSeries,
       settings: strapi.router.settings,
-      children: /* @__PURE__ */ jsxRuntime.jsx(reactRedux.Provider, { store, children: /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.AuthProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(HistoryProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Theme.LanguageProvider, { messages: strapi.configurations.translations, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.Theme, { themes: strapi.configurations.themes, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.NotificationsProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Theme.TrackingProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(GuidedTourProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      children: /* @__PURE__ */ jsxRuntime.jsx(reactRedux.Provider, { store, children: /* @__PURE__ */ jsxRuntime.jsx(reactQuery.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.AuthProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(HistoryProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Theme.LanguageProvider, { messages: strapi.configurations.translations, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.Theme, { themes: strapi.configurations.themes, children: /* @__PURE__ */ jsxRuntime.jsx(Theme.NotificationsProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Theme.TrackingProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(Theme.GuidedTourProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
         Theme.ConfigurationProvider,
         {
           defaultAuthLogo: strapi.configurations.authLogo,
@@ -928,7 +769,7 @@ const BaseHeaderLayout = React__namespace.forwardRef(
           right: 0,
           background: "neutral0",
           shadow: "tableShadow",
-          width: `${width}rem`,
+          width: `${width}px`,
           zIndex: 1,
           "data-strapi-header-sticky": true,
           children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { justifyContent: "space-between", children: [
@@ -1092,7 +933,7 @@ const getEERoutes = () => [
     {
       path: "audit-logs",
       lazy: async () => {
-        const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-KvnBaksH.js'));
+        const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-Vf4xtn8w.js'));
         return {
           Component: ProtectedListPage
         };
@@ -1103,7 +944,7 @@ const getEERoutes = () => [
     {
       path: "single-sign-on",
       lazy: async () => {
-        const { ProtectedSSO } = await Promise.resolve().then(() => require('./SingleSignOnPage-ifswElWH.js'));
+        const { ProtectedSSO } = await Promise.resolve().then(() => require('./SingleSignOnPage-WjL8NvC5.js'));
         return {
           Component: ProtectedSSO
         };
@@ -1196,13 +1037,20 @@ const Form = React__namespace.forwardRef(
       return () => clearTimeout(ref2);
     }, [state.errors]);
     const validate = React__namespace.useCallback(
-      async (shouldSetErrors = true) => {
+      async (shouldSetErrors = true, options = {}) => {
         setErrors({});
-        if (!props.validationSchema) {
+        if (!props.validationSchema && !props.validate) {
           return { data: state.values };
         }
         try {
-          const data = await props.validationSchema.validate(state.values, { abortEarly: false });
+          let data;
+          if (props.validationSchema) {
+            data = await props.validationSchema.validate(state.values, { abortEarly: false });
+          } else if (props.validate) {
+            data = await props.validate(state.values, options);
+          } else {
+            throw new Error("No validation schema or validate function provided");
+          }
           return { data };
         } catch (err) {
           if (isErrorYupValidationError(err)) {
@@ -1288,7 +1136,11 @@ const Form = React__namespace.forwardRef(
       } else if (options && multiple) {
         val = Array.from(options).filter((el) => el.selected).map((el) => el.value);
       } else {
-        val = value;
+        if (value === "") {
+          val = null;
+        } else {
+          val = value;
+        }
       }
       if (field) {
         dispatch({
@@ -1357,7 +1209,7 @@ const Form = React__namespace.forwardRef(
       {
         disabled,
         onChange: handleChange,
-        initialValues,
+        initialValues: initialValues.current,
         modified,
         addFieldRow,
         moveFieldRow,
@@ -1491,6 +1343,7 @@ const useField = (path) => {
     (state) => Theme.getIn(state.values, path)
   );
   const handleChange = useForm("useField", (state) => state.onChange);
+  const rawError = useForm("useField", (state) => Theme.getIn(state.errors, path));
   const error = useForm("useField", (state) => {
     const error2 = Theme.getIn(state.errors, path);
     if (isErrorMessageDescriptor(error2)) {
@@ -1505,6 +1358,7 @@ const useField = (path) => {
      * Errors can be a string, or a MessageDescriptor, so we need to handle both cases.
      * If it's anything else, we don't return it.
      */
+    rawError,
     error: isErrorMessageDescriptor(error) ? formatMessage(
       {
         id: error.id,
@@ -1654,7 +1508,7 @@ const DateInput = React.forwardRef(
           ref: composedRefs,
           clearLabel: formatMessage({ id: "clearLabel", defaultMessage: "Clear" }),
           onChange: (date) => {
-            field.onChange(name, date ? convertLocalDateToUTCDate(date) : null);
+            field.onChange(name, date ? convertLocalDateToUTCDate(date).toISOString() : null);
           },
           onClear: () => field.onChange(name, null),
           value: value ? convertLocalDateToUTCDate(value) : value,
@@ -1689,7 +1543,7 @@ const DateTimeInput = React.forwardRef(
           ref: composedRefs,
           clearLabel: formatMessage({ id: "clearLabel", defaultMessage: "Clear" }),
           onChange: (date) => {
-            field.onChange(name, date ? date : null);
+            field.onChange(name, date ? date.toISOString() : null);
           },
           onClear: () => field.onChange(name, null),
           value,
@@ -1716,7 +1570,6 @@ const EmailInput = React.forwardRef(
           ref: composedRefs,
           autoComplete: "email",
           onChange: field.onChange,
-          defaultValue: field.initialValue,
           value: field.value,
           ...props,
           type: "email"
@@ -1796,7 +1649,6 @@ const NumberInputImpl = React.forwardRef(
         designSystem.NumberInput,
         {
           ref: composedRefs,
-          defaultValue: field.initialValue,
           onValueChange: (value) => {
             field.onChange(name, value);
           },
@@ -1827,26 +1679,19 @@ const PasswordInput = React.forwardRef(
           ref: composedRefs,
           autoComplete: "password",
           endAction: /* @__PURE__ */ jsxRuntime.jsx(
-            "button",
+            designSystem.Field.Action,
             {
-              "aria-label": formatMessage({
+              label: formatMessage({
                 id: "Auth.form.password.show-password",
                 defaultMessage: "Show password"
               }),
               onClick: () => {
                 setShowPassword((prev) => !prev);
               },
-              style: {
-                border: "none",
-                padding: 0,
-                background: "transparent"
-              },
-              type: "button",
               children: showPassword ? /* @__PURE__ */ jsxRuntime.jsx(icons.Eye, { fill: "neutral500" }) : /* @__PURE__ */ jsxRuntime.jsx(icons.EyeStriked, { fill: "neutral500" })
             }
           ),
           onChange: field.onChange,
-          defaultValue: field.initialValue,
           value: field.value,
           ...props,
           type: showPassword ? "text" : "password"
@@ -1870,7 +1715,6 @@ const StringInput = React.forwardRef(
         designSystem.TextInput,
         {
           ref: composedRefs,
-          defaultValue: field.initialValue,
           onChange: field.onChange,
           value: field.value ?? "",
           ...props
@@ -1894,7 +1738,6 @@ const TextareaInput = React.forwardRef(
         designSystem.Textarea,
         {
           ref: composedRefs,
-          defaultValue: field.initialValue,
           onChange: field.onChange,
           value: field.value ?? "",
           ...props
@@ -2105,11 +1948,11 @@ const errorsTrads = {
 };
 
 const LOGIN_SCHEMA = yup__namespace.object().shape({
-  email: yup__namespace.string().email({
+  email: yup__namespace.string().nullable().email({
     id: errorsTrads.email.id,
     defaultMessage: "Not a valid email"
   }).required(errorsTrads.required),
-  password: yup__namespace.string().required(errorsTrads.required),
+  password: yup__namespace.string().required(errorsTrads.required).nullable(),
   rememberMe: yup__namespace.bool().nullable()
 });
 const Login = ({ children }) => {
@@ -2240,7 +2083,7 @@ const ForgotPassword = () => {
             email: yup__namespace.string().email(errorsTrads.email).required({
               id: errorsTrads.required.id,
               defaultMessage: "This field is required."
-            })
+            }).nullable()
           }),
           children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 6, children: [
             [
@@ -2609,7 +2452,7 @@ function useNpsSurveySettings() {
 }
 
 const REGISTER_USER_SCHEMA = yup__namespace.object().shape({
-  firstname: yup__namespace.string().trim().required(errorsTrads.required),
+  firstname: yup__namespace.string().trim().required(errorsTrads.required).nullable(),
   lastname: yup__namespace.string().nullable(),
   password: yup__namespace.string().min(8, {
     id: errorsTrads.minLength.id,
@@ -2633,14 +2476,14 @@ const REGISTER_USER_SCHEMA = yup__namespace.object().shape({
   }).required({
     id: errorsTrads.required.id,
     defaultMessage: "Password is required"
-  }),
+  }).nullable(),
   confirmPassword: yup__namespace.string().required({
     id: errorsTrads.required.id,
     defaultMessage: "Confirm password is required"
   }).oneOf([yup__namespace.ref("password"), null], {
     id: "components.Input.error.password.noMatch",
     defaultMessage: "Passwords must match"
-  }),
+  }).nullable(),
   registrationToken: yup__namespace.string().required({
     id: errorsTrads.required.id,
     defaultMessage: "Registration token is required"
@@ -2650,7 +2493,7 @@ const REGISTER_ADMIN_SCHEMA = yup__namespace.object().shape({
   firstname: yup__namespace.string().trim().required({
     id: errorsTrads.required.id,
     defaultMessage: "Firstname is required"
-  }),
+  }).nullable(),
   lastname: yup__namespace.string().nullable(),
   password: yup__namespace.string().min(8, {
     id: errorsTrads.minLength.id,
@@ -2674,11 +2517,11 @@ const REGISTER_ADMIN_SCHEMA = yup__namespace.object().shape({
   }).required({
     id: errorsTrads.required.id,
     defaultMessage: "Password is required"
-  }),
+  }).nullable(),
   confirmPassword: yup__namespace.string().required({
     id: errorsTrads.required,
     defaultMessage: "Confirm password is required"
-  }).oneOf([yup__namespace.ref("password"), null], {
+  }).nullable().oneOf([yup__namespace.ref("password"), null], {
     id: "components.Input.error.password.noMatch",
     defaultMessage: "Passwords must match"
   }),
@@ -2691,7 +2534,7 @@ const REGISTER_ADMIN_SCHEMA = yup__namespace.object().shape({
   }).required({
     id: errorsTrads.required.id,
     defaultMessage: "Email is required"
-  })
+  }).nullable()
 });
 const Register = ({ hasAdmin }) => {
   const { toggleNotification } = Theme.useNotification();
@@ -2700,7 +2543,7 @@ const Register = ({ hasAdmin }) => {
   const [apiError, setApiError] = React__namespace.useState();
   const { trackUsage } = Theme.useTracking();
   const { formatMessage } = reactIntl.useIntl();
-  const setSkipped = useGuidedTour("Register", (state) => state.setSkipped);
+  const setSkipped = Theme.useGuidedTour("Register", (state) => state.setSkipped);
   const { search: searchString } = reactRouterDom.useLocation();
   const query = React__namespace.useMemo(() => new URLSearchParams(searchString), [searchString]);
   const match = reactRouterDom.useMatch("/auth/:authType");
@@ -2932,7 +2775,7 @@ const Register = ({ hasAdmin }) => {
               size: 12,
               type: "checkbox"
             }
-          ].map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: size, children: /* @__PURE__ */ jsxRuntime.jsx(MemoizedInputRenderer, { ...field }) }, field.name)) }),
+          ].map(({ size, ...field }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: size, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(MemoizedInputRenderer, { ...field }) }, field.name)) }),
           /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { fullWidth: true, size: "L", type: "submit", children: formatMessage({
             id: "Auth.form.button.register",
             defaultMessage: "Let's start"
@@ -2989,14 +2832,14 @@ const RESET_PASSWORD_SCHEMA = yup__namespace.object().shape({
   }).required({
     id: errorsTrads.required.id,
     defaultMessage: "Password is required"
-  }),
+  }).nullable(),
   confirmPassword: yup__namespace.string().required({
     id: errorsTrads.required.id,
     defaultMessage: "Confirm password is required"
   }).oneOf([yup__namespace.ref("password"), null], {
     id: "components.Input.error.password.noMatch",
     defaultMessage: "Passwords must match"
-  })
+  }).nullable()
 });
 const ResetPassword = () => {
   const { formatMessage } = reactIntl.useIntl();
@@ -3099,11 +2942,11 @@ const AuthPage = () => {
   const { hasAdmin } = data ?? {};
   const Login$1 = useEnterprise.useEnterprise(
     Login,
-    async () => (await Promise.resolve().then(() => require('./Login-D_lEvhlk.js'))).LoginEE
+    async () => (await Promise.resolve().then(() => require('./Login-qr72UXGp.js'))).LoginEE
   );
   const forms = useEnterprise.useEnterprise(
     FORMS,
-    async () => (await Promise.resolve().then(() => require('./constants-PyUVE8mk.js'))).FORMS,
+    async () => (await Promise.resolve().then(() => require('./constants-bgMqSKBQ.js'))).FORMS,
     {
       combine(ceForms, eeForms) {
         return {
@@ -3119,7 +2962,13 @@ const AuthPage = () => {
     return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Navigate, { to: "/" });
   }
   const Component = forms[authType];
-  if (!Component || hasAdmin && authType === "register-admin" || token) {
+  if (!Component) {
+    return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Navigate, { to: "/" });
+  }
+  if (authType !== "register-admin" && authType !== "register" && token) {
+    return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Navigate, { to: "/" });
+  }
+  if (hasAdmin && authType === "register-admin" && token) {
     return /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Navigate, { to: "/" });
   }
   if (!hasAdmin && authType !== "register-admin") {
@@ -3146,7 +2995,7 @@ const AuthPage = () => {
 const ROUTES_CE = [
   {
     lazy: async () => {
-      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-qr-mWRUO.js'));
+      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-Hc3VZ9O3.js'));
       return {
         Component: ProtectedListPage
       };
@@ -3155,7 +3004,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-HNRkTZwZ.js'));
+      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-zzbF8IhD.js'));
       return {
         Component: ProtectedCreatePage
       };
@@ -3164,7 +3013,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-HNRkTZwZ.js'));
+      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-zzbF8IhD.js'));
       return {
         Component: ProtectedCreatePage
       };
@@ -3173,7 +3022,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-BAq4SLUJ.js'));
+      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-OFlfNGv0.js'));
       return {
         Component: ProtectedEditPage
       };
@@ -3182,7 +3031,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-eY08uWFn.js'));
+      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-GRLtmRuy.js'));
       return {
         Component: ProtectedListPage
       };
@@ -3191,7 +3040,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-nJMUfPC_.js'));
+      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-gJJgatNc.js'));
       return {
         Component: ProtectedEditPage
       };
@@ -3200,7 +3049,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-czINWoI4.js'));
+      const { ProtectedCreatePage } = await Promise.resolve().then(() => require('./CreatePage-3V_sa8A4.js'));
       return {
         Component: ProtectedCreatePage
       };
@@ -3209,7 +3058,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-RZcyUKwu.js')).then(n => n.EditPage$1);
+      const { ProtectedEditPage } = await Promise.resolve().then(() => require('./EditPage-8T9gBnnc.js')).then(n => n.EditPage$1);
       return {
         Component: ProtectedEditPage
       };
@@ -3218,7 +3067,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-2bW3tnRz.js'));
+      const { ProtectedListPage } = await Promise.resolve().then(() => require('./ListPage-y3rcDJX1.js'));
       return {
         Component: ProtectedListPage
       };
@@ -3227,7 +3076,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedListView } = await Promise.resolve().then(() => require('./ListView-4XLHSTtI.js'));
+      const { ProtectedListView } = await Promise.resolve().then(() => require('./ListView-8pEtfLsu.js'));
       return {
         Component: ProtectedListView
       };
@@ -3236,7 +3085,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedCreateView } = await Promise.resolve().then(() => require('./CreateView-AXL3tH85.js'));
+      const { ProtectedCreateView } = await Promise.resolve().then(() => require('./CreateView-5EC5Yv96.js'));
       return {
         Component: ProtectedCreateView
       };
@@ -3245,7 +3094,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedEditView } = await Promise.resolve().then(() => require('./EditViewPage-uUDS6iky.js'));
+      const { ProtectedEditView } = await Promise.resolve().then(() => require('./EditViewPage-_wx5u6QJ.js'));
       return {
         Component: ProtectedEditView
       };
@@ -3254,7 +3103,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedCreateView } = await Promise.resolve().then(() => require('./CreateView-aIiiLy3C.js'));
+      const { ProtectedCreateView } = await Promise.resolve().then(() => require('./CreateView-ZQEmP8-n.js'));
       return {
         Component: ProtectedCreateView
       };
@@ -3263,7 +3112,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedListView } = await Promise.resolve().then(() => require('./ListView-U0ueqVjR.js'));
+      const { ProtectedListView } = await Promise.resolve().then(() => require('./ListView-noYLY_DM.js'));
       return {
         Component: ProtectedListView
       };
@@ -3272,7 +3121,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { ProtectedEditView } = await Promise.resolve().then(() => require('./EditView-CqQ7E0hw.js'));
+      const { ProtectedEditView } = await Promise.resolve().then(() => require('./EditView-ZJPPeal2.js'));
       return {
         Component: ProtectedEditView
       };
@@ -3281,7 +3130,16 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { PurchaseAuditLogs } = await Promise.resolve().then(() => require('./PurchaseAuditLogs-LAxKPeum.js'));
+      const { ProtectedInstalledPlugins } = await Promise.resolve().then(() => require('./InstalledPlugins-spdwM8ub.js'));
+      return {
+        Component: ProtectedInstalledPlugins
+      };
+    },
+    path: "list-plugins"
+  },
+  {
+    lazy: async () => {
+      const { PurchaseAuditLogs } = await Promise.resolve().then(() => require('./PurchaseAuditLogs-qxVh-U_P.js'));
       return {
         Component: PurchaseAuditLogs
       };
@@ -3290,7 +3148,7 @@ const ROUTES_CE = [
   },
   {
     lazy: async () => {
-      const { PurchaseSingleSignOn } = await Promise.resolve().then(() => require('./PurchaseSingleSignOn-trhjWQVO.js'));
+      const { PurchaseSingleSignOn } = await Promise.resolve().then(() => require('./PurchaseSingleSignOn-ovEsG_Ud.js'));
       return {
         Component: PurchaseSingleSignOn
       };
@@ -3303,7 +3161,7 @@ const getImmutableRoutes = () => [
   {
     path: "usecase",
     lazy: async () => {
-      const { PrivateUseCasePage } = await Promise.resolve().then(() => require('./UseCasePage-ipjo7uhC.js'));
+      const { PrivateUseCasePage } = await Promise.resolve().then(() => require('./UseCasePage-hJH0orUl.js'));
       return {
         Component: PrivateUseCasePage
       };
@@ -3320,7 +3178,7 @@ const getInitialRoutes = () => [
   {
     index: true,
     lazy: async () => {
-      const { HomePage } = await Promise.resolve().then(() => require('./HomePage-cSNwcjEI.js'));
+      const { HomePage } = await Promise.resolve().then(() => require('./HomePage-T2yVEfC3.js'));
       return {
         Component: HomePage
       };
@@ -3329,25 +3187,16 @@ const getInitialRoutes = () => [
   {
     path: "me",
     lazy: async () => {
-      const { ProfilePage } = await Promise.resolve().then(() => require('./ProfilePage-8lhmqZEh.js'));
+      const { ProfilePage } = await Promise.resolve().then(() => require('./ProfilePage-Mte9RhXw.js'));
       return {
         Component: ProfilePage
       };
     }
   },
-  {
-    path: "list-plugins",
-    lazy: async () => {
-      const { ProtectedInstalledPluginsPage } = await Promise.resolve().then(() => require('./InstalledPluginsPage-Vj2K7uad.js'));
-      return {
-        Component: ProtectedInstalledPluginsPage
-      };
-    }
-  },
   {
     path: "marketplace",
     lazy: async () => {
-      const { ProtectedMarketplacePage } = await Promise.resolve().then(() => require('./MarketplacePage-eNFHM7J0.js'));
+      const { ProtectedMarketplacePage } = await Promise.resolve().then(() => require('./MarketplacePage-yRWZ54oN.js'));
       return {
         Component: ProtectedMarketplacePage
       };
@@ -3356,7 +3205,7 @@ const getInitialRoutes = () => [
   {
     path: "settings/*",
     lazy: async () => {
-      const { Layout } = await Promise.resolve().then(() => require('./Layout-Y4dCGf7_.js'));
+      const { Layout } = await Promise.resolve().then(() => require('./Layout-B3TQMQxb.js'));
       return {
         Component: Layout
       };
@@ -3365,7 +3214,7 @@ const getInitialRoutes = () => [
       {
         path: "application-infos",
         lazy: async () => {
-          const { ApplicationInfoPage } = await Promise.resolve().then(() => require('./ApplicationInfoPage-DOljMjfU.js'));
+          const { ApplicationInfoPage } = await Promise.resolve().then(() => require('./ApplicationInfoPage-bkWa99An.js'));
           return {
             Component: ApplicationInfoPage
           };
@@ -3429,7 +3278,7 @@ class Router {
           {
             path: "/*",
             lazy: async () => {
-              const { PrivateAdminLayout } = await Promise.resolve().then(() => require('./AuthenticatedLayout-S2qRx5pp.js'));
+              const { PrivateAdminLayout } = await Promise.resolve().then(() => require('./AuthenticatedLayout-ZAXB7o93.js'));
               return {
                 Component: PrivateAdminLayout
               };
@@ -3951,7 +3800,7 @@ class StrapiApp {
     const adminLocales = await Promise.all(
       this.configurations.locales.map(async (locale) => {
         try {
-          const { default: data } = await __variableDynamicImportRuntimeHelper((/* #__PURE__ */ Object.assign({"./translations/ar.json": () => Promise.resolve().then(() => require('./ar-74XpZHjA.js')),"./translations/ca.json": () => Promise.resolve().then(() => require('./ca-tfhzbe_0.js')),"./translations/cs.json": () => Promise.resolve().then(() => require('./cs-sS-228vY.js')),"./translations/de.json": () => Promise.resolve().then(() => require('./de-og0YSnla.js')),"./translations/dk.json": () => Promise.resolve().then(() => require('./dk-GtDhDxRc.js')),"./translations/en.json": () => Promise.resolve().then(() => require('./en-TbnMBjZf.js')),"./translations/es.json": () => Promise.resolve().then(() => require('./es-TQtY4G8X.js')),"./translations/eu.json": () => Promise.resolve().then(() => require('./eu-SRdPRyQu.js')),"./translations/fr.json": () => Promise.resolve().then(() => require('./fr-GW5-kEO9.js')),"./translations/gu.json": () => Promise.resolve().then(() => require('./gu-z6qqOLRh.js')),"./translations/he.json": () => Promise.resolve().then(() => require('./he-CLdZZ_n1.js')),"./translations/hi.json": () => Promise.resolve().then(() => require('./hi-3pMoYe6q.js')),"./translations/hu.json": () => Promise.resolve().then(() => require('./hu-VxIqV1X0.js')),"./translations/id.json": () => Promise.resolve().then(() => require('./id-cUUpuxZO.js')),"./translations/it.json": () => Promise.resolve().then(() => require('./it-m8H0rXTP.js')),"./translations/ja.json": () => Promise.resolve().then(() => require('./ja-jhqUhh7F.js')),"./translations/ko.json": () => Promise.resolve().then(() => require('./ko-Fq49QS3z.js')),"./translations/ml.json": () => Promise.resolve().then(() => require('./ml-mLJM4sQP.js')),"./translations/ms.json": () => Promise.resolve().then(() => require('./ms-NDmpSkMY.js')),"./translations/nl.json": () => Promise.resolve().then(() => require('./nl-RREi1JAg.js')),"./translations/no.json": () => Promise.resolve().then(() => require('./no-2wT9Jd9n.js')),"./translations/pl.json": () => Promise.resolve().then(() => require('./pl-kU2npCRO.js')),"./translations/pt-BR.json": () => Promise.resolve().then(() => require('./pt-BR-R-dMJxPL.js')),"./translations/pt.json": () => Promise.resolve().then(() => require('./pt-IygqsPYv.js')),"./translations/ru.json": () => Promise.resolve().then(() => require('./ru-5TBoMH_2.js')),"./translations/sa.json": () => Promise.resolve().then(() => require('./sa-KmwTiEO5.js')),"./translations/sk.json": () => Promise.resolve().then(() => require('./sk-IV2uPmXo.js')),"./translations/sv.json": () => Promise.resolve().then(() => require('./sv-Uv9nW9cN.js')),"./translations/th.json": () => Promise.resolve().then(() => require('./th-SXQwWjv6.js')),"./translations/tr.json": () => Promise.resolve().then(() => require('./tr-RBQM-Vq5.js')),"./translations/uk.json": () => Promise.resolve().then(() => require('./uk-5T4XFIKm.js')),"./translations/vi.json": () => Promise.resolve().then(() => require('./vi-mj-Smy3d.js')),"./translations/zh-Hans.json": () => Promise.resolve().then(() => require('./zh-Hans-eWSoi9-X.js')),"./translations/zh.json": () => Promise.resolve().then(() => require('./zh-6qF5HCOo.js'))})), `./translations/${locale}.json`);
+          const { default: data } = await __variableDynamicImportRuntimeHelper((/* #__PURE__ */ Object.assign({"./translations/ar.json": () => Promise.resolve().then(() => require('./ar-74XpZHjA.js')),"./translations/ca.json": () => Promise.resolve().then(() => require('./ca-tfhzbe_0.js')),"./translations/cs.json": () => Promise.resolve().then(() => require('./cs-sS-228vY.js')),"./translations/de.json": () => Promise.resolve().then(() => require('./de-og0YSnla.js')),"./translations/dk.json": () => Promise.resolve().then(() => require('./dk-GtDhDxRc.js')),"./translations/en.json": () => Promise.resolve().then(() => require('./en-_1-Nn7iH.js')),"./translations/es.json": () => Promise.resolve().then(() => require('./es-TQtY4G8X.js')),"./translations/eu.json": () => Promise.resolve().then(() => require('./eu-SRdPRyQu.js')),"./translations/fr.json": () => Promise.resolve().then(() => require('./fr-GW5-kEO9.js')),"./translations/gu.json": () => Promise.resolve().then(() => require('./gu-z6qqOLRh.js')),"./translations/he.json": () => Promise.resolve().then(() => require('./he-CLdZZ_n1.js')),"./translations/hi.json": () => Promise.resolve().then(() => require('./hi-3pMoYe6q.js')),"./translations/hu.json": () => Promise.resolve().then(() => require('./hu-VxIqV1X0.js')),"./translations/id.json": () => Promise.resolve().then(() => require('./id-cUUpuxZO.js')),"./translations/it.json": () => Promise.resolve().then(() => require('./it-m8H0rXTP.js')),"./translations/ja.json": () => Promise.resolve().then(() => require('./ja-jhqUhh7F.js')),"./translations/ko.json": () => Promise.resolve().then(() => require('./ko-Fq49QS3z.js')),"./translations/ml.json": () => Promise.resolve().then(() => require('./ml-mLJM4sQP.js')),"./translations/ms.json": () => Promise.resolve().then(() => require('./ms-NDmpSkMY.js')),"./translations/nl.json": () => Promise.resolve().then(() => require('./nl-RREi1JAg.js')),"./translations/no.json": () => Promise.resolve().then(() => require('./no-2wT9Jd9n.js')),"./translations/pl.json": () => Promise.resolve().then(() => require('./pl-kU2npCRO.js')),"./translations/pt-BR.json": () => Promise.resolve().then(() => require('./pt-BR-R-dMJxPL.js')),"./translations/pt.json": () => Promise.resolve().then(() => require('./pt-IygqsPYv.js')),"./translations/ru.json": () => Promise.resolve().then(() => require('./ru-5TBoMH_2.js')),"./translations/sa.json": () => Promise.resolve().then(() => require('./sa-KmwTiEO5.js')),"./translations/sk.json": () => Promise.resolve().then(() => require('./sk-IV2uPmXo.js')),"./translations/sv.json": () => Promise.resolve().then(() => require('./sv-Uv9nW9cN.js')),"./translations/th.json": () => Promise.resolve().then(() => require('./th-SXQwWjv6.js')),"./translations/tr.json": () => Promise.resolve().then(() => require('./tr-RBQM-Vq5.js')),"./translations/uk.json": () => Promise.resolve().then(() => require('./uk-5T4XFIKm.js')),"./translations/vi.json": () => Promise.resolve().then(() => require('./vi-mj-Smy3d.js')),"./translations/zh-Hans.json": () => Promise.resolve().then(() => require('./zh-Hans-eWSoi9-X.js')),"./translations/zh.json": () => Promise.resolve().then(() => require('./zh-6qF5HCOo.js'))})), `./translations/${locale}.json`);
           return { data, locale };
         } catch {
           return { data: null, locale };
@@ -4486,35 +4335,6 @@ function useUncontrolledState({
   return uncontrolledState;
 }
 
-const useQueryParams = (initialParams) => {
-  const { search } = reactRouterDom.useLocation();
-  const navigate = reactRouterDom.useNavigate();
-  const query = React.useMemo(() => {
-    const searchQuery = search.startsWith("?") ? search.slice(1) : search;
-    if (!search && initialParams) {
-      return initialParams;
-    }
-    return { ...initialParams, ...qs.parse(searchQuery) };
-  }, [search, initialParams]);
-  const setQuery = React.useCallback(
-    (nextParams, method = "push", replace = false) => {
-      let nextQuery = { ...query };
-      if (method === "remove") {
-        Object.keys(nextParams).forEach((key) => {
-          if (Object.prototype.hasOwnProperty.call(nextQuery, key)) {
-            delete nextQuery[key];
-          }
-        });
-      } else {
-        nextQuery = { ...query, ...nextParams };
-      }
-      navigate({ search: qs.stringify(nextQuery, { encode: false }) }, { replace });
-    },
-    [navigate, query]
-  );
-  return [{ query, rawQuery: search }, setQuery];
-};
-
 const [FiltersProvider, useFilters] = Theme.createContext("Filters");
 const Root$2 = ({
   children,
@@ -4565,7 +4385,7 @@ const Trigger = React__namespace.forwardRef(
   }
 );
 const PopoverImpl = () => {
-  const [{ query }, setQuery] = useQueryParams();
+  const [{ query }, setQuery] = Theme.useQueryParams();
   const { formatMessage } = reactIntl.useIntl();
   const options = useFilters("Popover", ({ options: options2 }) => options2);
   const onChange = useFilters("Popover", ({ onChange: onChange2 }) => onChange2);
@@ -4710,7 +4530,7 @@ const getFilterList = (filter) => {
   }
 };
 const List = () => {
-  const [{ query }, setQuery] = useQueryParams();
+  const [{ query }, setQuery] = Theme.useQueryParams();
   const options = useFilters("List", ({ options: options2 }) => options2);
   const handleClick = (data) => {
     const nextFilters = (query?.filters?.$and ?? []).filter((filter) => {
@@ -4845,7 +4665,7 @@ const Filters = {
 const [PaginationProvider, usePagination] = Theme.createContext("Pagination");
 const Root$1 = React__namespace.forwardRef(
   ({ children, defaultPageSize = 10, pageCount = 0, defaultPage = 1, onPageSizeChange, total = 0 }, forwardedRef) => {
-    const [{ query }, setQuery] = useQueryParams(
+    const [{ query }, setQuery] = Theme.useQueryParams(
       {
         pageSize: defaultPageSize.toString(),
         page: defaultPage.toString()
@@ -5005,7 +4825,7 @@ const SearchInput = ({
 }) => {
   const inputRef = React__namespace.useRef(null);
   const iconButtonRef = React__namespace.useRef(null);
-  const [{ query }, setQuery] = useQueryParams();
+  const [{ query }, setQuery] = Theme.useQueryParams();
   const [value, setValue] = React__namespace.useState(query?._q || "");
   const [isOpen, setIsOpen] = React__namespace.useState(!!value);
   const { formatMessage } = reactIntl.useIntl();
@@ -5118,7 +4938,7 @@ const Head = ({ children }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Thead, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Tr, { children }) });
 };
 const HeaderCell = ({ name, label, sortable }) => {
-  const [{ query }, setQuery] = useQueryParams();
+  const [{ query }, setQuery] = Theme.useQueryParams();
   const sort = query?.sort ?? "";
   const [sortBy, sortOrder] = sort.split(":");
   const { formatMessage } = reactIntl.useIntl();
@@ -5137,7 +4957,7 @@ const HeaderCell = ({ name, label, sortable }) => {
   return /* @__PURE__ */ jsxRuntime.jsx(
     designSystem.Th,
     {
-      action: isSorted && sortable && /* @__PURE__ */ jsxRuntime.jsx(designSystem.IconButton, { label: sortLabel, onClick: handleClickSort, borderStyle: "none", children: /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { $isUp: sortOrder === "ASC" }) }),
+      action: isSorted && sortable && /* @__PURE__ */ jsxRuntime.jsx(designSystem.IconButton, { label: sortLabel, onClick: handleClickSort, variant: "ghost", children: /* @__PURE__ */ jsxRuntime.jsx(SortIcon, { $isUp: sortOrder === "ASC" }) }),
       children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Tooltip, { label: sortable ? sortLabel : label, children: /* @__PURE__ */ jsxRuntime.jsx(
         designSystem.Typography,
         {
@@ -5288,6 +5108,41 @@ const Table = {
   Empty
 };
 
+const ContentBox = ({
+  title,
+  subtitle,
+  icon,
+  iconBackground,
+  endAction,
+  titleEllipsis = false
+}) => {
+  if (title && title.length > 70 && titleEllipsis) {
+    title = `${title.substring(0, 70)}...`;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { shadow: "tableShadow", hasRadius: true, padding: 6, background: "neutral0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(IconWrapper, { background: iconBackground, hasRadius: true, padding: 3, children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: endAction ? 0 : 1, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(TypographyWordBreak, { fontWeight: "semiBold", variant: "pi", children: title }),
+        endAction
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Typography, { textColor: "neutral600", children: subtitle })
+    ] })
+  ] });
+};
+const IconWrapper = styledComponents.styled(designSystem.Flex)`
+  margin-right: ${({ theme }) => theme.spaces[6]};
+
+  svg {
+    width: 3.2rem;
+    height: 3.2rem;
+  }
+`;
+const TypographyWordBreak = styledComponents.styled(designSystem.Typography)`
+  color: ${({ theme }) => theme.colors.neutral800};
+  word-break: break-all;
+`;
+
 function useInjectReducer(namespace, reducer) {
   const store = Theme.useTypedStore();
   React.useEffect(() => {
@@ -5489,6 +5344,7 @@ exports.BackButton = BackButton;
 exports.Blocker = Blocker;
 exports.Column = Column;
 exports.ConfirmDialog = ConfirmDialog;
+exports.ContentBox = ContentBox;
 exports.DescriptionComponentRenderer = DescriptionComponentRenderer;
 exports.Filters = Filters;
 exports.Form = Form;
@@ -5522,11 +5378,9 @@ exports.useForm = useForm;
 exports.useGetRolePermissionLayoutQuery = useGetRolePermissionLayoutQuery;
 exports.useGetRolePermissionsQuery = useGetRolePermissionsQuery;
 exports.useGetRolesQuery = useGetRolesQuery;
-exports.useGuidedTour = useGuidedTour;
 exports.useInjectReducer = useInjectReducer;
-exports.useQueryParams = useQueryParams;
 exports.useTable = useTable;
 exports.useUpdateRoleMutation = useUpdateRoleMutation;
 exports.useUpdateRolePermissionsMutation = useUpdateRolePermissionsMutation;
 exports.useUpdateUserMutation = useUpdateUserMutation;
-//# sourceMappingURL=index-3GWFhGv_.js.map
+//# sourceMappingURL=index-we0DbzVF.js.map