@strapi/content-manager 5.61.1 → 5.62.0

package/dist/admin/pages/EditView/components/FormInputs/Component/Input.mjs

@@ -1,65 +1,130 @@
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import * as React from 'react';
-import { useField } from '@strapi/admin/strapi-admin';
-import { Field, Flex, IconButton } from '@strapi/design-system';
-import { Trash } from '@strapi/icons';
+import { useField, useForm } from '@strapi/admin/strapi-admin';
+import { Field, Flex, Badge, Button, IconButton } from '@strapi/design-system';
+import { Duplicate, Trash } from '@strapi/icons';
 import { useIntl } from 'react-intl';
+import { COLLECTION_TYPES } from '../../../../../constants/collections.mjs';
 import { useDocumentContext } from '../../../../../hooks/useDocumentContext.mjs';
 import { getTranslation } from '../../../../../utils/translations.mjs';
 import { transformDocument } from '../../../utils/data.mjs';
 import { createDefaultForm } from '../../../utils/forms.mjs';
+import { ComponentCopyModal } from './ComponentCopyModal.mjs';
+import { useCopiedComponent } from './CopiedComponents.mjs';
 import { Initializer } from './Initializer.mjs';
 import { NonRepeatableComponent as MemoizedNonRepeatableComponent } from './NonRepeatable.mjs';
 import { RepeatableComponent as MemoizedRepeatableComponent } from './Repeatable.mjs';
