@strapi/content-type-builder 5.0.0-rc.0 → 5.0.0-rc.10

package/dist/_chunks/{index-Z-KG7c7n.js → index-DbqNgfVI.js}

@@ -9,7 +9,7 @@ const Icons = require("@strapi/icons");
 const reactDom = require("react-dom");
 const styledComponents = require("styled-components");
 const upperFirst = require("lodash/upperFirst");
-const index$1 = require("./index-hlyv9EE3.js");
+const index$1 = require("./index-DqqaFxyZ.js");
 const isEqual = require("lodash/isEqual");
 const get = require("lodash/get");
 const groupBy = require("lodash/groupBy");
@@ -347,23 +347,28 @@ const useContentTypeBuilderMenu = () => {
   ].map((section) => {
     const hasChild = section.links.some((l) => Array.isArray(l.links));
     if (hasChild) {
+      let filteredLinksCount = 0;
       return {
         ...section,
         links: section.links.map((link) => {
-          const filteredLinks = link.links.filter((link2) => startsWith(link2.title, search));
-          if (filteredLinks.length === 0) {
+          const filteredLinks2 = link.links.filter((link2) => startsWith(link2.title, search));
+          if (filteredLinks2.length === 0) {
             return null;
           }
+          filteredLinksCount += filteredLinks2.length;
           return {
             ...link,
-            links: filteredLinks.sort((a, b) => formatter.compare(a.title, b.title))
+            links: filteredLinks2.sort((a, b) => formatter.compare(a.title, b.title))
           };
-        }).filter(Boolean)
+        }).filter(Boolean),
+        linksCount: filteredLinksCount
       };
     }
+    const filteredLinks = section.links.filter((link) => startsWith(link.title, search)).sort((a, b) => formatter.compare(a.title, b.title));
     return {
       ...section,
-      links: section.links.filter((link) => startsWith(link.title, search)).sort((a, b) => formatter.compare(a.title, b.title))
+      links: filteredLinks,
+      linksCount: filteredLinks.length
     };
   });
   return {
@@ -372,81 +377,94 @@ const useContentTypeBuilderMenu = () => {
     onSearchChange: setSearch
   };
 };
