{"version":3,"file":"ComponentPicker.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/DynamicZone/ComponentPicker.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Flex, Accordion, Typography } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getTranslation } from '../../../../../utils/translations';\n\nimport { ComponentCategory, ComponentCategoryProps } from './ComponentCategory';\n\ninterface ComponentPickerProps {\n  dynamicComponentsByCategory?: Record<string, NonNullable<ComponentCategoryProps['components']>>;\n  isOpen?: boolean;\n  onClickAddComponent: (componentUid: string) => void;\n}\n\nconst ComponentPicker = ({\n  dynamicComponentsByCategory = {},\n  isOpen,\n  onClickAddComponent,\n}: ComponentPickerProps) => {\n  const { formatMessage } = useIntl();\n\n  const handleAddComponentToDz = (componentUid: string) => () => {\n    onClickAddComponent(componentUid);\n  };\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <Box\n      paddingTop={6}\n      paddingBottom={6}\n      paddingLeft={5}\n      paddingRight={5}\n      background=\"neutral0\"\n      shadow=\"tableShadow\"\n      borderColor=\"neutral150\"\n      hasRadius\n    >\n      <Flex justifyContent=\"center\">\n        <Typography fontWeight=\"bold\" textColor=\"neutral600\">\n          {formatMessage({\n            id: getTranslation('components.DynamicZone.ComponentPicker-label'),\n            defaultMessage: 'Pick one component',\n          })}\n        </Typography>\n      </Flex>\n      <Box paddingTop={2}>\n        <Accordion.Root defaultValue={Object.keys(dynamicComponentsByCategory)[0]}>\n          {Object.entries(dynamicComponentsByCategory).map(([category, components], index) => (\n            <ComponentCategory\n              key={category}\n              category={category}\n              components={components}\n              onAddComponent={handleAddComponentToDz}\n              variant={index % 2 === 1 ? 'primary' : 'secondary'}\n            />\n          ))}\n        </Accordion.Root>\n      </Box>\n    </Box>\n  );\n};\n\nexport { ComponentPicker };\nexport type { ComponentPickerProps };\n"],"names":["ComponentPicker","dynamicComponentsByCategory","isOpen","onClickAddComponent","formatMessage","useIntl","handleAddComponentToDz","componentUid","_jsxs","Box","paddingTop","paddingBottom","paddingLeft","paddingRight","background","shadow","borderColor","hasRadius","_jsx","Flex","justifyContent","Typography","fontWeight","textColor","id","getTranslation","defaultMessage","Accordion","Root","defaultValue","Object","keys","entries","map","category","components","index","ComponentCategory","onAddComponent","variant"],"mappings":";;;;;;;AAeMA,MAAAA,eAAAA,GAAkB,CAAC,EACvBC,2BAA8B,GAAA,EAAE,EAChCC,MAAM,EACNC,mBAAmB,EACE,GAAA;IACrB,MAAM,EAAEC,aAAa,EAAE,GAAGC,OAAAA,EAAAA;IAE1B,MAAMC,sBAAAA,GAAyB,CAACC,YAAyB,GAAA,IAAA;YACvDJ,mBAAoBI,CAAAA,YAAAA,CAAAA;AACtB,SAAA;AAEA,IAAA,IAAI,CAACL,MAAQ,EAAA;QACX,OAAO,IAAA;AACT;AAEA,IAAA,qBACEM,IAACC,CAAAA,GAAAA,EAAAA;QACCC,UAAY,EAAA,CAAA;QACZC,aAAe,EAAA,CAAA;QACfC,WAAa,EAAA,CAAA;QACbC,YAAc,EAAA,CAAA;QACdC,UAAW,EAAA,UAAA;QACXC,MAAO,EAAA,aAAA;QACPC,WAAY,EAAA,YAAA;QACZC,SAAS,EAAA,IAAA;;0BAETC,GAACC,CAAAA,IAAAA,EAAAA;gBAAKC,cAAe,EAAA,QAAA;AACnB,gBAAA,QAAA,gBAAAF,GAACG,CAAAA,UAAAA,EAAAA;oBAAWC,UAAW,EAAA,MAAA;oBAAOC,SAAU,EAAA,YAAA;8BACrCnB,aAAc,CAAA;AACboB,wBAAAA,EAAAA,EAAIC,cAAe,CAAA,8CAAA,CAAA;wBACnBC,cAAgB,EAAA;AAClB,qBAAA;;;0BAGJR,GAACT,CAAAA,GAAAA,EAAAA;gBAAIC,UAAY,EAAA,CAAA;wCACfQ,GAAA,CAACS,UAAUC,IAAI,EAAA;AAACC,oBAAAA,YAAAA,EAAcC,MAAOC,CAAAA,IAAI,CAAC9B,2BAAAA,CAA4B,CAAC,CAAE,CAAA;8BACtE6B,MAAOE,CAAAA,OAAO,CAAC/B,2BAAAA,CAAAA,CAA6BgC,GAAG,CAAC,CAAC,CAACC,QAAUC,EAAAA,UAAAA,CAAW,EAAEC,KAAAA,iBACxElB,GAACmB,CAAAA,iBAAAA,EAAAA;4BAECH,QAAUA,EAAAA,QAAAA;4BACVC,UAAYA,EAAAA,UAAAA;4BACZG,cAAgBhC,EAAAA,sBAAAA;4BAChBiC,OAASH,EAAAA,KAAAA,GAAQ,CAAM,KAAA,CAAA,GAAI,SAAY,GAAA;AAJlCF,yBAAAA,EAAAA,QAAAA,CAAAA;;;;;AAWnB;;;;"}