@strapi/content-manager 5.61.0 → 5.62.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"CopiedComponents.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/CopiedComponents.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { createContext, useField, useForm } from '@strapi/admin/strapi-admin';\nimport { generateNKeysBetween } from 'fractional-indexing';\nimport toPath from 'lodash/toPath';\n\nimport { getIn, isInteger, isObject } from '../../../../../utils/objects';\n\nimport type { AnyData } from '../../../utils/data';\n\n/* -------------------------------------------------------------------------------------------------\n * Key paths\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * A component is identified by the temp keys of the rows leading to it, not by their indexes:\n * `blocks.[a1].dishes.[a0]`. Rows keep their key when they're reordered, so the identity survives\n * a move, and it's gone with the row when the row is deleted.\n */\nconst KEY_SEGMENT = /^\\[(.+)\\]$/;\n\nconst getTempKey = (row: unknown): string | undefined =>\n  isObject(row) && typeof row.__temp_key__ === 'string' ? row.__temp_key__ : undefined;\n\n/**\n * @description Turns the name of a field into its key path: `blocks.1.dishes` becomes\n * `blocks.[a1].dishes`, `a1` being the temp key of the second block.\n */\nconst getFieldKeyPath = (values: unknown, name: string): string => {\n  const segments = toPath(name);\n\n  return segments\n    .map((segment, position) => {\n      if (!isInteger(segment)) {\n        return segment;\n      }\n\n      const key = getTempKey(getIn(values, segments.slice(0, position + 1)));\n\n      return `[${key ?? segment}]`;\n    })\n    .join('.');\n};\n\nconst getComponentKeyPath = (fieldKeyPath: string, tempKey: string) =>\n  `${fieldKeyPath}.[${tempKey}]`;\n\n/**\n * @description Returns the component at the given key path, if the form still holds it.\n */\nconst getComponentAt = (values: unknown, keyPath: string): unknown => {\n  let current: unknown = values;\n\n  for (const segment of keyPath.split('.')) {\n    const keyMatch = KEY_SEGMENT.exec(segment);\n\n    if (keyMatch) {\n      current = Array.isArray(current)\n        ? current.find((row) => getTempKey(row) === keyMatch[1])\n        : undefined;\n    } else {\n      current = isObject(current) ? current[segment] : undefined;\n    }\n\n    if (current === undefined || current === null) {\n      return undefined;\n    }\n  }\n\n  return current;\n};\n\n/**\n * @description Tells whether the form still holds the component at the given key path.\n */\nconst hasComponentAt = (values: unknown, keyPath: string): boolean =>\n  getComponentAt(values, keyPath) !== undefined;\n\n/* -------------------------------------------------------------------------------------------------\n * Copy marker\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * Set on the components put in the form by a copy. Key paths aren't enough to recognise them:\n * \"Fill in from another locale\" replaces the values with rows that reuse the same temp keys\n * (`a0`, `a1`…), so a copy's key path can point to a component that wasn't copied. Editing a field\n * clones the objects on its path with `lodash/clone`, which keeps symbol keys, while values that\n * replace the component don't carry the marker. Symbol keys aren't serialised, so the marker never\n * reaches the API.\n */\nconst COPIED = Symbol('copied');\n\nconst withCopyMarker = (item: AnyData): AnyData => ({ ...item, [COPIED]: true });\n\n/**\n * @description Tells whether the form still holds, at the given key path, the component that was\n * copied there.\n */\nconst hasCopyAt = (values: unknown, keyPath: string): boolean => {\n  const component = getComponentAt(values, keyPath);\n\n  return isObject(component) && (component as Record<symbol, unknown>)[COPIED] === true;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * CopiedComponentsProvider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface CopiedComponentsContextValue {\n  /**\n   * The key paths of the components copied from another entry since the form was last saved.\n   */\n  copiedPaths: string[];\n  markCopied: (keyPaths: string[]) => void;\n}\n\nconst [CopiedComponentsContextProvider, useCopiedComponentsContext] =\n  createContext<CopiedComponentsContextValue>('CopiedComponents');\n\ninterface CopiedComponentsProviderProps {\n  children: React.ReactNode;\n}\n\n/**\n * Remembers which components of the form were copied from another entry, so that they can be\n * flagged until the entry is saved. The state lives above the fields: a field nested in a block\n * is unmounted when the block collapses and would lose it otherwise. Must be rendered in a `Form`.\n */\nconst CopiedComponentsProvider = ({ children }: CopiedComponentsProviderProps) => {\n  const [copiedPaths, setCopiedPaths] = React.useState<string[]>([]);\n  const values = useForm('CopiedComponentsProvider', (state) => state.values);\n  const isFormModified = useForm('CopiedComponentsProvider', (state) => state.modified);\n\n  // Saving the entry, or undoing every change, clears the flags.\n  React.useEffect(() => {\n    if (!isFormModified) {\n      setCopiedPaths((paths) => (paths.length > 0 ? [] : paths));\n    }\n  }, [isFormModified]);\n\n  // A copied component that's removed or replaced (e.g. by \"Fill in from another locale\") drops its\n  // flag, so that a component put at the same key path can't inherit it.\n  React.useEffect(() => {\n    setCopiedPaths((paths) => {\n      const kept = paths.filter((path) => hasCopyAt(values, path));\n\n      return kept.length === paths.length ? paths : kept;\n    });\n  }, [values]);\n\n  const markCopied = React.useCallback((keyPaths: string[]) => {\n    setCopiedPaths((paths) => {\n      const added = keyPaths.filter((keyPath) => !paths.includes(keyPath));\n\n      return added.length > 0 ? [...paths, ...added] : paths;\n    });\n  }, []);\n\n  return (\n    <CopiedComponentsContextProvider copiedPaths={copiedPaths} markCopied={markCopied}>\n      {children}\n    </CopiedComponentsContextProvider>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * useCopiedComponents\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @description Inserts copied components in a repeatable component or a dynamic zone field and\n * tells which of its rows are copies. Without a `CopiedComponentsProvider` the copies are still\n * inserted, they're just not flagged.\n */\nconst useCopiedComponents = (name: string) => {\n  const copiedPaths = useCopiedComponentsContext(\n    'useCopiedComponents',\n    (state) => state.copiedPaths,\n    false\n  );\n  const markCopied = useCopiedComponentsContext(\n    'useCopiedComponents',\n    (state) => state.markCopied,\n    false\n  );\n  const { value, onChange } = useField<AnyData[] | null>(name);\n  const fieldKeyPath = useForm('useCopiedComponents', (state) =>\n    getFieldKeyPath(state.values, name)\n  );\n\n  const isCopied = React.useCallback(\n    (tempKey: string) => copiedPaths?.includes(getComponentKeyPath(fieldKeyPath, tempKey)) ?? false,\n    [copiedPaths, fieldKeyPath]\n  );\n\n  /**\n   * The rows are added with their keys already set, so the copies are flagged by key rather than\n   * recognised among the rows that appear next.\n   */\n  const insertCopies = React.useCallback(\n    (items: AnyData[]) => {\n      const rows = Array.isArray(value) ? value : [];\n      const lastKey =\n        rows\n          .map(getTempKey)\n          .filter((key): key is string => key !== undefined && key !== '')\n          .sort()\n          .pop() ?? null;\n      const keys = generateNKeysBetween(lastKey, null, items.length);\n\n      onChange(name, [\n        ...rows,\n        ...items.map((item, index) => withCopyMarker({ ...item, __temp_key__: keys[index] })),\n      ]);\n      markCopied?.(keys.map((key) => getComponentKeyPath(fieldKeyPath, key)));\n    },\n    [fieldKeyPath, markCopied, name, onChange, value]\n  );\n\n  return { isCopied, insertCopies };\n};\n\n/* -------------------------------------------------------------------------------------------------\n * useCopiedComponent\n * -----------------------------------------------------------------------------------------------*/\n\n/**\n * @description Puts a copied component in a non-repeatable component field and tells whether the\n * field holds a copy. The flag is set on the field itself: resetting the field drops it, so a\n * component added afterwards isn't flagged. Without a `CopiedComponentsProvider` the copy is still\n * put in place, it's just not flagged.\n */\nconst useCopiedComponent = (name: string) => {\n  const copiedPaths = useCopiedComponentsContext(\n    'useCopiedComponent',\n    (state) => state.copiedPaths,\n    false\n  );\n  const markCopied = useCopiedComponentsContext(\n    'useCopiedComponent',\n    (state) => state.markCopied,\n    false\n  );\n  const { onChange } = useField<AnyData | null>(name);\n  const fieldKeyPath = useForm('useCopiedComponent', (state) =>\n    getFieldKeyPath(state.values, name)\n  );\n\n  const isCopied = copiedPaths?.includes(fieldKeyPath) ?? false;\n\n  const insertCopy = React.useCallback(\n    (item: AnyData) => {\n      onChange(name, withCopyMarker(item));\n      markCopied?.([fieldKeyPath]);\n    },\n    [fieldKeyPath, markCopied, name, onChange]\n  );\n\n  return { isCopied, insertCopy };\n};\n\nexport {\n  CopiedComponentsProvider,\n  useCopiedComponents,\n  useCopiedComponent,\n  getFieldKeyPath,\n  hasComponentAt,\n};\nexport type { CopiedComponentsProviderProps };\n"],"names":["KEY_SEGMENT","getTempKey","row","isObject","__temp_key__","undefined","getFieldKeyPath","values","name","segments","toPath","map","segment","position","isInteger","key","getIn","slice","join","getComponentKeyPath","fieldKeyPath","tempKey","getComponentAt","keyPath","current","split","keyMatch","exec","Array","isArray","find","COPIED","Symbol","withCopyMarker","item","hasCopyAt","component","CopiedComponentsContextProvider","useCopiedComponentsContext","createContext","CopiedComponentsProvider","children","copiedPaths","setCopiedPaths","React","useState","useForm","state","isFormModified","modified","useEffect","paths","length","kept","filter","path","markCopied","useCallback","keyPaths","added","includes","_jsx","useCopiedComponents","value","onChange","useField","isCopied","insertCopies","items","rows","lastKey","sort","pop","keys","generateNKeysBetween","index","useCopiedComponent","insertCopy"],"mappings":"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"}

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