+const SubNavLinkCustom = styledComponents.styled(designSystem.SubNavLink)`
+  div {
+    width: inherit;
+    span:nth-child(2) {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      width: inherit;
+    }
+  }
+`;
 const ContentTypeBuilderNav = () => {
   const { menu, searchValue, onSearchChange } = useContentTypeBuilderMenu();
   const { formatMessage } = reactIntl.useIntl();
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    designSystem.SubNav,
-    {
-      "aria-label": formatMessage({
-        id: `${getTrad("plugin.name")}`,
-        defaultMessage: "Content-Types Builder"
-      }),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(
-          designSystem.SubNavHeader,
-          {
-            searchable: true,
-            value: searchValue,
-            onClear: () => onSearchChange(""),
-            onChange: (e) => onSearchChange(e.target.value),
-            label: formatMessage({
-              id: `${getTrad("plugin.name")}`,
-              defaultMessage: "Content-Types Builder"
-            }),
-            searchLabel: formatMessage({
-              id: "global.search",
-              defaultMessage: "Search"
-            })
-          }
-        ),
-        /* @__PURE__ */ jsxRuntime.jsx(designSystem.SubNavSections, { children: menu.map((section) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            designSystem.SubNavSection,
-            {
-              label: formatMessage({
-                id: section.title.id,
-                defaultMessage: section.title.defaultMessage
-              }),
-              collapsable: true,
-              badgeLabel: section.links.length.toString(),
-              children: section.links.map((link) => {
-                if (link.links) {
-                  return /* @__PURE__ */ jsxRuntime.jsx(designSystem.SubNavLinkSection, { label: upperFirst__default.default(link.title), children: link.links.map((subLink) => /* @__PURE__ */ jsxRuntime.jsx(
-                    designSystem.SubNavLink,
-                    {
-                      tag: reactRouterDom.NavLink,
-                      to: subLink.to,
-                      active: subLink.active,
-                      isSubSectionChild: true,
-                      children: upperFirst__default.default(
-                        formatMessage({ id: subLink.name, defaultMessage: subLink.title })
-                      )
-                    },
-                    subLink.name
-                  )) }, link.name);
-                }
-                return /* @__PURE__ */ jsxRuntime.jsx(designSystem.SubNavLink, { tag: reactRouterDom.NavLink, to: link.to, active: link.active, children: upperFirst__default.default(formatMessage({ id: link.name, defaultMessage: link.title })) }, link.name);
-              })
-            }
-          ),
-          section.customLink && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingLeft: 7, children: /* @__PURE__ */ jsxRuntime.jsx(
-            designSystem.TextButton,
-            {
-              onClick: section.customLink.onClick,
-              startIcon: /* @__PURE__ */ jsxRuntime.jsx(Icons.Plus, { width: "0.8rem", height: "0.8rem" }),
-              marginTop: 2,
-              cursor: "pointer",
-              children: formatMessage({
-                id: section.customLink.id,
-                defaultMessage: section.customLink.defaultMessage
-              })
+  const pluginName = formatMessage({
+    id: getTrad("plugin.name"),
+    defaultMessage: "Content-Type Builder"
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.SubNav, { "aria-label": pluginName, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.SubNavHeader,
+      {
+        searchable: true,
+        value: searchValue,
+        onClear: () => onSearchChange(""),
+        onChange: (e) => onSearchChange(e.target.value),
+        label: pluginName,
+        searchLabel: formatMessage({
+          id: "global.search",
+          defaultMessage: "Search"
+        })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.SubNavSections, { children: menu.map((section) => /* @__PURE__ */ jsxRuntime.jsxs(React.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.SubNavSection,
+        {
+          label: formatMessage({
+            id: section.title.id,
+            defaultMessage: section.title.defaultMessage
+          }),
+          collapsable: true,
+          badgeLabel: section.linksCount.toString(),
+          children: section.links.map((link) => {
+            if (link.links) {
+              return /* @__PURE__ */ jsxRuntime.jsx(designSystem.SubNavLinkSection, { label: upperFirst__default.default(link.title), children: link.links.map((subLink) => /* @__PURE__ */ jsxRuntime.jsx(
+                designSystem.SubNavLink,
+                {
+                  tag: reactRouterDom.NavLink,
+                  to: subLink.to,
+                  active: subLink.active,
+                  isSubSectionChild: true,
+                  children: upperFirst__default.default(
+                    formatMessage({ id: subLink.name, defaultMessage: subLink.title })
+                  )
+                },
+                subLink.name
+              )) }, link.name);
             }
-          ) })
-        ] }, section.name)) })
-      ]
-    }
-  );
+            return /* @__PURE__ */ jsxRuntime.jsx(
+              SubNavLinkCustom,
+              {
+                tag: reactRouterDom.NavLink,
+                to: link.to,
+                active: link.active,
+                width: "100%",
+                children: upperFirst__default.default(formatMessage({ id: link.name, defaultMessage: link.title }))
+              },
+              link.name
+            );
+          })
+        }
+      ),
+      section.customLink && /* @__PURE__ */ jsxRuntime.jsx(designSystem.Box, { paddingLeft: 7, children: /* @__PURE__ */ jsxRuntime.jsx(
+        designSystem.TextButton,
+        {
+          onClick: section.customLink.onClick,
+          startIcon: /* @__PURE__ */ jsxRuntime.jsx(Icons.Plus, { width: "0.8rem", height: "0.8rem" }),
+          marginTop: 2,
+          cursor: "pointer",
+          children: formatMessage({
+            id: section.customLink.id,
+            defaultMessage: section.customLink.defaultMessage
+          })
+        }
+      ) })
+    ] }, section.name)) })
+  ] });
 };
 const isAllowedContentTypesForRelations = (contentType) => {
   return contentType.kind === "collectionType" && (contentType.restrictRelationsTo === null || Array.isArray(contentType.restrictRelationsTo) && contentType.restrictRelationsTo.length > 0);
@@ -607,7 +625,7 @@ const AttributeOption = ({ type = "text" }) => {
 const AttributeList = ({ attributes }) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.KeyboardNavigable, { tagName: "button", children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 8, children: attributes.map((attributeRow, index2) => {
   return (
     // eslint-disable-next-line react/no-array-index-key
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 3, children: attributeRow.map((attribute) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, children: /* @__PURE__ */ jsxRuntime.jsx(AttributeOption, { type: attribute }) }, attribute)) }, index2)
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 3, children: attributeRow.map((attribute) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(AttributeOption, { type: attribute }) }, attribute)) }, index2)
   );
 }) }) });
 const CustomFieldOption = ({ customFieldUid, customField }) => {
@@ -688,7 +706,7 @@ const CustomFieldsList = () => {
     (a, b) => a[1].name > b[1].name ? 1 : -1
   );
   return /* @__PURE__ */ jsxRuntime.jsx(designSystem.KeyboardNavigable, { tagName: "button", children: /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Flex, { direction: "column", alignItems: "stretch", gap: 3, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 3, children: sortedCustomFields.map(([uid, customField]) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, children: /* @__PURE__ */ jsxRuntime.jsx(CustomFieldOption, { customFieldUid: uid, customField }, uid) }, uid)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Root, { gap: 3, children: sortedCustomFields.map(([uid, customField]) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: 6, direction: "column", alignItems: "stretch", children: /* @__PURE__ */ jsxRuntime.jsx(CustomFieldOption, { customFieldUid: uid, customField }, uid) }, uid)) }),
     /* @__PURE__ */ jsxRuntime.jsx(
       designSystem.Link,
       {
@@ -974,10 +992,19 @@ const DraftAndPublishToggle = ({
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Checkbox, { checked: value, disabled, onCheckedChange: handleChange, children: label }),
       /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Hint, {})
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Root, { open: showWarning, onOpenChange: (isOpen) => setShowWarning(isOpen), children: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.ConfirmDialog, { onConfirm: handleConfirm, children: formatMessage({
-      id: getTrad("popUpWarning.draft-publish.message"),
-      defaultMessage: "If you disable the draft & publish, your drafts will be deleted."
-    }) }) })
+    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Dialog.Root, { open: showWarning, onOpenChange: (isOpen) => setShowWarning(isOpen), children: /* @__PURE__ */ jsxRuntime.jsx(
+      strapiAdmin.ConfirmDialog,
+      {
+        endAction: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: handleConfirm, variant: "danger", width: "100%", justifyContent: "center", children: formatMessage({
+          id: getTrad("popUpWarning.draft-publish.button.confirm"),
+          defaultMessage: "Yes, disable"
+        }) }),
+        children: formatMessage({
+          id: getTrad("popUpWarning.draft-publish.message"),
+          defaultMessage: "If you disable the draft & publish, your drafts will be deleted."
+        })
+      }
+    ) })
   ] });
 };
 const FormModalEndActions = ({
@@ -1742,7 +1769,7 @@ const IconPicker = ({ intlLabel, name, onChange, value = "" }) => {
               id: getTrad("IconPicker.search.button.label"),
               defaultMessage: "Search icon button"
             }),
-            borderWidth: 0,
+            variant: "ghost",
             children: /* @__PURE__ */ jsxRuntime.jsx(Icons.Search, {})
           }
         ),
