@payloadcms/ui 4.0.0-internal.5b1e7cd → 4.0.0-internal.5d5a2b2

package/dist/elements/BulkUpload/EditForm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useMemo","Form","useForm","WatchChildErrors","useConfig","useDocumentEvents","useDocumentInfo","OperationProvider","useServerFunctions","abortAndIgnore","handleAbortRef","useDocumentDrawerContext","DocumentFields","MoveDocToFolder","Upload_v4","useFormsManager","baseClass","EditForm","resetUploadEdits","submitted","updateUploadEdits","uploadEdits","action","collectionSlug","docSlug","docPermissions","getDocPreferences","hasSavePermission","initialState","isInitializing","Upload","CustomUpload","drawerSlug","onSave","onSaveFromContext","getFormState","config","folders","getEntityConfig","abortOnChangeRef","useRef","collectionConfig","reportUpdate","slug","schemaPath","useState","json","doc","result","entitySlug","operation","updatedAt","Date","toISOString","onChange","formState","prevFormState","controller","docPreferences","state","newFormState","signal","skipValidation","current","abortOnChange","_jsx","_jsxs","className","disabled","undefined","method","onSuccess","BeforeFields","Fragment","customActions","buttonProps","buttonStyle","size","folderCollectionSlug","folderFieldName","fieldName","filter","Boolean","uploadConfig","upload","fields","schemaPathSegments","ReportAllErrors","GetFieldProxy","$","getField","getFields","getFormDataRef","t0","t1","docConfig","activeIndex","forms","setFormTotalErrorCount","errorCountRef","fileIsValid","currentForm","file","valid","reportFormErrorCount","fieldErrorCount","newErrorCount","errorCount","index","path","setErrorCount"],"sources":["../../../../src/elements/BulkUpload/EditForm/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useMemo } from 'react'\n\nimport type { EditFormProps } from './types.js'\n\nimport { Form, useForm } from '../../../forms/Form/index.js'\nimport { type FormProps } from '../../../forms/Form/types.js'\nimport { WatchChildErrors } from '../../../forms/WatchChildErrors/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { OperationProvider } from '../../../providers/Operation/index.js'\nimport { useServerFunctions } from '../../../providers/ServerFunctions/index.js'\nimport { abortAndIgnore, handleAbortRef } from '../../../utilities/abortAndIgnore.js'\nimport { useDocumentDrawerContext } from '../../DocumentDrawer/Provider.js'\nimport { DocumentFields } from '../../DocumentFields/index.js'\nimport { MoveDocToFolder } from '../../FolderView/MoveDocToFolder/index.js'\nimport { Upload_v4 } from '../../Upload/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport './index.scss'\n\nconst baseClass = 'collection-edit'\n\n// This component receives props only on _pages_\n// When rendered within a drawer, props are empty\n// This is solely to support custom edit views which get server-rendered\n\nexport function EditForm({\n  resetUploadEdits,\n  submitted,\n  updateUploadEdits,\n  uploadEdits,\n}: EditFormProps) {\n  const {\n    action,\n    collectionSlug: docSlug,\n    docPermissions,\n    getDocPreferences,\n    hasSavePermission,\n    initialState,\n    isInitializing,\n    Upload: CustomUpload,\n  } = useDocumentInfo()\n\n  const { drawerSlug, onSave: onSaveFromContext } = useDocumentDrawerContext()\n\n  const { getFormState } = useServerFunctions()\n\n  const {\n    config: { folders },\n    getEntityConfig,\n  } = useConfig()\n\n  const abortOnChangeRef = React.useRef<AbortController>(null)\n\n  const collectionConfig = getEntityConfig({ collectionSlug: docSlug })\n  const { reportUpdate } = useDocumentEvents()\n\n  const collectionSlug = collectionConfig.slug\n\n  const [schemaPath] = React.useState(collectionSlug)\n\n  const onSave = useCallback(\n    (json) => {\n      reportUpdate({\n        doc: json?.doc || json?.result,\n        drawerSlug,\n        entitySlug: collectionSlug,\n        operation: 'create',\n        updatedAt: json?.result?.updatedAt || new Date().toISOString(),\n      })\n\n      if (typeof onSaveFromContext === 'function') {\n        void onSaveFromContext({\n          ...json,\n          operation: 'create',\n        })\n      }\n      resetUploadEdits()\n    },\n    [collectionSlug, onSaveFromContext, reportUpdate, resetUploadEdits, drawerSlug],\n  )\n\n  const onChange: NonNullable<FormProps['onChange']>[0] = useCallback(\n    async ({ formState: prevFormState, submitted }) => {\n      const controller = handleAbortRef(abortOnChangeRef)\n\n      const docPreferences = await getDocPreferences()\n\n      const { state: newFormState } = await getFormState({\n        collectionSlug,\n        docPermissions,\n        docPreferences,\n        formState: prevFormState,\n        operation: 'create',\n        schemaPath,\n        signal: controller.signal,\n        skipValidation: !submitted,\n      })\n\n      abortOnChangeRef.current = null\n\n      return newFormState\n    },\n    [collectionSlug, schemaPath, getDocPreferences, getFormState, docPermissions],\n  )\n\n  useEffect(() => {\n    const abortOnChange = abortOnChangeRef.current\n\n    return () => {\n      abortAndIgnore(abortOnChange)\n    }\n  }, [])\n\n  return (\n    <OperationProvider operation=\"create\">\n      <Form\n        action={action}\n        className={`${baseClass}__form`}\n        disabled={isInitializing || !hasSavePermission}\n        initialState={isInitializing ? undefined : initialState}\n        isInitializing={isInitializing}\n        method=\"POST\"\n        onChange={[onChange]}\n        onSuccess={onSave}\n        submitted={submitted}\n      >\n        <DocumentFields\n          BeforeFields={\n            <React.Fragment>\n              {CustomUpload || (\n                <Upload_v4\n                  collectionSlug={collectionConfig.slug}\n                  customActions={[\n                    folders && collectionConfig.folders && (\n                      <MoveDocToFolder\n                        buttonProps={{\n                          buttonStyle: 'pill',\n                          size: 'small',\n                        }}\n                        folderCollectionSlug={folders.slug}\n                        folderFieldName={folders.fieldName}\n                        key=\"move-doc-to-folder\"\n                      />\n                    ),\n                  ].filter(Boolean)}\n                  initialState={initialState}\n                  resetUploadEdits={resetUploadEdits}\n                  updateUploadEdits={updateUploadEdits}\n                  uploadConfig={collectionConfig.upload}\n                  uploadEdits={uploadEdits}\n                />\n              )}\n            </React.Fragment>\n          }\n          docPermissions={docPermissions}\n          fields={collectionConfig.fields}\n          schemaPathSegments={[collectionConfig.slug]}\n        />\n        <ReportAllErrors />\n        <GetFieldProxy />\n      </Form>\n    </OperationProvider>\n  )\n}\n\nfunction GetFieldProxy() {\n  const { getField, getFields } = useForm()\n  const { getFormDataRef } = useFormsManager()\n\n  useEffect(() => {\n    // eslint-disable-next-line react-compiler/react-compiler -- TODO: fix\n    getFormDataRef.current = getFields\n  }, [getFields, getField, getFormDataRef])\n\n  return null\n}\n\nfunction ReportAllErrors() {\n  const { docConfig } = useDocumentInfo()\n  const { activeIndex, forms, setFormTotalErrorCount } = useFormsManager()\n  const errorCountRef = React.useRef(0)\n\n  const fileIsValid = useMemo(() => {\n    const currentForm = forms[activeIndex]\n    return currentForm?.formState?.file?.valid ?? true\n  }, [activeIndex, forms])\n\n  const reportFormErrorCount = React.useCallback(\n    (fieldErrorCount: number) => {\n      let newErrorCount = fieldErrorCount\n      // If the file is invalid, count that as an error\n      if (!fileIsValid) {\n        newErrorCount += 1\n      }\n      if (newErrorCount === errorCountRef.current) {\n        return\n      }\n      setFormTotalErrorCount({ errorCount: newErrorCount, index: activeIndex })\n      errorCountRef.current = newErrorCount\n    },\n    [activeIndex, setFormTotalErrorCount, fileIsValid],\n  )\n\n  if (!docConfig) {\n    return null\n  }\n\n  return (\n    <WatchChildErrors fields={docConfig.fields} path={[]} setErrorCount={reportFormErrorCount} />\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useCallback","useEffect","useMemo","Form","useForm","WatchChildErrors","useConfig","useDocumentEvents","useDocumentInfo","OperationProvider","useServerFunctions","abortAndIgnore","handleAbortRef","useDocumentDrawerContext","DocumentFields","Upload_v4","useFormsManager","baseClass","EditForm","BeforeDocumentMeta","resetUploadEdits","submitted","updateUploadEdits","uploadEdits","action","collectionSlug","docSlug","docPermissions","getDocPreferences","hasSavePermission","initialState","isInitializing","Upload","CustomUpload","drawerSlug","onSave","onSaveFromContext","getFormState","getEntityConfig","abortOnChangeRef","useRef","collectionConfig","reportUpdate","slug","schemaPath","useState","json","doc","result","entitySlug","operation","updatedAt","Date","toISOString","onChange","formState","prevFormState","controller","docPreferences","state","newFormState","signal","skipValidation","current","abortOnChange","_jsx","_jsxs","className","disabled","undefined","method","onSuccess","BeforeFields","Fragment","customActions","filter","Boolean","uploadConfig","upload","fields","schemaPathSegments","ReportAllErrors","GetFieldProxy","$","getField","getFields","getFormDataRef","t0","t1","docConfig","activeIndex","forms","setFormTotalErrorCount","errorCountRef","fileIsValid","currentForm","file","valid","reportFormErrorCount","fieldErrorCount","newErrorCount","errorCount","index","path","setErrorCount"],"sources":["../../../../src/elements/BulkUpload/EditForm/index.tsx"],"sourcesContent":["'use client'\n\nimport React, { useCallback, useEffect, useMemo } from 'react'\n\nimport type { EditFormProps } from './types.js'\n\nimport { Form, useForm } from '../../../forms/Form/index.js'\nimport { type FormProps } from '../../../forms/Form/types.js'\nimport { WatchChildErrors } from '../../../forms/WatchChildErrors/index.js'\nimport { useConfig } from '../../../providers/Config/index.js'\nimport { useDocumentEvents } from '../../../providers/DocumentEvents/index.js'\nimport { useDocumentInfo } from '../../../providers/DocumentInfo/index.js'\nimport { OperationProvider } from '../../../providers/Operation/index.js'\nimport { useServerFunctions } from '../../../providers/ServerFunctions/index.js'\nimport { abortAndIgnore, handleAbortRef } from '../../../utilities/abortAndIgnore.js'\nimport { useDocumentDrawerContext } from '../../DocumentDrawer/Provider.js'\nimport { DocumentFields } from '../../DocumentFields/index.js'\nimport { Upload_v4 } from '../../Upload/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport './index.scss'\n\nconst baseClass = 'collection-edit'\n\n// This component receives props only on _pages_\n// When rendered within a drawer, props are empty\n// This is solely to support custom edit views which get server-rendered\n\nexport function EditForm({\n  BeforeDocumentMeta,\n  resetUploadEdits,\n  submitted,\n  updateUploadEdits,\n  uploadEdits,\n}: EditFormProps) {\n  const {\n    action,\n    collectionSlug: docSlug,\n    docPermissions,\n    getDocPreferences,\n    hasSavePermission,\n    initialState,\n    isInitializing,\n    Upload: CustomUpload,\n  } = useDocumentInfo()\n\n  const { drawerSlug, onSave: onSaveFromContext } = useDocumentDrawerContext()\n\n  const { getFormState } = useServerFunctions()\n\n  const { getEntityConfig } = useConfig()\n\n  const abortOnChangeRef = React.useRef<AbortController>(null)\n\n  const collectionConfig = getEntityConfig({ collectionSlug: docSlug })\n  const { reportUpdate } = useDocumentEvents()\n\n  const collectionSlug = collectionConfig.slug\n\n  const [schemaPath] = React.useState(collectionSlug)\n\n  const onSave = useCallback(\n    (json) => {\n      reportUpdate({\n        doc: json?.doc || json?.result,\n        drawerSlug,\n        entitySlug: collectionSlug,\n        operation: 'create',\n        updatedAt: json?.result?.updatedAt || new Date().toISOString(),\n      })\n\n      if (typeof onSaveFromContext === 'function') {\n        void onSaveFromContext({\n          ...json,\n          operation: 'create',\n        })\n      }\n      resetUploadEdits()\n    },\n    [collectionSlug, onSaveFromContext, reportUpdate, resetUploadEdits, drawerSlug],\n  )\n\n  const onChange: NonNullable<FormProps['onChange']>[0] = useCallback(\n    async ({ formState: prevFormState, submitted }) => {\n      const controller = handleAbortRef(abortOnChangeRef)\n\n      const docPreferences = await getDocPreferences()\n\n      const { state: newFormState } = await getFormState({\n        collectionSlug,\n        docPermissions,\n        docPreferences,\n        formState: prevFormState,\n        operation: 'create',\n        schemaPath,\n        signal: controller.signal,\n        skipValidation: !submitted,\n      })\n\n      abortOnChangeRef.current = null\n\n      return newFormState\n    },\n    [collectionSlug, schemaPath, getDocPreferences, getFormState, docPermissions],\n  )\n\n  useEffect(() => {\n    const abortOnChange = abortOnChangeRef.current\n\n    return () => {\n      abortAndIgnore(abortOnChange)\n    }\n  }, [])\n\n  return (\n    <OperationProvider operation=\"create\">\n      <Form\n        action={action}\n        className={`${baseClass}__form`}\n        disabled={isInitializing || !hasSavePermission}\n        initialState={isInitializing ? undefined : initialState}\n        isInitializing={isInitializing}\n        method=\"POST\"\n        onChange={[onChange]}\n        onSuccess={onSave}\n        submitted={submitted}\n      >\n        <DocumentFields\n          BeforeFields={\n            <React.Fragment>\n              {CustomUpload || (\n                <Upload_v4\n                  collectionSlug={collectionConfig.slug}\n                  customActions={[BeforeDocumentMeta].filter(Boolean)}\n                  initialState={initialState}\n                  resetUploadEdits={resetUploadEdits}\n                  updateUploadEdits={updateUploadEdits}\n                  uploadConfig={collectionConfig.upload}\n                  uploadEdits={uploadEdits}\n                />\n              )}\n            </React.Fragment>\n          }\n          docPermissions={docPermissions}\n          fields={collectionConfig.fields}\n          schemaPathSegments={[collectionConfig.slug]}\n        />\n        <ReportAllErrors />\n        <GetFieldProxy />\n      </Form>\n    </OperationProvider>\n  )\n}\n\nfunction GetFieldProxy() {\n  const { getField, getFields } = useForm()\n  const { getFormDataRef } = useFormsManager()\n\n  useEffect(() => {\n    // eslint-disable-next-line react-compiler/react-compiler -- TODO: fix\n    getFormDataRef.current = getFields\n  }, [getFields, getField, getFormDataRef])\n\n  return null\n}\n\nfunction ReportAllErrors() {\n  const { docConfig } = useDocumentInfo()\n  const { activeIndex, forms, setFormTotalErrorCount } = useFormsManager()\n  const errorCountRef = React.useRef(0)\n\n  const fileIsValid = useMemo(() => {\n    const currentForm = forms[activeIndex]\n    return currentForm?.formState?.file?.valid ?? true\n  }, [activeIndex, forms])\n\n  const reportFormErrorCount = React.useCallback(\n    (fieldErrorCount: number) => {\n      let newErrorCount = fieldErrorCount\n      // If the file is invalid, count that as an error\n      if (!fileIsValid) {\n        newErrorCount += 1\n      }\n      if (newErrorCount === errorCountRef.current) {\n        return\n      }\n      setFormTotalErrorCount({ errorCount: newErrorCount, index: activeIndex })\n      errorCountRef.current = newErrorCount\n    },\n    [activeIndex, setFormTotalErrorCount, fileIsValid],\n  )\n\n  if (!docConfig) {\n    return null\n  }\n\n  return (\n    <WatchChildErrors fields={docConfig.fields} path={[]} setErrorCount={reportFormErrorCount} />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/BulkUpload/EditForm/types.d.ts