@@ -6,54 +6,97 @@ var strapiAdmin = require('@strapi/admin/strapi-admin');
 var designSystem = require('@strapi/design-system');
 var Icons = require('@strapi/icons');
 var reactIntl = require('react-intl');
+var styledComponents = require('styled-components');
 var translations = require('../../../../../utils/translations.js');
+var AddComponentMenu = require('./AddComponentMenu.js');
 
-const Initializer = ({ disabled, name, onClick })=>{
+const Initializer = ({ disabled, name, onClick, onCopyClick })=>{
     const { formatMessage } = reactIntl.useIntl();
     const field = strapiAdmin.useField(name);
-    return /*#__PURE__*/ jsxRuntime.jsx(jsxRuntime.Fragment, {
-        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
-            tag: "button",
-            background: disabled ? 'neutral150' : 'neutral100',
-            borderColor: field.error ? 'danger600' : 'neutral200',
-            hasRadius: true,
-            disabled: disabled,
-            onClick: onClick,
-            paddingTop: 9,
-            paddingBottom: 9,
-            type: "button",
-            style: {
-                cursor: disabled ? 'not-allowed' : 'pointer'
-            },
-            children: /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
-                direction: "column",
-                gap: 2,
-                children: [
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-                        justifyContent: "center",
-                        color: disabled ? 'neutral500' : 'primary600',
-                        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.PlusCircle, {
-                            width: "3.2rem",
-                            height: "3.2rem"
-                        })
-                    }),
-                    /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
-                        justifyContent: "center",
-                        children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                            textColor: disabled ? 'neutral600' : 'primary600',
-                            variant: "pi",
-                            fontWeight: "bold",
-                            children: formatMessage({
-                                id: translations.getTranslation('components.empty-repeatable'),
-                                defaultMessage: 'No entry yet. Click to add one.'
-                            })
-                        })
-                    })
-                ]
+    const content = /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+        tag: "span",
+        direction: "column",
+        gap: 2,
+        alignItems: "center",
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+                tag: "span",
+                justifyContent: "center",
+                color: disabled ? 'neutral500' : 'primary600',
+                children: /*#__PURE__*/ jsxRuntime.jsx(Icons.PlusCircle, {
+                    width: "3.2rem",
+                    height: "3.2rem"
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                tag: "span",
+                textColor: disabled ? 'neutral600' : 'primary600',
+                variant: "pi",
+                fontWeight: "bold",
+                children: formatMessage({
+                    id: translations.getTranslation('components.empty-repeatable'),
+                    defaultMessage: 'No entry yet. Click to add one.'
+                })
             })
