@strapi/upload 5.48.0 → 5.49.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/admin/ai/components/AIAssetCard.js +3 -2
- package/dist/admin/ai/components/AIAssetCard.js.map +1 -1
- package/dist/admin/ai/components/AIUploadModal.js +3 -2
- package/dist/admin/ai/components/AIUploadModal.js.map +1 -1
- package/dist/admin/components/AssetCard/UploadingAssetCard.js +3 -2
- package/dist/admin/components/AssetCard/UploadingAssetCard.js.map +1 -1
- package/dist/admin/components/AssetCard/VideoAssetCard.js +3 -2
- package/dist/admin/components/AssetCard/VideoAssetCard.js.map +1 -1
- package/dist/admin/components/AssetDialog/AssetDialog.js +3 -2
- package/dist/admin/components/AssetDialog/AssetDialog.js.map +1 -1
- package/dist/admin/components/AssetDialog/BrowseStep/Filters.js +3 -2
- package/dist/admin/components/AssetDialog/BrowseStep/Filters.js.map +1 -1
- package/dist/admin/components/AssetDialog/BrowseStep/PaginationFooter/Pagination.js +3 -2
- package/dist/admin/components/AssetDialog/BrowseStep/PaginationFooter/Pagination.js.map +1 -1
- package/dist/admin/components/AssetDialog/BrowseStep/SearchAsset/SearchAsset.js +3 -2
- package/dist/admin/components/AssetDialog/BrowseStep/SearchAsset/SearchAsset.js.map +1 -1
- package/dist/admin/components/AssetGridList/Draggable.js +3 -2
- package/dist/admin/components/AssetGridList/Draggable.js.map +1 -1
- package/dist/admin/components/Breadcrumbs/CrumbSimpleMenuAsync.js +3 -2
- package/dist/admin/components/Breadcrumbs/CrumbSimpleMenuAsync.js.map +1 -1
- package/dist/admin/components/BulkMoveDialog/BulkMoveDialog.js +5 -1
- package/dist/admin/components/BulkMoveDialog/BulkMoveDialog.js.map +1 -1
- package/dist/admin/components/EditAssetDialog/EditAssetContent.js +8 -4
- package/dist/admin/components/EditAssetDialog/EditAssetContent.js.map +1 -1
- package/dist/admin/components/EditAssetDialog/PreviewBox/AssetPreview.js +7 -3
- package/dist/admin/components/EditAssetDialog/PreviewBox/AssetPreview.js.map +1 -1
- package/dist/admin/components/EditAssetDialog/PreviewBox/PreviewBox.js +7 -3
- package/dist/admin/components/EditAssetDialog/PreviewBox/PreviewBox.js.map +1 -1
- package/dist/admin/components/EditAssetDialog/ReplaceMediaButton.js +3 -2
- package/dist/admin/components/EditAssetDialog/ReplaceMediaButton.js.map +1 -1
- package/dist/admin/components/EditFolderDialog/EditFolderDialog.js +8 -4
- package/dist/admin/components/EditFolderDialog/EditFolderDialog.js.map +1 -1
- package/dist/admin/components/FilterPopover/FilterPopover.js +3 -2
- package/dist/admin/components/FilterPopover/FilterPopover.js.map +1 -1
- package/dist/admin/components/FolderCard/FolderCard/FolderCard.js +3 -2
- package/dist/admin/components/FolderCard/FolderCard/FolderCard.js.map +1 -1
- package/dist/admin/components/MediaLibraryDialog/MediaLibraryDialog.js +5 -3
- package/dist/admin/components/MediaLibraryDialog/MediaLibraryDialog.js.map +1 -1
- package/dist/admin/components/MediaLibraryDialog/MediaLibraryDialog.mjs +2 -1
- package/dist/admin/components/MediaLibraryDialog/MediaLibraryDialog.mjs.map +1 -1
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAssets.js +3 -2
- package/dist/admin/components/MediaLibraryInput/Carousel/CarouselAssets.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/Carousel/EmptyStateAsset.js +3 -2
- package/dist/admin/components/MediaLibraryInput/Carousel/EmptyStateAsset.js.map +1 -1
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.js +3 -2
- package/dist/admin/components/MediaLibraryInput/MediaLibraryInput.js.map +1 -1
- package/dist/admin/components/SelectTree/SelectTree.js +7 -3
- package/dist/admin/components/SelectTree/SelectTree.js.map +1 -1
- package/dist/admin/components/TableList/CellContent.js +5 -1
- package/dist/admin/components/TableList/CellContent.js.map +1 -1
- package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromComputerForm.js +3 -2
- package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromComputerForm.js.map +1 -1
- package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.js +3 -2
- package/dist/admin/components/UploadAssetDialog/AddAssetStep/FromUrlForm.js.map +1 -1
- package/dist/admin/components/UploadAssetDialog/PendingAssetStep/PendingAssetStep.js +3 -2
- package/dist/admin/components/UploadAssetDialog/PendingAssetStep/PendingAssetStep.js.map +1 -1
- package/dist/admin/components/UploadAssetDialog/UploadAssetDialog.js +3 -2
- package/dist/admin/components/UploadAssetDialog/UploadAssetDialog.js.map +1 -1
- package/dist/admin/future/components/Drawer.js +4 -3
- package/dist/admin/future/components/Drawer.js.map +1 -1
- package/dist/admin/future/pages/Assets/AssetsPage.js +29 -4
- package/dist/admin/future/pages/Assets/AssetsPage.js.map +1 -1
- package/dist/admin/future/pages/Assets/AssetsPage.mjs +28 -4
- package/dist/admin/future/pages/Assets/AssetsPage.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetDetailsDrawer.js +3 -2
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetDetailsDrawer.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js +3 -2
- package/dist/admin/future/pages/Assets/components/AssetDetails/AssetPreview.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.js +3 -2
- package/dist/admin/future/pages/Assets/components/DropZone/UploadDropZone.js.map +1 -1
- package/dist/admin/future/pages/Assets/components/FolderTree/FolderTree.js +389 -0
- package/dist/admin/future/pages/Assets/components/FolderTree/FolderTree.js.map +1 -0
- package/dist/admin/future/pages/Assets/components/FolderTree/FolderTree.mjs +387 -0
- package/dist/admin/future/pages/Assets/components/FolderTree/FolderTree.mjs.map +1 -0
- package/dist/admin/future/pages/Assets/components/ImportFromUrlDialog.js +3 -2
- package/dist/admin/future/pages/Assets/components/ImportFromUrlDialog.js.map +1 -1
- package/dist/admin/future/pages/Assets/hooks/useFolderInfo.js +4 -4
- package/dist/admin/future/pages/Assets/hooks/useFolderInfo.js.map +1 -1
- package/dist/admin/future/pages/Assets/hooks/useFolderInfo.mjs +4 -4
- package/dist/admin/future/pages/Assets/hooks/useFolderInfo.mjs.map +1 -1
- package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.js +48 -2
- package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.js.map +1 -1
- package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.mjs +48 -2
- package/dist/admin/future/pages/Assets/hooks/useFolderNavigation.mjs.map +1 -1
- package/dist/admin/future/services/folders.js +28 -1
- package/dist/admin/future/services/folders.js.map +1 -1
- package/dist/admin/future/services/folders.mjs +28 -2
- package/dist/admin/future/services/folders.mjs.map +1 -1
- package/dist/admin/future/utils/files.js +5 -1
- package/dist/admin/future/utils/files.js.map +1 -1
- package/dist/admin/hooks/useAIMetadataJob.js +3 -2
- package/dist/admin/hooks/useAIMetadataJob.js.map +1 -1
- package/dist/admin/hooks/useAssets.js +3 -2
- package/dist/admin/hooks/useAssets.js.map +1 -1
- package/dist/admin/hooks/useCropImg.js +7 -3
- package/dist/admin/hooks/useCropImg.js.map +1 -1
- package/dist/admin/hooks/useEditAsset.js +3 -2
- package/dist/admin/hooks/useEditAsset.js.map +1 -1
- package/dist/admin/hooks/useFolders.js +3 -2
- package/dist/admin/hooks/useFolders.js.map +1 -1
- package/dist/admin/hooks/useModalQueryParams.js +3 -2
- package/dist/admin/hooks/useModalQueryParams.js.map +1 -1
- package/dist/admin/hooks/useSelectionState.js +3 -2
- package/dist/admin/hooks/useSelectionState.js.map +1 -1
- package/dist/admin/hooks/useUpload.js +3 -2
- package/dist/admin/hooks/useUpload.js.map +1 -1
- package/dist/admin/pages/App/App.js +3 -2
- package/dist/admin/pages/App/App.js.map +1 -1
- package/dist/admin/pages/App/ConfigureTheView/ConfigureTheView.js +7 -3
- package/dist/admin/pages/App/ConfigureTheView/ConfigureTheView.js.map +1 -1
- package/dist/admin/pages/App/ConfigureTheView/state/reducer.js +7 -2
- package/dist/admin/pages/App/ConfigureTheView/state/reducer.js.map +1 -1
- package/dist/admin/pages/App/MediaLibrary.js +3 -2
- package/dist/admin/pages/App/MediaLibrary.js.map +1 -1
- package/dist/admin/pages/App/components/BulkMoveButton.js +3 -2
- package/dist/admin/pages/App/components/BulkMoveButton.js.map +1 -1
- package/dist/admin/pages/App/components/Filters.js +3 -2
- package/dist/admin/pages/App/components/Filters.js.map +1 -1
- package/dist/admin/pages/SettingsPage/SettingsPage.js +7 -3
- package/dist/admin/pages/SettingsPage/SettingsPage.js.map +1 -1
- package/dist/admin/pages/SettingsPage/reducer.js +5 -1
- package/dist/admin/pages/SettingsPage/reducer.js.map +1 -1
- package/dist/admin/src/components/MediaLibraryDialog/MediaLibraryDialog.d.ts +2 -1
- package/dist/admin/src/future/pages/Assets/components/FolderTree/FolderTree.d.ts +19 -0
- package/dist/admin/src/future/pages/Assets/hooks/useFolderNavigation.d.ts +2 -0
- package/dist/admin/src/future/services/folders.d.ts +2 -2
- package/dist/admin/translations/en.json.js +10 -1
- package/dist/admin/translations/en.json.js.map +1 -1
- package/dist/admin/translations/en.json.mjs +10 -1
- package/dist/admin/translations/en.json.mjs.map +1 -1
- package/dist/admin/utils/formatBytes.js +5 -1
- package/dist/admin/utils/formatBytes.js.map +1 -1
- package/dist/admin/utils/urlYupSchema.js +3 -2
- package/dist/admin/utils/urlYupSchema.js.map +1 -1
- package/dist/server/controllers/admin-upload.js +11 -4
- package/dist/server/controllers/admin-upload.js.map +1 -1
- package/dist/server/controllers/content-api.js +19 -2
- package/dist/server/controllers/content-api.js.map +1 -1
- package/dist/server/controllers/content-api.mjs +12 -0
- package/dist/server/controllers/content-api.mjs.map +1 -1
- package/dist/server/controllers/utils/find-entity-and-check-permissions.js +7 -3
- package/dist/server/controllers/utils/find-entity-and-check-permissions.js.map +1 -1
- package/dist/server/middlewares/upload.js +7 -2
- package/dist/server/middlewares/upload.js.map +1 -1
- package/dist/server/register.js +9 -4
- package/dist/server/register.js.map +1 -1
- package/dist/server/routes/content-api.js +18 -2
- package/dist/server/routes/content-api.js.map +1 -1
- package/dist/server/routes/content-api.mjs +15 -0
- package/dist/server/routes/content-api.mjs.map +1 -1
- package/dist/server/routes/validation/upload.js +31 -2
- package/dist/server/routes/validation/upload.js.map +1 -1
- package/dist/server/routes/validation/upload.mjs +28 -0
- package/dist/server/routes/validation/upload.mjs.map +1 -1
- package/dist/server/services/file.js +13 -6
- package/dist/server/services/file.js.map +1 -1
- package/dist/server/services/image-manipulation.js +18 -12
- package/dist/server/services/image-manipulation.js.map +1 -1
- package/dist/server/services/provider.js +24 -0
- package/dist/server/services/provider.js.map +1 -1
- package/dist/server/services/provider.mjs +24 -0
- package/dist/server/services/provider.mjs.map +1 -1
- package/dist/server/services/upload.js +187 -31
- package/dist/server/services/upload.js.map +1 -1
- package/dist/server/services/upload.mjs +159 -11
- package/dist/server/services/upload.mjs.map +1 -1
- package/dist/server/src/controllers/content-api.d.ts +1 -0
- package/dist/server/src/controllers/content-api.d.ts.map +1 -1
- package/dist/server/src/controllers/index.d.ts +1 -0
- package/dist/server/src/controllers/index.d.ts.map +1 -1
- package/dist/server/src/index.d.ts +6 -0
- package/dist/server/src/index.d.ts.map +1 -1
- package/dist/server/src/routes/content-api.d.ts.map +1 -1
- package/dist/server/src/routes/validation/upload.d.ts +45 -0
- package/dist/server/src/routes/validation/upload.d.ts.map +1 -1
- package/dist/server/src/services/index.d.ts +5 -0
- package/dist/server/src/services/index.d.ts.map +1 -1
- package/dist/server/src/services/provider.d.ts +2 -1
- package/dist/server/src/services/provider.d.ts.map +1 -1
- package/dist/server/src/services/upload.d.ts +5 -0
- package/dist/server/src/services/upload.d.ts.map +1 -1
- package/dist/server/src/utils/mime-validation.d.ts.map +1 -1
- package/dist/server/utils/mime-validation.js +8 -2
- package/dist/server/utils/mime-validation.js.map +1 -1
- package/dist/server/utils/mime-validation.mjs +9 -3
- package/dist/server/utils/mime-validation.mjs.map +1 -1
- package/package.json +7 -7
|
@@ -10,7 +10,8 @@ var CarouselAsset = require('./CarouselAsset.js');
|
|
|
10
10
|
var CarouselAssetActions = require('./CarouselAssetActions.js');
|
|
11
11
|
var EmptyStateAsset = require('./EmptyStateAsset.js');
|
|
12
12
|
|
|
13
|
-
function
|
|
13
|
+
function _interopNamespace(e) {
|
|
14
|
+
if (e && e.__esModule) return e;
|
|
14
15
|
var n = Object.create(null);
|
|
15
16
|
if (e) {
|
|
16
17
|
Object.keys(e).forEach(function (k) {
|
|
@@ -27,7 +28,7 @@ function _interopNamespaceDefault(e) {
|
|
|
27
28
|
return Object.freeze(n);
|
|
28
29
|
}
|
|
29
30
|
|
|
30
|
-
var React__namespace = /*#__PURE__*/
|
|
31
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
31
32
|
|
|
32
33
|
const CarouselAssets = /*#__PURE__*/ React__namespace.forwardRef(({ assets, disabled = false, error, hint, label, labelAction, onAddAsset, onDeleteAsset, onDeleteAssetFromMediaLibrary, onDropAsset, onEditAsset, onNext, onPrevious, onDoubleClickAsset, required = false, selectedAssetIndex, trackedLocation }, forwardedRef)=>{
|
|
33
34
|
const { formatMessage } = reactIntl.useIntl();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselAssets.js","sources":["../../../../../admin/src/components/MediaLibraryInput/Carousel/CarouselAssets.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CarouselInput, CarouselSlide } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad } from '../../../utils/getTrad';\nimport { EditAssetDialog } from '../../EditAssetDialog/EditAssetContent';\n\nimport { CarouselAsset } from './CarouselAsset';\nimport { CarouselAssetActions } from './CarouselAssetActions';\nimport { EmptyStateAsset } from './EmptyStateAsset';\n\nimport type { File as FileAsset, RawFile } from '../../../../../shared/contracts/files';\n\nexport type FileWithoutIdHash = Omit<FileAsset, 'id' | 'hash'>;\n\ninterface Asset extends Omit<FileAsset, 'folder'> {\n isLocal?: boolean;\n rawFile?: RawFile;\n folder?: FileAsset['folder'] & { id: number };\n}\n\nexport interface CarouselAssetsProps {\n assets: FileAsset[];\n disabled?: boolean;\n error?: string;\n hint?: string;\n label: string;\n labelAction?: React.ReactNode;\n onAddAsset: (asset?: FileAsset, event?: React.MouseEventHandler<HTMLButtonElement>) => void;\n onDeleteAsset: (asset: FileAsset) => void;\n onDeleteAssetFromMediaLibrary: () => void;\n onDropAsset?: (assets: FileWithoutIdHash[]) => void;\n onEditAsset?: (asset: FileAsset) => void;\n onNext: () => void;\n onPrevious: () => void;\n onDoubleClickAsset: (asset: FileAsset, event?: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n required?: boolean;\n selectedAssetIndex: number;\n trackedLocation?: string;\n}\n\nexport const CarouselAssets = React.forwardRef(\n (\n {\n assets,\n disabled = false,\n error,\n hint,\n label,\n labelAction,\n onAddAsset,\n onDeleteAsset,\n onDeleteAssetFromMediaLibrary,\n onDropAsset,\n onEditAsset,\n onNext,\n onPrevious,\n onDoubleClickAsset,\n required = false,\n selectedAssetIndex,\n trackedLocation,\n }: CarouselAssetsProps,\n forwardedRef\n ) => {\n const { formatMessage } = useIntl();\n const [isEditingAsset, setIsEditingAsset] = React.useState(false);\n\n const currentAsset = assets[selectedAssetIndex];\n const canEditMedia = !disabled && onEditAsset;\n\n return (\n <>\n <CarouselInput\n ref={forwardedRef as React.Ref<HTMLDivElement>}\n label={label}\n labelAction={labelAction}\n secondaryLabel={currentAsset?.name}\n selectedSlide={selectedAssetIndex}\n previousLabel={formatMessage({\n id: getTrad('mediaLibraryInput.actions.previousSlide'),\n defaultMessage: 'Previous slide',\n })}\n nextLabel={formatMessage({\n id: getTrad('mediaLibraryInput.actions.nextSlide'),\n defaultMessage: 'Next slide',\n })}\n onNext={onNext}\n onPrevious={onPrevious}\n hint={hint}\n error={error}\n required={required}\n actions={\n currentAsset ? (\n <CarouselAssetActions\n asset={currentAsset}\n onDeleteAsset={disabled ? undefined : onDeleteAsset}\n onAddAsset={disabled ? undefined : onAddAsset}\n onEditAsset={canEditMedia ? () => setIsEditingAsset(true) : undefined}\n />\n ) : undefined\n }\n >\n {assets.length === 0 ? (\n <CarouselSlide\n label={formatMessage(\n {\n id: getTrad('mediaLibraryInput.slideCount'),\n defaultMessage: '{n} of {m} slides',\n },\n { n: 1, m: 1 }\n )}\n >\n <EmptyStateAsset\n disabled={disabled}\n onClick={onAddAsset}\n onDropAsset={onDropAsset!}\n />\n </CarouselSlide>\n ) : (\n assets.map((asset, index) => (\n <CarouselSlide\n key={asset.id}\n label={formatMessage(\n {\n id: getTrad('mediaLibraryInput.slideCount'),\n defaultMessage: '{n} of {m} slides',\n },\n { n: index + 1, m: assets.length }\n )}\n onDoubleClick={(event) => {\n setIsEditingAsset(true);\n onDoubleClickAsset(asset, event);\n }}\n aria-selected={currentAsset.id === asset.id}\n >\n <CarouselAsset asset={asset} />\n </CarouselSlide>\n ))\n )}\n </CarouselInput>\n <EditAssetDialog\n open={isEditingAsset}\n onClose={(editedAsset) => {\n setIsEditingAsset(false);\n\n // The asset has been deleted\n if (editedAsset === null) {\n onDeleteAssetFromMediaLibrary();\n }\n if (editedAsset && typeof editedAsset !== 'boolean') {\n onEditAsset?.(editedAsset);\n }\n }}\n asset={currentAsset as Asset}\n canUpdate\n canCopyLink\n canDownload\n trackedLocation={trackedLocation}\n />\n </>\n );\n }\n);\n"],"names":["CarouselAssets","React","forwardRef","assets","disabled","error","hint","label","labelAction","onAddAsset","onDeleteAsset","onDeleteAssetFromMediaLibrary","onDropAsset","onEditAsset","onNext","onPrevious","onDoubleClickAsset","required","selectedAssetIndex","trackedLocation","forwardedRef","formatMessage","useIntl","isEditingAsset","setIsEditingAsset","useState","currentAsset","canEditMedia","_jsxs","_Fragment","_jsx","CarouselInput","ref","secondaryLabel","name","selectedSlide","previousLabel","id","getTrad","defaultMessage","nextLabel","actions","CarouselAssetActions","asset","undefined","length","CarouselSlide","n","m","EmptyStateAsset","onClick","map","index","onDoubleClick","event","aria-selected","CarouselAsset","EditAssetDialog","open","onClose","editedAsset","canUpdate","canCopyLink","canDownload"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CarouselAssets.js","sources":["../../../../../admin/src/components/MediaLibraryInput/Carousel/CarouselAssets.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { CarouselInput, CarouselSlide } from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\n\nimport { getTrad } from '../../../utils/getTrad';\nimport { EditAssetDialog } from '../../EditAssetDialog/EditAssetContent';\n\nimport { CarouselAsset } from './CarouselAsset';\nimport { CarouselAssetActions } from './CarouselAssetActions';\nimport { EmptyStateAsset } from './EmptyStateAsset';\n\nimport type { File as FileAsset, RawFile } from '../../../../../shared/contracts/files';\n\nexport type FileWithoutIdHash = Omit<FileAsset, 'id' | 'hash'>;\n\ninterface Asset extends Omit<FileAsset, 'folder'> {\n isLocal?: boolean;\n rawFile?: RawFile;\n folder?: FileAsset['folder'] & { id: number };\n}\n\nexport interface CarouselAssetsProps {\n assets: FileAsset[];\n disabled?: boolean;\n error?: string;\n hint?: string;\n label: string;\n labelAction?: React.ReactNode;\n onAddAsset: (asset?: FileAsset, event?: React.MouseEventHandler<HTMLButtonElement>) => void;\n onDeleteAsset: (asset: FileAsset) => void;\n onDeleteAssetFromMediaLibrary: () => void;\n onDropAsset?: (assets: FileWithoutIdHash[]) => void;\n onEditAsset?: (asset: FileAsset) => void;\n onNext: () => void;\n onPrevious: () => void;\n onDoubleClickAsset: (asset: FileAsset, event?: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n required?: boolean;\n selectedAssetIndex: number;\n trackedLocation?: string;\n}\n\nexport const CarouselAssets = React.forwardRef(\n (\n {\n assets,\n disabled = false,\n error,\n hint,\n label,\n labelAction,\n onAddAsset,\n onDeleteAsset,\n onDeleteAssetFromMediaLibrary,\n onDropAsset,\n onEditAsset,\n onNext,\n onPrevious,\n onDoubleClickAsset,\n required = false,\n selectedAssetIndex,\n trackedLocation,\n }: CarouselAssetsProps,\n forwardedRef\n ) => {\n const { formatMessage } = useIntl();\n const [isEditingAsset, setIsEditingAsset] = React.useState(false);\n\n const currentAsset = assets[selectedAssetIndex];\n const canEditMedia = !disabled && onEditAsset;\n\n return (\n <>\n <CarouselInput\n ref={forwardedRef as React.Ref<HTMLDivElement>}\n label={label}\n labelAction={labelAction}\n secondaryLabel={currentAsset?.name}\n selectedSlide={selectedAssetIndex}\n previousLabel={formatMessage({\n id: getTrad('mediaLibraryInput.actions.previousSlide'),\n defaultMessage: 'Previous slide',\n })}\n nextLabel={formatMessage({\n id: getTrad('mediaLibraryInput.actions.nextSlide'),\n defaultMessage: 'Next slide',\n })}\n onNext={onNext}\n onPrevious={onPrevious}\n hint={hint}\n error={error}\n required={required}\n actions={\n currentAsset ? (\n <CarouselAssetActions\n asset={currentAsset}\n onDeleteAsset={disabled ? undefined : onDeleteAsset}\n onAddAsset={disabled ? undefined : onAddAsset}\n onEditAsset={canEditMedia ? () => setIsEditingAsset(true) : undefined}\n />\n ) : undefined\n }\n >\n {assets.length === 0 ? (\n <CarouselSlide\n label={formatMessage(\n {\n id: getTrad('mediaLibraryInput.slideCount'),\n defaultMessage: '{n} of {m} slides',\n },\n { n: 1, m: 1 }\n )}\n >\n <EmptyStateAsset\n disabled={disabled}\n onClick={onAddAsset}\n onDropAsset={onDropAsset!}\n />\n </CarouselSlide>\n ) : (\n assets.map((asset, index) => (\n <CarouselSlide\n key={asset.id}\n label={formatMessage(\n {\n id: getTrad('mediaLibraryInput.slideCount'),\n defaultMessage: '{n} of {m} slides',\n },\n { n: index + 1, m: assets.length }\n )}\n onDoubleClick={(event) => {\n setIsEditingAsset(true);\n onDoubleClickAsset(asset, event);\n }}\n aria-selected={currentAsset.id === asset.id}\n >\n <CarouselAsset asset={asset} />\n </CarouselSlide>\n ))\n )}\n </CarouselInput>\n <EditAssetDialog\n open={isEditingAsset}\n onClose={(editedAsset) => {\n setIsEditingAsset(false);\n\n // The asset has been deleted\n if (editedAsset === null) {\n onDeleteAssetFromMediaLibrary();\n }\n if (editedAsset && typeof editedAsset !== 'boolean') {\n onEditAsset?.(editedAsset);\n }\n }}\n asset={currentAsset as Asset}\n canUpdate\n canCopyLink\n canDownload\n trackedLocation={trackedLocation}\n />\n </>\n );\n }\n);\n"],"names":["CarouselAssets","React","forwardRef","assets","disabled","error","hint","label","labelAction","onAddAsset","onDeleteAsset","onDeleteAssetFromMediaLibrary","onDropAsset","onEditAsset","onNext","onPrevious","onDoubleClickAsset","required","selectedAssetIndex","trackedLocation","forwardedRef","formatMessage","useIntl","isEditingAsset","setIsEditingAsset","useState","currentAsset","canEditMedia","_jsxs","_Fragment","_jsx","CarouselInput","ref","secondaryLabel","name","selectedSlide","previousLabel","id","getTrad","defaultMessage","nextLabel","actions","CarouselAssetActions","asset","undefined","length","CarouselSlide","n","m","EmptyStateAsset","onClick","map","index","onDoubleClick","event","aria-selected","CarouselAsset","EditAssetDialog","open","onClose","editedAsset","canUpdate","canCopyLink","canDownload"],"mappings":"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"}
|
|
@@ -15,7 +15,8 @@ var rawFileToAsset = require('../../../utils/rawFileToAsset.js');
|
|
|
15
15
|
require('../../../utils/typeFromMime.js');
|
|
16
16
|
require('../../../utils/urlYupSchema.js');
|
|
17
17
|
|
|
18
|
-
function
|
|
18
|
+
function _interopNamespace(e) {
|
|
19
|
+
if (e && e.__esModule) return e;
|
|
19
20
|
var n = Object.create(null);
|
|
20
21
|
if (e) {
|
|
21
22
|
Object.keys(e).forEach(function (k) {
|
|
@@ -32,7 +33,7 @@ function _interopNamespaceDefault(e) {
|
|
|
32
33
|
return Object.freeze(n);
|
|
33
34
|
}
|
|
34
35
|
|
|
35
|
-
var React__namespace = /*#__PURE__*/
|
|
36
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
36
37
|
|
|
37
38
|
const TextAlignTypography = styledComponents.styled(designSystem.Typography)`
|
|
38
39
|
align-items: center;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyStateAsset.js","sources":["../../../../../admin/src/components/MediaLibraryInput/Carousel/EmptyStateAsset.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Flex, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { File } from '../../../../../shared/contracts/files';\n\nconst TextAlignTypography = styled(Typography)`\n align-items: center;\n`;\n\ntype FileWithoutIdHash = Omit<File, 'id' | 'hash'>;\n\ninterface EmptyStateAssetProps {\n disabled?: boolean;\n onClick: (asset?: File, event?: React.MouseEventHandler<HTMLButtonElement>) => void;\n onDropAsset: (assets: FileWithoutIdHash[]) => void;\n}\n\nexport const EmptyStateAsset = ({\n disabled = false,\n onClick,\n onDropAsset,\n}: EmptyStateAssetProps) => {\n const { formatMessage } = useIntl();\n const [dragOver, setDragOver] = React.useState(false);\n\n const handleDragEnter = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n setDragOver(true);\n };\n\n const handleDragLeave = (e: React.DragEvent<HTMLButtonElement>) => {\n if (!e.currentTarget.contains(e.relatedTarget as Node)) {\n setDragOver(false);\n }\n };\n\n const handleDragOver = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n };\n\n const handleDrop = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n\n if (e?.dataTransfer?.files) {\n const files = e.dataTransfer.files;\n const assets: FileWithoutIdHash[] = [];\n\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n\n assets.push(asset);\n }\n }\n\n onDropAsset(assets);\n }\n\n setDragOver(false);\n };\n\n return (\n <Flex\n borderStyle={dragOver ? 'dashed' : undefined}\n borderWidth={dragOver ? '1px' : undefined}\n borderColor={dragOver ? 'primary600' : undefined}\n direction=\"column\"\n justifyContent=\"center\"\n alignItems=\"center\"\n height=\"100%\"\n width=\"100%\"\n tag=\"button\"\n type=\"button\"\n disabled={disabled}\n onClick={onClick as unknown as React.MouseEventHandler<HTMLButtonElement>}\n onDragEnter={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDragOver={handleDragOver}\n onDrop={handleDrop}\n gap={3}\n style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n >\n <PicturePlus\n aria-hidden\n width=\"3.2rem\"\n height=\"3.2rem\"\n fill={disabled ? 'neutral400' : 'primary600'}\n />\n <TextAlignTypography\n variant=\"pi\"\n fontWeight=\"bold\"\n textColor=\"neutral600\"\n style={{ textAlign: 'center' }}\n tag=\"span\"\n >\n {formatMessage({\n id: getTrad('mediaLibraryInput.placeholder'),\n defaultMessage: 'Click to add an asset or drag and drop one in this area',\n })}\n </TextAlignTypography>\n </Flex>\n );\n};\n"],"names":["TextAlignTypography","styled","Typography","EmptyStateAsset","disabled","onClick","onDropAsset","formatMessage","useIntl","dragOver","setDragOver","React","useState","handleDragEnter","e","preventDefault","handleDragLeave","currentTarget","contains","relatedTarget","handleDragOver","handleDrop","dataTransfer","files","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","_jsxs","Flex","borderStyle","undefined","borderWidth","borderColor","direction","justifyContent","alignItems","height","width","tag","type","onDragEnter","onDragLeave","onDragOver","onDrop","gap","style","cursor","_jsx","PicturePlus","aria-hidden","fill","variant","fontWeight","textColor","textAlign","id","getTrad","defaultMessage"],"mappings":"
|
|
1
|
+
{"version":3,"file":"EmptyStateAsset.js","sources":["../../../../../admin/src/components/MediaLibraryInput/Carousel/EmptyStateAsset.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Flex, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { File } from '../../../../../shared/contracts/files';\n\nconst TextAlignTypography = styled(Typography)`\n align-items: center;\n`;\n\ntype FileWithoutIdHash = Omit<File, 'id' | 'hash'>;\n\ninterface EmptyStateAssetProps {\n disabled?: boolean;\n onClick: (asset?: File, event?: React.MouseEventHandler<HTMLButtonElement>) => void;\n onDropAsset: (assets: FileWithoutIdHash[]) => void;\n}\n\nexport const EmptyStateAsset = ({\n disabled = false,\n onClick,\n onDropAsset,\n}: EmptyStateAssetProps) => {\n const { formatMessage } = useIntl();\n const [dragOver, setDragOver] = React.useState(false);\n\n const handleDragEnter = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n setDragOver(true);\n };\n\n const handleDragLeave = (e: React.DragEvent<HTMLButtonElement>) => {\n if (!e.currentTarget.contains(e.relatedTarget as Node)) {\n setDragOver(false);\n }\n };\n\n const handleDragOver = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n };\n\n const handleDrop = (e: React.DragEvent<HTMLButtonElement>) => {\n e.preventDefault();\n\n if (e?.dataTransfer?.files) {\n const files = e.dataTransfer.files;\n const assets: FileWithoutIdHash[] = [];\n\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n\n assets.push(asset);\n }\n }\n\n onDropAsset(assets);\n }\n\n setDragOver(false);\n };\n\n return (\n <Flex\n borderStyle={dragOver ? 'dashed' : undefined}\n borderWidth={dragOver ? '1px' : undefined}\n borderColor={dragOver ? 'primary600' : undefined}\n direction=\"column\"\n justifyContent=\"center\"\n alignItems=\"center\"\n height=\"100%\"\n width=\"100%\"\n tag=\"button\"\n type=\"button\"\n disabled={disabled}\n onClick={onClick as unknown as React.MouseEventHandler<HTMLButtonElement>}\n onDragEnter={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDragOver={handleDragOver}\n onDrop={handleDrop}\n gap={3}\n style={{ cursor: disabled ? 'not-allowed' : 'pointer' }}\n >\n <PicturePlus\n aria-hidden\n width=\"3.2rem\"\n height=\"3.2rem\"\n fill={disabled ? 'neutral400' : 'primary600'}\n />\n <TextAlignTypography\n variant=\"pi\"\n fontWeight=\"bold\"\n textColor=\"neutral600\"\n style={{ textAlign: 'center' }}\n tag=\"span\"\n >\n {formatMessage({\n id: getTrad('mediaLibraryInput.placeholder'),\n defaultMessage: 'Click to add an asset or drag and drop one in this area',\n })}\n </TextAlignTypography>\n </Flex>\n );\n};\n"],"names":["TextAlignTypography","styled","Typography","EmptyStateAsset","disabled","onClick","onDropAsset","formatMessage","useIntl","dragOver","setDragOver","React","useState","handleDragEnter","e","preventDefault","handleDragLeave","currentTarget","contains","relatedTarget","handleDragOver","handleDrop","dataTransfer","files","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","_jsxs","Flex","borderStyle","undefined","borderWidth","borderColor","direction","justifyContent","alignItems","height","width","tag","type","onDragEnter","onDragLeave","onDragOver","onDrop","gap","style","cursor","_jsx","PicturePlus","aria-hidden","fill","variant","fontWeight","textColor","textAlign","id","getTrad","defaultMessage"],"mappings":"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"}
|
|
@@ -16,7 +16,8 @@ var EditFolderDialog = require('../EditFolderDialog/EditFolderDialog.js');
|
|
|
16
16
|
var UploadAssetDialog = require('../UploadAssetDialog/UploadAssetDialog.js');
|
|
17
17
|
var CarouselAssets = require('./Carousel/CarouselAssets.js');
|
|
18
18
|
|
|
19
|
-
function
|
|
19
|
+
function _interopNamespace(e) {
|
|
20
|
+
if (e && e.__esModule) return e;
|
|
20
21
|
var n = Object.create(null);
|
|
21
22
|
if (e) {
|
|
22
23
|
Object.keys(e).forEach(function (k) {
|
|
@@ -33,7 +34,7 @@ function _interopNamespaceDefault(e) {
|
|
|
33
34
|
return Object.freeze(n);
|
|
34
35
|
}
|
|
35
36
|
|
|
36
|
-
var React__namespace = /*#__PURE__*/
|
|
37
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
37
38
|
|
|
38
39
|
// TODO: find a better naming convention for the file that was an index file before
|
|
39
40
|
const STEPS = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MediaLibraryInput.js","sources":["../../../../admin/src/components/MediaLibraryInput/MediaLibraryInput.tsx"],"sourcesContent":["// TODO: find a better naming convention for the file that was an index file before\nimport * as React from 'react';\n\nimport { useField, useNotification } from '@strapi/admin/strapi-admin';\nimport { useIntl } from 'react-intl';\n\nimport { AllowedFiles, getAllowedFiles, getTrad } from '../../utils';\nimport { AssetDialog } from '../AssetDialog/AssetDialog';\nimport { EditFolderDialog } from '../EditFolderDialog/EditFolderDialog';\nimport { Asset, UploadAssetDialog } from '../UploadAssetDialog/UploadAssetDialog';\n\nimport { CarouselAssets, CarouselAssetsProps, FileWithoutIdHash } from './Carousel/CarouselAssets';\n\nimport type { File } from '../../../../shared/contracts/files';\n\ntype AllowedTypes = 'files' | 'images' | 'videos' | 'audios';\n\nconst STEPS = {\n AssetSelect: 'SelectAsset',\n AssetUpload: 'UploadAsset',\n FolderCreate: 'FolderCreate',\n};\n\nexport interface MediaLibraryInputProps {\n required?: boolean;\n name: string;\n labelAction?: React.ReactNode;\n label?: string;\n hint?: string;\n disabled?: boolean;\n attribute?: {\n allowedTypes?: AllowedTypes[];\n multiple?: boolean;\n };\n}\n\nexport const MediaLibraryInput = React.forwardRef<CarouselAssetsProps, MediaLibraryInputProps>(\n (\n {\n attribute: { allowedTypes = null, multiple = false } = {},\n label,\n hint,\n disabled = false,\n labelAction = undefined,\n name,\n required = false,\n },\n forwardedRef\n ) => {\n const { formatMessage } = useIntl();\n const { onChange, value, error } = useField(name);\n const [uploadedFiles, setUploadedFiles] = React.useState<Asset[] | File[]>([]);\n const [step, setStep] = React.useState<string | undefined>(undefined);\n const [selectedIndex, setSelectedIndex] = React.useState(0);\n const [droppedAssets, setDroppedAssets] = React.useState<AllowedFiles[]>();\n const [folderId, setFolderId] = React.useState<number | null>(null);\n const { toggleNotification } = useNotification();\n\n React.useEffect(() => {\n // Clear the uploaded files on close\n if (step === undefined) {\n setUploadedFiles([]);\n }\n }, [step]);\n\n let selectedAssets: File[] = [];\n\n if (Array.isArray(value)) {\n selectedAssets = value;\n } else if (value) {\n selectedAssets = [value];\n }\n\n const handleValidation = (nextSelectedAssets: File[]) => {\n const value = multiple ? nextSelectedAssets : nextSelectedAssets[0];\n onChange(name, value);\n setStep(undefined);\n };\n\n const handleDeleteAssetFromMediaLibrary = () => {\n let nextValue;\n\n if (multiple) {\n const nextSelectedAssets = selectedAssets.filter(\n (_, assetIndex) => assetIndex !== selectedIndex\n );\n nextValue = nextSelectedAssets.length > 0 ? nextSelectedAssets : null;\n } else {\n nextValue = null;\n }\n\n const value = nextValue;\n onChange(name, value);\n\n setSelectedIndex(0);\n };\n\n const handleDeleteAsset = (asset: File) => {\n let nextValue;\n\n if (multiple) {\n const nextSelectedAssets = selectedAssets.filter((prevAsset) => prevAsset.id !== asset.id);\n\n nextValue = nextSelectedAssets.length > 0 ? nextSelectedAssets : null;\n } else {\n nextValue = null;\n }\n\n onChange(name, nextValue);\n\n setSelectedIndex(0);\n };\n\n const handleAssetEdit = (asset: File) => {\n const nextSelectedAssets = selectedAssets.map((prevAsset) =>\n prevAsset.id === asset.id ? asset : prevAsset\n );\n\n onChange(name, multiple ? nextSelectedAssets : nextSelectedAssets[0]);\n };\n\n const validateAssetsTypes = (\n assets: FileWithoutIdHash[] | Asset[],\n callback: (assets?: AllowedFiles[], error?: string) => void\n ) => {\n const allowedAssets = getAllowedFiles(allowedTypes, assets as AllowedFiles[]);\n\n if (allowedAssets.length > 0) {\n callback(allowedAssets);\n } else {\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage(\n {\n id: getTrad('input.notification.not-supported'),\n defaultMessage: `You can't upload this type of file.`,\n },\n {\n fileTypes: (allowedTypes ?? []).join(','),\n }\n ),\n });\n }\n };\n\n const handleAssetDrop = (assets: FileWithoutIdHash[]) => {\n validateAssetsTypes(assets, (allowedAssets?: AllowedFiles[]) => {\n setDroppedAssets(allowedAssets);\n setStep(STEPS.AssetUpload);\n });\n };\n\n if (multiple && selectedAssets.length > 0) {\n label = `${label} (${selectedIndex + 1} / ${selectedAssets.length})`;\n }\n\n const handleNext = () => {\n setSelectedIndex((current) => (current < selectedAssets.length - 1 ? current + 1 : 0));\n };\n\n const handlePrevious = () => {\n setSelectedIndex((current) => (current > 0 ? current - 1 : selectedAssets.length - 1));\n };\n\n const handleFilesUploadSucceeded = (uploadedFiles: Asset[] | File[]) => {\n setUploadedFiles((prev) => [...prev, ...uploadedFiles]);\n };\n\n let initiallySelectedAssets = selectedAssets;\n\n if (uploadedFiles.length > 0) {\n const allowedUploadedFiles = getAllowedFiles(allowedTypes, uploadedFiles as AllowedFiles[]);\n\n initiallySelectedAssets = multiple\n ? [...allowedUploadedFiles, ...selectedAssets]\n : [allowedUploadedFiles[0]];\n }\n\n const handleDoubleClickAsset = (asset: File) => {\n handleAssetEdit(asset);\n };\n\n return (\n <>\n <CarouselAssets\n ref={forwardedRef}\n assets={selectedAssets}\n disabled={disabled}\n label={label!}\n labelAction={labelAction}\n onDeleteAsset={handleDeleteAsset}\n onDeleteAssetFromMediaLibrary={handleDeleteAssetFromMediaLibrary}\n onAddAsset={() => setStep(STEPS.AssetSelect)}\n onDropAsset={handleAssetDrop}\n onEditAsset={handleAssetEdit}\n onNext={handleNext}\n onPrevious={handlePrevious}\n onDoubleClickAsset={handleDoubleClickAsset}\n error={error}\n hint={hint}\n required={required}\n selectedAssetIndex={selectedIndex}\n trackedLocation=\"content-manager\"\n />\n\n {step === STEPS.AssetSelect && (\n <AssetDialog\n allowedTypes={allowedTypes as AllowedTypes[]}\n initiallySelectedAssets={initiallySelectedAssets}\n folderId={folderId}\n onClose={() => {\n setStep(undefined);\n setFolderId(null);\n }}\n open={step === STEPS.AssetSelect}\n onValidate={handleValidation}\n multiple={multiple}\n onAddAsset={() => setStep(STEPS.AssetUpload)}\n onAddFolder={() => setStep(STEPS.FolderCreate)}\n onChangeFolder={(folder) => setFolderId(folder)}\n trackedLocation=\"content-manager\"\n />\n )}\n\n {step === STEPS.AssetUpload && (\n <UploadAssetDialog\n open={step === STEPS.AssetUpload}\n onClose={() => setStep(STEPS.AssetSelect)}\n initialAssetsToAdd={droppedAssets as Asset[]}\n addUploadedFiles={handleFilesUploadSucceeded}\n trackedLocation=\"content-manager\"\n folderId={folderId}\n validateAssetsTypes={validateAssetsTypes}\n />\n )}\n\n {step === STEPS.FolderCreate && (\n <EditFolderDialog\n open={step === STEPS.FolderCreate}\n onClose={() => setStep(STEPS.AssetSelect)}\n parentFolderId={folderId}\n />\n )}\n </>\n );\n }\n);\n"],"names":["STEPS","AssetSelect","AssetUpload","FolderCreate","MediaLibraryInput","React","forwardRef","attribute","allowedTypes","multiple","label","hint","disabled","labelAction","undefined","name","required","forwardedRef","formatMessage","useIntl","onChange","value","error","useField","uploadedFiles","setUploadedFiles","useState","step","setStep","selectedIndex","setSelectedIndex","droppedAssets","setDroppedAssets","folderId","setFolderId","toggleNotification","useNotification","useEffect","selectedAssets","Array","isArray","handleValidation","nextSelectedAssets","handleDeleteAssetFromMediaLibrary","nextValue","filter","_","assetIndex","length","handleDeleteAsset","asset","prevAsset","id","handleAssetEdit","map","validateAssetsTypes","assets","callback","allowedAssets","getAllowedFiles","type","timeout","message","getTrad","defaultMessage","fileTypes","join","handleAssetDrop","handleNext","current","handlePrevious","handleFilesUploadSucceeded","prev","initiallySelectedAssets","allowedUploadedFiles","handleDoubleClickAsset","_jsxs","_Fragment","_jsx","CarouselAssets","ref","onDeleteAsset","onDeleteAssetFromMediaLibrary","onAddAsset","onDropAsset","onEditAsset","onNext","onPrevious","onDoubleClickAsset","selectedAssetIndex","trackedLocation","AssetDialog","onClose","open","onValidate","onAddFolder","onChangeFolder","folder","UploadAssetDialog","initialAssetsToAdd","addUploadedFiles","EditFolderDialog","parentFolderId"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MediaLibraryInput.js","sources":["../../../../admin/src/components/MediaLibraryInput/MediaLibraryInput.tsx"],"sourcesContent":["// TODO: find a better naming convention for the file that was an index file before\nimport * as React from 'react';\n\nimport { useField, useNotification } from '@strapi/admin/strapi-admin';\nimport { useIntl } from 'react-intl';\n\nimport { AllowedFiles, getAllowedFiles, getTrad } from '../../utils';\nimport { AssetDialog } from '../AssetDialog/AssetDialog';\nimport { EditFolderDialog } from '../EditFolderDialog/EditFolderDialog';\nimport { Asset, UploadAssetDialog } from '../UploadAssetDialog/UploadAssetDialog';\n\nimport { CarouselAssets, CarouselAssetsProps, FileWithoutIdHash } from './Carousel/CarouselAssets';\n\nimport type { File } from '../../../../shared/contracts/files';\n\ntype AllowedTypes = 'files' | 'images' | 'videos' | 'audios';\n\nconst STEPS = {\n AssetSelect: 'SelectAsset',\n AssetUpload: 'UploadAsset',\n FolderCreate: 'FolderCreate',\n};\n\nexport interface MediaLibraryInputProps {\n required?: boolean;\n name: string;\n labelAction?: React.ReactNode;\n label?: string;\n hint?: string;\n disabled?: boolean;\n attribute?: {\n allowedTypes?: AllowedTypes[];\n multiple?: boolean;\n };\n}\n\nexport const MediaLibraryInput = React.forwardRef<CarouselAssetsProps, MediaLibraryInputProps>(\n (\n {\n attribute: { allowedTypes = null, multiple = false } = {},\n label,\n hint,\n disabled = false,\n labelAction = undefined,\n name,\n required = false,\n },\n forwardedRef\n ) => {\n const { formatMessage } = useIntl();\n const { onChange, value, error } = useField(name);\n const [uploadedFiles, setUploadedFiles] = React.useState<Asset[] | File[]>([]);\n const [step, setStep] = React.useState<string | undefined>(undefined);\n const [selectedIndex, setSelectedIndex] = React.useState(0);\n const [droppedAssets, setDroppedAssets] = React.useState<AllowedFiles[]>();\n const [folderId, setFolderId] = React.useState<number | null>(null);\n const { toggleNotification } = useNotification();\n\n React.useEffect(() => {\n // Clear the uploaded files on close\n if (step === undefined) {\n setUploadedFiles([]);\n }\n }, [step]);\n\n let selectedAssets: File[] = [];\n\n if (Array.isArray(value)) {\n selectedAssets = value;\n } else if (value) {\n selectedAssets = [value];\n }\n\n const handleValidation = (nextSelectedAssets: File[]) => {\n const value = multiple ? nextSelectedAssets : nextSelectedAssets[0];\n onChange(name, value);\n setStep(undefined);\n };\n\n const handleDeleteAssetFromMediaLibrary = () => {\n let nextValue;\n\n if (multiple) {\n const nextSelectedAssets = selectedAssets.filter(\n (_, assetIndex) => assetIndex !== selectedIndex\n );\n nextValue = nextSelectedAssets.length > 0 ? nextSelectedAssets : null;\n } else {\n nextValue = null;\n }\n\n const value = nextValue;\n onChange(name, value);\n\n setSelectedIndex(0);\n };\n\n const handleDeleteAsset = (asset: File) => {\n let nextValue;\n\n if (multiple) {\n const nextSelectedAssets = selectedAssets.filter((prevAsset) => prevAsset.id !== asset.id);\n\n nextValue = nextSelectedAssets.length > 0 ? nextSelectedAssets : null;\n } else {\n nextValue = null;\n }\n\n onChange(name, nextValue);\n\n setSelectedIndex(0);\n };\n\n const handleAssetEdit = (asset: File) => {\n const nextSelectedAssets = selectedAssets.map((prevAsset) =>\n prevAsset.id === asset.id ? asset : prevAsset\n );\n\n onChange(name, multiple ? nextSelectedAssets : nextSelectedAssets[0]);\n };\n\n const validateAssetsTypes = (\n assets: FileWithoutIdHash[] | Asset[],\n callback: (assets?: AllowedFiles[], error?: string) => void\n ) => {\n const allowedAssets = getAllowedFiles(allowedTypes, assets as AllowedFiles[]);\n\n if (allowedAssets.length > 0) {\n callback(allowedAssets);\n } else {\n toggleNotification({\n type: 'danger',\n timeout: 4000,\n message: formatMessage(\n {\n id: getTrad('input.notification.not-supported'),\n defaultMessage: `You can't upload this type of file.`,\n },\n {\n fileTypes: (allowedTypes ?? []).join(','),\n }\n ),\n });\n }\n };\n\n const handleAssetDrop = (assets: FileWithoutIdHash[]) => {\n validateAssetsTypes(assets, (allowedAssets?: AllowedFiles[]) => {\n setDroppedAssets(allowedAssets);\n setStep(STEPS.AssetUpload);\n });\n };\n\n if (multiple && selectedAssets.length > 0) {\n label = `${label} (${selectedIndex + 1} / ${selectedAssets.length})`;\n }\n\n const handleNext = () => {\n setSelectedIndex((current) => (current < selectedAssets.length - 1 ? current + 1 : 0));\n };\n\n const handlePrevious = () => {\n setSelectedIndex((current) => (current > 0 ? current - 1 : selectedAssets.length - 1));\n };\n\n const handleFilesUploadSucceeded = (uploadedFiles: Asset[] | File[]) => {\n setUploadedFiles((prev) => [...prev, ...uploadedFiles]);\n };\n\n let initiallySelectedAssets = selectedAssets;\n\n if (uploadedFiles.length > 0) {\n const allowedUploadedFiles = getAllowedFiles(allowedTypes, uploadedFiles as AllowedFiles[]);\n\n initiallySelectedAssets = multiple\n ? [...allowedUploadedFiles, ...selectedAssets]\n : [allowedUploadedFiles[0]];\n }\n\n const handleDoubleClickAsset = (asset: File) => {\n handleAssetEdit(asset);\n };\n\n return (\n <>\n <CarouselAssets\n ref={forwardedRef}\n assets={selectedAssets}\n disabled={disabled}\n label={label!}\n labelAction={labelAction}\n onDeleteAsset={handleDeleteAsset}\n onDeleteAssetFromMediaLibrary={handleDeleteAssetFromMediaLibrary}\n onAddAsset={() => setStep(STEPS.AssetSelect)}\n onDropAsset={handleAssetDrop}\n onEditAsset={handleAssetEdit}\n onNext={handleNext}\n onPrevious={handlePrevious}\n onDoubleClickAsset={handleDoubleClickAsset}\n error={error}\n hint={hint}\n required={required}\n selectedAssetIndex={selectedIndex}\n trackedLocation=\"content-manager\"\n />\n\n {step === STEPS.AssetSelect && (\n <AssetDialog\n allowedTypes={allowedTypes as AllowedTypes[]}\n initiallySelectedAssets={initiallySelectedAssets}\n folderId={folderId}\n onClose={() => {\n setStep(undefined);\n setFolderId(null);\n }}\n open={step === STEPS.AssetSelect}\n onValidate={handleValidation}\n multiple={multiple}\n onAddAsset={() => setStep(STEPS.AssetUpload)}\n onAddFolder={() => setStep(STEPS.FolderCreate)}\n onChangeFolder={(folder) => setFolderId(folder)}\n trackedLocation=\"content-manager\"\n />\n )}\n\n {step === STEPS.AssetUpload && (\n <UploadAssetDialog\n open={step === STEPS.AssetUpload}\n onClose={() => setStep(STEPS.AssetSelect)}\n initialAssetsToAdd={droppedAssets as Asset[]}\n addUploadedFiles={handleFilesUploadSucceeded}\n trackedLocation=\"content-manager\"\n folderId={folderId}\n validateAssetsTypes={validateAssetsTypes}\n />\n )}\n\n {step === STEPS.FolderCreate && (\n <EditFolderDialog\n open={step === STEPS.FolderCreate}\n onClose={() => setStep(STEPS.AssetSelect)}\n parentFolderId={folderId}\n />\n )}\n </>\n );\n }\n);\n"],"names":["STEPS","AssetSelect","AssetUpload","FolderCreate","MediaLibraryInput","React","forwardRef","attribute","allowedTypes","multiple","label","hint","disabled","labelAction","undefined","name","required","forwardedRef","formatMessage","useIntl","onChange","value","error","useField","uploadedFiles","setUploadedFiles","useState","step","setStep","selectedIndex","setSelectedIndex","droppedAssets","setDroppedAssets","folderId","setFolderId","toggleNotification","useNotification","useEffect","selectedAssets","Array","isArray","handleValidation","nextSelectedAssets","handleDeleteAssetFromMediaLibrary","nextValue","filter","_","assetIndex","length","handleDeleteAsset","asset","prevAsset","id","handleAssetEdit","map","validateAssetsTypes","assets","callback","allowedAssets","getAllowedFiles","type","timeout","message","getTrad","defaultMessage","fileTypes","join","handleAssetDrop","handleNext","current","handlePrevious","handleFilesUploadSucceeded","prev","initiallySelectedAssets","allowedUploadedFiles","handleDoubleClickAsset","_jsxs","_Fragment","_jsx","CarouselAssets","ref","onDeleteAsset","onDeleteAssetFromMediaLibrary","onAddAsset","onDropAsset","onEditAsset","onNext","onPrevious","onDoubleClickAsset","selectedAssetIndex","trackedLocation","AssetDialog","onClose","open","onValidate","onAddFolder","onChangeFolder","folder","UploadAssetDialog","initialAssetsToAdd","addUploadedFiles","EditFolderDialog","parentFolderId"],"mappings":"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"}
|
|
@@ -11,7 +11,10 @@ var flattenTree = require('./utils/flattenTree.js');
|
|
|
11
11
|
var getOpenValues = require('./utils/getOpenValues.js');
|
|
12
12
|
var getValuesToClose = require('./utils/getValuesToClose.js');
|
|
13
13
|
|
|
14
|
-
function
|
|
14
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
|
+
|
|
16
|
+
function _interopNamespace(e) {
|
|
17
|
+
if (e && e.__esModule) return e;
|
|
15
18
|
var n = Object.create(null);
|
|
16
19
|
if (e) {
|
|
17
20
|
Object.keys(e).forEach(function (k) {
|
|
@@ -28,7 +31,8 @@ function _interopNamespaceDefault(e) {
|
|
|
28
31
|
return Object.freeze(n);
|
|
29
32
|
}
|
|
30
33
|
|
|
31
|
-
var React__namespace = /*#__PURE__*/
|
|
34
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
35
|
+
var ReactSelect__default = /*#__PURE__*/_interopDefault(ReactSelect);
|
|
32
36
|
|
|
33
37
|
const hasParent = (option)=>!option.parent;
|
|
34
38
|
const SelectTree = ({ options: defaultOptions, maxDisplayDepth = 5, defaultValue, ...props })=>{
|
|
@@ -90,7 +94,7 @@ const SelectTree = ({ options: defaultOptions, maxDisplayDepth = 5, defaultValue
|
|
|
90
94
|
const Select = ({ components = {}, styles = {}, error, ariaErrorMessage, ...props })=>{
|
|
91
95
|
const theme = styledComponents.useTheme();
|
|
92
96
|
const customStyles = getSelectStyles(theme, error);
|
|
93
|
-
return /*#__PURE__*/ jsxRuntime.jsx(
|
|
97
|
+
return /*#__PURE__*/ jsxRuntime.jsx(ReactSelect__default.default, {
|
|
94
98
|
menuPosition: "fixed",
|
|
95
99
|
components: {
|
|
96
100
|
...components,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectTree.js","sources":["../../../../admin/src/components/SelectTree/SelectTree.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { Cross, CaretDown } from '@strapi/icons';\nimport ReactSelect, {\n components,\n GroupBase,\n StylesConfig,\n ClearIndicatorProps,\n} from 'react-select';\nimport { styled, useTheme, DefaultTheme } from 'styled-components';\n\nimport { Option } from './Option';\nimport { flattenTree, FlattenedNode } from './utils/flattenTree';\nimport { getOpenValues } from './utils/getOpenValues';\nimport { getValuesToClose } from './utils/getValuesToClose';\n\nconst hasParent = (option: FlattenedNode<string | number | null>) => !option.parent;\n\nexport type OptionSelectTree = {\n value: string | number | null;\n label?: string;\n children?: OptionSelectTree[];\n};\n\nexport interface SelectTreeProps<\n Option = unknown,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n IsMulti extends boolean = false,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Group extends GroupBase<Option> = GroupBase<Option>,\n> {\n maxDisplayDepth?: number;\n defaultValue?: {\n value?: string | number | null;\n };\n options: OptionSelectTree[];\n onChange?: (value: Record<string, string | number>) => void;\n name?: string;\n menuPortalTarget?: HTMLElement | null;\n inputId?: string;\n error?: string;\n ariaErrorMessage?: string;\n isDisabled?: boolean;\n disabled?: boolean;\n}\n\nexport const SelectTree = ({\n options: defaultOptions,\n maxDisplayDepth = 5,\n defaultValue,\n ...props\n}: SelectTreeProps) => {\n const flatDefaultOptions = React.useMemo(() => flattenTree(defaultOptions), [defaultOptions]);\n const optionsFiltered = React.useMemo(\n () => flatDefaultOptions.filter(hasParent),\n [flatDefaultOptions]\n );\n const [options, setOptions] = React.useState(optionsFiltered);\n const [openValues, setOpenValues] = React.useState(\n getOpenValues(flatDefaultOptions, defaultValue)\n );\n\n React.useEffect(() => {\n if (openValues.length === 0) {\n setOptions(flatDefaultOptions.filter((option) => option.parent === undefined));\n } else {\n const allOpenValues = openValues.reduce<(string | number | null)[]>((acc, value) => {\n const options = flatDefaultOptions.filter(\n (option) => option.value === value || option.parent === value\n );\n\n options.forEach((option) => {\n const values = getOpenValues(flatDefaultOptions, option);\n acc = [...acc, ...values];\n });\n\n return acc;\n }, []);\n\n const nextOptions = flatDefaultOptions.filter((option) =>\n allOpenValues.includes(option.value)\n );\n\n setOptions(nextOptions);\n }\n }, [openValues, flatDefaultOptions, optionsFiltered]);\n\n const handleToggle = (value: string | number | null) => {\n if (openValues.includes(value)) {\n const valuesToClose = getValuesToClose(flatDefaultOptions, value);\n setOpenValues((prev) => prev.filter((prevData) => !valuesToClose.includes(prevData)));\n } else {\n setOpenValues((prev) => [...prev, value]);\n }\n };\n\n return (\n <Select\n components={{ Option }}\n options={options}\n defaultValue={defaultValue}\n isSearchable={false}\n /* -- custom props, used by the Option component */\n maxDisplayDepth={maxDisplayDepth}\n openValues={openValues}\n onOptionToggle={handleToggle}\n /* -- / custom props */\n {...props}\n />\n );\n};\n\ntype SelectOption = { value?: string | number | null; label?: string };\n\ninterface SelectProps<\n Option = SelectOption,\n IsMulti extends boolean = false,\n Group extends GroupBase<Option> = GroupBase<Option>,\n> {\n components?: object;\n styles?: StylesConfig<Option, IsMulti, Group>;\n error?: string;\n ariaErrorMessage?: string;\n options: OptionSelectTree[];\n defaultValue?: {\n value?: string | number | null;\n };\n isSearchable?: boolean;\n maxDisplayDepth?: number;\n openValues?: (string | number | null)[];\n onOptionToggle?: (value: string | number | null) => void;\n}\n\nconst Select = ({\n components = {},\n styles = {},\n error,\n ariaErrorMessage,\n ...props\n}: SelectProps) => {\n const theme = useTheme();\n const customStyles = getSelectStyles(theme, error);\n\n return (\n <ReactSelect\n menuPosition=\"fixed\"\n components={{\n ...components,\n ClearIndicator,\n DropdownIndicator,\n IndicatorSeparator: () => null,\n LoadingIndicator: () => null,\n }}\n aria-errormessage={error && ariaErrorMessage}\n aria-invalid={!!error}\n styles={\n { ...customStyles, ...styles } as StylesConfig<SelectOption, false, GroupBase<SelectOption>>\n }\n {...props}\n />\n );\n};\n\nconst IconBox = styled(Box)`\n background: transparent;\n border: none;\n position: relative;\n z-index: 1;\n\n svg {\n height: 1.1rem;\n width: 1.1rem;\n }\n\n svg path {\n fill: ${({ theme }) => theme.colors.neutral600};\n }\n`;\n\nconst ClearIndicator = (\n props: ClearIndicatorProps<SelectOption, false, GroupBase<SelectOption>>\n) => {\n const Component = components.ClearIndicator;\n\n return (\n <Component {...props}>\n <IconBox tag=\"button\" type=\"button\">\n <Cross />\n </IconBox>\n </Component>\n );\n};\n\nconst CarretBox = styled(IconBox)`\n display: flex;\n background: none;\n border: none;\n\n svg {\n width: 0.9rem;\n }\n`;\n\nconst DropdownIndicator = ({ innerProps }: { innerProps: object }) => {\n return (\n <CarretBox paddingRight={3} {...innerProps}>\n <CaretDown />\n </CarretBox>\n );\n};\n\nconst getSelectStyles = (\n theme: DefaultTheme,\n error?: string\n): StylesConfig<SelectOption, false, GroupBase<SelectOption>> => {\n return {\n clearIndicator: (base: object) => ({ ...base, padding: 0, paddingRight: theme.spaces[3] }),\n container: (base: object) => ({\n ...base,\n background: theme.colors.neutral0,\n lineHeight: 'normal',\n }),\n control(base: object, state: { isFocused: boolean; isDisabled: boolean }) {\n let borderColor = theme.colors.neutral200;\n let boxShadowColor: string | undefined = undefined;\n let backgroundColor: string | undefined = undefined;\n\n if (state.isFocused) {\n borderColor = theme.colors.primary600;\n boxShadowColor = theme.colors.primary600;\n } else if (error) {\n borderColor = theme.colors.danger600;\n }\n\n if (state.isDisabled) {\n backgroundColor = `${theme.colors.neutral150} !important`;\n }\n\n return {\n ...base,\n fontSize: theme.fontSizes[2],\n height: 40,\n border: `1px solid ${borderColor} !important`,\n outline: 0,\n backgroundColor,\n borderRadius: theme.borderRadius,\n boxShadow: boxShadowColor ? `${boxShadowColor} 0px 0px 0px 2px` : '',\n };\n },\n indicatorsContainer: (base: object) => ({ ...base, padding: 0, paddingRight: theme.spaces[3] }),\n input: (base: object) => ({\n ...base,\n margin: 0,\n padding: 0,\n color: theme.colors.neutral800,\n gridTemplateColumns: '0 100%',\n }),\n menuPortal: (base: object) => ({\n ...base,\n zIndex: theme.zIndices.dialog,\n pointerEvents: 'auto',\n }),\n menu(base: object) {\n return {\n ...base,\n width: '100%',\n marginTop: theme.spaces[1],\n backgroundColor: theme.colors.neutral0,\n color: theme.colors.neutral800,\n borderRadius: theme.borderRadius,\n border: `1px solid ${theme.colors.neutral200}`,\n boxShadow: theme.shadows.tableShadow,\n fontSize: theme.fontSizes[2],\n zIndex: 2,\n };\n },\n menuList: (base: object) => ({\n ...base,\n paddingLeft: theme.spaces[1],\n paddingTop: theme.spaces[1],\n paddingRight: theme.spaces[1],\n paddingBottom: theme.spaces[1],\n }),\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n option(base: any, state: { isFocused: boolean; isSelected: boolean }) {\n let backgroundColor = base?.backgroundColor as string;\n\n if (state.isFocused || state.isSelected) {\n backgroundColor = theme.colors.primary100;\n }\n\n return {\n ...base,\n color: theme.colors.neutral800,\n lineHeight: theme.spaces[5],\n backgroundColor,\n borderRadius: theme.borderRadius,\n '&:active': {\n backgroundColor: theme.colors.primary100,\n },\n };\n },\n placeholder: (base: object) => ({\n ...base,\n color: theme.colors.neutral600,\n marginLeft: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n maxWidth: '80%',\n }),\n singleValue(base: object, state: { isDisabled: boolean }) {\n let color = theme.colors.neutral800;\n\n if (state.isDisabled) {\n color = theme.colors.neutral600;\n }\n\n return { ...base, marginLeft: 0, color };\n },\n valueContainer: (base: object) => ({\n ...base,\n cursor: 'pointer',\n padding: 0,\n paddingLeft: theme.spaces[4],\n marginLeft: 0,\n marginRight: 0,\n }),\n };\n};\n"],"names":["hasParent","option","parent","SelectTree","options","defaultOptions","maxDisplayDepth","defaultValue","props","flatDefaultOptions","React","useMemo","flattenTree","optionsFiltered","filter","setOptions","useState","openValues","setOpenValues","getOpenValues","useEffect","length","undefined","allOpenValues","reduce","acc","value","forEach","values","nextOptions","includes","handleToggle","valuesToClose","getValuesToClose","prev","prevData","_jsx","Select","components","Option","isSearchable","onOptionToggle","styles","error","ariaErrorMessage","theme","useTheme","customStyles","getSelectStyles","ReactSelect","menuPosition","ClearIndicator","DropdownIndicator","IndicatorSeparator","LoadingIndicator","aria-errormessage","aria-invalid","IconBox","styled","Box","colors","neutral600","Component","tag","type","Cross","CarretBox","innerProps","paddingRight","CaretDown","clearIndicator","base","padding","spaces","container","background","neutral0","lineHeight","control","state","borderColor","neutral200","boxShadowColor","backgroundColor","isFocused","primary600","danger600","isDisabled","neutral150","fontSize","fontSizes","height","border","outline","borderRadius","boxShadow","indicatorsContainer","input","margin","color","neutral800","gridTemplateColumns","menuPortal","zIndex","zIndices","dialog","pointerEvents","menu","width","marginTop","shadows","tableShadow","menuList","paddingLeft","paddingTop","paddingBottom","isSelected","primary100","placeholder","marginLeft","overflow","textOverflow","whiteSpace","maxWidth","singleValue","valueContainer","cursor","marginRight"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"SelectTree.js","sources":["../../../../admin/src/components/SelectTree/SelectTree.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box } from '@strapi/design-system';\nimport { Cross, CaretDown } from '@strapi/icons';\nimport ReactSelect, {\n components,\n GroupBase,\n StylesConfig,\n ClearIndicatorProps,\n} from 'react-select';\nimport { styled, useTheme, DefaultTheme } from 'styled-components';\n\nimport { Option } from './Option';\nimport { flattenTree, FlattenedNode } from './utils/flattenTree';\nimport { getOpenValues } from './utils/getOpenValues';\nimport { getValuesToClose } from './utils/getValuesToClose';\n\nconst hasParent = (option: FlattenedNode<string | number | null>) => !option.parent;\n\nexport type OptionSelectTree = {\n value: string | number | null;\n label?: string;\n children?: OptionSelectTree[];\n};\n\nexport interface SelectTreeProps<\n Option = unknown,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n IsMulti extends boolean = false,\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n Group extends GroupBase<Option> = GroupBase<Option>,\n> {\n maxDisplayDepth?: number;\n defaultValue?: {\n value?: string | number | null;\n };\n options: OptionSelectTree[];\n onChange?: (value: Record<string, string | number>) => void;\n name?: string;\n menuPortalTarget?: HTMLElement | null;\n inputId?: string;\n error?: string;\n ariaErrorMessage?: string;\n isDisabled?: boolean;\n disabled?: boolean;\n}\n\nexport const SelectTree = ({\n options: defaultOptions,\n maxDisplayDepth = 5,\n defaultValue,\n ...props\n}: SelectTreeProps) => {\n const flatDefaultOptions = React.useMemo(() => flattenTree(defaultOptions), [defaultOptions]);\n const optionsFiltered = React.useMemo(\n () => flatDefaultOptions.filter(hasParent),\n [flatDefaultOptions]\n );\n const [options, setOptions] = React.useState(optionsFiltered);\n const [openValues, setOpenValues] = React.useState(\n getOpenValues(flatDefaultOptions, defaultValue)\n );\n\n React.useEffect(() => {\n if (openValues.length === 0) {\n setOptions(flatDefaultOptions.filter((option) => option.parent === undefined));\n } else {\n const allOpenValues = openValues.reduce<(string | number | null)[]>((acc, value) => {\n const options = flatDefaultOptions.filter(\n (option) => option.value === value || option.parent === value\n );\n\n options.forEach((option) => {\n const values = getOpenValues(flatDefaultOptions, option);\n acc = [...acc, ...values];\n });\n\n return acc;\n }, []);\n\n const nextOptions = flatDefaultOptions.filter((option) =>\n allOpenValues.includes(option.value)\n );\n\n setOptions(nextOptions);\n }\n }, [openValues, flatDefaultOptions, optionsFiltered]);\n\n const handleToggle = (value: string | number | null) => {\n if (openValues.includes(value)) {\n const valuesToClose = getValuesToClose(flatDefaultOptions, value);\n setOpenValues((prev) => prev.filter((prevData) => !valuesToClose.includes(prevData)));\n } else {\n setOpenValues((prev) => [...prev, value]);\n }\n };\n\n return (\n <Select\n components={{ Option }}\n options={options}\n defaultValue={defaultValue}\n isSearchable={false}\n /* -- custom props, used by the Option component */\n maxDisplayDepth={maxDisplayDepth}\n openValues={openValues}\n onOptionToggle={handleToggle}\n /* -- / custom props */\n {...props}\n />\n );\n};\n\ntype SelectOption = { value?: string | number | null; label?: string };\n\ninterface SelectProps<\n Option = SelectOption,\n IsMulti extends boolean = false,\n Group extends GroupBase<Option> = GroupBase<Option>,\n> {\n components?: object;\n styles?: StylesConfig<Option, IsMulti, Group>;\n error?: string;\n ariaErrorMessage?: string;\n options: OptionSelectTree[];\n defaultValue?: {\n value?: string | number | null;\n };\n isSearchable?: boolean;\n maxDisplayDepth?: number;\n openValues?: (string | number | null)[];\n onOptionToggle?: (value: string | number | null) => void;\n}\n\nconst Select = ({\n components = {},\n styles = {},\n error,\n ariaErrorMessage,\n ...props\n}: SelectProps) => {\n const theme = useTheme();\n const customStyles = getSelectStyles(theme, error);\n\n return (\n <ReactSelect\n menuPosition=\"fixed\"\n components={{\n ...components,\n ClearIndicator,\n DropdownIndicator,\n IndicatorSeparator: () => null,\n LoadingIndicator: () => null,\n }}\n aria-errormessage={error && ariaErrorMessage}\n aria-invalid={!!error}\n styles={\n { ...customStyles, ...styles } as StylesConfig<SelectOption, false, GroupBase<SelectOption>>\n }\n {...props}\n />\n );\n};\n\nconst IconBox = styled(Box)`\n background: transparent;\n border: none;\n position: relative;\n z-index: 1;\n\n svg {\n height: 1.1rem;\n width: 1.1rem;\n }\n\n svg path {\n fill: ${({ theme }) => theme.colors.neutral600};\n }\n`;\n\nconst ClearIndicator = (\n props: ClearIndicatorProps<SelectOption, false, GroupBase<SelectOption>>\n) => {\n const Component = components.ClearIndicator;\n\n return (\n <Component {...props}>\n <IconBox tag=\"button\" type=\"button\">\n <Cross />\n </IconBox>\n </Component>\n );\n};\n\nconst CarretBox = styled(IconBox)`\n display: flex;\n background: none;\n border: none;\n\n svg {\n width: 0.9rem;\n }\n`;\n\nconst DropdownIndicator = ({ innerProps }: { innerProps: object }) => {\n return (\n <CarretBox paddingRight={3} {...innerProps}>\n <CaretDown />\n </CarretBox>\n );\n};\n\nconst getSelectStyles = (\n theme: DefaultTheme,\n error?: string\n): StylesConfig<SelectOption, false, GroupBase<SelectOption>> => {\n return {\n clearIndicator: (base: object) => ({ ...base, padding: 0, paddingRight: theme.spaces[3] }),\n container: (base: object) => ({\n ...base,\n background: theme.colors.neutral0,\n lineHeight: 'normal',\n }),\n control(base: object, state: { isFocused: boolean; isDisabled: boolean }) {\n let borderColor = theme.colors.neutral200;\n let boxShadowColor: string | undefined = undefined;\n let backgroundColor: string | undefined = undefined;\n\n if (state.isFocused) {\n borderColor = theme.colors.primary600;\n boxShadowColor = theme.colors.primary600;\n } else if (error) {\n borderColor = theme.colors.danger600;\n }\n\n if (state.isDisabled) {\n backgroundColor = `${theme.colors.neutral150} !important`;\n }\n\n return {\n ...base,\n fontSize: theme.fontSizes[2],\n height: 40,\n border: `1px solid ${borderColor} !important`,\n outline: 0,\n backgroundColor,\n borderRadius: theme.borderRadius,\n boxShadow: boxShadowColor ? `${boxShadowColor} 0px 0px 0px 2px` : '',\n };\n },\n indicatorsContainer: (base: object) => ({ ...base, padding: 0, paddingRight: theme.spaces[3] }),\n input: (base: object) => ({\n ...base,\n margin: 0,\n padding: 0,\n color: theme.colors.neutral800,\n gridTemplateColumns: '0 100%',\n }),\n menuPortal: (base: object) => ({\n ...base,\n zIndex: theme.zIndices.dialog,\n pointerEvents: 'auto',\n }),\n menu(base: object) {\n return {\n ...base,\n width: '100%',\n marginTop: theme.spaces[1],\n backgroundColor: theme.colors.neutral0,\n color: theme.colors.neutral800,\n borderRadius: theme.borderRadius,\n border: `1px solid ${theme.colors.neutral200}`,\n boxShadow: theme.shadows.tableShadow,\n fontSize: theme.fontSizes[2],\n zIndex: 2,\n };\n },\n menuList: (base: object) => ({\n ...base,\n paddingLeft: theme.spaces[1],\n paddingTop: theme.spaces[1],\n paddingRight: theme.spaces[1],\n paddingBottom: theme.spaces[1],\n }),\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n option(base: any, state: { isFocused: boolean; isSelected: boolean }) {\n let backgroundColor = base?.backgroundColor as string;\n\n if (state.isFocused || state.isSelected) {\n backgroundColor = theme.colors.primary100;\n }\n\n return {\n ...base,\n color: theme.colors.neutral800,\n lineHeight: theme.spaces[5],\n backgroundColor,\n borderRadius: theme.borderRadius,\n '&:active': {\n backgroundColor: theme.colors.primary100,\n },\n };\n },\n placeholder: (base: object) => ({\n ...base,\n color: theme.colors.neutral600,\n marginLeft: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n maxWidth: '80%',\n }),\n singleValue(base: object, state: { isDisabled: boolean }) {\n let color = theme.colors.neutral800;\n\n if (state.isDisabled) {\n color = theme.colors.neutral600;\n }\n\n return { ...base, marginLeft: 0, color };\n },\n valueContainer: (base: object) => ({\n ...base,\n cursor: 'pointer',\n padding: 0,\n paddingLeft: theme.spaces[4],\n marginLeft: 0,\n marginRight: 0,\n }),\n };\n};\n"],"names":["hasParent","option","parent","SelectTree","options","defaultOptions","maxDisplayDepth","defaultValue","props","flatDefaultOptions","React","useMemo","flattenTree","optionsFiltered","filter","setOptions","useState","openValues","setOpenValues","getOpenValues","useEffect","length","undefined","allOpenValues","reduce","acc","value","forEach","values","nextOptions","includes","handleToggle","valuesToClose","getValuesToClose","prev","prevData","_jsx","Select","components","Option","isSearchable","onOptionToggle","styles","error","ariaErrorMessage","theme","useTheme","customStyles","getSelectStyles","ReactSelect","menuPosition","ClearIndicator","DropdownIndicator","IndicatorSeparator","LoadingIndicator","aria-errormessage","aria-invalid","IconBox","styled","Box","colors","neutral600","Component","tag","type","Cross","CarretBox","innerProps","paddingRight","CaretDown","clearIndicator","base","padding","spaces","container","background","neutral0","lineHeight","control","state","borderColor","neutral200","boxShadowColor","backgroundColor","isFocused","primary600","danger600","isDisabled","neutral150","fontSize","fontSizes","height","border","outline","borderRadius","boxShadow","indicatorsContainer","input","margin","color","neutral800","gridTemplateColumns","menuPortal","zIndex","zIndices","dialog","pointerEvents","menu","width","marginTop","shadows","tableShadow","menuList","paddingLeft","paddingTop","paddingBottom","isSelected","primary100","placeholder","marginLeft","overflow","textOverflow","whiteSpace","maxWidth","singleValue","valueContainer","cursor","marginRight"],"mappings":"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"}
|
|
@@ -12,6 +12,10 @@ require('../../utils/typeFromMime.js');
|
|
|
12
12
|
require('../../utils/urlYupSchema.js');
|
|
13
13
|
var PreviewCell = require('./PreviewCell.js');
|
|
14
14
|
|
|
15
|
+
function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
|
+
|
|
17
|
+
var parseISO__default = /*#__PURE__*/_interopDefault(parseISO);
|
|
18
|
+
|
|
15
19
|
const CellContent = ({ cellType, contentType, content, name })=>{
|
|
16
20
|
const { formatDate, formatMessage } = reactIntl.useIntl();
|
|
17
21
|
const contentValue = content[name];
|
|
@@ -24,7 +28,7 @@ const CellContent = ({ cellType, contentType, content, name })=>{
|
|
|
24
28
|
case 'date':
|
|
25
29
|
if (typeof contentValue === 'string') {
|
|
26
30
|
return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
|
|
27
|
-
children: formatDate(
|
|
31
|
+
children: formatDate(parseISO__default.default(contentValue), {
|
|
28
32
|
dateStyle: 'full'
|
|
29
33
|
})
|
|
30
34
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellContent.js","sources":["../../../../admin/src/components/TableList/CellContent.tsx"],"sourcesContent":["import { Typography } from '@strapi/design-system';\nimport parseISO from 'date-fns/parseISO';\nimport { useIntl } from 'react-intl';\n\nimport { formatBytes, getFileExtension } from '../../utils';\n\nimport { PreviewCell } from './PreviewCell';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nexport interface CellContentProps {\n cellType: string;\n contentType?: string;\n content: File;\n name: string;\n}\n\nexport const CellContent = ({ cellType, contentType, content, name }: CellContentProps) => {\n const { formatDate, formatMessage } = useIntl();\n const contentValue = content[name as Extract<keyof File, string>];\n\n switch (cellType) {\n case 'image':\n return <PreviewCell type={contentType} content={content} />;\n\n case 'date':\n if (typeof contentValue === 'string') {\n return <Typography>{formatDate(parseISO(contentValue), { dateStyle: 'full' })}</Typography>;\n }\n\n case 'size':\n if (contentType === 'folder')\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n if (typeof contentValue === 'string' || typeof contentValue === 'number') {\n return <Typography>{formatBytes(contentValue)}</Typography>;\n }\n\n case 'ext':\n if (contentType === 'folder')\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n\n if (typeof contentValue === 'string') {\n return <Typography>{getFileExtension(contentValue)?.toUpperCase()}</Typography>;\n }\n case 'text':\n if (typeof contentValue === 'string') {\n return <Typography>{contentValue}</Typography>;\n }\n\n default:\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n }\n};\n"],"names":["CellContent","cellType","contentType","content","name","formatDate","formatMessage","useIntl","contentValue","_jsx","PreviewCell","type","Typography","parseISO","dateStyle","aria-label","id","defaultMessage","formatBytes","getFileExtension","toUpperCase"],"mappings":"
|
|
1
|
+
{"version":3,"file":"CellContent.js","sources":["../../../../admin/src/components/TableList/CellContent.tsx"],"sourcesContent":["import { Typography } from '@strapi/design-system';\nimport parseISO from 'date-fns/parseISO';\nimport { useIntl } from 'react-intl';\n\nimport { formatBytes, getFileExtension } from '../../utils';\n\nimport { PreviewCell } from './PreviewCell';\n\nimport type { File } from '../../../../shared/contracts/files';\n\nexport interface CellContentProps {\n cellType: string;\n contentType?: string;\n content: File;\n name: string;\n}\n\nexport const CellContent = ({ cellType, contentType, content, name }: CellContentProps) => {\n const { formatDate, formatMessage } = useIntl();\n const contentValue = content[name as Extract<keyof File, string>];\n\n switch (cellType) {\n case 'image':\n return <PreviewCell type={contentType} content={content} />;\n\n case 'date':\n if (typeof contentValue === 'string') {\n return <Typography>{formatDate(parseISO(contentValue), { dateStyle: 'full' })}</Typography>;\n }\n\n case 'size':\n if (contentType === 'folder')\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n if (typeof contentValue === 'string' || typeof contentValue === 'number') {\n return <Typography>{formatBytes(contentValue)}</Typography>;\n }\n\n case 'ext':\n if (contentType === 'folder')\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n\n if (typeof contentValue === 'string') {\n return <Typography>{getFileExtension(contentValue)?.toUpperCase()}</Typography>;\n }\n case 'text':\n if (typeof contentValue === 'string') {\n return <Typography>{contentValue}</Typography>;\n }\n\n default:\n return (\n <Typography\n aria-label={formatMessage({\n id: 'list.table.content.empty-label',\n defaultMessage: 'This field is empty',\n })}\n >\n -\n </Typography>\n );\n }\n};\n"],"names":["CellContent","cellType","contentType","content","name","formatDate","formatMessage","useIntl","contentValue","_jsx","PreviewCell","type","Typography","parseISO","dateStyle","aria-label","id","defaultMessage","formatBytes","getFileExtension","toUpperCase"],"mappings":";;;;;;;;;;;;;;;;;;AAiBO,MAAMA,WAAAA,GAAc,CAAC,EAAEC,QAAQ,EAAEC,WAAW,EAAEC,OAAO,EAAEC,IAAI,EAAoB,GAAA;AACpF,IAAA,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAE,GAAGC,iBAAAA,EAAAA;IACtC,MAAMC,YAAAA,GAAeL,OAAO,CAACC,IAAAA,CAAoC;IAEjE,OAAQH,QAAAA;QACN,KAAK,OAAA;AACH,YAAA,qBAAOQ,cAAA,CAACC,uBAAAA,EAAAA;gBAAYC,IAAAA,EAAMT,WAAAA;gBAAaC,OAAAA,EAASA;;QAElD,KAAK,MAAA;YACH,IAAI,OAAOK,iBAAiB,QAAA,EAAU;AACpC,gBAAA,qBAAOC,cAAA,CAACG,uBAAAA,EAAAA;AAAYP,oBAAAA,QAAAA,EAAAA,UAAAA,CAAWQ,0BAASL,YAAAA,CAAAA,EAAe;wBAAEM,SAAAA,EAAW;AAAO,qBAAA;;AAC7E,YAAA;QAEF,KAAK,MAAA;YACH,IAAIZ,WAAAA,KAAgB,QAAA,EAClB,qBACEO,cAAA,CAACG,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAAA,CAAc;oBACxBU,EAAAA,EAAI,gCAAA;oBACJC,cAAAA,EAAgB;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIL,YAAA,IAAI,OAAOT,YAAAA,KAAiB,QAAA,IAAY,OAAOA,iBAAiB,QAAA,EAAU;AACxE,gBAAA,qBAAOC,cAAA,CAACG,uBAAAA,EAAAA;8BAAYM,uBAAAA,CAAYV,YAAAA;;AAClC,YAAA;QAEF,KAAK,KAAA;YACH,IAAIN,WAAAA,KAAgB,QAAA,EAClB,qBACEO,cAAA,CAACG,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAAA,CAAc;oBACxBU,EAAAA,EAAI,gCAAA;oBACJC,cAAAA,EAAgB;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;YAKL,IAAI,OAAOT,iBAAiB,QAAA,EAAU;AACpC,gBAAA,qBAAOC,cAAA,CAACG,uBAAAA,EAAAA;AAAYO,oBAAAA,QAAAA,EAAAA,iCAAAA,CAAiBX,YAAAA,CAAAA,EAAeY,WAAAA;;AACtD,YAAA;QACF,KAAK,MAAA;YACH,IAAI,OAAOZ,iBAAiB,QAAA,EAAU;AACpC,gBAAA,qBAAOC,cAAA,CAACG,uBAAAA,EAAAA;AAAYJ,oBAAAA,QAAAA,EAAAA;;AACtB,YAAA;AAEF,QAAA;AACE,YAAA,qBACEC,cAAA,CAACG,uBAAAA,EAAAA;AACCG,gBAAAA,YAAAA,EAAYT,aAAAA,CAAc;oBACxBU,EAAAA,EAAI,gCAAA;oBACJC,cAAAA,EAAgB;AAClB,iBAAA,CAAA;AACD,gBAAA,QAAA,EAAA;;AAIP;AACF;;;;"}
|
|
@@ -16,7 +16,8 @@ var rawFileToAsset = require('../../../utils/rawFileToAsset.js');
|
|
|
16
16
|
require('../../../utils/typeFromMime.js');
|
|
17
17
|
require('../../../utils/urlYupSchema.js');
|
|
18
18
|
|
|
19
|
-
function
|
|
19
|
+
function _interopNamespace(e) {
|
|
20
|
+
if (e && e.__esModule) return e;
|
|
20
21
|
var n = Object.create(null);
|
|
21
22
|
if (e) {
|
|
22
23
|
Object.keys(e).forEach(function (k) {
|
|
@@ -33,7 +34,7 @@ function _interopNamespaceDefault(e) {
|
|
|
33
34
|
return Object.freeze(n);
|
|
34
35
|
}
|
|
35
36
|
|
|
36
|
-
var React__namespace = /*#__PURE__*/
|
|
37
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
37
38
|
|
|
38
39
|
const Wrapper = styledComponents.styled(designSystem.Flex)`
|
|
39
40
|
flex-direction: column;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FromComputerForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromComputerForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Flex, Modal, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { useTracking } from '../../../hooks/useTracking';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\nconst Wrapper = styled(Flex)`\n flex-direction: column;\n`;\n\nconst IconWrapper = styled.div`\n font-size: 6rem;\n\n svg path {\n fill: ${({ theme }) => theme.colors.primary600};\n }\n`;\n\nconst MediaBox = styled(Box)`\n border-style: dashed;\n`;\n\nconst OpaqueBox = styled(Box)`\n opacity: 0;\n cursor: pointer;\n`;\n\ninterface FromComputerFormProps {\n onClose: () => void;\n onAddAssets: (assets: FileWithRawFile[]) => void;\n trackedLocation?: string;\n}\n\nexport const FromComputerForm = ({\n onClose,\n onAddAssets,\n trackedLocation,\n}: FromComputerFormProps) => {\n const { formatMessage } = useIntl();\n const [dragOver, setDragOver] = React.useState(false);\n const inputRef = React.useRef<HTMLInputElement>(null);\n const { trackUsage } = useTracking();\n\n const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault();\n };\n\n const handleDragEnter = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault();\n setDragOver(true);\n };\n\n const handleDragLeave = () => setDragOver(false);\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n // inputRef.current?.click();\n };\n\n const handleChange = () => {\n const files = inputRef.current?.files;\n const assets: FileWithRawFile[] = [];\n\n if (files) {\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n assets.push(asset);\n }\n }\n }\n\n if (trackedLocation) {\n trackUsage('didSelectFile', { source: 'computer', location: trackedLocation });\n }\n\n onAddAssets(assets);\n };\n\n const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n\n if (e?.dataTransfer?.files) {\n const files = e.dataTransfer.files;\n const assets = [];\n\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n assets.push(asset);\n }\n }\n\n onAddAssets(assets);\n }\n\n setDragOver(false);\n };\n\n return (\n <form>\n <Box paddingLeft={8} paddingRight={8} paddingTop={6} paddingBottom={6}>\n <label>\n <MediaBox\n paddingTop={11}\n paddingBottom={11}\n hasRadius\n justifyContent=\"center\"\n borderColor={dragOver ? 'primary500' : 'neutral300'}\n background={dragOver ? 'primary100' : 'neutral100'}\n position=\"relative\"\n onDragEnter={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDragOver={handleDragOver}\n onDrop={handleDrop}\n >\n <Flex justifyContent=\"center\">\n <Wrapper>\n <IconWrapper>\n <PicturePlus aria-hidden width=\"3.2rem\" height=\"3.2rem\" />\n </IconWrapper>\n\n <Box paddingTop={3} paddingBottom={5}>\n <Typography variant=\"delta\" textColor=\"neutral600\" tag=\"span\">\n {formatMessage({\n id: getTrad('input.label'),\n defaultMessage: 'Drag & Drop here or',\n })}\n </Typography>\n </Box>\n\n <OpaqueBox\n tag=\"input\"\n position=\"absolute\"\n left={0}\n right={0}\n bottom={0}\n top={0}\n width=\"100%\"\n type=\"file\"\n multiple\n name=\"files\"\n aria-label={formatMessage({\n id: getTrad('input.label'),\n defaultMessage: 'Drag & Drop here or',\n })}\n tabIndex={-1}\n ref={inputRef}\n zIndex={1}\n onChange={handleChange}\n />\n\n {/* <Box position=\"relative\">\n <Button type=\"button\" onClick={handleClick}>\n {formatMessage({\n id: getTrad('input.button.label'),\n defaultMessage: 'Browse files',\n })}\n </Button>\n </Box> */}\n </Wrapper>\n </Flex>\n </MediaBox>\n </label>\n </Box>\n\n <Modal.Footer>\n <Button onClick={onClose} variant=\"tertiary\">\n {formatMessage({\n id: 'app.components.Button.cancel',\n defaultMessage: 'cancel',\n })}\n </Button>\n </Modal.Footer>\n </form>\n );\n};\n"],"names":["Wrapper","styled","Flex","IconWrapper","div","theme","colors","primary600","MediaBox","Box","OpaqueBox","FromComputerForm","onClose","onAddAssets","trackedLocation","formatMessage","useIntl","dragOver","setDragOver","React","useState","inputRef","useRef","trackUsage","useTracking","handleDragOver","event","preventDefault","handleDragEnter","handleDragLeave","handleChange","files","current","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","source","location","handleDrop","e","dataTransfer","_jsxs","form","_jsx","paddingLeft","paddingRight","paddingTop","paddingBottom","label","hasRadius","justifyContent","borderColor","background","position","onDragEnter","onDragLeave","onDragOver","onDrop","PicturePlus","aria-hidden","width","height","Typography","variant","textColor","tag","id","getTrad","defaultMessage","left","right","bottom","top","type","multiple","name","aria-label","tabIndex","ref","zIndex","onChange","Modal","Footer","Button","onClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"FromComputerForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromComputerForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Flex, Modal, Typography } from '@strapi/design-system';\nimport { PlusCircle as PicturePlus } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { AssetSource } from '../../../constants';\nimport { useTracking } from '../../../hooks/useTracking';\nimport { getTrad, rawFileToAsset } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\nconst Wrapper = styled(Flex)`\n flex-direction: column;\n`;\n\nconst IconWrapper = styled.div`\n font-size: 6rem;\n\n svg path {\n fill: ${({ theme }) => theme.colors.primary600};\n }\n`;\n\nconst MediaBox = styled(Box)`\n border-style: dashed;\n`;\n\nconst OpaqueBox = styled(Box)`\n opacity: 0;\n cursor: pointer;\n`;\n\ninterface FromComputerFormProps {\n onClose: () => void;\n onAddAssets: (assets: FileWithRawFile[]) => void;\n trackedLocation?: string;\n}\n\nexport const FromComputerForm = ({\n onClose,\n onAddAssets,\n trackedLocation,\n}: FromComputerFormProps) => {\n const { formatMessage } = useIntl();\n const [dragOver, setDragOver] = React.useState(false);\n const inputRef = React.useRef<HTMLInputElement>(null);\n const { trackUsage } = useTracking();\n\n const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault();\n };\n\n const handleDragEnter = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault();\n setDragOver(true);\n };\n\n const handleDragLeave = () => setDragOver(false);\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n e.preventDefault();\n // inputRef.current?.click();\n };\n\n const handleChange = () => {\n const files = inputRef.current?.files;\n const assets: FileWithRawFile[] = [];\n\n if (files) {\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n assets.push(asset);\n }\n }\n }\n\n if (trackedLocation) {\n trackUsage('didSelectFile', { source: 'computer', location: trackedLocation });\n }\n\n onAddAssets(assets);\n };\n\n const handleDrop = (e: React.DragEvent<HTMLDivElement>) => {\n e.preventDefault();\n\n if (e?.dataTransfer?.files) {\n const files = e.dataTransfer.files;\n const assets = [];\n\n for (let i = 0; i < files.length; i++) {\n const file = files.item(i);\n if (file) {\n const asset = rawFileToAsset(file, AssetSource.Computer);\n assets.push(asset);\n }\n }\n\n onAddAssets(assets);\n }\n\n setDragOver(false);\n };\n\n return (\n <form>\n <Box paddingLeft={8} paddingRight={8} paddingTop={6} paddingBottom={6}>\n <label>\n <MediaBox\n paddingTop={11}\n paddingBottom={11}\n hasRadius\n justifyContent=\"center\"\n borderColor={dragOver ? 'primary500' : 'neutral300'}\n background={dragOver ? 'primary100' : 'neutral100'}\n position=\"relative\"\n onDragEnter={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDragOver={handleDragOver}\n onDrop={handleDrop}\n >\n <Flex justifyContent=\"center\">\n <Wrapper>\n <IconWrapper>\n <PicturePlus aria-hidden width=\"3.2rem\" height=\"3.2rem\" />\n </IconWrapper>\n\n <Box paddingTop={3} paddingBottom={5}>\n <Typography variant=\"delta\" textColor=\"neutral600\" tag=\"span\">\n {formatMessage({\n id: getTrad('input.label'),\n defaultMessage: 'Drag & Drop here or',\n })}\n </Typography>\n </Box>\n\n <OpaqueBox\n tag=\"input\"\n position=\"absolute\"\n left={0}\n right={0}\n bottom={0}\n top={0}\n width=\"100%\"\n type=\"file\"\n multiple\n name=\"files\"\n aria-label={formatMessage({\n id: getTrad('input.label'),\n defaultMessage: 'Drag & Drop here or',\n })}\n tabIndex={-1}\n ref={inputRef}\n zIndex={1}\n onChange={handleChange}\n />\n\n {/* <Box position=\"relative\">\n <Button type=\"button\" onClick={handleClick}>\n {formatMessage({\n id: getTrad('input.button.label'),\n defaultMessage: 'Browse files',\n })}\n </Button>\n </Box> */}\n </Wrapper>\n </Flex>\n </MediaBox>\n </label>\n </Box>\n\n <Modal.Footer>\n <Button onClick={onClose} variant=\"tertiary\">\n {formatMessage({\n id: 'app.components.Button.cancel',\n defaultMessage: 'cancel',\n })}\n </Button>\n </Modal.Footer>\n </form>\n );\n};\n"],"names":["Wrapper","styled","Flex","IconWrapper","div","theme","colors","primary600","MediaBox","Box","OpaqueBox","FromComputerForm","onClose","onAddAssets","trackedLocation","formatMessage","useIntl","dragOver","setDragOver","React","useState","inputRef","useRef","trackUsage","useTracking","handleDragOver","event","preventDefault","handleDragEnter","handleDragLeave","handleChange","files","current","assets","i","length","file","item","asset","rawFileToAsset","AssetSource","Computer","push","source","location","handleDrop","e","dataTransfer","_jsxs","form","_jsx","paddingLeft","paddingRight","paddingTop","paddingBottom","label","hasRadius","justifyContent","borderColor","background","position","onDragEnter","onDragLeave","onDragOver","onDrop","PicturePlus","aria-hidden","width","height","Typography","variant","textColor","tag","id","getTrad","defaultMessage","left","right","bottom","top","type","multiple","name","aria-label","tabIndex","ref","zIndex","onChange","Modal","Footer","Button","onClick"],"mappings":"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"}
|
|
@@ -14,7 +14,8 @@ require('../../../utils/typeFromMime.js');
|
|
|
14
14
|
var urlsToAssets = require('../../../utils/urlsToAssets.js');
|
|
15
15
|
var urlYupSchema = require('../../../utils/urlYupSchema.js');
|
|
16
16
|
|
|
17
|
-
function
|
|
17
|
+
function _interopNamespace(e) {
|
|
18
|
+
if (e && e.__esModule) return e;
|
|
18
19
|
var n = Object.create(null);
|
|
19
20
|
if (e) {
|
|
20
21
|
Object.keys(e).forEach(function (k) {
|
|
@@ -31,7 +32,7 @@ function _interopNamespaceDefault(e) {
|
|
|
31
32
|
return Object.freeze(n);
|
|
32
33
|
}
|
|
33
34
|
|
|
34
|
-
var React__namespace = /*#__PURE__*/
|
|
35
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
35
36
|
|
|
36
37
|
const FromUrlForm = ({ onClose, onAddAsset, trackedLocation })=>{
|
|
37
38
|
const [loading, setLoading] = React__namespace.useState(false);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FromUrlForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromUrlForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Field, Modal, Textarea } from '@strapi/design-system';\nimport { Form, Formik } from 'formik';\nimport { useIntl } from 'react-intl';\n\nimport { useTracking } from '../../../hooks/useTracking';\nimport { getTrad, urlsToAssets, urlSchema } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\ninterface FromUrlFormProps {\n onClose: () => void;\n onAddAsset: (assets: FileWithRawFile[]) => void;\n trackedLocation?: string;\n}\n\nexport const FromUrlForm = ({ onClose, onAddAsset, trackedLocation }: FromUrlFormProps) => {\n const [loading, setLoading] = React.useState(false);\n const [error, setError] = React.useState<Error | undefined>(undefined);\n const { formatMessage } = useIntl();\n const { trackUsage } = useTracking();\n\n const handleSubmit = async ({ urls }: { urls: string }) => {\n setLoading(true);\n const urlArray = urls.split(/\\r?\\n/);\n try {\n const assets: FileWithRawFile[] = await urlsToAssets(urlArray);\n\n if (trackedLocation) {\n trackUsage('didSelectFile', { source: 'url', location: trackedLocation });\n }\n\n // no need to set the loading to false since the component unmounts\n onAddAsset(assets);\n } catch (e: unknown) {\n setError(e as Error);\n setLoading(false);\n }\n };\n\n return (\n <Formik\n enableReinitialize\n initialValues={{\n urls: '',\n }}\n onSubmit={handleSubmit}\n validationSchema={urlSchema}\n validateOnChange={false}\n >\n {({ values, errors, handleChange }) => (\n <Form noValidate>\n <Box paddingLeft={8} paddingRight={8} paddingBottom={6} paddingTop={6}>\n <Field.Root\n hint={formatMessage({\n id: getTrad('input.url.description'),\n defaultMessage: 'Separate your URL links by a carriage return.',\n })}\n error={\n error?.message ||\n (errors.urls\n ? formatMessage({ id: errors.urls, defaultMessage: 'An error occurred' })\n : undefined)\n }\n >\n <Field.Label>\n {formatMessage({ id: getTrad('input.url.label'), defaultMessage: 'URL' })}\n </Field.Label>\n <Textarea name=\"urls\" onChange={handleChange} value={values.urls} />\n <Field.Hint />\n <Field.Error />\n </Field.Root>\n </Box>\n\n <Modal.Footer>\n <Button onClick={onClose} variant=\"tertiary\">\n {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}\n </Button>\n <Button type=\"submit\" loading={loading}>\n {formatMessage({\n id: getTrad('button.next'),\n defaultMessage: 'Next',\n })}\n </Button>\n </Modal.Footer>\n </Form>\n )}\n </Formik>\n );\n};\n"],"names":["FromUrlForm","onClose","onAddAsset","trackedLocation","loading","setLoading","React","useState","error","setError","undefined","formatMessage","useIntl","trackUsage","useTracking","handleSubmit","urls","urlArray","split","assets","urlsToAssets","source","location","e","_jsx","Formik","enableReinitialize","initialValues","onSubmit","validationSchema","urlSchema","validateOnChange","values","errors","handleChange","_jsxs","Form","noValidate","Box","paddingLeft","paddingRight","paddingBottom","paddingTop","Field","Root","hint","id","getTrad","defaultMessage","message","Label","Textarea","name","onChange","value","Hint","Error","Modal","Footer","Button","onClick","variant","type"],"mappings":"
|
|
1
|
+
{"version":3,"file":"FromUrlForm.js","sources":["../../../../../admin/src/components/UploadAssetDialog/AddAssetStep/FromUrlForm.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, Button, Field, Modal, Textarea } from '@strapi/design-system';\nimport { Form, Formik } from 'formik';\nimport { useIntl } from 'react-intl';\n\nimport { useTracking } from '../../../hooks/useTracking';\nimport { getTrad, urlsToAssets, urlSchema } from '../../../utils';\n\nimport type { FileWithRawFile } from './AddAssetStep';\n\ninterface FromUrlFormProps {\n onClose: () => void;\n onAddAsset: (assets: FileWithRawFile[]) => void;\n trackedLocation?: string;\n}\n\nexport const FromUrlForm = ({ onClose, onAddAsset, trackedLocation }: FromUrlFormProps) => {\n const [loading, setLoading] = React.useState(false);\n const [error, setError] = React.useState<Error | undefined>(undefined);\n const { formatMessage } = useIntl();\n const { trackUsage } = useTracking();\n\n const handleSubmit = async ({ urls }: { urls: string }) => {\n setLoading(true);\n const urlArray = urls.split(/\\r?\\n/);\n try {\n const assets: FileWithRawFile[] = await urlsToAssets(urlArray);\n\n if (trackedLocation) {\n trackUsage('didSelectFile', { source: 'url', location: trackedLocation });\n }\n\n // no need to set the loading to false since the component unmounts\n onAddAsset(assets);\n } catch (e: unknown) {\n setError(e as Error);\n setLoading(false);\n }\n };\n\n return (\n <Formik\n enableReinitialize\n initialValues={{\n urls: '',\n }}\n onSubmit={handleSubmit}\n validationSchema={urlSchema}\n validateOnChange={false}\n >\n {({ values, errors, handleChange }) => (\n <Form noValidate>\n <Box paddingLeft={8} paddingRight={8} paddingBottom={6} paddingTop={6}>\n <Field.Root\n hint={formatMessage({\n id: getTrad('input.url.description'),\n defaultMessage: 'Separate your URL links by a carriage return.',\n })}\n error={\n error?.message ||\n (errors.urls\n ? formatMessage({ id: errors.urls, defaultMessage: 'An error occurred' })\n : undefined)\n }\n >\n <Field.Label>\n {formatMessage({ id: getTrad('input.url.label'), defaultMessage: 'URL' })}\n </Field.Label>\n <Textarea name=\"urls\" onChange={handleChange} value={values.urls} />\n <Field.Hint />\n <Field.Error />\n </Field.Root>\n </Box>\n\n <Modal.Footer>\n <Button onClick={onClose} variant=\"tertiary\">\n {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}\n </Button>\n <Button type=\"submit\" loading={loading}>\n {formatMessage({\n id: getTrad('button.next'),\n defaultMessage: 'Next',\n })}\n </Button>\n </Modal.Footer>\n </Form>\n )}\n </Formik>\n );\n};\n"],"names":["FromUrlForm","onClose","onAddAsset","trackedLocation","loading","setLoading","React","useState","error","setError","undefined","formatMessage","useIntl","trackUsage","useTracking","handleSubmit","urls","urlArray","split","assets","urlsToAssets","source","location","e","_jsx","Formik","enableReinitialize","initialValues","onSubmit","validationSchema","urlSchema","validateOnChange","values","errors","handleChange","_jsxs","Form","noValidate","Box","paddingLeft","paddingRight","paddingBottom","paddingTop","Field","Root","hint","id","getTrad","defaultMessage","message","Label","Textarea","name","onChange","value","Hint","Error","Modal","Footer","Button","onClick","variant","type"],"mappings":"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"}
|
|
@@ -14,7 +14,8 @@ require('../../../utils/urlYupSchema.js');
|
|
|
14
14
|
var AssetCard = require('../../AssetCard/AssetCard.js');
|
|
15
15
|
var UploadingAssetCard = require('../../AssetCard/UploadingAssetCard.js');
|
|
16
16
|
|
|
17
|
-
function
|
|
17
|
+
function _interopNamespace(e) {
|
|
18
|
+
if (e && e.__esModule) return e;
|
|
18
19
|
var n = Object.create(null);
|
|
19
20
|
if (e) {
|
|
20
21
|
Object.keys(e).forEach(function (k) {
|
|
@@ -31,7 +32,7 @@ function _interopNamespaceDefault(e) {
|
|
|
31
32
|
return Object.freeze(n);
|
|
32
33
|
}
|
|
33
34
|
|
|
34
|
-
var React__namespace = /*#__PURE__*/
|
|
35
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
35
36
|
|
|
36
37
|
const Status = {
|
|
37
38
|
Idle: 'IDLE',
|