@@ -1,5 +1,6 @@
 import type { UploadProps_v4 } from '../../Upload/index.js';
 export type EditFormProps = {
+    readonly BeforeDocumentMeta?: React.ReactNode;
     readonly submitted?: boolean;
 } & Pick<UploadProps_v4, 'resetUploadEdits' | 'updateUploadEdits' | 'uploadEdits'>;
 //# sourceMappingURL=types.d.ts.map

package/dist/elements/BulkUpload/EditForm/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditForm/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;CAC7B,GAAG,IAAI,CAAC,cAAc,EAAE,kBAAkB,GAAG,mBAAmB,GAAG,aAAa,CAAC,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditForm/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAA;AAE3D,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,CAAC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7C,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAA;CAC7B,GAAG,IAAI,CAAC,cAAc,EAAE,kBAAkB,GAAG,mBAAmB,GAAG,aAAa,CAAC,CAAA"}

package/dist/elements/BulkUpload/EditForm/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/BulkUpload/EditForm/types.ts"],"sourcesContent":["import type { UploadProps_v4 } from '../../Upload/index.js'\n\nexport type EditFormProps = {\n  readonly submitted?: boolean\n} & Pick<UploadProps_v4, 'resetUploadEdits' | 'updateUploadEdits' | 'uploadEdits'>\n"],"mappings":"AAEA","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/elements/BulkUpload/EditForm/types.ts"],"sourcesContent":["import type { UploadProps_v4 } from '../../Upload/index.js'\n\nexport type EditFormProps = {\n  readonly BeforeDocumentMeta?: React.ReactNode\n  readonly submitted?: boolean\n} & Pick<UploadProps_v4, 'resetUploadEdits' | 'updateUploadEdits' | 'uploadEdits'>\n"],"mappings":"AAEA","ignoreList":[]}