-        })
+        ]
+    });
+    if (onCopyClick) {
+        return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Menu.Root, {
+            children: [
+                /*#__PURE__*/ jsxRuntime.jsx(InitializerMenuTrigger, {
+                    disabled: disabled,
+                    endIcon: null,
+                    $hasError: !!field.error,
+                    children: content
+                }),
+                /*#__PURE__*/ jsxRuntime.jsx(AddComponentMenu.AddComponentMenuContent, {
+                    kind: "entry",
+                    onAddEmpty: ()=>onClick?.(),
+                    onCopy: onCopyClick
+                })
+            ]
+        });
+    }
+    return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+        tag: "button",
+        background: disabled ? 'neutral150' : 'neutral100',
+        borderColor: field.error ? 'danger600' : 'neutral200',
+        hasRadius: true,
+        disabled: disabled,
+        onClick: onClick,
+        paddingTop: 9,
+        paddingBottom: 9,
+        type: "button",
+        style: {
+            cursor: disabled ? 'not-allowed' : 'pointer'
+        },
+        children: content
     });
 };
+/**
+ * The menu trigger is a button of the design system, restyled as the placeholder box.
+ */ const InitializerMenuTrigger = styledComponents.styled(designSystem.Menu.Trigger)`
+  && {
+    width: 100%;
+    height: auto;
+    padding: ${({ theme })=>theme.spaces[9]} 0;
+    border: 1px solid
+      ${({ theme, $hasError })=>$hasError ? theme.colors.danger600 : theme.colors.neutral200};
+    border-radius: ${({ theme })=>theme.borderRadius};
+    background: ${({ theme })=>theme.colors.neutral100};
+  }
+
+  &&:not([disabled]):hover,
+  &&[data-state='open'] {
+    border-color: ${({ theme })=>theme.colors.primary200};
+    background: ${({ theme })=>theme.colors.primary100};
+  }
+
+  &&[disabled] {
+    background: ${({ theme })=>theme.colors.neutral150};
+    cursor: not-allowed;
+  }
+`;
 
 exports.Initializer = Initializer;
 //# sourceMappingURL=Initializer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Initializer.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Initializer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, Typography } from '@strapi/design-system';\nimport { PlusCircle } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\ninterface InitializerProps {\n  disabled?: boolean;\n  name: string;\n  onClick?: React.MouseEventHandler<HTMLButtonElement> & React.MouseEventHandler<HTMLDivElement>;\n}\n\nconst Initializer = ({ disabled, name, onClick }: InitializerProps) => {\n  const { formatMessage } = useIntl();\n\n  const field = useField(name);\n\n  return (\n    <>\n      <Box\n        tag=\"button\"\n        background={disabled ? 'neutral150' : 'neutral100'}\n        borderColor={field.error ? 'danger600' : 'neutral200'}\n        hasRadius\n        disabled={disabled}\n        onClick={onClick}\n        paddingTop={9}\n        paddingBottom={9}\n        type=\"button\"\n        style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n      >\n        <Flex direction=\"column\" gap={2}>\n          <Flex justifyContent=\"center\" color={disabled ? 'neutral500' : 'primary600'}>\n            <PlusCircle width=\"3.2rem\" height=\"3.2rem\" />\n          </Flex>\n          <Flex justifyContent=\"center\">\n            <Typography\n              textColor={disabled ? 'neutral600' : 'primary600'}\n              variant=\"pi\"\n              fontWeight=\"bold\"\n            >\n              {formatMessage({\n                id: getTranslation('components.empty-repeatable'),\n                defaultMessage: 'No entry yet. Click to add one.',\n              })}\n            </Typography>\n          </Flex>\n        </Flex>\n      </Box>\n    </>\n  );\n};\n\nexport { Initializer };\nexport type { InitializerProps };\n"],"names":["Initializer","disabled","name","onClick","formatMessage","useIntl","field","useField","_jsx","_Fragment","Box","tag","background","borderColor","error","hasRadius","paddingTop","paddingBottom","type","style","cursor","_jsxs","Flex","direction","gap","justifyContent","color","PlusCircle","width","height","Typography","textColor","variant","fontWeight","id","getTranslation","defaultMessage"],"mappings":";;;;;;;;;;AAeA,MAAMA,WAAAA,GAAc,CAAC,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,OAAO,EAAoB,GAAA;IAChE,MAAM,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;AAE1B,IAAA,MAAMC,QAAQC,oBAAAA,CAASL,IAAAA,CAAAA;IAEvB,qBACEM,cAAA,CAAAC,mBAAA,EAAA;AACE,QAAA,QAAA,gBAAAD,cAAA,CAACE,gBAAAA,EAAAA;YACCC,GAAAA,EAAI,QAAA;AACJC,YAAAA,UAAAA,EAAYX,WAAW,YAAA,GAAe,YAAA;YACtCY,WAAAA,EAAaP,KAAAA,CAAMQ,KAAK,GAAG,WAAA,GAAc,YAAA;YACzCC,SAAS,EAAA,IAAA;YACTd,QAAAA,EAAUA,QAAAA;YACVE,OAAAA,EAASA,OAAAA;YACTa,UAAAA,EAAY,CAAA;YACZC,aAAAA,EAAe,CAAA;YACfC,IAAAA,EAAK,QAAA;YACLC,KAAAA,EAAO;AAAEC,gBAAAA,MAAAA,EAAQnB,WAAW,aAAA,GAAgB;AAAU,aAAA;AAEtD,YAAA,QAAA,gBAAAoB,eAAA,CAACC,iBAAAA,EAAAA;gBAAKC,SAAAA,EAAU,QAAA;gBAASC,GAAAA,EAAK,CAAA;;kCAC5BhB,cAAA,CAACc,iBAAAA,EAAAA;wBAAKG,cAAAA,EAAe,QAAA;AAASC,wBAAAA,KAAAA,EAAOzB,WAAW,YAAA,GAAe,YAAA;AAC7D,wBAAA,QAAA,gBAAAO,cAAA,CAACmB,gBAAAA,EAAAA;4BAAWC,KAAAA,EAAM,QAAA;4BAASC,MAAAA,EAAO;;;kCAEpCrB,cAAA,CAACc,iBAAAA,EAAAA;wBAAKG,cAAAA,EAAe,QAAA;AACnB,wBAAA,QAAA,gBAAAjB,cAAA,CAACsB,uBAAAA,EAAAA;AACCC,4BAAAA,SAAAA,EAAW9B,WAAW,YAAA,GAAe,YAAA;4BACrC+B,OAAAA,EAAQ,IAAA;4BACRC,UAAAA,EAAW,MAAA;sCAEV7B,aAAAA,CAAc;AACb8B,gCAAAA,EAAAA,EAAIC,2BAAAA,CAAe,6BAAA,CAAA;gCACnBC,cAAAA,EAAgB;AAClB,6BAAA;;;;;;;AAOd;;;;"}