+import { getSavedComponent, isComponentBlank } from './utils/componentCopy.mjs';
 
 const ComponentInput = ({ label, required, name, attribute, disabled, labelAction, ...props })=>{
     const { formatMessage } = useIntl();
     const field = useField(name);
-    const showResetComponent = !attribute.repeatable && field.value !== undefined && field.value !== null && !disabled;
-    const { currentDocument: { components } } = useDocumentContext('ComponentInput');
+    const [isCopyModalOpen, setIsCopyModalOpen] = React.useState(false);
+    const { isCopied, insertCopy } = useCopiedComponent(name);
+    const { currentDocumentMeta, currentDocument: { components, document } } = useDocumentContext('ComponentInput');
+    // A reference into the document: it only changes when the document is refetched
+    const savedComponent = useForm('ComponentInput', (state)=>getSavedComponent(document, state.values, name));
+    const canCopyFromExisting = currentDocumentMeta.collectionType === COLLECTION_TYPES;
+    const hasComponent = !attribute.repeatable && field.value !== undefined && field.value !== null;
+    const showResetComponent = hasComponent && !disabled;
+    /**
+   * A component that was just added is blank: copying into it fills it. Once it holds content,
+   * copying into it replaces that content and the user is warned.
+   */ const hasContent = hasComponent && !isComponentBlank(field.value, attribute.component, components, savedComponent);
     const handleInitialisationClick = ()=>{
         const schema = components[attribute.component];
         const form = createDefaultForm(schema, components);
         const data = transformDocument(schema, components)(form);
         field.onChange(name, data);
     };
+    /**
+   * The copy replaces the component in place. It has no id, so the inputs holding server data for
+   * the replaced component (relations) drop it, see `RelationsField`.
+   */ const handleCopyComponent = ([componentData])=>{
+        insertCopy(componentData);
+        return true;
+    };
     return /*#__PURE__*/ jsxs(Field.Root, {
         error: field.error,
         required: required,
         children: [
             /*#__PURE__*/ jsxs(Flex, {
                 justifyContent: "space-between",
+                alignItems: "center",
+                gap: 2,
                 children: [
-                    /*#__PURE__*/ jsxs(Field.Label, {
-                        action: labelAction,
+                    /*#__PURE__*/ jsxs(Flex, {
+                        gap: 2,
                         children: [
-                            label,
-                            attribute.repeatable && /*#__PURE__*/ jsxs(Fragment, {
+                            /*#__PURE__*/ jsxs(Field.Label, {
+                                action: labelAction,
                                 children: [
-                                    " (",
-                                    Array.isArray(field.value) ? field.value.length : 0,
-                                    ")"
+                                    label,
+                                    attribute.repeatable && /*#__PURE__*/ jsxs(Fragment, {
+                                        children: [
+                                            " (",
+                                            Array.isArray(field.value) ? field.value.length : 0,
+                                            ")"
+                                        ]
+                                    })
                                 ]
+                            }),
+                            hasComponent && isCopied && /*#__PURE__*/ jsx(Badge, {
+                                variant: "success",
+                                size: "S",
+                                children: formatMessage({
+                                    id: getTranslation('components.Component.copied'),
+                                    defaultMessage: 'Copied'
+                                })
                             })
                         ]
                     }),
-                    showResetComponent && /*#__PURE__*/ jsx(IconButton, {
-                        label: formatMessage({
-                            id: getTranslation('components.reset-entry'),
-                            defaultMessage: 'Reset Entry'
-                        }),
-                        variant: "ghost",
-                        onClick: ()=>{
-                            field.onChange(name, null);
-                        },
-                        children: /*#__PURE__*/ jsx(Trash, {})
+                    showResetComponent && /*#__PURE__*/ jsxs(Flex, {
+                        gap: 1,
+                        children: [
+                            canCopyFromExisting && /*#__PURE__*/ jsx(Button, {
+                                variant: "ghost",
+                                size: "S",
+                                startIcon: /*#__PURE__*/ jsx(Duplicate, {}),
+                                onClick: ()=>setIsCopyModalOpen(true),
+                                children: hasContent ? formatMessage({
+                                    id: getTranslation('components.Component.replace-content'),
+                                    defaultMessage: 'Replace content…'
+                                }) : formatMessage({
+                                    id: getTranslation('components.AddComponentMenu.copy'),
+                                    defaultMessage: 'Use existing content…'
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(IconButton, {
+                                label: formatMessage({
+                                    id: getTranslation('components.reset-entry'),
+                                    defaultMessage: 'Reset Entry'
+                                }),
+                                variant: "ghost",
+                                onClick: ()=>{
+                                    field.onChange(name, null);
+                                },
+                                children: /*#__PURE__*/ jsx(Trash, {})
+                            })
+                        ]
                     })
                 ]
             }),
             !attribute.repeatable && !field.value && /*#__PURE__*/ jsx(Initializer, {
                 disabled: disabled,
                 name: name,
-                onClick: handleInitialisationClick
+                onClick: handleInitialisationClick,
+                onCopyClick: canCopyFromExisting ? ()=>setIsCopyModalOpen(true) : undefined
+            }),
+            !attribute.repeatable && isCopyModalOpen && /*#__PURE__*/ jsx(ComponentCopyModal, {
+                componentUid: attribute.component,
+                fieldLabel: label,
+                mode: "component",
+                onClose: ()=>setIsCopyModalOpen(false),
+                onInsert: handleCopyComponent,
+                replacesContent: hasContent,
+                selection: "single",
+                sourceFieldName: name
             }),
             !attribute.repeatable && field.value ? /*#__PURE__*/ jsx(MemoizedNonRepeatableComponent, {
                 attribute: attribute,
@@ -70,6 +135,7 @@ const ComponentInput = ({ label, required, name, attribute, disabled, labelActio
             }) : null,
             attribute.repeatable && /*#__PURE__*/ jsx(MemoizedRepeatableComponent, {
                 attribute: attribute,
+                label: label,
                 name: name,
                 disabled: disabled,
                 ...props,

package/dist/admin/pages/EditView/components/FormInputs/Component/Input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Input.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { InputProps, useField } from '@strapi/admin/strapi-admin';\nimport { Field, Flex, IconButton } from '@strapi/design-system';\nimport { Trash } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { useDocumentContext } from '../../../../../hooks/useDocumentContext';\nimport { EditFieldLayout } from '../../../../../hooks/useDocumentLayout';\nimport { getTranslation } from '../../../../../utils/translations';\nimport { type AnyData, transformDocument } from '../../../utils/data';\nimport { createDefaultForm } from '../../../utils/forms';\nimport { type InputRendererProps } from '../../InputRenderer';\n\nimport { Initializer } from './Initializer';\nimport { NonRepeatableComponent } from './NonRepeatable';\nimport { RepeatableComponent } from './Repeatable';\n\ninterface ComponentInputProps\n  extends\n    Omit<Extract<EditFieldLayout, { type: 'component' }>, 'size' | 'hint'>,\n    Pick<InputProps, 'hint'> {\n  labelAction?: React.ReactNode;\n  children: (props: InputRendererProps) => React.ReactNode;\n  /**\n   * We need layout to come from the props, and not via a hook, because Content History needs\n   * a way to modify the normal component layout to add hidden fields.\n   */\n  layout: ReadonlyArray<ReadonlyArray<EditFieldLayout>>;\n}\n\nconst ComponentInput = ({\n  label,\n  required,\n  name,\n  attribute,\n  disabled,\n  labelAction,\n  ...props\n}: ComponentInputProps) => {\n  const { formatMessage } = useIntl();\n  const field = useField<AnyData | AnyData[] | null>(name);\n\n  const showResetComponent =\n    !attribute.repeatable && field.value !== undefined && field.value !== null && !disabled;\n\n  const {\n    currentDocument: { components },\n  } = useDocumentContext('ComponentInput');\n\n  const handleInitialisationClick = () => {\n    const schema = components[attribute.component];\n    const form = createDefaultForm(schema, components);\n    const data = transformDocument(schema, components)(form);\n\n    field.onChange(name, data);\n  };\n\n  return (\n    <Field.Root error={field.error} required={required}>\n      <Flex justifyContent=\"space-between\">\n        <Field.Label action={labelAction}>\n          {label}\n          {attribute.repeatable && (\n            <>&nbsp;({Array.isArray(field.value) ? field.value.length : 0})</>\n          )}\n        </Field.Label>\n\n        {showResetComponent && (\n          <IconButton\n            label={formatMessage({\n              id: getTranslation('components.reset-entry'),\n              defaultMessage: 'Reset Entry',\n            })}\n            variant=\"ghost\"\n            onClick={() => {\n              field.onChange(name, null);\n            }}\n          >\n            <Trash />\n          </IconButton>\n        )}\n      </Flex>\n      {/**\n       * if the field isn't repeatable then we display a button to start the field\n       * TODO: should this just live in the `NonRepeatableComponent`?\n       */}\n      {!attribute.repeatable && !field.value && (\n        <Initializer disabled={disabled} name={name} onClick={handleInitialisationClick} />\n      )}\n      {!attribute.repeatable && field.value ? (\n        <NonRepeatableComponent attribute={attribute} name={name} disabled={disabled} {...props}>\n          {props.children}\n        </NonRepeatableComponent>\n      ) : null}\n      {attribute.repeatable && (\n        <RepeatableComponent attribute={attribute} name={name} disabled={disabled} {...props}>\n          {props.children}\n        </RepeatableComponent>\n      )}\n      <Field.Error />\n    </Field.Root>\n  );\n};\n\nconst MemoizedComponentInput = React.memo(ComponentInput);\n\nexport { MemoizedComponentInput as ComponentInput };\nexport type { ComponentInputProps };\n"],"names":["ComponentInput","label","required","name","attribute","disabled","labelAction","props","formatMessage","useIntl","field","useField","showResetComponent","repeatable","value","undefined","currentDocument","components","useDocumentContext","handleInitialisationClick","schema","component","form","createDefaultForm","data","transformDocument","onChange","_jsxs","Field","Root","error","Flex","justifyContent","Label","action","_Fragment","Array","isArray","length","_jsx","IconButton","id","getTranslation","defaultMessage","variant","onClick","Trash","Initializer","NonRepeatableComponent","children","RepeatableComponent","Error","MemoizedComponentInput","React","memo"],"mappings":"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"}
+{"version":3,"file":"Input.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Input.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { InputProps, useField, useForm } from '@strapi/admin/strapi-admin';\nimport { Badge, Button, Field, Flex, IconButton } from '@strapi/design-system';\nimport { Duplicate, Trash } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { COLLECTION_TYPES } from '../../../../../constants/collections';\nimport { useDocumentContext } from '../../../../../hooks/useDocumentContext';\nimport { EditFieldLayout } from '../../../../../hooks/useDocumentLayout';\nimport { getTranslation } from '../../../../../utils/translations';\nimport { type AnyData, transformDocument } from '../../../utils/data';\nimport { createDefaultForm } from '../../../utils/forms';\nimport { type InputRendererProps } from '../../InputRenderer';\n\nimport { ComponentCopyModal } from './ComponentCopyModal';\nimport { useCopiedComponent } from './CopiedComponents';\nimport { Initializer } from './Initializer';\nimport { NonRepeatableComponent } from './NonRepeatable';\nimport { RepeatableComponent } from './Repeatable';\nimport { getSavedComponent, isComponentBlank } from './utils/componentCopy';\n\ninterface ComponentInputProps\n  extends\n    Omit<Extract<EditFieldLayout, { type: 'component' }>, 'size' | 'hint'>,\n    Pick<InputProps, 'hint'> {\n  labelAction?: React.ReactNode;\n  children: (props: InputRendererProps) => React.ReactNode;\n  /**\n   * We need layout to come from the props, and not via a hook, because Content History needs\n   * a way to modify the normal component layout to add hidden fields.\n   */\n  layout: ReadonlyArray<ReadonlyArray<EditFieldLayout>>;\n}\n\nconst ComponentInput = ({\n  label,\n  required,\n  name,\n  attribute,\n  disabled,\n  labelAction,\n  ...props\n}: ComponentInputProps) => {\n  const { formatMessage } = useIntl();\n  const field = useField<AnyData | AnyData[] | null>(name);\n  const [isCopyModalOpen, setIsCopyModalOpen] = React.useState(false);\n  const { isCopied, insertCopy } = useCopiedComponent(name);\n\n  const {\n    currentDocumentMeta,\n    currentDocument: { components, document },\n  } = useDocumentContext('ComponentInput');\n  // A reference into the document: it only changes when the document is refetched\n  const savedComponent = useForm('ComponentInput', (state) =>\n    getSavedComponent(document, state.values, name)\n  );\n  const canCopyFromExisting = currentDocumentMeta.collectionType === COLLECTION_TYPES;\n\n  const hasComponent = !attribute.repeatable && field.value !== undefined && field.value !== null;\n  const showResetComponent = hasComponent && !disabled;\n  /**\n   * A component that was just added is blank: copying into it fills it. Once it holds content,\n   * copying into it replaces that content and the user is warned.\n   */\n  const hasContent =\n    hasComponent && !isComponentBlank(field.value, attribute.component, components, savedComponent);\n\n  const handleInitialisationClick = () => {\n    const schema = components[attribute.component];\n    const form = createDefaultForm(schema, components);\n    const data = transformDocument(schema, components)(form);\n\n    field.onChange(name, data);\n  };\n\n  /**\n   * The copy replaces the component in place. It has no id, so the inputs holding server data for\n   * the replaced component (relations) drop it, see `RelationsField`.\n   */\n  const handleCopyComponent = ([componentData]: AnyData[]) => {\n    insertCopy(componentData);\n\n    return true;\n  };\n\n  return (\n    <Field.Root error={field.error} required={required}>\n      <Flex justifyContent=\"space-between\" alignItems=\"center\" gap={2}>\n        <Flex gap={2}>\n          <Field.Label action={labelAction}>\n            {label}\n            {attribute.repeatable && (\n              <>&nbsp;({Array.isArray(field.value) ? field.value.length : 0})</>\n            )}\n          </Field.Label>\n          {hasComponent && isCopied && (\n            <Badge variant=\"success\" size=\"S\">\n              {formatMessage({\n                id: getTranslation('components.Component.copied'),\n                defaultMessage: 'Copied',\n              })}\n            </Badge>\n          )}\n        </Flex>\n\n        {showResetComponent && (\n          <Flex gap={1}>\n            {canCopyFromExisting && (\n              <Button\n                variant=\"ghost\"\n                size=\"S\"\n                startIcon={<Duplicate />}\n                onClick={() => setIsCopyModalOpen(true)}\n              >\n                {hasContent\n                  ? formatMessage({\n                      id: getTranslation('components.Component.replace-content'),\n                      defaultMessage: 'Replace content…',\n                    })\n                  : formatMessage({\n                      id: getTranslation('components.AddComponentMenu.copy'),\n                      defaultMessage: 'Use existing content…',\n                    })}\n              </Button>\n            )}\n            <IconButton\n              label={formatMessage({\n                id: getTranslation('components.reset-entry'),\n                defaultMessage: 'Reset Entry',\n              })}\n              variant=\"ghost\"\n              onClick={() => {\n                field.onChange(name, null);\n              }}\n            >\n              <Trash />\n            </IconButton>\n          </Flex>\n        )}\n      </Flex>\n      {/**\n       * if the field isn't repeatable then we display a button to start the field\n       * TODO: should this just live in the `NonRepeatableComponent`?\n       */}\n      {!attribute.repeatable && !field.value && (\n        <Initializer\n          disabled={disabled}\n          name={name}\n          onClick={handleInitialisationClick}\n          onCopyClick={canCopyFromExisting ? () => setIsCopyModalOpen(true) : undefined}\n        />\n      )}\n      {!attribute.repeatable && isCopyModalOpen && (\n        <ComponentCopyModal\n          componentUid={attribute.component}\n          fieldLabel={label}\n          mode=\"component\"\n          onClose={() => setIsCopyModalOpen(false)}\n          onInsert={handleCopyComponent}\n          replacesContent={hasContent}\n          selection=\"single\"\n          sourceFieldName={name}\n        />\n      )}\n      {!attribute.repeatable && field.value ? (\n        <NonRepeatableComponent attribute={attribute} name={name} disabled={disabled} {...props}>\n          {props.children}\n        </NonRepeatableComponent>\n      ) : null}\n      {attribute.repeatable && (\n        <RepeatableComponent\n          attribute={attribute}\n          label={label}\n          name={name}\n          disabled={disabled}\n          {...props}\n        >\n          {props.children}\n        </RepeatableComponent>\n      )}\n      <Field.Error />\n    </Field.Root>\n  );\n};\n\nconst MemoizedComponentInput = React.memo(ComponentInput);\n\nexport { MemoizedComponentInput as ComponentInput };\nexport type { ComponentInputProps };\n"],"names":["ComponentInput","label","required","name","attribute","disabled","labelAction","props","formatMessage","useIntl","field","useField","isCopyModalOpen","setIsCopyModalOpen","React","useState","isCopied","insertCopy","useCopiedComponent","currentDocumentMeta","currentDocument","components","document","useDocumentContext","savedComponent","useForm","state","getSavedComponent","values","canCopyFromExisting","collectionType","COLLECTION_TYPES","hasComponent","repeatable","value","undefined","showResetComponent","hasContent","isComponentBlank","component","handleInitialisationClick","schema","form","createDefaultForm","data","transformDocument","onChange","handleCopyComponent","componentData","_jsxs","Field","Root","error","Flex","justifyContent","alignItems","gap","Label","action","_Fragment","Array","isArray","length","_jsx","Badge","variant","size","id","getTranslation","defaultMessage","Button","startIcon","Duplicate","onClick","IconButton","Trash","Initializer","onCopyClick","ComponentCopyModal","componentUid","fieldLabel","mode","onClose","onInsert","replacesContent","selection","sourceFieldName","NonRepeatableComponent","children","RepeatableComponent","Error","MemoizedComponentInput","memo"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/Component/NonRepeatable.js

@@ -29,7 +29,7 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
-const NonRepeatableComponent = ({ attribute, name, children, layout })=>{
+const NonRepeatableComponent = ({ attribute, name, children, layout, disabled })=>{
     const componentId = strapiAdmin.useForm('NonRepeatableComponent', (state)=>objects.getIn(state.values, `${name}.id`));
     const level = ComponentContext.useComponent('NonRepeatableComponent', (state)=>state.level);
     const isNested = level > 0;
@@ -51,12 +51,13 @@ const NonRepeatableComponent = ({ attribute, name, children, layout })=>{
                 attribute: attribute,
                 name: name,
                 layout: layout,
+                disabled: disabled,
                 children: children
             })
         })
     });
 };
-const NonRepeatableComponentFields = /*#__PURE__*/ React__namespace.memo(({ attribute, children, layout, name })=>{
+const NonRepeatableComponentFields = /*#__PURE__*/ React__namespace.memo(({ attribute, children, layout, name, disabled })=>{
     const { formatMessage } = reactIntl.useIntl();
     return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
         direction: "column",
@@ -87,6 +88,8 @@ const NonRepeatableComponentFields = /*#__PURE__*/ React__namespace.memo(({ attr
                         alignItems: "stretch",
                         children: children({
                             ...field,
+                            // Inherit parent disable (e.g. locked non-localized component on a secondary locale)
+                            disabled: field.disabled || disabled,
                             size,
                             label: translatedLabel,
                             name: completeFieldName

package/dist/admin/pages/EditView/components/FormInputs/Component/NonRepeatable.js.map

@@ -1 +1 @@
-{"version":3,"file":"NonRepeatable.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/NonRepeatable.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useForm, useIsMobile } from '@strapi/admin/strapi-admin';\nimport { Box, Flex } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getIn } from '../../../../../utils/objects';\nimport { ResponsiveGridItem, ResponsiveGridRoot } from '../../FormLayout';\nimport { ComponentProvider, useComponent } from '../ComponentContext';\n\nimport type { ComponentInputProps } from './Input';\n\ntype NonRepeatableComponentProps = Omit<ComponentInputProps, 'required' | 'label'>;\n\nconst NonRepeatableComponent = ({\n  attribute,\n  name,\n  children,\n  layout,\n}: NonRepeatableComponentProps) => {\n  const componentId = useForm(\n    'NonRepeatableComponent',\n    (state) => getIn(state.values, `${name}.id`) as number | undefined\n  );\n  const level = useComponent('NonRepeatableComponent', (state) => state.level);\n  const isNested = level > 0;\n  const isMobile = useIsMobile();\n\n  return (\n    <ComponentProvider\n      id={componentId}\n      uid={attribute.component}\n      level={level + 1}\n      type=\"component\"\n    >\n      <Box\n        background={'neutral100'}\n        padding={{ initial: 4, medium: 6 }}\n        hasRadius={isNested}\n        borderColor={isNested || isMobile ? 'neutral200' : undefined}\n      >\n        <NonRepeatableComponentFields attribute={attribute} name={name} layout={layout}>\n          {children}\n        </NonRepeatableComponentFields>\n      </Box>\n    </ComponentProvider>\n  );\n};\n\ninterface NonRepeatableComponentFieldsProps extends Pick<\n  NonRepeatableComponentProps,\n  'attribute' | 'children' | 'layout' | 'name'\n> {}\n\nconst NonRepeatableComponentFields = React.memo(\n  ({ attribute, children, layout, name }: NonRepeatableComponentFieldsProps) => {\n    const { formatMessage } = useIntl();\n\n    return (\n      <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n        {layout.map((row) => {\n          return (\n            <ResponsiveGridRoot\n              gap={{ initial: 3, medium: 4 }}\n              key={row.map((field) => field.name).join('.')}\n            >\n              {row.map(({ size, ...field }) => {\n                /**\n                 * Layouts are built from schemas so they don't understand the complete\n                 * schema tree, for components we append the parent name to the field name\n                 * because this is the structure for the data & permissions also understand\n                 * the nesting involved.\n                 */\n                const completeFieldName = `${name}.${field.name}`;\n\n                const translatedLabel = formatMessage({\n                  id: `content-manager.components.${attribute.component}.${field.name}`,\n                  defaultMessage: field.label,\n                });\n\n                return (\n                  <ResponsiveGridItem\n                    col={size}\n                    key={completeFieldName}\n                    s={12}\n                    xs={12}\n                    direction=\"column\"\n                    alignItems=\"stretch\"\n                  >\n                    {children({\n                      ...field,\n                      size,\n                      label: translatedLabel,\n                      name: completeFieldName,\n                    })}\n                  </ResponsiveGridItem>\n                );\n              })}\n            </ResponsiveGridRoot>\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nNonRepeatableComponentFields.displayName = 'NonRepeatableComponentFields';\n\nconst MemoizedNonRepeatableComponent = React.memo(NonRepeatableComponent);\n\nexport { MemoizedNonRepeatableComponent as NonRepeatableComponent };\nexport type { NonRepeatableComponentProps };\n"],"names":["NonRepeatableComponent","attribute","name","children","layout","componentId","useForm","state","getIn","values","level","useComponent","isNested","isMobile","useIsMobile","_jsx","ComponentProvider","id","uid","component","type","Box","background","padding","initial","medium","hasRadius","borderColor","undefined","NonRepeatableComponentFields","React","memo","formatMessage","useIntl","Flex","direction","alignItems","gap","map","row","ResponsiveGridRoot","size","field","completeFieldName","translatedLabel","defaultMessage","label","ResponsiveGridItem","col","s","xs","join","displayName","MemoizedNonRepeatableComponent"],"mappings":"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"}
+{"version":3,"file":"NonRepeatable.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/NonRepeatable.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useForm, useIsMobile } from '@strapi/admin/strapi-admin';\nimport { Box, Flex } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getIn } from '../../../../../utils/objects';\nimport { ResponsiveGridItem, ResponsiveGridRoot } from '../../FormLayout';\nimport { ComponentProvider, useComponent } from '../ComponentContext';\n\nimport type { ComponentInputProps } from './Input';\n\ntype NonRepeatableComponentProps = Omit<ComponentInputProps, 'required' | 'label'>;\n\nconst NonRepeatableComponent = ({\n  attribute,\n  name,\n  children,\n  layout,\n  disabled,\n}: NonRepeatableComponentProps) => {\n  const componentId = useForm(\n    'NonRepeatableComponent',\n    (state) => getIn(state.values, `${name}.id`) as number | undefined\n  );\n  const level = useComponent('NonRepeatableComponent', (state) => state.level);\n  const isNested = level > 0;\n  const isMobile = useIsMobile();\n\n  return (\n    <ComponentProvider\n      id={componentId}\n      uid={attribute.component}\n      level={level + 1}\n      type=\"component\"\n    >\n      <Box\n        background={'neutral100'}\n        padding={{ initial: 4, medium: 6 }}\n        hasRadius={isNested}\n        borderColor={isNested || isMobile ? 'neutral200' : undefined}\n      >\n        <NonRepeatableComponentFields\n          attribute={attribute}\n          name={name}\n          layout={layout}\n          disabled={disabled}\n        >\n          {children}\n        </NonRepeatableComponentFields>\n      </Box>\n    </ComponentProvider>\n  );\n};\n\ninterface NonRepeatableComponentFieldsProps extends Pick<\n  NonRepeatableComponentProps,\n  'attribute' | 'children' | 'layout' | 'name' | 'disabled'\n> {}\n\nconst NonRepeatableComponentFields = React.memo(\n  ({ attribute, children, layout, name, disabled }: NonRepeatableComponentFieldsProps) => {\n    const { formatMessage } = useIntl();\n\n    return (\n      <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n        {layout.map((row) => {\n          return (\n            <ResponsiveGridRoot\n              gap={{ initial: 3, medium: 4 }}\n              key={row.map((field) => field.name).join('.')}\n            >\n              {row.map(({ size, ...field }) => {\n                /**\n                 * Layouts are built from schemas so they don't understand the complete\n                 * schema tree, for components we append the parent name to the field name\n                 * because this is the structure for the data & permissions also understand\n                 * the nesting involved.\n                 */\n                const completeFieldName = `${name}.${field.name}`;\n\n                const translatedLabel = formatMessage({\n                  id: `content-manager.components.${attribute.component}.${field.name}`,\n                  defaultMessage: field.label,\n                });\n\n                return (\n                  <ResponsiveGridItem\n                    col={size}\n                    key={completeFieldName}\n                    s={12}\n                    xs={12}\n                    direction=\"column\"\n                    alignItems=\"stretch\"\n                  >\n                    {children({\n                      ...field,\n                      // Inherit parent disable (e.g. locked non-localized component on a secondary locale)\n                      disabled: field.disabled || disabled,\n                      size,\n                      label: translatedLabel,\n                      name: completeFieldName,\n                    })}\n                  </ResponsiveGridItem>\n                );\n              })}\n            </ResponsiveGridRoot>\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nNonRepeatableComponentFields.displayName = 'NonRepeatableComponentFields';\n\nconst MemoizedNonRepeatableComponent = React.memo(NonRepeatableComponent);\n\nexport { MemoizedNonRepeatableComponent as NonRepeatableComponent };\nexport type { NonRepeatableComponentProps };\n"],"names":["NonRepeatableComponent","attribute","name","children","layout","disabled","componentId","useForm","state","getIn","values","level","useComponent","isNested","isMobile","useIsMobile","_jsx","ComponentProvider","id","uid","component","type","Box","background","padding","initial","medium","hasRadius","borderColor","undefined","NonRepeatableComponentFields","React","memo","formatMessage","useIntl","Flex","direction","alignItems","gap","map","row","ResponsiveGridRoot","size","field","completeFieldName","translatedLabel","defaultMessage","label","ResponsiveGridItem","col","s","xs","join","displayName","MemoizedNonRepeatableComponent"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/Component/NonRepeatable.mjs

@@ -7,7 +7,7 @@ import { getIn } from '../../../../../utils/objects.mjs';
 import { ResponsiveGridRoot, ResponsiveGridItem } from '../../FormLayout.mjs';
 import { useComponent, ComponentProvider } from '../ComponentContext.mjs';
 
-const NonRepeatableComponent = ({ attribute, name, children, layout })=>{
+const NonRepeatableComponent = ({ attribute, name, children, layout, disabled })=>{
     const componentId = useForm('NonRepeatableComponent', (state)=>getIn(state.values, `${name}.id`));
     const level = useComponent('NonRepeatableComponent', (state)=>state.level);
     const isNested = level > 0;
@@ -29,12 +29,13 @@ const NonRepeatableComponent = ({ attribute, name, children, layout })=>{
                 attribute: attribute,
                 name: name,
                 layout: layout,
+                disabled: disabled,
                 children: children
             })
         })
     });
 };
-const NonRepeatableComponentFields = /*#__PURE__*/ React.memo(({ attribute, children, layout, name })=>{
+const NonRepeatableComponentFields = /*#__PURE__*/ React.memo(({ attribute, children, layout, name, disabled })=>{
     const { formatMessage } = useIntl();
     return /*#__PURE__*/ jsx(Flex, {
         direction: "column",
@@ -65,6 +66,8 @@ const NonRepeatableComponentFields = /*#__PURE__*/ React.memo(({ attribute, chil
                         alignItems: "stretch",
                         children: children({
                             ...field,
+                            // Inherit parent disable (e.g. locked non-localized component on a secondary locale)
+                            disabled: field.disabled || disabled,
                             size,
                             label: translatedLabel,
                             name: completeFieldName

package/dist/admin/pages/EditView/components/FormInputs/Component/NonRepeatable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"NonRepeatable.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/NonRepeatable.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useForm, useIsMobile } from '@strapi/admin/strapi-admin';\nimport { Box, Flex } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getIn } from '../../../../../utils/objects';\nimport { ResponsiveGridItem, ResponsiveGridRoot } from '../../FormLayout';\nimport { ComponentProvider, useComponent } from '../ComponentContext';\n\nimport type { ComponentInputProps } from './Input';\n\ntype NonRepeatableComponentProps = Omit<ComponentInputProps, 'required' | 'label'>;\n\nconst NonRepeatableComponent = ({\n  attribute,\n  name,\n  children,\n  layout,\n}: NonRepeatableComponentProps) => {\n  const componentId = useForm(\n    'NonRepeatableComponent',\n    (state) => getIn(state.values, `${name}.id`) as number | undefined\n  );\n  const level = useComponent('NonRepeatableComponent', (state) => state.level);\n  const isNested = level > 0;\n  const isMobile = useIsMobile();\n\n  return (\n    <ComponentProvider\n      id={componentId}\n      uid={attribute.component}\n      level={level + 1}\n      type=\"component\"\n    >\n      <Box\n        background={'neutral100'}\n        padding={{ initial: 4, medium: 6 }}\n        hasRadius={isNested}\n        borderColor={isNested || isMobile ? 'neutral200' : undefined}\n      >\n        <NonRepeatableComponentFields attribute={attribute} name={name} layout={layout}>\n          {children}\n        </NonRepeatableComponentFields>\n      </Box>\n    </ComponentProvider>\n  );\n};\n\ninterface NonRepeatableComponentFieldsProps extends Pick<\n  NonRepeatableComponentProps,\n  'attribute' | 'children' | 'layout' | 'name'\n> {}\n\nconst NonRepeatableComponentFields = React.memo(\n  ({ attribute, children, layout, name }: NonRepeatableComponentFieldsProps) => {\n    const { formatMessage } = useIntl();\n\n    return (\n      <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n        {layout.map((row) => {\n          return (\n            <ResponsiveGridRoot\n              gap={{ initial: 3, medium: 4 }}\n              key={row.map((field) => field.name).join('.')}\n            >\n              {row.map(({ size, ...field }) => {\n                /**\n                 * Layouts are built from schemas so they don't understand the complete\n                 * schema tree, for components we append the parent name to the field name\n                 * because this is the structure for the data & permissions also understand\n                 * the nesting involved.\n                 */\n                const completeFieldName = `${name}.${field.name}`;\n\n                const translatedLabel = formatMessage({\n                  id: `content-manager.components.${attribute.component}.${field.name}`,\n                  defaultMessage: field.label,\n                });\n\n                return (\n                  <ResponsiveGridItem\n                    col={size}\n                    key={completeFieldName}\n                    s={12}\n                    xs={12}\n                    direction=\"column\"\n                    alignItems=\"stretch\"\n                  >\n                    {children({\n                      ...field,\n                      size,\n                      label: translatedLabel,\n                      name: completeFieldName,\n                    })}\n                  </ResponsiveGridItem>\n                );\n              })}\n            </ResponsiveGridRoot>\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nNonRepeatableComponentFields.displayName = 'NonRepeatableComponentFields';\n\nconst MemoizedNonRepeatableComponent = React.memo(NonRepeatableComponent);\n\nexport { MemoizedNonRepeatableComponent as NonRepeatableComponent };\nexport type { NonRepeatableComponentProps };\n"],"names":["NonRepeatableComponent","attribute","name","children","layout","componentId","useForm","state","getIn","values","level","useComponent","isNested","isMobile","useIsMobile","_jsx","ComponentProvider","id","uid","component","type","Box","background","padding","initial","medium","hasRadius","borderColor","undefined","NonRepeatableComponentFields","React","memo","formatMessage","useIntl","Flex","direction","alignItems","gap","map","row","ResponsiveGridRoot","size","field","completeFieldName","translatedLabel","defaultMessage","label","ResponsiveGridItem","col","s","xs","join","displayName","MemoizedNonRepeatableComponent"],"mappings":"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"}
+{"version":3,"file":"NonRepeatable.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/NonRepeatable.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useForm, useIsMobile } from '@strapi/admin/strapi-admin';\nimport { Box, Flex } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getIn } from '../../../../../utils/objects';\nimport { ResponsiveGridItem, ResponsiveGridRoot } from '../../FormLayout';\nimport { ComponentProvider, useComponent } from '../ComponentContext';\n\nimport type { ComponentInputProps } from './Input';\n\ntype NonRepeatableComponentProps = Omit<ComponentInputProps, 'required' | 'label'>;\n\nconst NonRepeatableComponent = ({\n  attribute,\n  name,\n  children,\n  layout,\n  disabled,\n}: NonRepeatableComponentProps) => {\n  const componentId = useForm(\n    'NonRepeatableComponent',\n    (state) => getIn(state.values, `${name}.id`) as number | undefined\n  );\n  const level = useComponent('NonRepeatableComponent', (state) => state.level);\n  const isNested = level > 0;\n  const isMobile = useIsMobile();\n\n  return (\n    <ComponentProvider\n      id={componentId}\n      uid={attribute.component}\n      level={level + 1}\n      type=\"component\"\n    >\n      <Box\n        background={'neutral100'}\n        padding={{ initial: 4, medium: 6 }}\n        hasRadius={isNested}\n        borderColor={isNested || isMobile ? 'neutral200' : undefined}\n      >\n        <NonRepeatableComponentFields\n          attribute={attribute}\n          name={name}\n          layout={layout}\n          disabled={disabled}\n        >\n          {children}\n        </NonRepeatableComponentFields>\n      </Box>\n    </ComponentProvider>\n  );\n};\n\ninterface NonRepeatableComponentFieldsProps extends Pick<\n  NonRepeatableComponentProps,\n  'attribute' | 'children' | 'layout' | 'name' | 'disabled'\n> {}\n\nconst NonRepeatableComponentFields = React.memo(\n  ({ attribute, children, layout, name, disabled }: NonRepeatableComponentFieldsProps) => {\n    const { formatMessage } = useIntl();\n\n    return (\n      <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n        {layout.map((row) => {\n          return (\n            <ResponsiveGridRoot\n              gap={{ initial: 3, medium: 4 }}\n              key={row.map((field) => field.name).join('.')}\n            >\n              {row.map(({ size, ...field }) => {\n                /**\n                 * Layouts are built from schemas so they don't understand the complete\n                 * schema tree, for components we append the parent name to the field name\n                 * because this is the structure for the data & permissions also understand\n                 * the nesting involved.\n                 */\n                const completeFieldName = `${name}.${field.name}`;\n\n                const translatedLabel = formatMessage({\n                  id: `content-manager.components.${attribute.component}.${field.name}`,\n                  defaultMessage: field.label,\n                });\n\n                return (\n                  <ResponsiveGridItem\n                    col={size}\n                    key={completeFieldName}\n                    s={12}\n                    xs={12}\n                    direction=\"column\"\n                    alignItems=\"stretch\"\n                  >\n                    {children({\n                      ...field,\n                      // Inherit parent disable (e.g. locked non-localized component on a secondary locale)\n                      disabled: field.disabled || disabled,\n                      size,\n                      label: translatedLabel,\n                      name: completeFieldName,\n                    })}\n                  </ResponsiveGridItem>\n                );\n              })}\n            </ResponsiveGridRoot>\n          );\n        })}\n      </Flex>\n    );\n  }\n);\n\nNonRepeatableComponentFields.displayName = 'NonRepeatableComponentFields';\n\nconst MemoizedNonRepeatableComponent = React.memo(NonRepeatableComponent);\n\nexport { MemoizedNonRepeatableComponent as NonRepeatableComponent };\nexport type { NonRepeatableComponentProps };\n"],"names":["NonRepeatableComponent","attribute","name","children","layout","disabled","componentId","useForm","state","getIn","values","level","useComponent","isNested","isMobile","useIsMobile","_jsx","ComponentProvider","id","uid","component","type","Box","background","padding","initial","medium","hasRadius","borderColor","undefined","NonRepeatableComponentFields","React","memo","formatMessage","useIntl","Flex","direction","alignItems","gap","map","row","ResponsiveGridRoot","size","field","completeFieldName","translatedLabel","defaultMessage","label","ResponsiveGridItem","col","s","xs","join","displayName","MemoizedNonRepeatableComponent"],"mappings":"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"}