package/dist/elements/BulkUpload/EditMany/DrawerContent.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
 import type { State } from '../FormsManager/reducer.js';
 import type { EditManyBulkUploadsProps } from './index.js';
 import './index.scss';
-import '../../../forms/RenderFields/index.scss';
+import '../../../forms/RenderFields/index.css';
 export declare const EditManyBulkUploadsDrawerContent: React.FC<{
     collection: ClientCollectionConfig;
     drawerSlug: string;

package/dist/elements/BulkUpload/EditMany/DrawerContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditMany/DrawerContent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAc,MAAM,SAAS,CAAA;AAKjE,OAAO,KAAoD,MAAM,OAAO,CAAA;AAKxE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAA;AAc1D,OAAO,cAAc,CAAA;AACrB,OAAO,wCAAwC,CAAA;AAE/C,eAAO,MAAM,gCAAgC,EAAE,KAAK,CAAC,EAAE,CACrD;IACE,UAAU,EAAE,sBAAsB,CAAA;IAClC,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAA;CACtB,GAAG,wBAAwB,CA2K7B,CAAA"}
+{"version":3,"file":"DrawerContent.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditMany/DrawerContent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAc,MAAM,SAAS,CAAA;AAKjE,OAAO,KAAoD,MAAM,OAAO,CAAA;AAKxE,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AACvD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,YAAY,CAAA;AAc1D,OAAO,cAAc,CAAA;AACrB,OAAO,uCAAuC,CAAA;AAE9C,eAAO,MAAM,gCAAgC,EAAE,KAAK,CAAC,EAAE,CACrD;IACE,UAAU,EAAE,sBAAsB,CAAA;IAClC,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAA;CACtB,GAAG,wBAAwB,CA2K7B,CAAA"}

package/dist/elements/BulkUpload/EditMany/DrawerContent.js

@@ -18,7 +18,7 @@ import { FieldSelect } from '../../FieldSelect/index.js';
 import { useFormsManager } from '../FormsManager/index.js';
 import { baseClass } from './index.js';
 import './index.scss';
-import '../../../forms/RenderFields/index.scss';
+import '../../../forms/RenderFields/index.css';
 export const EditManyBulkUploadsDrawerContent = props => {
   const {
     collection: {

package/dist/elements/BulkUpload/EditMany/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.js","names":["useModal","getTranslation","unflatten","React","useCallback","useEffect","useMemo","useState","Button","Form","FieldPathContext","RenderField","XIcon","useAuth","useServerFunctions","useTranslation","abortAndIgnore","handleAbortRef","FieldSelect","useFormsManager","baseClass","EditManyBulkUploadsDrawerContent","props","collection","fields","labels","plural","singular","drawerSlug","forms","isInitializing","setIsInitializing","permissions","i18n","t","closeModal","bulkUpdateForm","getFormState","abortFormStateRef","useRef","selectedFields","setSelectedFields","collectionPermissions","collections","slug","select","reduce","acc","option","value","path","onChange","formState","prevFormState","submitted","controller","state","collectionSlug","docPermissions","docPreferences","operation","schemaPath","signal","skipValidation","current","abortFormState","handleSubmit","pairedData","onFieldSelect","dispatchFields","selected","type","_jsxs","className","_jsx","count","length","label","id","onClick","onSubmit","undefined","map","i","field","fieldPermissions","clientFieldConfig","indexPath","parentPath","parentSchemaPath"],"sources":["../../../../src/elements/BulkUpload/EditMany/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig, SelectType } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { unflatten } from 'payload/shared'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\n\nimport type { FormProps } from '../../../forms/Form/index.js'\nimport type { OnFieldSelect } from '../../FieldSelect/index.js'\nimport type { FieldOption } from '../../FieldSelect/reduceFieldOptions.js'\nimport type { State } from '../FormsManager/reducer.js'\nimport type { EditManyBulkUploadsProps } from './index.js'\n\nimport { Button } from '../../../elements/Button/index.js'\nimport { Form } from '../../../forms/Form/index.js'\nimport { FieldPathContext } from '../../../forms/RenderFields/context.js'\nimport { RenderField } from '../../../forms/RenderFields/RenderField.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useAuth } from '../../../providers/Auth/index.js'\nimport { useServerFunctions } from '../../../providers/ServerFunctions/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { abortAndIgnore, handleAbortRef } from '../../../utilities/abortAndIgnore.js'\nimport { FieldSelect } from '../../FieldSelect/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { baseClass } from './index.js'\nimport './index.scss'\nimport '../../../forms/RenderFields/index.scss'\n\nexport const EditManyBulkUploadsDrawerContent: React.FC<\n  {\n    collection: ClientCollectionConfig\n    drawerSlug: string\n    forms: State['forms']\n  } & EditManyBulkUploadsProps\n> = (props) => {\n  const {\n    collection: { fields, labels: { plural, singular } } = {},\n    collection,\n    drawerSlug,\n    forms,\n  } = props\n\n  const [isInitializing, setIsInitializing] = useState(false)\n  const { permissions } = useAuth()\n  const { i18n, t } = useTranslation()\n  const { closeModal } = useModal()\n  const { bulkUpdateForm } = useFormsManager()\n  const { getFormState } = useServerFunctions()\n  const abortFormStateRef = React.useRef<AbortController>(null)\n\n  const [selectedFields, setSelectedFields] = useState<FieldOption[]>([])\n  const collectionPermissions = permissions?.collections?.[collection.slug]\n\n  const select = useMemo<SelectType>(() => {\n    return unflatten(\n      selectedFields.reduce((acc, option) => {\n        acc[option.value.path] = true\n        return acc\n      }, {} as SelectType),\n    )\n  }, [selectedFields])\n\n  const onChange: FormProps['onChange'][0] = useCallback(\n    async ({ formState: prevFormState, submitted }) => {\n      const controller = handleAbortRef(abortFormStateRef)\n\n      const { state } = await getFormState({\n        collectionSlug: collection.slug,\n        docPermissions: collectionPermissions,\n        docPreferences: null,\n        formState: prevFormState,\n        operation: 'update',\n        schemaPath: collection.slug,\n        select,\n        signal: controller.signal,\n        skipValidation: !submitted,\n      })\n\n      abortFormStateRef.current = null\n\n      return state\n    },\n    [getFormState, collection, collectionPermissions, select],\n  )\n\n  useEffect(() => {\n    const abortFormState = abortFormStateRef.current\n\n    return () => {\n      abortAndIgnore(abortFormState)\n    }\n  }, [])\n\n  const handleSubmit: FormProps['onSubmit'] = useCallback(\n    (formState) => {\n      const pairedData = selectedFields.reduce((acc, option) => {\n        if (formState[option.value.path]) {\n          acc[option.value.path] = formState[option.value.path].value\n        }\n        return acc\n      }, {})\n\n      void bulkUpdateForm(pairedData, () => closeModal(drawerSlug))\n    },\n    [closeModal, drawerSlug, bulkUpdateForm, selectedFields],\n  )\n\n  const onFieldSelect = useCallback<OnFieldSelect>(\n    async ({ dispatchFields, formState, selected }) => {\n      setIsInitializing(true)\n\n      setSelectedFields(selected || [])\n\n      const { state } = await getFormState({\n        collectionSlug: collection.slug,\n        docPermissions: collectionPermissions,\n        docPreferences: null,\n        formState,\n        operation: 'update',\n        schemaPath: collection.slug,\n        select: unflatten(\n          selected.reduce((acc, option) => {\n            acc[option.value.path] = true\n            return acc\n          }, {} as SelectType),\n        ),\n        skipValidation: true,\n      })\n\n      dispatchFields({\n        type: 'UPDATE_MANY',\n        formState: state,\n      })\n\n      setIsInitializing(false)\n    },\n    [getFormState, collection, collectionPermissions],\n  )\n\n  return (\n    <div className={`${baseClass}__main`}>\n      <div className={`${baseClass}__header`}>\n        <h2 className={`${baseClass}__header__title`}>\n          {t('general:editingLabel', {\n            count: forms.length,\n            label: getTranslation(forms.length > 1 ? plural : singular, i18n),\n          })}\n        </h2>\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__header__close`}\n          id={`close-drawer__${drawerSlug}`}\n          onClick={() => closeModal(drawerSlug)}\n          type=\"button\"\n        >\n          <XIcon />\n        </button>\n      </div>\n      <Form\n        className={`${baseClass}__form`}\n        isInitializing={isInitializing}\n        onChange={[onChange]}\n        onSubmit={handleSubmit}\n      >\n        <FieldSelect\n          fields={fields}\n          onChange={onFieldSelect}\n          permissions={collectionPermissions.fields}\n        />\n        {selectedFields.length === 0 ? null : (\n          <div className=\"render-fields\">\n            <FieldPathContext value={undefined}>\n              {selectedFields.map((option, i) => {\n                const {\n                  value: { field, fieldPermissions, path },\n                } = option\n\n                return (\n                  <RenderField\n                    clientFieldConfig={field}\n                    indexPath=\"\"\n                    key={`${path}-${i}`}\n                    parentPath=\"\"\n                    parentSchemaPath=\"\"\n                    path={path}\n                    permissions={fieldPermissions}\n                  />\n                )\n              })}\n            </FieldPathContext>\n          </div>\n        )}\n        <div className={`${baseClass}__sidebar-wrap`}>\n          <div className={`${baseClass}__sidebar`}>\n            <div className={`${baseClass}__sidebar-sticky-wrap`}>\n              <div className={`${baseClass}__document-actions`}>\n                <Button type=\"submit\">{t('general:applyChanges')}</Button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Form>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DrawerContent.js","names":["useModal","getTranslation","unflatten","React","useCallback","useEffect","useMemo","useState","Button","Form","FieldPathContext","RenderField","XIcon","useAuth","useServerFunctions","useTranslation","abortAndIgnore","handleAbortRef","FieldSelect","useFormsManager","baseClass","EditManyBulkUploadsDrawerContent","props","collection","fields","labels","plural","singular","drawerSlug","forms","isInitializing","setIsInitializing","permissions","i18n","t","closeModal","bulkUpdateForm","getFormState","abortFormStateRef","useRef","selectedFields","setSelectedFields","collectionPermissions","collections","slug","select","reduce","acc","option","value","path","onChange","formState","prevFormState","submitted","controller","state","collectionSlug","docPermissions","docPreferences","operation","schemaPath","signal","skipValidation","current","abortFormState","handleSubmit","pairedData","onFieldSelect","dispatchFields","selected","type","_jsxs","className","_jsx","count","length","label","id","onClick","onSubmit","undefined","map","i","field","fieldPermissions","clientFieldConfig","indexPath","parentPath","parentSchemaPath"],"sources":["../../../../src/elements/BulkUpload/EditMany/DrawerContent.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig, SelectType } from 'payload'\n\nimport { useModal } from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { unflatten } from 'payload/shared'\nimport React, { useCallback, useEffect, useMemo, useState } from 'react'\n\nimport type { FormProps } from '../../../forms/Form/index.js'\nimport type { OnFieldSelect } from '../../FieldSelect/index.js'\nimport type { FieldOption } from '../../FieldSelect/reduceFieldOptions.js'\nimport type { State } from '../FormsManager/reducer.js'\nimport type { EditManyBulkUploadsProps } from './index.js'\n\nimport { Button } from '../../../elements/Button/index.js'\nimport { Form } from '../../../forms/Form/index.js'\nimport { FieldPathContext } from '../../../forms/RenderFields/context.js'\nimport { RenderField } from '../../../forms/RenderFields/RenderField.js'\nimport { XIcon } from '../../../icons/X/index.js'\nimport { useAuth } from '../../../providers/Auth/index.js'\nimport { useServerFunctions } from '../../../providers/ServerFunctions/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { abortAndIgnore, handleAbortRef } from '../../../utilities/abortAndIgnore.js'\nimport { FieldSelect } from '../../FieldSelect/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { baseClass } from './index.js'\nimport './index.scss'\nimport '../../../forms/RenderFields/index.css'\n\nexport const EditManyBulkUploadsDrawerContent: React.FC<\n  {\n    collection: ClientCollectionConfig\n    drawerSlug: string\n    forms: State['forms']\n  } & EditManyBulkUploadsProps\n> = (props) => {\n  const {\n    collection: { fields, labels: { plural, singular } } = {},\n    collection,\n    drawerSlug,\n    forms,\n  } = props\n\n  const [isInitializing, setIsInitializing] = useState(false)\n  const { permissions } = useAuth()\n  const { i18n, t } = useTranslation()\n  const { closeModal } = useModal()\n  const { bulkUpdateForm } = useFormsManager()\n  const { getFormState } = useServerFunctions()\n  const abortFormStateRef = React.useRef<AbortController>(null)\n\n  const [selectedFields, setSelectedFields] = useState<FieldOption[]>([])\n  const collectionPermissions = permissions?.collections?.[collection.slug]\n\n  const select = useMemo<SelectType>(() => {\n    return unflatten(\n      selectedFields.reduce((acc, option) => {\n        acc[option.value.path] = true\n        return acc\n      }, {} as SelectType),\n    )\n  }, [selectedFields])\n\n  const onChange: FormProps['onChange'][0] = useCallback(\n    async ({ formState: prevFormState, submitted }) => {\n      const controller = handleAbortRef(abortFormStateRef)\n\n      const { state } = await getFormState({\n        collectionSlug: collection.slug,\n        docPermissions: collectionPermissions,\n        docPreferences: null,\n        formState: prevFormState,\n        operation: 'update',\n        schemaPath: collection.slug,\n        select,\n        signal: controller.signal,\n        skipValidation: !submitted,\n      })\n\n      abortFormStateRef.current = null\n\n      return state\n    },\n    [getFormState, collection, collectionPermissions, select],\n  )\n\n  useEffect(() => {\n    const abortFormState = abortFormStateRef.current\n\n    return () => {\n      abortAndIgnore(abortFormState)\n    }\n  }, [])\n\n  const handleSubmit: FormProps['onSubmit'] = useCallback(\n    (formState) => {\n      const pairedData = selectedFields.reduce((acc, option) => {\n        if (formState[option.value.path]) {\n          acc[option.value.path] = formState[option.value.path].value\n        }\n        return acc\n      }, {})\n\n      void bulkUpdateForm(pairedData, () => closeModal(drawerSlug))\n    },\n    [closeModal, drawerSlug, bulkUpdateForm, selectedFields],\n  )\n\n  const onFieldSelect = useCallback<OnFieldSelect>(\n    async ({ dispatchFields, formState, selected }) => {\n      setIsInitializing(true)\n\n      setSelectedFields(selected || [])\n\n      const { state } = await getFormState({\n        collectionSlug: collection.slug,\n        docPermissions: collectionPermissions,\n        docPreferences: null,\n        formState,\n        operation: 'update',\n        schemaPath: collection.slug,\n        select: unflatten(\n          selected.reduce((acc, option) => {\n            acc[option.value.path] = true\n            return acc\n          }, {} as SelectType),\n        ),\n        skipValidation: true,\n      })\n\n      dispatchFields({\n        type: 'UPDATE_MANY',\n        formState: state,\n      })\n\n      setIsInitializing(false)\n    },\n    [getFormState, collection, collectionPermissions],\n  )\n\n  return (\n    <div className={`${baseClass}__main`}>\n      <div className={`${baseClass}__header`}>\n        <h2 className={`${baseClass}__header__title`}>\n          {t('general:editingLabel', {\n            count: forms.length,\n            label: getTranslation(forms.length > 1 ? plural : singular, i18n),\n          })}\n        </h2>\n        <button\n          aria-label={t('general:close')}\n          className={`${baseClass}__header__close`}\n          id={`close-drawer__${drawerSlug}`}\n          onClick={() => closeModal(drawerSlug)}\n          type=\"button\"\n        >\n          <XIcon />\n        </button>\n      </div>\n      <Form\n        className={`${baseClass}__form`}\n        isInitializing={isInitializing}\n        onChange={[onChange]}\n        onSubmit={handleSubmit}\n      >\n        <FieldSelect\n          fields={fields}\n          onChange={onFieldSelect}\n          permissions={collectionPermissions.fields}\n        />\n        {selectedFields.length === 0 ? null : (\n          <div className=\"render-fields\">\n            <FieldPathContext value={undefined}>\n              {selectedFields.map((option, i) => {\n                const {\n                  value: { field, fieldPermissions, path },\n                } = option\n\n                return (\n                  <RenderField\n                    clientFieldConfig={field}\n                    indexPath=\"\"\n                    key={`${path}-${i}`}\n                    parentPath=\"\"\n                    parentSchemaPath=\"\"\n                    path={path}\n                    permissions={fieldPermissions}\n                  />\n                )\n              })}\n            </FieldPathContext>\n          </div>\n        )}\n        <div className={`${baseClass}__sidebar-wrap`}>\n          <div className={`${baseClass}__sidebar`}>\n            <div className={`${baseClass}__sidebar-sticky-wrap`}>\n              <div className={`${baseClass}__document-actions`}>\n                <Button type=\"submit\">{t('general:applyChanges')}</Button>\n              </div>\n            </div>\n          </div>\n        </div>\n      </Form>\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/BulkUpload/EditMany/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditMany/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAErD,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,2BAA2B,CAAA;AAEjD,MAAM,MAAM,wBAAwB,GAAG;IACrC,QAAQ,CAAC,UAAU,EAAE,sBAAsB,CAAA;CAC5C,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAqClE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/EditMany/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AAErD,OAAO,KAAK,MAAM,OAAO,CAAA;AAQzB,OAAO,cAAc,CAAA;AAErB,eAAO,MAAM,SAAS,2BAA2B,CAAA;AAEjD,MAAM,MAAM,wBAAwB,GAAG;IACrC,QAAQ,CAAC,UAAU,EAAE,sBAAsB,CAAA;CAC5C,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CAsClE,CAAA"}

package/dist/elements/BulkUpload/EditMany/index.js

@@ -41,6 +41,7 @@ export const EditManyBulkUploads = props => {
       className: baseClass,
       children: [_jsx(DrawerToggler, {
         "aria-label": t("general:editAll"),
+        buttonStyle: "secondary",
         className: `${baseClass}__toggle`,
         slug: drawerSlug,
         children: t("general:editAll")

package/dist/elements/BulkUpload/EditMany/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","React","useAuth","EditDepthProvider","useTranslation","Drawer","DrawerToggler","useFormsManager","EditManyBulkUploadsDrawerContent","baseClass","EditManyBulkUploads","props","$","collection","t0","slug","undefined","permissions","t","forms","collectionPermissions","collections","hasUpdatePermission","update","drawerSlug","t1","_jsxs","className","children","_jsx","Header"],"sources":["../../../../src/elements/BulkUpload/EditMany/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig } from 'payload'\n\nimport React from 'react'\n\nimport { useAuth } from '../../../providers/Auth/index.js'\nimport { EditDepthProvider } from '../../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Drawer, DrawerToggler } from '../../Drawer/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { EditManyBulkUploadsDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'edit-many-bulk-uploads'\n\nexport type EditManyBulkUploadsProps = {\n  readonly collection: ClientCollectionConfig\n}\n\nexport const EditManyBulkUploads: React.FC<EditManyBulkUploadsProps> = (props) => {\n  const { collection: { slug } = {}, collection } = props\n\n  const { permissions } = useAuth()\n\n  const { t } = useTranslation()\n  const { forms } = useFormsManager() // Access forms managed in bulk uploads\n\n  const collectionPermissions = permissions?.collections?.[slug]\n  const hasUpdatePermission = collectionPermissions?.update\n\n  const drawerSlug = `edit-${slug}-bulk-uploads`\n\n  if (!hasUpdatePermission) {\n    return null\n  }\n\n  return (\n    <div className={baseClass}>\n      <DrawerToggler\n        aria-label={t('general:editAll')}\n        className={`${baseClass}__toggle`}\n        slug={drawerSlug}\n      >\n        {t('general:editAll')}\n      </DrawerToggler>\n      <EditDepthProvider>\n        <Drawer Header={null} slug={drawerSlug}>\n          <EditManyBulkUploadsDrawerContent\n            collection={collection}\n            drawerSlug={drawerSlug}\n            forms={forms}\n          />\n        </Drawer>\n      </EditDepthProvider>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,EAAEC,aAAa,QAAQ;AACtC,SAASC,eAAe,QAAQ;AAChC,SAASC,gCAAgC,QAAQ;AACjD,OAAO;AAEP,OAAO,MAAMC,SAAA,GAAY;AAMzB,OAAO,MAAMC,mBAAA,GAA0DC,KAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EACrE;IAAAa,UAAA,EAAAC,EAAA;IAAAD;EAAA,IAAkDF,KAAA;EAA9B;IAAAI;EAAA,IAAAD,EAAa,KAAAE,SAAA,QAAbF,EAAa;EAEjC;IAAAG;EAAA,IAAwBf,OAAA;EAExB;IAAAgB;EAAA,IAAcd,cAAA;EACd;IAAAe;EAAA,IAAkBZ,eAAA;EAElB,MAAAa,qBAAA,GAA8BH,WAAA,EAAAI,WAAA,GAA2BN,IAAA;EACzD,MAAAO,mBAAA,GAA4BF,qBAAA,EAAAG,MAAA;EAE5B,MAAAC,UAAA,GAAmB,QAAQT,IAAA,eAAmB;EAAA,KAEzCO,mBAAA;IAAA;EAAA;EAAA,IAAAG,EAAA;EAAA,IAAAb,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAY,UAAA,IAAAZ,CAAA,QAAAO,KAAA,IAAAP,CAAA,QAAAM,CAAA;IAKHO,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAAlB,SAAA;MAAAmB,QAAA,GACCC,IAAA,CAAAvB,aAAA;QAAA,cACcY,CAAA,CAAE;QAAAS,SAAA,EACH,GAAAlB,SAAA,UAAsB;QAAAM,IAAA,EAC3BS,UAAA;QAAAI,QAAA,EAELV,CAAA,CAAE;MAAA,C,GAELW,IAAA,CAAA1B,iBAAA;QAAAyB,QAAA,EACEC,IAAA,CAAAxB,MAAA;UAAAyB,MAAA;UAAAf,IAAA,EAA4BS,UAAA;UAAAI,QAAA,EAC1BC,IAAA,CAAArB,gCAAA;YAAAK,UAAA;YAAAW,UAAA;YAAAL;UAAA,C;;;;;;;;;;;;SAVNM,E;CAmBJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","React","useAuth","EditDepthProvider","useTranslation","Drawer","DrawerToggler","useFormsManager","EditManyBulkUploadsDrawerContent","baseClass","EditManyBulkUploads","props","$","collection","t0","slug","undefined","permissions","t","forms","collectionPermissions","collections","hasUpdatePermission","update","drawerSlug","t1","_jsxs","className","children","_jsx","buttonStyle","Header"],"sources":["../../../../src/elements/BulkUpload/EditMany/index.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientCollectionConfig } from 'payload'\n\nimport React from 'react'\n\nimport { useAuth } from '../../../providers/Auth/index.js'\nimport { EditDepthProvider } from '../../../providers/EditDepth/index.js'\nimport { useTranslation } from '../../../providers/Translation/index.js'\nimport { Drawer, DrawerToggler } from '../../Drawer/index.js'\nimport { useFormsManager } from '../FormsManager/index.js'\nimport { EditManyBulkUploadsDrawerContent } from './DrawerContent.js'\nimport './index.scss'\n\nexport const baseClass = 'edit-many-bulk-uploads'\n\nexport type EditManyBulkUploadsProps = {\n  readonly collection: ClientCollectionConfig\n}\n\nexport const EditManyBulkUploads: React.FC<EditManyBulkUploadsProps> = (props) => {\n  const { collection: { slug } = {}, collection } = props\n\n  const { permissions } = useAuth()\n\n  const { t } = useTranslation()\n  const { forms } = useFormsManager() // Access forms managed in bulk uploads\n\n  const collectionPermissions = permissions?.collections?.[slug]\n  const hasUpdatePermission = collectionPermissions?.update\n\n  const drawerSlug = `edit-${slug}-bulk-uploads`\n\n  if (!hasUpdatePermission) {\n    return null\n  }\n\n  return (\n    <div className={baseClass}>\n      <DrawerToggler\n        aria-label={t('general:editAll')}\n        buttonStyle=\"secondary\"\n        className={`${baseClass}__toggle`}\n        slug={drawerSlug}\n      >\n        {t('general:editAll')}\n      </DrawerToggler>\n      <EditDepthProvider>\n        <Drawer Header={null} slug={drawerSlug}>\n          <EditManyBulkUploadsDrawerContent\n            collection={collection}\n            drawerSlug={drawerSlug}\n            forms={forms}\n          />\n        </Drawer>\n      </EditDepthProvider>\n    </div>\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAIA,OAAOC,KAAA,MAAW;AAElB,SAASC,OAAO,QAAQ;AACxB,SAASC,iBAAiB,QAAQ;AAClC,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,EAAEC,aAAa,QAAQ;AACtC,SAASC,eAAe,QAAQ;AAChC,SAASC,gCAAgC,QAAQ;AACjD,OAAO;AAEP,OAAO,MAAMC,SAAA,GAAY;AAMzB,OAAO,MAAMC,mBAAA,GAA0DC,KAAA;EAAA,MAAAC,CAAA,GAAAZ,EAAA;EACrE;IAAAa,UAAA,EAAAC,EAAA;IAAAD;EAAA,IAAkDF,KAAA;EAA9B;IAAAI;EAAA,IAAAD,EAAa,KAAAE,SAAA,QAAbF,EAAa;EAEjC;IAAAG;EAAA,IAAwBf,OAAA;EAExB;IAAAgB;EAAA,IAAcd,cAAA;EACd;IAAAe;EAAA,IAAkBZ,eAAA;EAElB,MAAAa,qBAAA,GAA8BH,WAAA,EAAAI,WAAA,GAA2BN,IAAA;EACzD,MAAAO,mBAAA,GAA4BF,qBAAA,EAAAG,MAAA;EAE5B,MAAAC,UAAA,GAAmB,QAAQT,IAAA,eAAmB;EAAA,KAEzCO,mBAAA;IAAA;EAAA;EAAA,IAAAG,EAAA;EAAA,IAAAb,CAAA,QAAAC,UAAA,IAAAD,CAAA,QAAAY,UAAA,IAAAZ,CAAA,QAAAO,KAAA,IAAAP,CAAA,QAAAM,CAAA;IAKHO,EAAA,GAAAC,KAAA,CAAC;MAAAC,SAAA,EAAAlB,SAAA;MAAAmB,QAAA,GACCC,IAAA,CAAAvB,aAAA;QAAA,cACcY,CAAA,CAAE;QAAAY,WAAA,EACF;QAAAH,SAAA,EACD,GAAAlB,SAAA,UAAsB;QAAAM,IAAA,EAC3BS,UAAA;QAAAI,QAAA,EAELV,CAAA,CAAE;MAAA,C,GAELW,IAAA,CAAA1B,iBAAA;QAAAyB,QAAA,EACEC,IAAA,CAAAxB,MAAA;UAAA0B,MAAA;UAAAhB,IAAA,EAA4BS,UAAA;UAAAI,QAAA,EAC1BC,IAAA,CAAArB,gCAAA;YAAAK,UAAA;YAAAW,UAAA;YAAAL;UAAA,C;;;;;;;;;;;;SAXNM,E;CAoBJ","ignoreList":[]}

package/dist/elements/BulkUpload/EditMany/index.scss

@@ -2,36 +2,6 @@
 
 @layer payload-default {
   .edit-many-bulk-uploads {
-    &__toggle {
-      font-size: 1rem;
-      line-height: base(1.2);
-      display: inline-flex;
-      background: var(--theme-elevation-150);
-      color: var(--theme-elevation-800);
-      border-radius: $style-radius-s;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      border: 0;
-      padding: 0 base(0.4);
-      align-items: center;
-      cursor: pointer;
-      text-decoration: none;
-
-      &:active,
-      &:focus {
-        outline: none;
-      }
-
-      &:hover {
-        background: var(--theme-elevation-100);
-      }
-
-      &:active {
-        background: var(--theme-elevation-100);
-      }
-    }
-
     &__form {
       height: 100%;
     }

package/dist/elements/BulkUpload/FileSidebar/index.css

@@ -0,0 +1,366 @@
+@layer payload-default {
+  .file-selections {
+    --file-gutter-h: calc(var(--gutter-h) / 4);
+    border-right: 1px solid var(--theme-border-color);
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    width: 300px;
+    overflow: visible;
+    max-height: 100%;
+  }
+
+  .file-selections__header {
+    position: sticky;
+    top: 0;
+    margin-top: var(--spacer-4);
+    z-index: 1;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    background: var(--theme-bg);
+    flex-wrap: wrap;
+
+    p {
+      margin: 0;
+    }
+  }
+
+  .file-selections__collectionSelect {
+    width: 100%;
+
+    .react-select {
+      width: 100%;
+    }
+
+    .field-type__wrap {
+      width: 100%;
+      padding-block: var(--spacer-4);
+      padding-inline: var(--file-gutter-h);
+    }
+  }
+
+  .file-selections__headerTopRow {
+    display: flex;
+    align-items: flex-end;
+    justify-content: space-between;
+    gap: var(--spacer-4);
+    width: 100%;
+    padding-block: var(--spacer-4);
+    padding-inline: var(--file-gutter-h);
+  }
+
+  .file-selections__header__text {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-2);
+
+    .error-pill {
+      align-self: flex-start;
+    }
+  }
+
+  .file-selections__filesContainer {
+    display: flex;
+    flex-direction: column;
+    gap: var(--spacer-2);
+    margin-top: var(--spacer-2-5);
+    width: 100%;
+    padding-inline: var(--file-gutter-h);
+
+    .shimmer-effect {
+      border-radius: var(--radius-medium);
+    }
+  }
+
+  .file-selections__fileRowContainer {
+    --rowPadding: var(--spacer-2);
+    position: relative;
+
+    &:last-child {
+      margin-bottom: var(--spacer-2);
+    }
+  }
+
+  .file-selections__fileRow {
+    display: flex;
+    padding: var(--rowPadding);
+    align-items: center;
+    gap: var(--spacer-2-5);
+    border-radius: var(--radius-medium);
+    max-width: 100%;
+    cursor: pointer;
+    width: 100%;
+
+    &:hover {
+      background-color: var(--theme-elevation-100);
+    }
+
+    .file-selections__thumbnail,
+    .file-selections__thumbnail-shimmer {
+      width: var(--spacer-4);
+      height: var(--spacer-4);
+      border-radius: var(--radius-small);
+      flex-shrink: 0;
+      object-fit: cover;
+    }
+
+    p {
+      margin: 0;
+    }
+  }
+
+  .file-selections__fileDetails {
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+  }
+
+  .file-selections__fileRowContainer--active {
+    .file-selections__fileRow {
+      background-color: var(--theme-elevation-100);
+    }
+
+    .file-selections__remove {
+      .icon--x {
+        opacity: 1;
+      }
+    }
+  }
+
+  .file-selections__fileRowContainer--error {
+    .file-selections__fileRow {
+      background-color: var(--theme-error-100);
+    }
+
+    &.file-selections__fileRowContainer--active .file-selections__fileRow,
+    .file-selections__fileRow:hover {
+      background-color: var(--theme-error-200);
+    }
+
+    .file-selections__remove--overlay:hover {
+      background-color: var(--theme-error-50);
+
+      .icon--x {
+        opacity: 1;
+      }
+    }
+  }
+
+  .file-selections__errorCount {
+    margin-left: auto;
+    position: absolute;
+    transform: translate(50%, -50%);
+    top: 0;
+    right: 0;
+  }
+
+  .file-selections__fileName {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .file-selections__fileSize {
+    font-family: var(--text-body-small-font-family);
+    font-size: var(--text-body-small-font-size);
+    font-weight: var(--text-body-small-font-weight);
+    line-height: var(--text-body-small-line-height);
+    color: var(--theme-elevation-400);
+    flex-shrink: 0;
+  }
+
+  .file-selections__remove {
+    margin: 0;
+    margin-left: auto;
+
+    .icon--x {
+      opacity: 0.75;
+    }
+  }
+
+  .file-selections__remove--underlay {
+    pointer-events: none;
+    opacity: 0;
+  }
+
+  .file-selections__remove--overlay {
+    position: absolute;
+    transform: translateY(-50%);
+    top: 50%;
+    bottom: 50%;
+    right: var(--rowPadding);
+    height: 20px;
+    border-radius: var(--radius-medium);
+    cursor: pointer;
+
+    &:hover {
+      background-color: var(--theme-elevation-200);
+    }
+  }
+
+  .file-selections__header__actions {
+    display: flex;
+    align-items: center;
+    gap: var(--spacer-4);
+  }
+
+  .file-selections__toggler {
+    display: none;
+    margin: 0;
+    padding-block: 0;
+  }
+
+  .file-selections__toggler__text {
+    display: none;
+  }
+
+  .file-selections__header__mobileDocActions {
+    display: none;
+  }
+
+  .file-selections__animateWrapper {
+    overflow: auto;
+  }
+
+  .file-selections__mobileBlur {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    transition: opacity 100ms cubic-bezier(0, 0.2, 0.2, 1);
+
+    &::before,
+    &::after {
+      content: ' ';
+      position: absolute;
+      inset: 0;
+    }
+
+    &::before {
+      background: var(--theme-bg);
+      opacity: 0.75;
+    }
+
+    &::after {
+      backdrop-filter: blur(8px);
+    }
+  }
+
+  .file-selections__showingFiles {
+    .file-selections__mobileBlur {
+      opacity: 1;
+    }
+  }
+
+  @media (max-width: 1024px) {
+    .file-selections {
+      --file-gutter-h: var(--gutter-h);
+      flex-direction: column-reverse;
+      width: 100%;
+      position: sticky;
+      bottom: 0;
+      flex-shrink: 0;
+    }
+
+    .file-selections__showingFiles {
+      z-index: 2;
+    }
+
+    .file-selections__filesContainer {
+      &::before,
+      &::after {
+        content: ' ';
+        position: absolute;
+        inset: 0;
+      }
+
+      &::before {
+        background: var(--theme-bg);
+        opacity: 0.75;
+      }
+
+      &::after {
+        backdrop-filter: blur(8px);
+      }
+    }
+
+    .file-selections__fileRowContainer {
+      z-index: 1;
+    }
+
+    .file-selections__header {
+      margin-top: 0;
+    }
+
+    .file-selections__headerTopRow {
+      border-top: 1px solid var(--theme-border-color);
+      padding-block: 0 var(--spacer-3) 0;
+    }
+
+    .file-selections__header__text {
+      display: none;
+    }
+
+    .file-selections__header__actions {
+      flex-grow: 2;
+      display: flex;
+      justify-content: flex-end;
+    }
+
+    .file-selections__header__mobileDocActions {
+      position: relative;
+      display: flex;
+      width: 100%;
+      padding-block: var(--spacer-3);
+      padding-inline: var(--file-gutter-h);
+      border-top: 1px solid var(--theme-border-color);
+
+      > div {
+        display: flex;
+        justify-content: flex-end;
+        width: 100%;
+
+        button {
+          flex: 0.5;
+        }
+      }
+    }
+
+    .file-selections__toggler {
+      padding-right: 0;
+      padding-left: 0;
+      padding-top: var(--spacer-3);
+      padding-bottom: var(--spacer-3);
+      display: flex;
+      justify-content: flex-end;
+      flex-grow: 1;
+
+      .btn__label {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+      }
+
+      svg {
+        max-width: 1.5rem;
+      }
+
+      .btn__content {
+        width: 100%;
+      }
+    }
+
+    .file-selections__toggler__text {
+      display: flex;
+    }
+
+    .file-selections .btn {
+      margin: 0;
+    }
+  }
+}

package/dist/elements/BulkUpload/FileSidebar/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import './index.scss';
+import './index.css';
 export declare function FileSidebar(): React.JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/BulkUpload/FileSidebar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/FileSidebar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAiBzB,OAAO,cAAc,CAAA;AAQrB,wBAAgB,WAAW,sBA6M1B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/elements/BulkUpload/FileSidebar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,MAAM,OAAO,CAAA;AAgBzB,OAAO,aAAa,CAAA;AAQpB,wBAAgB,WAAW,sBA8M1B"}