+{"version":3,"file":"Initializer.js","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Initializer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, Menu, Typography } from '@strapi/design-system';\nimport { PlusCircle } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\nimport { AddComponentMenuContent } from './AddComponentMenu';\n\ninterface InitializerProps {\n  disabled?: boolean;\n  name: string;\n  onClick?: () => void;\n  /**\n   * When set, clicking the placeholder offers to start with an empty component or to copy\n   * existing content, instead of adding an empty component right away.\n   */\n  onCopyClick?: () => void;\n}\n\nconst Initializer = ({ disabled, name, onClick, onCopyClick }: InitializerProps) => {\n  const { formatMessage } = useIntl();\n\n  const field = useField(name);\n\n  const content = (\n    <Flex tag=\"span\" direction=\"column\" gap={2} alignItems=\"center\">\n      <Flex tag=\"span\" justifyContent=\"center\" color={disabled ? 'neutral500' : 'primary600'}>\n        <PlusCircle width=\"3.2rem\" height=\"3.2rem\" />\n      </Flex>\n      <Typography\n        tag=\"span\"\n        textColor={disabled ? 'neutral600' : 'primary600'}\n        variant=\"pi\"\n        fontWeight=\"bold\"\n      >\n        {formatMessage({\n          id: getTranslation('components.empty-repeatable'),\n          defaultMessage: 'No entry yet. Click to add one.',\n        })}\n      </Typography>\n    </Flex>\n  );\n\n  if (onCopyClick) {\n    return (\n      <Menu.Root>\n        <InitializerMenuTrigger disabled={disabled} endIcon={null} $hasError={!!field.error}>\n          {content}\n        </InitializerMenuTrigger>\n        <AddComponentMenuContent kind=\"entry\" onAddEmpty={() => onClick?.()} onCopy={onCopyClick} />\n      </Menu.Root>\n    );\n  }\n\n  return (\n    <Box\n      tag=\"button\"\n      background={disabled ? 'neutral150' : 'neutral100'}\n      borderColor={field.error ? 'danger600' : 'neutral200'}\n      hasRadius\n      disabled={disabled}\n      onClick={onClick}\n      paddingTop={9}\n      paddingBottom={9}\n      type=\"button\"\n      style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n    >\n      {content}\n    </Box>\n  );\n};\n\n/**\n * The menu trigger is a button of the design system, restyled as the placeholder box.\n */\nconst InitializerMenuTrigger = styled(Menu.Trigger)<{ $hasError?: boolean }>`\n  && {\n    width: 100%;\n    height: auto;\n    padding: ${({ theme }) => theme.spaces[9]} 0;\n    border: 1px solid\n      ${({ theme, $hasError }) => ($hasError ? theme.colors.danger600 : theme.colors.neutral200)};\n    border-radius: ${({ theme }) => theme.borderRadius};\n    background: ${({ theme }) => theme.colors.neutral100};\n  }\n\n  &&:not([disabled]):hover,\n  &&[data-state='open'] {\n    border-color: ${({ theme }) => theme.colors.primary200};\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &&[disabled] {\n    background: ${({ theme }) => theme.colors.neutral150};\n    cursor: not-allowed;\n  }\n`;\n\nexport { Initializer };\nexport type { InitializerProps };\n"],"names":["Initializer","disabled","name","onClick","onCopyClick","formatMessage","useIntl","field","useField","content","_jsxs","Flex","tag","direction","gap","alignItems","_jsx","justifyContent","color","PlusCircle","width","height","Typography","textColor","variant","fontWeight","id","getTranslation","defaultMessage","Menu","Root","InitializerMenuTrigger","endIcon","$hasError","error","AddComponentMenuContent","kind","onAddEmpty","onCopy","Box","background","borderColor","hasRadius","paddingTop","paddingBottom","type","style","cursor","styled","Trigger","theme","spaces","colors","danger600","neutral200","borderRadius","neutral100","primary200","primary100","neutral150"],"mappings":"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"}

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