@@ -1762,7 +1789,7 @@ const IconPicker = ({ intlLabel, name, onChange, value = "" }) => {
                   id: getTrad("IconPicker.remove.button"),
                   defaultMessage: "Remove the selected icon"
                 }),
-                borderWidth: 0,
+                variant: "ghost",
                 children: /* @__PURE__ */ jsxRuntime.jsx(Icons.Trash, {})
               }
             )
@@ -2294,6 +2321,12 @@ const RelationTargetPicker = ({
   ] });
 };
 const MenuTrigger = styledComponents.styled(designSystem.Menu.Trigger)`
+  max-width: 16.8rem;
+  span {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
   svg {
     width: 0.6rem;
     height: 0.4rem;
@@ -2498,7 +2531,8 @@ const SelectCategory = ({
   intlLabel,
   name,
   onChange,
-  value = void 0
+  value = void 0,
+  isCreating
 }) => {
   const { formatMessage } = reactIntl.useIntl();
   const { allComponentsCategories } = useDataManager();
@@ -2514,7 +2548,17 @@ const SelectCategory = ({
   };
   return /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Field.Root, { error: errorMessage, name, children: [
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Label, { children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx(designSystem.Combobox, { onChange: handleChange, onCreateOption: handleCreateOption, value, creatable: true, children: categories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.ComboboxOption, { value: category, children: category }, category)) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      designSystem.Combobox,
+      {
+        disabled: !isCreating,
+        onChange: handleChange,
+        onCreateOption: handleCreateOption,
+        value,
+        creatable: true,
+        children: categories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(designSystem.ComboboxOption, { value: category, children: category }, category))
+      }
+    ),
     /* @__PURE__ */ jsxRuntime.jsx(designSystem.Field.Error, {})
   ] });
 };
@@ -2836,18 +2880,36 @@ const TabForm = ({
           null
         );
         if (input.type === "pushRight") {
-          return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: input.size || 6, children: /* @__PURE__ */ jsxRuntime.jsx("div", {}) }, input.name || key);
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            designSystem.Grid.Item,
+            {
+              col: input.size || 6,
+              direction: "column",
+              alignItems: "stretch",
+              children: /* @__PURE__ */ jsxRuntime.jsx("div", {})
+            },
+            input.name || key
+          );
         }
-        return /* @__PURE__ */ jsxRuntime.jsx(designSystem.Grid.Item, { col: input.size || 6, children: /* @__PURE__ */ jsxRuntime.jsx(
-          MemoizedGenericInput,
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          designSystem.Grid.Item,
           {
-            ...input,
-            ...genericInputProps,
-            error: errorId,
-            onChange,
-            value
-          }
-        ) }, input.name || key);
+            col: input.size || 6,
+            direction: "column",
+            alignItems: "stretch",
+            children: /* @__PURE__ */ jsxRuntime.jsx(
+              MemoizedGenericInput,
+              {
+                ...input,
+                ...genericInputProps,
+                error: errorId,
+                onChange,
+                value
+              }
+            )
+          },
+          input.name || key
+        );
       }) })
     ] }, sectionIndex);
   }) });
@@ -6713,11 +6775,11 @@ const FormModalNavigationProvider = ({ children }) => {
     }
   );
 };
-const ListView$1 = React.lazy(() => Promise.resolve().then(() => require("./ListView-g9V7g_tv.js")));
+const ListView$1 = React.lazy(() => Promise.resolve().then(() => require("./ListView-BSIe0goP.js")));
 const RecursivePath = () => {
   return /* @__PURE__ */ jsxRuntime.jsx(React.Suspense, { fallback: /* @__PURE__ */ jsxRuntime.jsx(strapiAdmin.Page.Loading, {}), children: /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Routes, { children: /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.Route, { path: `/:componentUid`, element: /* @__PURE__ */ jsxRuntime.jsx(ListView$1, {}) }) }) });
 };
-const ListView = React.lazy(() => Promise.resolve().then(() => require("./ListView-g9V7g_tv.js")));
+const ListView = React.lazy(() => Promise.resolve().then(() => require("./ListView-BSIe0goP.js")));
 const App = () => {
   const { formatMessage } = reactIntl.useIntl();
   const title = formatMessage({
@@ -6749,4 +6811,4 @@ exports.getTrad = getTrad;
 exports.index = index;
 exports.useDataManager = useDataManager;
 exports.useFormModalNavigation = useFormModalNavigation;
-//# sourceMappingURL=index-Z-KG7c7n.js.map
+//# sourceMappingURL=index-DbqNgfVI.js.map