@@ -1,57 +1,100 @@
-import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react';
 import { useField } from '@strapi/admin/strapi-admin';
-import { Box, Flex, Typography } from '@strapi/design-system';
+import { Menu, Flex, Typography, Box } from '@strapi/design-system';
 import { PlusCircle } from '@strapi/icons';
 import { useIntl } from 'react-intl';
+import { styled } from 'styled-components';
 import { getTranslation } from '../../../../../utils/translations.mjs';
+import { AddComponentMenuContent } from './AddComponentMenu.mjs';
 
-const Initializer = ({ disabled, name, onClick })=>{
+const Initializer = ({ disabled, name, onClick, onCopyClick })=>{
     const { formatMessage } = useIntl();
     const field = useField(name);
-    return /*#__PURE__*/ jsx(Fragment, {
-        children: /*#__PURE__*/ jsx(Box, {
-            tag: "button",
-            background: disabled ? 'neutral150' : 'neutral100',
-            borderColor: field.error ? 'danger600' : 'neutral200',
-            hasRadius: true,
-            disabled: disabled,
-            onClick: onClick,
-            paddingTop: 9,
-            paddingBottom: 9,
-            type: "button",
-            style: {
-                cursor: disabled ? 'not-allowed' : 'pointer'
-            },
-            children: /*#__PURE__*/ jsxs(Flex, {
-                direction: "column",
-                gap: 2,
-                children: [
-                    /*#__PURE__*/ jsx(Flex, {
-                        justifyContent: "center",
-                        color: disabled ? 'neutral500' : 'primary600',
-                        children: /*#__PURE__*/ jsx(PlusCircle, {
-                            width: "3.2rem",
-                            height: "3.2rem"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(Flex, {
-                        justifyContent: "center",
-                        children: /*#__PURE__*/ jsx(Typography, {
-                            textColor: disabled ? 'neutral600' : 'primary600',
-                            variant: "pi",
-                            fontWeight: "bold",
-                            children: formatMessage({
-                                id: getTranslation('components.empty-repeatable'),
-                                defaultMessage: 'No entry yet. Click to add one.'
-                            })
-                        })
-                    })
-                ]
+    const content = /*#__PURE__*/ jsxs(Flex, {
+        tag: "span",
+        direction: "column",
+        gap: 2,
+        alignItems: "center",
+        children: [
+            /*#__PURE__*/ jsx(Flex, {
+                tag: "span",
+                justifyContent: "center",
+                color: disabled ? 'neutral500' : 'primary600',
+                children: /*#__PURE__*/ jsx(PlusCircle, {
+                    width: "3.2rem",
+                    height: "3.2rem"
+                })
+            }),
+            /*#__PURE__*/ jsx(Typography, {
+                tag: "span",
+                textColor: disabled ? 'neutral600' : 'primary600',
+                variant: "pi",
+                fontWeight: "bold",
+                children: formatMessage({
+                    id: getTranslation('components.empty-repeatable'),
+                    defaultMessage: 'No entry yet. Click to add one.'
+                })
             })
-        })
+        ]
+    });
+    if (onCopyClick) {
+        return /*#__PURE__*/ jsxs(Menu.Root, {
+            children: [
+                /*#__PURE__*/ jsx(InitializerMenuTrigger, {
+                    disabled: disabled,
+                    endIcon: null,
+                    $hasError: !!field.error,
+                    children: content
+                }),
+                /*#__PURE__*/ jsx(AddComponentMenuContent, {
+                    kind: "entry",
+                    onAddEmpty: ()=>onClick?.(),
+                    onCopy: onCopyClick
+                })
+            ]
+        });
+    }
+    return /*#__PURE__*/ jsx(Box, {
+        tag: "button",
+        background: disabled ? 'neutral150' : 'neutral100',
+        borderColor: field.error ? 'danger600' : 'neutral200',
+        hasRadius: true,
+        disabled: disabled,
+        onClick: onClick,
+        paddingTop: 9,
+        paddingBottom: 9,
+        type: "button",
+        style: {
+            cursor: disabled ? 'not-allowed' : 'pointer'
+        },
+        children: content
     });
 };
+/**
+ * The menu trigger is a button of the design system, restyled as the placeholder box.
+ */ const InitializerMenuTrigger = styled(Menu.Trigger)`
+  && {
+    width: 100%;
+    height: auto;
+    padding: ${({ theme })=>theme.spaces[9]} 0;
+    border: 1px solid
+      ${({ theme, $hasError })=>$hasError ? theme.colors.danger600 : theme.colors.neutral200};
+    border-radius: ${({ theme })=>theme.borderRadius};
+    background: ${({ theme })=>theme.colors.neutral100};
+  }
+
+  &&:not([disabled]):hover,
+  &&[data-state='open'] {
+    border-color: ${({ theme })=>theme.colors.primary200};
+    background: ${({ theme })=>theme.colors.primary100};
+  }
+
+  &&[disabled] {
+    background: ${({ theme })=>theme.colors.neutral150};
+    cursor: not-allowed;
+  }
+`;
 
 export { Initializer };
 //# sourceMappingURL=Initializer.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"Initializer.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Initializer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, Typography } from '@strapi/design-system';\nimport { PlusCircle } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\ninterface InitializerProps {\n  disabled?: boolean;\n  name: string;\n  onClick?: React.MouseEventHandler<HTMLButtonElement> & React.MouseEventHandler<HTMLDivElement>;\n}\n\nconst Initializer = ({ disabled, name, onClick }: InitializerProps) => {\n  const { formatMessage } = useIntl();\n\n  const field = useField(name);\n\n  return (\n    <>\n      <Box\n        tag=\"button\"\n        background={disabled ? 'neutral150' : 'neutral100'}\n        borderColor={field.error ? 'danger600' : 'neutral200'}\n        hasRadius\n        disabled={disabled}\n        onClick={onClick}\n        paddingTop={9}\n        paddingBottom={9}\n        type=\"button\"\n        style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n      >\n        <Flex direction=\"column\" gap={2}>\n          <Flex justifyContent=\"center\" color={disabled ? 'neutral500' : 'primary600'}>\n            <PlusCircle width=\"3.2rem\" height=\"3.2rem\" />\n          </Flex>\n          <Flex justifyContent=\"center\">\n            <Typography\n              textColor={disabled ? 'neutral600' : 'primary600'}\n              variant=\"pi\"\n              fontWeight=\"bold\"\n            >\n              {formatMessage({\n                id: getTranslation('components.empty-repeatable'),\n                defaultMessage: 'No entry yet. Click to add one.',\n              })}\n            </Typography>\n          </Flex>\n        </Flex>\n      </Box>\n    </>\n  );\n};\n\nexport { Initializer };\nexport type { InitializerProps };\n"],"names":["Initializer","disabled","name","onClick","formatMessage","useIntl","field","useField","_jsx","_Fragment","Box","tag","background","borderColor","error","hasRadius","paddingTop","paddingBottom","type","style","cursor","_jsxs","Flex","direction","gap","justifyContent","color","PlusCircle","width","height","Typography","textColor","variant","fontWeight","id","getTranslation","defaultMessage"],"mappings":";;;;;;;;AAeA,MAAMA,WAAAA,GAAc,CAAC,EAAEC,QAAQ,EAAEC,IAAI,EAAEC,OAAO,EAAoB,GAAA;IAChE,MAAM,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;AAE1B,IAAA,MAAMC,QAAQC,QAAAA,CAASL,IAAAA,CAAAA;IAEvB,qBACEM,GAAA,CAAAC,QAAA,EAAA;AACE,QAAA,QAAA,gBAAAD,GAAA,CAACE,GAAAA,EAAAA;YACCC,GAAAA,EAAI,QAAA;AACJC,YAAAA,UAAAA,EAAYX,WAAW,YAAA,GAAe,YAAA;YACtCY,WAAAA,EAAaP,KAAAA,CAAMQ,KAAK,GAAG,WAAA,GAAc,YAAA;YACzCC,SAAS,EAAA,IAAA;YACTd,QAAAA,EAAUA,QAAAA;YACVE,OAAAA,EAASA,OAAAA;YACTa,UAAAA,EAAY,CAAA;YACZC,aAAAA,EAAe,CAAA;YACfC,IAAAA,EAAK,QAAA;YACLC,KAAAA,EAAO;AAAEC,gBAAAA,MAAAA,EAAQnB,WAAW,aAAA,GAAgB;AAAU,aAAA;AAEtD,YAAA,QAAA,gBAAAoB,IAAA,CAACC,IAAAA,EAAAA;gBAAKC,SAAAA,EAAU,QAAA;gBAASC,GAAAA,EAAK,CAAA;;kCAC5BhB,GAAA,CAACc,IAAAA,EAAAA;wBAAKG,cAAAA,EAAe,QAAA;AAASC,wBAAAA,KAAAA,EAAOzB,WAAW,YAAA,GAAe,YAAA;AAC7D,wBAAA,QAAA,gBAAAO,GAAA,CAACmB,UAAAA,EAAAA;4BAAWC,KAAAA,EAAM,QAAA;4BAASC,MAAAA,EAAO;;;kCAEpCrB,GAAA,CAACc,IAAAA,EAAAA;wBAAKG,cAAAA,EAAe,QAAA;AACnB,wBAAA,QAAA,gBAAAjB,GAAA,CAACsB,UAAAA,EAAAA;AACCC,4BAAAA,SAAAA,EAAW9B,WAAW,YAAA,GAAe,YAAA;4BACrC+B,OAAAA,EAAQ,IAAA;4BACRC,UAAAA,EAAW,MAAA;sCAEV7B,aAAAA,CAAc;AACb8B,gCAAAA,EAAAA,EAAIC,cAAAA,CAAe,6BAAA,CAAA;gCACnBC,cAAAA,EAAgB;AAClB,6BAAA;;;;;;;AAOd;;;;"}
+{"version":3,"file":"Initializer.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Component/Initializer.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { useField } from '@strapi/admin/strapi-admin';\nimport { Box, Flex, Menu, Typography } from '@strapi/design-system';\nimport { PlusCircle } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\nimport { AddComponentMenuContent } from './AddComponentMenu';\n\ninterface InitializerProps {\n  disabled?: boolean;\n  name: string;\n  onClick?: () => void;\n  /**\n   * When set, clicking the placeholder offers to start with an empty component or to copy\n   * existing content, instead of adding an empty component right away.\n   */\n  onCopyClick?: () => void;\n}\n\nconst Initializer = ({ disabled, name, onClick, onCopyClick }: InitializerProps) => {\n  const { formatMessage } = useIntl();\n\n  const field = useField(name);\n\n  const content = (\n    <Flex tag=\"span\" direction=\"column\" gap={2} alignItems=\"center\">\n      <Flex tag=\"span\" justifyContent=\"center\" color={disabled ? 'neutral500' : 'primary600'}>\n        <PlusCircle width=\"3.2rem\" height=\"3.2rem\" />\n      </Flex>\n      <Typography\n        tag=\"span\"\n        textColor={disabled ? 'neutral600' : 'primary600'}\n        variant=\"pi\"\n        fontWeight=\"bold\"\n      >\n        {formatMessage({\n          id: getTranslation('components.empty-repeatable'),\n          defaultMessage: 'No entry yet. Click to add one.',\n        })}\n      </Typography>\n    </Flex>\n  );\n\n  if (onCopyClick) {\n    return (\n      <Menu.Root>\n        <InitializerMenuTrigger disabled={disabled} endIcon={null} $hasError={!!field.error}>\n          {content}\n        </InitializerMenuTrigger>\n        <AddComponentMenuContent kind=\"entry\" onAddEmpty={() => onClick?.()} onCopy={onCopyClick} />\n      </Menu.Root>\n    );\n  }\n\n  return (\n    <Box\n      tag=\"button\"\n      background={disabled ? 'neutral150' : 'neutral100'}\n      borderColor={field.error ? 'danger600' : 'neutral200'}\n      hasRadius\n      disabled={disabled}\n      onClick={onClick}\n      paddingTop={9}\n      paddingBottom={9}\n      type=\"button\"\n      style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n    >\n      {content}\n    </Box>\n  );\n};\n\n/**\n * The menu trigger is a button of the design system, restyled as the placeholder box.\n */\nconst InitializerMenuTrigger = styled(Menu.Trigger)<{ $hasError?: boolean }>`\n  && {\n    width: 100%;\n    height: auto;\n    padding: ${({ theme }) => theme.spaces[9]} 0;\n    border: 1px solid\n      ${({ theme, $hasError }) => ($hasError ? theme.colors.danger600 : theme.colors.neutral200)};\n    border-radius: ${({ theme }) => theme.borderRadius};\n    background: ${({ theme }) => theme.colors.neutral100};\n  }\n\n  &&:not([disabled]):hover,\n  &&[data-state='open'] {\n    border-color: ${({ theme }) => theme.colors.primary200};\n    background: ${({ theme }) => theme.colors.primary100};\n  }\n\n  &&[disabled] {\n    background: ${({ theme }) => theme.colors.neutral150};\n    cursor: not-allowed;\n  }\n`;\n\nexport { Initializer };\nexport type { InitializerProps };\n"],"names":["Initializer","disabled","name","onClick","onCopyClick","formatMessage","useIntl","field","useField","content","_jsxs","Flex","tag","direction","gap","alignItems","_jsx","justifyContent","color","PlusCircle","width","height","Typography","textColor","variant","fontWeight","id","getTranslation","defaultMessage","Menu","Root","InitializerMenuTrigger","endIcon","$hasError","error","AddComponentMenuContent","kind","onAddEmpty","onCopy","Box","background","borderColor","hasRadius","paddingTop","paddingBottom","type","style","cursor","styled","Trigger","theme","spaces","colors","danger600","neutral200","borderRadius","neutral100","primary200","primary100","neutral150"],"mappings":"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"}

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

@@ -6,13 +6,17 @@ var strapiAdmin = require('@strapi/admin/strapi-admin');
 var designSystem = require('@strapi/design-system');
 var Icons = require('@strapi/icons');
 var reactIntl = require('react-intl');
+var collections = require('../../../../../constants/collections.js');
 var useDocumentContext = require('../../../../../hooks/useDocumentContext.js');
 var translations = require('../../../../../utils/translations.js');
 var data = require('../../../utils/data.js');
 var forms = require('../../../utils/forms.js');
+var ComponentCopyModal = require('./ComponentCopyModal.js');
+var CopiedComponents = require('./CopiedComponents.js');
 var Initializer = require('./Initializer.js');
 var NonRepeatable = require('./NonRepeatable.js');
 var Repeatable = require('./Repeatable.js');
+var componentCopy = require('./utils/componentCopy.js');
 
 function _interopNamespace(e) {
   if (e && e.__esModule) return e;
@@ -37,51 +41,112 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
 const ComponentInput = ({ label, required, name, attribute, disabled, labelAction, ...props })=>{
     const { formatMessage } = reactIntl.useIntl();
     const field = strapiAdmin.useField(name);
-    const showResetComponent = !attribute.repeatable && field.value !== undefined && field.value !== null && !disabled;
-    const { currentDocument: { components } } = useDocumentContext.useDocumentContext('ComponentInput');
+    const [isCopyModalOpen, setIsCopyModalOpen] = React__namespace.useState(false);
+    const { isCopied, insertCopy } = CopiedComponents.useCopiedComponent(name);
+    const { currentDocumentMeta, currentDocument: { components, document } } = useDocumentContext.useDocumentContext('ComponentInput');
+    // A reference into the document: it only changes when the document is refetched
+    const savedComponent = strapiAdmin.useForm('ComponentInput', (state)=>componentCopy.getSavedComponent(document, state.values, name));
+    const canCopyFromExisting = currentDocumentMeta.collectionType === collections.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 && !componentCopy.isComponentBlank(field.value, attribute.component, components, savedComponent);
     const handleInitialisationClick = ()=>{
         const schema = components[attribute.component];
         const form = forms.createDefaultForm(schema, components);
         const data$1 = data.transformDocument(schema, components)(form);
         field.onChange(name, data$1);
     };
+    /**
+   * 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__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
         error: field.error,
         required: required,
         children: [
             /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
                 justifyContent: "space-between",
+                alignItems: "center",
+                gap: 2,
                 children: [
-                    /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Label, {
-                        action: labelAction,
+                    /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                        gap: 2,
                         children: [
-                            label,
-                            attribute.repeatable && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+                            /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Label, {
+                                action: labelAction,
                                 children: [
-                                    " (",
-                                    Array.isArray(field.value) ? field.value.length : 0,
-                                    ")"
+                                    label,
+                                    attribute.repeatable && /*#__PURE__*/ jsxRuntime.jsxs(jsxRuntime.Fragment, {
+                                        children: [
+                                            " (",
+                                            Array.isArray(field.value) ? field.value.length : 0,
+                                            ")"
+                                        ]
+                                    })
                                 ]
+                            }),
+                            hasComponent && isCopied && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Badge, {
+                                variant: "success",
+                                size: "S",
+                                children: formatMessage({
+                                    id: translations.getTranslation('components.Component.copied'),
+                                    defaultMessage: 'Copied'
+                                })
                             })
                         ]
                     }),
-                    showResetComponent && /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
-                        label: formatMessage({
-                            id: translations.getTranslation('components.reset-entry'),
-                            defaultMessage: 'Reset Entry'
-                        }),
-                        variant: "ghost",
-                        onClick: ()=>{
-                            field.onChange(name, null);
-                        },
-                        children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Trash, {})
+                    showResetComponent && /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                        gap: 1,
+                        children: [
+                            canCopyFromExisting && /*#__PURE__*/ jsxRuntime.jsx(designSystem.Button, {
+                                variant: "ghost",
+                                size: "S",
+                                startIcon: /*#__PURE__*/ jsxRuntime.jsx(Icons.Duplicate, {}),
+                                onClick: ()=>setIsCopyModalOpen(true),
+                                children: hasContent ? formatMessage({
+                                    id: translations.getTranslation('components.Component.replace-content'),
+                                    defaultMessage: 'Replace content…'
+                                }) : formatMessage({
+                                    id: translations.getTranslation('components.AddComponentMenu.copy'),
+                                    defaultMessage: 'Use existing content…'
+                                })
+                            }),
+                            /*#__PURE__*/ jsxRuntime.jsx(designSystem.IconButton, {
+                                label: formatMessage({
+                                    id: translations.getTranslation('components.reset-entry'),
+                                    defaultMessage: 'Reset Entry'
+                                }),
+                                variant: "ghost",
+                                onClick: ()=>{
+                                    field.onChange(name, null);
+                                },
+                                children: /*#__PURE__*/ jsxRuntime.jsx(Icons.Trash, {})
+                            })
+                        ]
                     })
                 ]
             }),
             !attribute.repeatable && !field.value && /*#__PURE__*/ jsxRuntime.jsx(Initializer.Initializer, {
                 disabled: disabled,
                 name: name,
-                onClick: handleInitialisationClick
+                onClick: handleInitialisationClick,
+                onCopyClick: canCopyFromExisting ? ()=>setIsCopyModalOpen(true) : undefined
+            }),
+            !attribute.repeatable && isCopyModalOpen && /*#__PURE__*/ jsxRuntime.jsx(ComponentCopyModal.ComponentCopyModal, {
+                componentUid: attribute.component,
+                fieldLabel: label,
+                mode: "component",
+                onClose: ()=>setIsCopyModalOpen(false),
+                onInsert: handleCopyComponent,
+                replacesContent: hasContent,
+                selection: "single",
+                sourceFieldName: name
             }),
             !attribute.repeatable && field.value ? /*#__PURE__*/ jsxRuntime.jsx(NonRepeatable.NonRepeatableComponent, {
                 attribute: attribute,
@@ -92,6 +157,7 @@ const ComponentInput = ({ label, required, name, attribute, disabled, labelActio
             }) : null,
             attribute.repeatable && /*#__PURE__*/ jsxRuntime.jsx(Repeatable.RepeatableComponent, {
                 attribute: attribute,
+                label: label,
                 name: name,
                 disabled: disabled,
                 ...props,

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","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.js","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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"}