@payloadcms/richtext-lexical 3.71.0-internal.e36f916 → 3.71.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/exports/client/bundled.css +1 -1
- package/dist/exports/client/chunk-2S5Q7QYO.js +2 -0
- package/dist/exports/client/chunk-2S5Q7QYO.js.map +7 -0
- package/dist/exports/client/chunk-QJ5EETIB.js +2 -0
- package/dist/exports/client/{chunk-O6XRT2H3.js.map → chunk-QJ5EETIB.js.map} +3 -3
- package/dist/exports/client/{component-YQ22OGQW.js → component-XIHC3W6W.js} +2 -2
- package/dist/exports/client/componentInline-NL25DNZ5.js +2 -0
- package/dist/exports/client/index.js +3 -3
- package/dist/exports/client/index.js.map +3 -3
- package/dist/features/blocks/client/component/index.d.ts.map +1 -1
- package/dist/features/blocks/client/component/index.js +12 -4
- package/dist/features/blocks/client/component/index.js.map +1 -1
- package/dist/features/blocks/client/componentInline/index.d.ts.map +1 -1
- package/dist/features/blocks/client/componentInline/index.js +9 -3
- package/dist/features/blocks/client/componentInline/index.js.map +1 -1
- package/dist/field/bundled.css +1 -1
- package/dist/utilities/fieldsDrawer/DrawerContent.d.ts.map +1 -1
- package/dist/utilities/fieldsDrawer/DrawerContent.js +6 -2
- package/dist/utilities/fieldsDrawer/DrawerContent.js.map +1 -1
- package/package.json +7 -7
- package/dist/exports/client/chunk-O6XRT2H3.js +0 -2
- package/dist/exports/client/chunk-TRHFMZ3F.js +0 -2
- package/dist/exports/client/chunk-TRHFMZ3F.js.map +0 -7
- package/dist/exports/client/componentInline-5OVPQNQH.js +0 -2
- /package/dist/exports/client/{component-YQ22OGQW.js.map → component-XIHC3W6W.js.map} +0 -0
- /package/dist/exports/client/{componentInline-5OVPQNQH.js.map → componentInline-NL25DNZ5.js.map} +0 -0
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{a as ie}from"./chunk-INBEEENE.js";import{b as se}from"./chunk-BZZVLW4U.js";import{jsx as s,jsxs as b,Fragment as ve}from"react/jsx-runtime";import{useLexicalComposerContext as Oe}from"@lexical/react/LexicalComposerContext";import{useLexicalEditable as $e}from"@lexical/react/useLexicalEditable";import{getTranslation as ce}from"@payloadcms/translations";import{Button as ae,Drawer as Te,EditDepthProvider as Ee,Form as Re,formatDrawerSlug as Pe,FormSubmit as Le,RenderFields as je,ShimmerEffect as Me,useConfig as Ae,useDocumentForm as Je,useDocumentInfo as Ke,useEditDepth as ze,useServerFunctions as Ve,useTranslation as He}from"@payloadcms/ui";import{abortAndIgnore as A}from"@payloadcms/ui/shared";import{$getNodeByKey as J}from"lexical";import{deepCopyObjectSimpleWithoutReactComponents as K,reduceFieldsToValues as We}from"payload/shared";import O,{createContext as qe,useCallback as z,useEffect as N,useMemo as v,useRef as _}from"react";import{v4 as Ge}from"uuid";import{jsx as ye}from"react/jsx-runtime";import Fe from"bson-objectid";import{$applyNodeReplacement as De}from"lexical";import we from"react";import{addClassNamesToElement as ge}from"@lexical/utils";import xe from"bson-objectid";import{$applyNodeReplacement as _e,DecoratorNode as Ce}from"lexical";var x=class extends Ce{__cacheBuster;__fields;constructor({cacheBuster:e,fields:n,key:t}){super(t),this.__fields=n,this.__cacheBuster=e||0}static clone(e){return new this({cacheBuster:e.__cacheBuster,fields:e.__fields,key:e.__key})}static getType(){return"inlineBlock"}static importDOM(){return{}}static importJSON(e){return Se(e.fields)}static isInline(){return!1}canIndent(){return!0}createDOM(e){let n=document.createElement("span");return ge(n,e?.theme?.inlineBlock),n}decorate(e,n){return null}exportDOM(){let e=document.createElement("span");e.classList.add("inline-block-container");let n=document.createTextNode(this.getTextContent());return e.append(n),{element:e}}exportJSON(){return{type:"inlineBlock",fields:this.getFields(),version:1}}getCacheBuster(){return this.getLatest().__cacheBuster}getFields(){return this.getLatest().__fields}getTextContent(){return"Block Field"}isInline(){return!0}setFields(e,n){let t=this.getWritable();t.__fields=e,n||t.__cacheBuster++}updateDOM(){return!1}};function Se(i){return _e(new x({fields:{...i,id:i?.id||new xe.default().toHexString()}}))}var Ie=we.lazy(()=>import("./componentInline-NL25DNZ5.js").then(i=>({default:i.InlineBlockComponent}))),I=class extends x{static clone(e){return super.clone(e)}static getType(){return super.getType()}static importJSON(e){return Ne(e.fields)}decorate(e,n){return ye(Ie,{cacheBuster:this.getCacheBuster(),className:n.theme.inlineBlock??"LexicalEditorTheme__inlineBlock",formData:this.getFields(),nodeKey:this.getKey()})}exportJSON(){return super.exportJSON()}};function Ne(i){return De(new I({fields:{...i,id:i?.id||new Fe.default().toHexString()}}))}function M(i){return i instanceof I}var ue=qe({initialState:!1}),gt=()=>O.use(ue),xt=i=>{let{cacheBuster:e,className:n,formData:t,nodeKey:d}=i,[f]=Oe(),c=$e(),{i18n:$,t:p}=He(),{createdInlineBlock:V,fieldProps:{featureClientSchemaMap:me,initialLexicalFormState:de,schemaPath:H},setCreatedInlineBlock:W,uuid:pe}=se(),{fields:C}=Je(),{getFormState:S}=Ve(),fe=ze(),q=_(!1),[a,T]=O.useState(()=>{let o=de?.[t.id]?.formState;return o?Object.fromEntries(Object.entries(o).map(([l,r])=>[l,l in t?{...r,initialValue:t[l],value:t[l]}:r])):!1}),G=_(!1),Q=_(e);N(()=>{G.current?(Q.current!==e&&T(!1),Q.current=e):G.current=!0},[e]);let[E,U]=O.useState(a?._components?.customComponents?.BlockLabel),[X,Y]=O.useState(a?._components?.customComponents?.Block),Z=Pe({slug:`lexical-inlineBlocks-create-${pe}-${t.id}`,depth:fe}),{toggleDrawer:h}=ie(Z,!0),be=_(null),{id:y,collectionSlug:F,getDocPreferences:D,globalSlug:w}=Ke(),{config:he}=Ae(),ke=`${H}.lexical_internal_feature.blocks.lexical_inline_blocks.${t.blockType}`,k=me.blocks?.[ke]?.[0],u=k.blockReferences?typeof k?.blockReferences?.[0]=="string"?he.blocksMap[k?.blockReferences?.[0]]:k?.blockReferences?.[0]:k?.blocks?.[0],ee=u?.fields??[];N(()=>{!q.current&&V?.getKey()===d&&(ee.length>2&&h(),W?.(void 0),q.current=!0)},[ee.length,V,d,W,h]);let te=z(()=>{f.update(()=>{J(d)?.remove()})},[f,d]),B=u?.labels?.singular?ce(u?.labels.singular,$):u?.slug,R=_(new AbortController),g=`${H}.lexical_internal_feature.blocks.lexical_inline_blocks.${u?.slug}.fields`;N(()=>{let o=new AbortController;return t&&!a&&(async()=>{let{state:r}=await S({id:y,collectionSlug:F,data:t,docPermissions:{fields:!0},docPreferences:await D(),documentFormState:K(C,{excludeFiles:!0}),globalSlug:w,initialBlockData:t,initialBlockFormState:t,operation:"update",readOnly:!c,renderAllFields:!0,schemaPath:g,signal:o.signal});if(r){let m=We(K(r,{excludeFiles:!0}),!0);f.update(()=>{let j=J(d);if(j&&M(j)){let le=m;le.blockType=t.blockType,j.setFields(le,!0)}}),T(r),U(r._components?.customComponents?.BlockLabel),Y(r._components?.customComponents?.Block)}})(),()=>{A(o)}},[S,f,d,c,g,y,t,a,F,w,D,C]);let ne=z(async({formState:o,submit:l})=>{A(R.current);let r=new AbortController;R.current=r;let{state:m}=await S({id:y,collectionSlug:F,docPermissions:{fields:!0},docPreferences:await D(),documentFormState:K(C,{excludeFiles:!0}),formState:o,globalSlug:w,initialBlockFormState:o,operation:"update",readOnly:!c,renderAllFields:!!l,schemaPath:g,signal:r.signal});return m?(l&&(U(m._components?.customComponents?.BlockLabel),Y(m._components?.customComponents?.Block)),m):o},[S,y,F,D,C,w,c,g]);N(()=>{let o=(l,r)=>Object.keys(r).some(m=>r[m]&&l[m]!==r[m].value);return()=>{a&&o(t,a)&&T(!1),A(R.current)}},[t,a]);let Be=z((o,l)=>{l.blockType=t.blockType,f.update(()=>{let r=J(d);r&&M(r)&&r.setFields(l,!0)})},[f,d,t]),P=v(()=>()=>s(ae,{buttonStyle:"icon-label",className:`${n}__removeButton`,disabled:!c,icon:"x",onClick:o=>{o.preventDefault(),te()},round:!0,size:"small",tooltip:p("lexical:blocks:inlineBlocks:remove",{label:B})}),[n,B,c,te,p]),oe=v(()=>()=>s(ae,{buttonStyle:"icon-label",className:`${n}__editButton`,disabled:!c,el:"button",icon:"edit",onClick:()=>{h()},round:!0,size:"small",tooltip:p("lexical:blocks:inlineBlocks:edit",{label:B})}),[n,B,c,p,h]),L=v(()=>({children:o,className:l})=>s("div",{className:[`${n}__container`,n+"-"+t.blockType,l].filter(Boolean).join(" "),ref:be,children:o}),[n,t.blockType]),re=v(()=>E?()=>E:()=>s("div",{children:u?.labels?ce(u?.labels.singular,$):""}),[E,u?.labels,$]);return u?b(Re,{beforeSubmit:[async({formState:o})=>await ne({formState:o,submit:!0})],disableValidationOnSubmit:!0,el:"div",fields:u?.fields,initialState:a||{},onChange:[ne],onSubmit:(o,l)=>{Be(o,l),h()},uuid:Ge(),children:[s(Ee,{children:s(Te,{className:"",slug:Z,title:p(`lexical:blocks:inlineBlocks:${t?.id?"edit":"create"}`,{label:B??p("lexical:blocks:inlineBlocks:label")}),children:a?b(ve,{children:[s(je,{fields:u?.fields,forceRender:!0,parentIndexPath:"",parentPath:"",parentSchemaPath:g,permissions:!0,readOnly:!c}),s(Le,{programmaticSubmit:!0,children:p("fields:saveChanges")})]}):null})}),X?s(ue,{value:{EditButton:oe,initialState:a,InlineBlockContainer:L,Label:re,nodeKey:d,RemoveButton:P},children:X}):b(L,{children:[a?s(re,{}):s(Me,{height:"15px",width:"40px"}),c?b("div",{className:`${n}__actions`,children:[s(oe,{}),s(P,{})]}):null]})]}):b(L,{className:`${n}-not-found`,children:[b("span",{children:["Error: Block '",t.blockType,"' not found"]}),c?s("div",{className:`${n}__actions`,children:s(P,{})}):null]})};export{gt as a,xt as b,I as c,Ne as d,M as e};
|
|
2
|
+
//# sourceMappingURL=chunk-2S5Q7QYO.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/features/blocks/client/componentInline/index.tsx", "../../../src/features/blocks/client/nodes/InlineBlocksNode.tsx", "../../../src/features/blocks/server/nodes/InlineBlocksNode.tsx"],
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport type { BlocksFieldClient, ClientBlock, Data, FormState } from 'payload'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n Button,\n Drawer,\n EditDepthProvider,\n Form,\n formatDrawerSlug,\n FormSubmit,\n RenderFields,\n ShimmerEffect,\n useConfig,\n useDocumentForm,\n useDocumentInfo,\n useEditDepth,\n useServerFunctions,\n useTranslation,\n} from '@payloadcms/ui'\nimport { abortAndIgnore } from '@payloadcms/ui/shared'\nimport { $getNodeByKey } from 'lexical'\n\nimport './index.scss'\n\nimport { deepCopyObjectSimpleWithoutReactComponents, reduceFieldsToValues } from 'payload/shared'\nimport React, { createContext, useCallback, useEffect, useMemo, useRef } from 'react'\nimport { v4 as uuid } from 'uuid'\n\nimport type { InlineBlockFields } from '../../server/nodes/InlineBlocksNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDrawer.js'\nimport { $isInlineBlockNode } from '../nodes/InlineBlocksNode.js'\n\ntype Props = {\n /**\n * Can be modified by the node in order to trigger the re-fetch of the initial state based on the\n * formData. This is useful when node.setFields() is explicitly called from outside of the form - in\n * this case, the new field state is likely not reflected in the form state, so we need to re-fetch\n */\n readonly cacheBuster: number\n readonly className: string\n readonly formData: InlineBlockFields\n readonly nodeKey: string\n}\n\ntype InlineBlockComponentContextType = {\n EditButton?: React.FC\n initialState: false | FormState | undefined\n InlineBlockContainer?: React.FC<{ children: React.ReactNode }>\n Label?: React.FC\n nodeKey?: string\n RemoveButton?: React.FC\n}\n\nconst InlineBlockComponentContext = createContext<InlineBlockComponentContextType>({\n initialState: false,\n})\n\nexport const useInlineBlockComponentContext = () => React.use(InlineBlockComponentContext)\n\nexport const InlineBlockComponent: React.FC<Props> = (props) => {\n const { cacheBuster, className: baseClass, formData, nodeKey } = props\n\n const [editor] = useLexicalComposerContext()\n const isEditable = useLexicalEditable()\n const { i18n, t } = useTranslation<object, string>()\n const {\n createdInlineBlock,\n fieldProps: { featureClientSchemaMap, initialLexicalFormState, schemaPath },\n setCreatedInlineBlock,\n uuid: uuidFromContext,\n } = useEditorConfigContext()\n const { fields: parentDocumentFields } = useDocumentForm()\n\n const { getFormState } = useServerFunctions()\n const editDepth = useEditDepth()\n const firstTimeDrawer = useRef(false)\n\n const [initialState, setInitialState] = React.useState<false | FormState | undefined>(() => {\n // Initial form state that was calculated server-side. May have stale values\n const cachedFormState = initialLexicalFormState?.[formData.id]?.formState\n if (!cachedFormState) {\n return false\n }\n\n // Merge current formData values into the cached form state\n // This ensures that when the component remounts (e.g., due to view changes), we don't lose user edits\n return Object.fromEntries(\n Object.entries(cachedFormState).map(([fieldName, fieldState]) => [\n fieldName,\n fieldName in formData\n ? {\n ...fieldState,\n initialValue: formData[fieldName],\n value: formData[fieldName],\n }\n : fieldState,\n ]),\n )\n })\n\n const hasMounted = useRef(false)\n const prevCacheBuster = useRef(cacheBuster)\n useEffect(() => {\n if (hasMounted.current) {\n if (prevCacheBuster.current !== cacheBuster) {\n setInitialState(false)\n }\n prevCacheBuster.current = cacheBuster\n } else {\n hasMounted.current = true\n }\n }, [cacheBuster])\n\n const [CustomLabel, setCustomLabel] = React.useState<React.ReactNode | undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.BlockLabel,\n )\n\n const [CustomBlock, setCustomBlock] = React.useState<React.ReactNode | undefined>(\n // @ts-expect-error - vestiges of when tsconfig was not strict. Feel free to improve\n initialState?.['_components']?.customComponents?.Block,\n )\n\n const drawerSlug = formatDrawerSlug({\n slug: `lexical-inlineBlocks-create-${uuidFromContext}-${formData.id}`,\n depth: editDepth,\n })\n const { toggleDrawer } = useLexicalDrawer(drawerSlug, true)\n\n const inlineBlockElemElemRef = useRef<HTMLDivElement | null>(null)\n const { id, collectionSlug, getDocPreferences, globalSlug } = useDocumentInfo()\n const { config } = useConfig()\n\n const componentMapRenderedBlockPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_inline_blocks.${formData.blockType}`\n\n const clientSchemaMap = featureClientSchemaMap['blocks']\n\n const blocksField: BlocksFieldClient = clientSchemaMap?.[\n componentMapRenderedBlockPath\n ]?.[0] as BlocksFieldClient\n\n const clientBlock: ClientBlock | undefined = blocksField.blockReferences\n ? typeof blocksField?.blockReferences?.[0] === 'string'\n ? config.blocksMap[blocksField?.blockReferences?.[0]]\n : blocksField?.blockReferences?.[0]\n : blocksField?.blocks?.[0]\n\n const clientBlockFields = clientBlock?.fields ?? []\n\n // Open drawer on \"mount\"\n useEffect(() => {\n if (!firstTimeDrawer.current && createdInlineBlock?.getKey() === nodeKey) {\n // > 2 because they always have \"id\" and \"blockName\" fields\n if (clientBlockFields.length > 2) {\n toggleDrawer()\n }\n setCreatedInlineBlock?.(undefined)\n firstTimeDrawer.current = true\n }\n }, [clientBlockFields.length, createdInlineBlock, nodeKey, setCreatedInlineBlock, toggleDrawer])\n\n const removeInlineBlock = useCallback(() => {\n editor.update(() => {\n $getNodeByKey(nodeKey)?.remove()\n })\n }, [editor, nodeKey])\n\n const blockDisplayName = clientBlock?.labels?.singular\n ? getTranslation(clientBlock?.labels.singular, i18n)\n : clientBlock?.slug\n\n const onChangeAbortControllerRef = useRef(new AbortController())\n const schemaFieldsPath = `${schemaPath}.lexical_internal_feature.blocks.lexical_inline_blocks.${clientBlock?.slug}.fields`\n\n // Initial state for newly created blocks\n useEffect(() => {\n const abortController = new AbortController()\n\n const awaitInitialState = async () => {\n /*\n * This will only run if a new block is created. For all existing blocks that are loaded when the document is loaded, or when the form is saved,\n * this is not run, as the lexical field RSC will fetch the state server-side and pass it to the client. That way, we avoid unnecessary client-side\n * requests. Though for newly created blocks, we need to fetch the state client-side, as the server doesn't know about the block yet.\n */\n const { state } = await getFormState({\n id,\n collectionSlug,\n data: formData,\n docPermissions: { fields: true },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {\n excludeFiles: true,\n }),\n globalSlug,\n initialBlockData: formData,\n initialBlockFormState: formData,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: true,\n schemaPath: schemaFieldsPath,\n signal: abortController.signal,\n })\n\n if (state) {\n const newFormStateData: InlineBlockFields = reduceFieldsToValues(\n deepCopyObjectSimpleWithoutReactComponents(state, { excludeFiles: true }),\n true,\n ) as InlineBlockFields\n\n // Things like default values may come back from the server => update the node with the new data\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isInlineBlockNode(node)) {\n const newData = newFormStateData\n newData.blockType = formData.blockType\n\n node.setFields(newData, true)\n }\n })\n\n setInitialState(state)\n setCustomLabel(state['_components']?.customComponents?.BlockLabel)\n setCustomBlock(state['_components']?.customComponents?.Block)\n }\n }\n\n if (formData && !initialState) {\n void awaitInitialState()\n }\n\n return () => {\n abortAndIgnore(abortController)\n }\n }, [\n getFormState,\n editor,\n nodeKey,\n isEditable,\n schemaFieldsPath,\n id,\n formData,\n initialState,\n collectionSlug,\n globalSlug,\n getDocPreferences,\n parentDocumentFields,\n ])\n\n /**\n * HANDLE ONCHANGE\n */\n const onChange = useCallback(\n async ({ formState: prevFormState, submit }: { formState: FormState; submit?: boolean }) => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n\n const controller = new AbortController()\n onChangeAbortControllerRef.current = controller\n\n const { state } = await getFormState({\n id,\n collectionSlug,\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {\n excludeFiles: true,\n }),\n formState: prevFormState,\n globalSlug,\n initialBlockFormState: prevFormState,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: submit ? true : false,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n if (!state) {\n return prevFormState\n }\n\n if (submit) {\n setCustomLabel(state['_components']?.customComponents?.BlockLabel)\n setCustomBlock(state['_components']?.customComponents?.Block)\n }\n\n return state\n },\n [\n getFormState,\n id,\n collectionSlug,\n getDocPreferences,\n parentDocumentFields,\n globalSlug,\n isEditable,\n schemaFieldsPath,\n ],\n )\n // cleanup effect\n useEffect(() => {\n const isStateOutOfSync = (formData: InlineBlockFields, initialState: FormState) => {\n return Object.keys(initialState).some(\n (key) => initialState[key] && formData[key] !== initialState[key].value,\n )\n }\n\n return () => {\n // If the component is unmounted (either via removeInlineBlock or via lexical itself) and the form state got changed before,\n // we need to reset the initial state to force a re-fetch of the initial state when it gets mounted again (e.g. via lexical history undo).\n // Otherwise it would use an outdated initial state.\n if (initialState && isStateOutOfSync(formData, initialState)) {\n setInitialState(false)\n }\n abortAndIgnore(onChangeAbortControllerRef.current)\n }\n }, [formData, initialState])\n\n /**\n * HANDLE FORM SUBMIT\n */\n const onFormSubmit = useCallback(\n (formState: FormState, newData: Data) => {\n newData.blockType = formData.blockType\n\n editor.update(() => {\n const node = $getNodeByKey(nodeKey)\n if (node && $isInlineBlockNode(node)) {\n node.setFields(newData as InlineBlockFields, true)\n }\n })\n },\n [editor, nodeKey, formData],\n )\n\n const RemoveButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__removeButton`}\n disabled={!isEditable}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n removeInlineBlock()\n }}\n round\n size=\"small\"\n tooltip={t('lexical:blocks:inlineBlocks:remove', { label: blockDisplayName })}\n />\n ),\n [baseClass, blockDisplayName, isEditable, removeInlineBlock, t],\n )\n\n const EditButton = useMemo(\n () => () => (\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__editButton`}\n disabled={!isEditable}\n el=\"button\"\n icon=\"edit\"\n onClick={() => {\n toggleDrawer()\n }}\n round\n size=\"small\"\n tooltip={t('lexical:blocks:inlineBlocks:edit', { label: blockDisplayName })}\n />\n ),\n [baseClass, blockDisplayName, isEditable, t, toggleDrawer],\n )\n\n const InlineBlockContainer = useMemo(\n () =>\n ({ children, className }: { children: React.ReactNode; className?: string }) => (\n <div\n className={[`${baseClass}__container`, baseClass + '-' + formData.blockType, className]\n .filter(Boolean)\n .join(' ')}\n ref={inlineBlockElemElemRef}\n >\n {children}\n </div>\n ),\n [baseClass, formData.blockType],\n )\n\n const Label = useMemo(() => {\n if (CustomLabel) {\n return () => CustomLabel\n } else {\n return () => (\n <div>{clientBlock?.labels ? getTranslation(clientBlock?.labels.singular, i18n) : ''}</div>\n )\n }\n }, [CustomLabel, clientBlock?.labels, i18n])\n\n if (!clientBlock) {\n return (\n <InlineBlockContainer className={`${baseClass}-not-found`}>\n <span>Error: Block '{formData.blockType}' not found</span>\n {isEditable ? (\n <div className={`${baseClass}__actions`}>\n <RemoveButton />\n </div>\n ) : null}\n </InlineBlockContainer>\n )\n }\n\n return (\n <Form\n beforeSubmit={[\n async ({ formState }) => {\n // This is only called when form is submitted from drawer\n return await onChange({ formState, submit: true })\n },\n ]}\n disableValidationOnSubmit\n el=\"div\"\n fields={clientBlock?.fields}\n initialState={initialState || {}}\n onChange={[onChange]}\n onSubmit={(formState, data) => {\n onFormSubmit(formState, data)\n toggleDrawer()\n }}\n uuid={uuid()}\n >\n <EditDepthProvider>\n <Drawer\n className={''}\n slug={drawerSlug}\n title={t(`lexical:blocks:inlineBlocks:${formData?.id ? 'edit' : 'create'}`, {\n label: blockDisplayName ?? t('lexical:blocks:inlineBlocks:label'),\n })}\n >\n {initialState ? (\n <>\n <RenderFields\n fields={clientBlock?.fields}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\" // See Blocks feature path for details as for why this is empty\n parentSchemaPath={schemaFieldsPath}\n permissions={true}\n readOnly={!isEditable}\n />\n <FormSubmit programmaticSubmit={true}>{t('fields:saveChanges')}</FormSubmit>\n </>\n ) : null}\n </Drawer>\n </EditDepthProvider>\n {CustomBlock ? (\n <InlineBlockComponentContext\n value={{\n EditButton,\n initialState,\n InlineBlockContainer,\n Label,\n nodeKey,\n RemoveButton,\n }}\n >\n {CustomBlock}\n </InlineBlockComponentContext>\n ) : (\n <InlineBlockContainer>\n {initialState ? <Label /> : <ShimmerEffect height=\"15px\" width=\"40px\" />}\n {isEditable ? (\n <div className={`${baseClass}__actions`}>\n <EditButton />\n <RemoveButton />\n </div>\n ) : null}\n </InlineBlockContainer>\n )}\n </Form>\n )\n}\n", "'use client'\nimport ObjectID from 'bson-objectid'\nimport {\n $applyNodeReplacement,\n type EditorConfig,\n type LexicalEditor,\n type LexicalNode,\n} from 'lexical'\nimport React, { type JSX } from 'react'\n\nimport type {\n InlineBlockFields,\n SerializedInlineBlockNode,\n} from '../../server/nodes/InlineBlocksNode.js'\n\nimport { ServerInlineBlockNode } from '../../server/nodes/InlineBlocksNode.js'\n\nconst InlineBlockComponent = React.lazy(() =>\n import('../componentInline/index.js').then((module) => ({\n default: module.InlineBlockComponent,\n })),\n)\n\nexport class InlineBlockNode extends ServerInlineBlockNode {\n static override clone(node: ServerInlineBlockNode): ServerInlineBlockNode {\n return super.clone(node)\n }\n\n static override getType(): string {\n return super.getType()\n }\n\n static override importJSON(serializedNode: SerializedInlineBlockNode): InlineBlockNode {\n const node = $createInlineBlockNode(serializedNode.fields)\n return node\n }\n\n override decorate(_editor: LexicalEditor, config: EditorConfig): JSX.Element {\n return (\n <InlineBlockComponent\n cacheBuster={this.getCacheBuster()}\n className={config.theme.inlineBlock ?? 'LexicalEditorTheme__inlineBlock'}\n formData={this.getFields()}\n nodeKey={this.getKey()}\n />\n )\n }\n\n override exportJSON(): SerializedInlineBlockNode {\n return super.exportJSON()\n }\n}\n\nexport function $createInlineBlockNode(fields: Exclude<InlineBlockFields, 'id'>): InlineBlockNode {\n return $applyNodeReplacement(\n new InlineBlockNode({\n fields: {\n ...fields,\n id: fields?.id || new ObjectID.default().toHexString(),\n },\n }),\n )\n}\n\nexport function $isInlineBlockNode(\n node: InlineBlockNode | LexicalNode | null | undefined,\n): node is InlineBlockNode {\n return node instanceof InlineBlockNode\n}\n", "import type {\n DOMConversionMap,\n DOMExportOutput,\n EditorConfig,\n LexicalEditor,\n LexicalNode,\n NodeKey,\n SerializedLexicalNode,\n} from 'lexical'\nimport type { JsonObject } from 'payload'\nimport type React from 'react'\nimport type { JSX } from 'react'\n\nimport { addClassNamesToElement } from '@lexical/utils'\nimport ObjectID from 'bson-objectid'\nimport { $applyNodeReplacement, DecoratorNode } from 'lexical'\n\nimport type { StronglyTypedLeafNode } from '../../../../nodeTypes.js'\n\nexport type InlineBlockFields<TInlineBlockFields extends JsonObject = JsonObject> = {\n blockType: string\n id: string\n} & TInlineBlockFields\n\nexport type SerializedInlineBlockNode<TBlockFields extends JsonObject = JsonObject> = {\n fields: InlineBlockFields<TBlockFields>\n} & StronglyTypedLeafNode<SerializedLexicalNode, 'inlineBlock'>\n\nexport class ServerInlineBlockNode extends DecoratorNode<null | React.ReactElement> {\n __cacheBuster: number\n __fields: InlineBlockFields\n\n constructor({\n cacheBuster,\n fields,\n key,\n }: {\n cacheBuster?: number\n fields: InlineBlockFields\n key?: NodeKey\n }) {\n super(key)\n this.__fields = fields\n this.__cacheBuster = cacheBuster || 0\n }\n\n static override clone(node: ServerInlineBlockNode): ServerInlineBlockNode {\n return new this({\n cacheBuster: node.__cacheBuster,\n fields: node.__fields,\n key: node.__key,\n })\n }\n\n static override getType(): string {\n return 'inlineBlock'\n }\n\n static override importDOM(): DOMConversionMap<HTMLDivElement> | null {\n return {}\n }\n\n static override importJSON(serializedNode: SerializedInlineBlockNode): ServerInlineBlockNode {\n const node = $createServerInlineBlockNode(serializedNode.fields)\n return node\n }\n\n static isInline(): false {\n return false\n }\n\n canIndent() {\n return true\n }\n\n override createDOM(config?: EditorConfig): HTMLElement {\n const element = document.createElement('span')\n addClassNamesToElement(element, config?.theme?.inlineBlock)\n return element\n }\n\n override decorate(editor: LexicalEditor, config: EditorConfig): JSX.Element | null {\n return null\n }\n\n override exportDOM(): DOMExportOutput {\n const element = document.createElement('span')\n element.classList.add('inline-block-container')\n\n const text = document.createTextNode(this.getTextContent())\n element.append(text)\n return { element }\n }\n\n override exportJSON(): SerializedInlineBlockNode {\n return {\n type: 'inlineBlock',\n fields: this.getFields(),\n version: 1,\n }\n }\n\n getCacheBuster(): number {\n return this.getLatest().__cacheBuster\n }\n\n getFields(): InlineBlockFields {\n return this.getLatest().__fields\n }\n\n override getTextContent(): string {\n return `Block Field`\n }\n\n override isInline() {\n return true\n }\n\n setFields(fields: InlineBlockFields, preventFormStateUpdate?: boolean): void {\n const writable = this.getWritable()\n writable.__fields = fields\n if (!preventFormStateUpdate) {\n writable.__cacheBuster++\n }\n }\n\n override updateDOM(): boolean {\n return false\n }\n}\n\nexport function $createServerInlineBlockNode(\n fields: Exclude<InlineBlockFields, 'id'>,\n): ServerInlineBlockNode {\n return $applyNodeReplacement(\n new ServerInlineBlockNode({\n fields: {\n ...fields,\n id: fields?.id || new ObjectID.default().toHexString(),\n },\n }),\n )\n}\n\nexport function $isServerInlineBlockNode(\n node: LexicalNode | null | ServerInlineBlockNode | undefined,\n): node is ServerInlineBlockNode {\n return node instanceof ServerInlineBlockNode\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["useLexicalComposerContext", "useLexicalEditable", "getTranslation", "Button", "Drawer", "EditDepthProvider", "Form", "formatDrawerSlug", "FormSubmit", "RenderFields", "ShimmerEffect", "useConfig", "useDocumentForm", "useDocumentInfo", "useEditDepth", "useServerFunctions", "useTranslation", "abortAndIgnore", "$getNodeByKey", "deepCopyObjectSimpleWithoutReactComponents", "reduceFieldsToValues", "React", "createContext", "useCallback", "useEffect", "useMemo", "useRef", "v4", "uuid", "ObjectID", "$applyNodeReplacement", "React", "addClassNamesToElement", "ObjectID", "$applyNodeReplacement", "DecoratorNode", "ServerInlineBlockNode", "__cacheBuster", "__fields", "constructor", "cacheBuster", "fields", "key", "clone", "node", "__key", "getType", "importDOM", "importJSON", "serializedNode", "$createServerInlineBlockNode", "isInline", "canIndent", "createDOM", "config", "element", "document", "createElement", "theme", "inlineBlock", "decorate", "editor", "exportDOM", "classList", "add", "text", "createTextNode", "getTextContent", "append", "exportJSON", "type", "getFields", "version", "getCacheBuster", "getLatest", "setFields", "preventFormStateUpdate", "writable", "getWritable", "updateDOM", "id", "default", "toHexString", "InlineBlockComponent", "React", "lazy", "then", "module", "default", "InlineBlockNode", "ServerInlineBlockNode", "clone", "node", "getType", "importJSON", "serializedNode", "$createInlineBlockNode", "fields", "decorate", "_editor", "config", "_jsx", "cacheBuster", "getCacheBuster", "className", "theme", "inlineBlock", "formData", "getFields", "nodeKey", "getKey", "exportJSON", "$applyNodeReplacement", "id", "ObjectID", "toHexString", "$isInlineBlockNode", "InlineBlockComponentContext", "createContext", "initialState", "useInlineBlockComponentContext", "React", "use", "InlineBlockComponent", "props", "cacheBuster", "className", "baseClass", "formData", "nodeKey", "editor", "useLexicalComposerContext", "isEditable", "useLexicalEditable", "i18n", "t", "useTranslation", "createdInlineBlock", "fieldProps", "featureClientSchemaMap", "initialLexicalFormState", "schemaPath", "setCreatedInlineBlock", "uuid", "uuidFromContext", "useEditorConfigContext", "fields", "parentDocumentFields", "useDocumentForm", "getFormState", "useServerFunctions", "editDepth", "useEditDepth", "firstTimeDrawer", "useRef", "setInitialState", "useState", "cachedFormState", "id", "formState", "Object", "fromEntries", "entries", "map", "fieldName", "fieldState", "initialValue", "value", "hasMounted", "prevCacheBuster", "useEffect", "current", "CustomLabel", "setCustomLabel", "customComponents", "BlockLabel", "CustomBlock", "setCustomBlock", "Block", "drawerSlug", "formatDrawerSlug", "slug", "depth", "toggleDrawer", "useLexicalDrawer", "inlineBlockElemElemRef", "collectionSlug", "getDocPreferences", "globalSlug", "useDocumentInfo", "config", "useConfig", "componentMapRenderedBlockPath", "blockType", "blocksField", "clientBlock", "blockReferences", "blocksMap", "blocks", "clientBlockFields", "getKey", "length", "undefined", "removeInlineBlock", "useCallback", "update", "$getNodeByKey", "remove", "blockDisplayName", "labels", "singular", "getTranslation", "onChangeAbortControllerRef", "AbortController", "schemaFieldsPath", "abortController", "state", "data", "docPermissions", "docPreferences", "documentFormState", "deepCopyObjectSimpleWithoutReactComponents", "excludeFiles", "initialBlockData", "initialBlockFormState", "operation", "readOnly", "renderAllFields", "signal", "newFormStateData", "reduceFieldsToValues", "node", "$isInlineBlockNode", "newData", "setFields", "abortAndIgnore", "onChange", "prevFormState", "submit", "controller", "isStateOutOfSync", "keys", "some", "key", "onFormSubmit", "RemoveButton", "useMemo", "_jsx", "Button", "buttonStyle", "disabled", "icon", "onClick", "e", "preventDefault", "round", "size", "tooltip", "label", "EditButton", "el", "InlineBlockContainer", "children", "filter", "Boolean", "join", "ref", "Label", "_jsxs", "Form", "beforeSubmit", "disableValidationOnSubmit", "onSubmit", "EditDepthProvider", "Drawer", "title", "_Fragment", "RenderFields", "forceRender", "parentIndexPath", "parentPath", "parentSchemaPath", "permissions", "FormSubmit", "programmaticSubmit", "ShimmerEffect", "height", "width"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{b as R}from"./chunk-BZZVLW4U.js";import{c as q}from"react/compiler-runtime";import{jsx as x}from"react/jsx-runtime";import{Drawer as z,EditDepthProvider as G,useModal as J}from"@payloadcms/ui";import"react";import{jsx as O,jsxs as M}from"react/jsx-runtime";import{useLexicalEditable as j}from"@lexical/react/useLexicalEditable";import{Form as T,FormSubmit as v,RenderFields as N,useDocumentForm as W,useDocumentInfo as $,useServerFunctions as k,useTranslation as L}from"@payloadcms/ui";import{abortAndIgnore as _}from"@payloadcms/ui/shared";import{deepCopyObjectSimpleWithoutReactComponents as y}from"payload/shared";import{useCallback as B,useEffect as I,useRef as H,useState as U}from"react";import{v4 as V}from"uuid";var E=({data:f,featureKey:e,fieldMapOverride:p,handleDrawerSubmit:h,schemaFieldsPathOverride:o,schemaPath:g,schemaPathSuffix:m})=>{let{t:S}=L(),{id:a,collectionSlug:n,getDocPreferences:i,globalSlug:s}=$(),{fields:l}=W(),r=j(),t=H(new AbortController),[c,w]=U(!1),{fieldProps:{featureClientSchemaMap:P}}=R(),{getFormState:C}=k(),u=o??`${g}.lexical_internal_feature.${e}${m?`.${m}`:""}`,b=p??P[e]?.[u];I(()=>{let d=new AbortController;return(async()=>{let{state:D}=await C({id:a,collectionSlug:n,data:f??{},docPermissions:{fields:!0},docPreferences:await i(),documentFormState:y(l,{excludeFiles:!0}),globalSlug:s,initialBlockData:f,operation:"update",readOnly:!r,renderAllFields:!0,schemaPath:u,signal:d.signal});w(D)})(),()=>{_(d)}},[u,a,f,C,n,r,s,i,l]);let F=B(async({formState:d})=>{_(t.current);let A=new AbortController;t.current=A;let{state:D}=await C({id:a,collectionSlug:n,docPermissions:{fields:!0},docPreferences:await i(),documentFormState:y(l,{excludeFiles:!0}),formState:d,globalSlug:s,initialBlockFormState:d,operation:"update",readOnly:!r,schemaPath:u,signal:A.signal});return D||d},[C,a,r,n,i,l,s,u]);return I(()=>()=>{_(t.current)},[]),c===!1?null:M(T,{beforeSubmit:[F],disableValidationOnSubmit:!0,fields:Array.isArray(b)?b:[],initialState:c,onChange:[F],onSubmit:h,uuid:V(),children:[O(N,{fields:Array.isArray(b)?b:[],forceRender:!0,parentIndexPath:"",parentPath:"",parentSchemaPath:u,permissions:!0,readOnly:!r}),O(v,{children:S("fields:saveChanges")})]})};var de=f=>{let e=q(15),{className:p,data:h,drawerSlug:o,drawerTitle:g,featureKey:m,fieldMapOverride:S,handleDrawerSubmit:a,schemaFieldsPathOverride:n,schemaPath:i,schemaPathSuffix:s}=f,{closeModal:l}=J(),r=g??"",t;e[0]!==l||e[1]!==o||e[2]!==a?(t=(w,P)=>{l(o),setTimeout(()=>{a(w,P)},1)},e[0]=l,e[1]=o,e[2]=a,e[3]=t):t=e[3];let c;return e[4]!==p||e[5]!==h||e[6]!==o||e[7]!==m||e[8]!==S||e[9]!==n||e[10]!==i||e[11]!==s||e[12]!==r||e[13]!==t?(c=x(G,{children:x(z,{className:p,slug:o,title:r,children:x(E,{data:h,featureKey:m,fieldMapOverride:S,handleDrawerSubmit:t,schemaFieldsPathOverride:n,schemaPath:i,schemaPathSuffix:s})})}),e[4]=p,e[5]=h,e[6]=o,e[7]=m,e[8]=S,e[9]=n,e[10]=i,e[11]=s,e[12]=r,e[13]=t,e[14]=c):c=e[14],c};import{createCommand as K}from"lexical";var he=K("INSERT_UPLOAD_WITH_DRAWER_COMMAND");export{de as a,he as b};
|
|
2
|
+
//# sourceMappingURL=chunk-QJ5EETIB.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/utilities/fieldsDrawer/Drawer.tsx", "../../../src/utilities/fieldsDrawer/DrawerContent.tsx", "../../../src/features/upload/client/drawer/commands.ts"],
|
|
4
|
-
"sourcesContent": ["'use client'\nimport type { ClientField, Data, FormState, JsonObject } from 'payload'\n\nimport { Drawer, EditDepthProvider, useModal } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { DrawerContent } from './DrawerContent.js'\n\nexport type FieldsDrawerProps = {\n readonly className?: string\n readonly data?: Data\n readonly drawerSlug: string\n readonly drawerTitle?: string\n readonly featureKey: string\n readonly fieldMapOverride?: ClientField[]\n readonly handleDrawerSubmit: (fields: FormState, data: JsonObject) => void\n readonly schemaFieldsPathOverride?: string\n readonly schemaPath: string\n readonly schemaPathSuffix?: string\n}\n\n/**\n * This FieldsDrawer component can be used to easily create a Drawer that contains a form with fields within your feature.\n * The fields are taken directly from the schema map based on your `featureKey` and `schemaPathSuffix`. Thus, this can only\n * be used if you provide your field schema inside the `generateSchemaMap` prop of your feature.server.ts.\n */\nexport const FieldsDrawer: React.FC<FieldsDrawerProps> = ({\n className,\n data,\n drawerSlug,\n drawerTitle,\n featureKey,\n fieldMapOverride,\n handleDrawerSubmit,\n schemaFieldsPathOverride,\n schemaPath,\n schemaPathSuffix,\n}) => {\n const { closeModal } = useModal()\n // The Drawer only renders its children (and itself) if it's open. Thus, by extracting the main content\n // to DrawerContent, this should be faster\n return (\n <EditDepthProvider>\n <Drawer className={className} slug={drawerSlug} title={drawerTitle ?? ''}>\n <DrawerContent\n data={data}\n featureKey={featureKey}\n fieldMapOverride={fieldMapOverride}\n handleDrawerSubmit={(args, args2) => {\n // Simply close drawer - no need for useLexicalDrawer here as at this point,\n // we don't need to restore the cursor position. This is handled by the useEffect in useLexicalDrawer.\n closeModal(drawerSlug)\n\n // Actual drawer submit logic needs to be triggered after the drawer is closed.\n // That's because the lexical selection / cursor restore logic that is striggerer by\n // `useLexicalDrawer` neeeds to be triggered before any editor.update calls that may happen\n // in the `handleDrawerSubmit` function.\n setTimeout(() => {\n handleDrawerSubmit(args, args2)\n }, 1)\n }}\n schemaFieldsPathOverride={schemaFieldsPathOverride}\n schemaPath={schemaPath}\n schemaPathSuffix={schemaPathSuffix}\n />\n </Drawer>\n </EditDepthProvider>\n )\n}\n", "'use client'\nimport type { FormState } from 'payload'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n Form,\n FormSubmit,\n RenderFields,\n useDocumentForm,\n useDocumentInfo,\n useServerFunctions,\n useTranslation,\n} from '@payloadcms/ui'\nimport { abortAndIgnore } from '@payloadcms/ui/shared'\nimport { deepCopyObjectSimpleWithoutReactComponents } from 'payload/shared'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { v4 as uuid } from 'uuid'\n\nimport type { FieldsDrawerProps } from './Drawer.js'\n\nimport { useEditorConfigContext } from '../../lexical/config/client/EditorConfigProvider.js'\n\nexport const DrawerContent: React.FC<Omit<FieldsDrawerProps, 'drawerSlug' | 'drawerTitle'>> = ({\n data,\n featureKey,\n fieldMapOverride,\n handleDrawerSubmit,\n schemaFieldsPathOverride,\n schemaPath,\n schemaPathSuffix,\n}) => {\n const { t } = useTranslation()\n const { id, collectionSlug, getDocPreferences, globalSlug } = useDocumentInfo()\n const { fields: parentDocumentFields } = useDocumentForm()\n const isEditable = useLexicalEditable()\n\n const onChangeAbortControllerRef = useRef(new AbortController())\n\n const [initialState, setInitialState] = useState<false | FormState | undefined>(false)\n\n const {\n fieldProps: { featureClientSchemaMap },\n } = useEditorConfigContext()\n\n const { getFormState } = useServerFunctions()\n\n const schemaFieldsPath =\n schemaFieldsPathOverride ??\n `${schemaPath}.lexical_internal_feature.${featureKey}${schemaPathSuffix ? `.${schemaPathSuffix}` : ''}`\n\n const fields: any = fieldMapOverride ?? featureClientSchemaMap[featureKey]?.[schemaFieldsPath] // Field Schema\n\n useEffect(() => {\n const controller = new AbortController()\n\n const awaitInitialState = async () => {\n const { state } = await getFormState({\n id,\n collectionSlug,\n data: data ?? {},\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n globalSlug,\n initialBlockData: data,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: true,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n setInitialState(state)\n }\n\n void awaitInitialState()\n\n return () => {\n abortAndIgnore(controller)\n }\n }, [\n schemaFieldsPath,\n id,\n data,\n getFormState,\n collectionSlug,\n isEditable,\n globalSlug,\n getDocPreferences,\n parentDocumentFields,\n ])\n\n const onChange = useCallback(\n async ({ formState: prevFormState }: { formState: FormState }) => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n\n const controller = new AbortController()\n onChangeAbortControllerRef.current = controller\n\n const { state } = await getFormState({\n id,\n collectionSlug,\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields),\n formState: prevFormState,\n globalSlug,\n initialBlockFormState: prevFormState,\n operation: 'update',\n readOnly: !isEditable,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n if (!state) {\n return prevFormState\n }\n\n return state\n },\n [\n getFormState,\n id,\n isEditable,\n collectionSlug,\n getDocPreferences,\n parentDocumentFields,\n globalSlug,\n schemaFieldsPath,\n ],\n )\n\n // cleanup effect\n useEffect(() => {\n return () => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n }\n }, [])\n\n if (initialState === false) {\n return null\n }\n\n return (\n <Form\n beforeSubmit={[onChange]}\n disableValidationOnSubmit\n fields={Array.isArray(fields) ? fields : []}\n initialState={initialState}\n onChange={[onChange]}\n onSubmit={handleDrawerSubmit}\n uuid={uuid()}\n >\n <RenderFields\n fields={Array.isArray(fields) ? fields : []}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\" // See Blocks feature path for details as for why this is empty\n parentSchemaPath={schemaFieldsPath}\n permissions={true}\n readOnly={!isEditable}\n />\n <FormSubmit>{t('fields:saveChanges')}</FormSubmit>\n </Form>\n )\n}\n", "'use client'\nimport type { LexicalCommand } from 'lexical'\n\nimport { createCommand } from 'lexical'\n\nexport const INSERT_UPLOAD_WITH_DRAWER_COMMAND: LexicalCommand<{\n replace: { nodeKey: string } | false\n}> = createCommand('INSERT_UPLOAD_WITH_DRAWER_COMMAND')\n"],
|
|
5
|
-
"mappings": "wCAAA,OAAAA,KAAAC,MAAA,iEAGA,OAASC,UAAAA,EAAQC,qBAAAA,EAAmBC,YAAAA,MAAgB,iBACpD,MAAkB,0DCDlB,OAASC,sBAAAA,MAA0B,oCACnC,OACEC,QAAAA,EACAC,cAAAA,EACAC,gBAAAA,EACAC,mBAAAA,EACAC,mBAAAA,EACAC,sBAAAA,EACAC,kBAAAA,MACK,iBACP,OAASC,kBAAAA,MAAsB,wBAC/B,OAASC,8CAAAA,MAAkD,iBAC3D,OAAgBC,eAAAA,EAAaC,aAAAA,EAAWC,UAAAA,EAAQC,YAAAA,MAAgB,QAChE,OAASC,MAAMC,MAAY,OAMpB,IAAMC,EAAiFA,CAAC,CAC7FC,KAAAA,EACAC,WAAAA,EACAC,iBAAAA,EACAC,mBAAAA,EACAC,yBAAAA,EACAC,WAAAA,EACAC,iBAAAA,CAAgB,IACjB,CACC,GAAM,CAAEC,EAAAA,CAAC,EAAKC,EAAA,EACR,CAAEC,GAAAA,EAAIC,eAAAA,EAAgBC,kBAAAA,EAAmBC,WAAAA,CAAU,EAAKC,EAAA,EACxD,CAAEC,OAAQC,CAAoB,EAAKC,EAAA,EACnCC,EAAaC,EAAA,EAEbC,EAA6BC,EAAO,IAAIC,eAAA,EAExC,CAACC,EAAcC,CAAA,EAAmBC,EAAwC,EAAA,EAE1E,CACJC,WAAY,CAAEC,uBAAAA,CAAsB,CAAE,EACpCC,EAAA,EAEE,CAAEC,aAAAA,CAAY,EAAKC,EAAA,EAEnBC,EACJ1B,GACA,GAAGC,CAAA,6BAAuCJ,CAAA,GAAaK,EAAmB,IAAIA,CAAA,GAAqB,EAAA,GAE/FQ,EAAcZ,GAAoBwB,EAAuBzB,CAAA,IAAc6B,CAAA,EAE7EC,EAAU,IAAA,CACR,IAAMC,EAAa,IAAIX,
|
|
6
|
-
"names": ["c", "_c", "Drawer", "EditDepthProvider", "useModal", "useLexicalEditable", "Form", "FormSubmit", "RenderFields", "useDocumentForm", "useDocumentInfo", "useServerFunctions", "useTranslation", "abortAndIgnore", "deepCopyObjectSimpleWithoutReactComponents", "useCallback", "useEffect", "useRef", "useState", "v4", "uuid", "DrawerContent", "data", "featureKey", "fieldMapOverride", "handleDrawerSubmit", "schemaFieldsPathOverride", "schemaPath", "schemaPathSuffix", "t", "useTranslation", "id", "collectionSlug", "getDocPreferences", "globalSlug", "useDocumentInfo", "fields", "parentDocumentFields", "useDocumentForm", "isEditable", "useLexicalEditable", "onChangeAbortControllerRef", "useRef", "AbortController", "initialState", "setInitialState", "useState", "fieldProps", "featureClientSchemaMap", "useEditorConfigContext", "getFormState", "useServerFunctions", "schemaFieldsPath", "useEffect", "controller", "state", "docPermissions", "docPreferences", "documentFormState", "deepCopyObjectSimpleWithoutReactComponents", "initialBlockData", "operation", "readOnly", "renderAllFields", "signal", "abortAndIgnore", "onChange", "useCallback", "formState", "prevFormState", "current", "initialBlockFormState", "_jsxs", "Form", "beforeSubmit", "disableValidationOnSubmit", "Array", "isArray", "onSubmit", "uuid", "_jsx", "RenderFields", "forceRender", "parentIndexPath", "parentPath", "parentSchemaPath", "permissions", "FormSubmit", "FieldsDrawer", "t0", "$", "_c", "className", "data", "drawerSlug", "drawerTitle", "featureKey", "fieldMapOverride", "handleDrawerSubmit", "schemaFieldsPathOverride", "schemaPath", "schemaPathSuffix", "closeModal", "useModal", "t1", "t2", "args", "args2", "setTimeout", "t3", "_jsx", "EditDepthProvider", "children", "Drawer", "slug", "title", "DrawerContent", "createCommand", "INSERT_UPLOAD_WITH_DRAWER_COMMAND"]
|
|
4
|
+
"sourcesContent": ["'use client'\nimport type { ClientField, Data, FormState, JsonObject } from 'payload'\n\nimport { Drawer, EditDepthProvider, useModal } from '@payloadcms/ui'\nimport React from 'react'\n\nimport { DrawerContent } from './DrawerContent.js'\n\nexport type FieldsDrawerProps = {\n readonly className?: string\n readonly data?: Data\n readonly drawerSlug: string\n readonly drawerTitle?: string\n readonly featureKey: string\n readonly fieldMapOverride?: ClientField[]\n readonly handleDrawerSubmit: (fields: FormState, data: JsonObject) => void\n readonly schemaFieldsPathOverride?: string\n readonly schemaPath: string\n readonly schemaPathSuffix?: string\n}\n\n/**\n * This FieldsDrawer component can be used to easily create a Drawer that contains a form with fields within your feature.\n * The fields are taken directly from the schema map based on your `featureKey` and `schemaPathSuffix`. Thus, this can only\n * be used if you provide your field schema inside the `generateSchemaMap` prop of your feature.server.ts.\n */\nexport const FieldsDrawer: React.FC<FieldsDrawerProps> = ({\n className,\n data,\n drawerSlug,\n drawerTitle,\n featureKey,\n fieldMapOverride,\n handleDrawerSubmit,\n schemaFieldsPathOverride,\n schemaPath,\n schemaPathSuffix,\n}) => {\n const { closeModal } = useModal()\n // The Drawer only renders its children (and itself) if it's open. Thus, by extracting the main content\n // to DrawerContent, this should be faster\n return (\n <EditDepthProvider>\n <Drawer className={className} slug={drawerSlug} title={drawerTitle ?? ''}>\n <DrawerContent\n data={data}\n featureKey={featureKey}\n fieldMapOverride={fieldMapOverride}\n handleDrawerSubmit={(args, args2) => {\n // Simply close drawer - no need for useLexicalDrawer here as at this point,\n // we don't need to restore the cursor position. This is handled by the useEffect in useLexicalDrawer.\n closeModal(drawerSlug)\n\n // Actual drawer submit logic needs to be triggered after the drawer is closed.\n // That's because the lexical selection / cursor restore logic that is striggerer by\n // `useLexicalDrawer` neeeds to be triggered before any editor.update calls that may happen\n // in the `handleDrawerSubmit` function.\n setTimeout(() => {\n handleDrawerSubmit(args, args2)\n }, 1)\n }}\n schemaFieldsPathOverride={schemaFieldsPathOverride}\n schemaPath={schemaPath}\n schemaPathSuffix={schemaPathSuffix}\n />\n </Drawer>\n </EditDepthProvider>\n )\n}\n", "'use client'\nimport type { FormState } from 'payload'\n\nimport { useLexicalEditable } from '@lexical/react/useLexicalEditable'\nimport {\n Form,\n FormSubmit,\n RenderFields,\n useDocumentForm,\n useDocumentInfo,\n useServerFunctions,\n useTranslation,\n} from '@payloadcms/ui'\nimport { abortAndIgnore } from '@payloadcms/ui/shared'\nimport { deepCopyObjectSimpleWithoutReactComponents } from 'payload/shared'\nimport React, { useCallback, useEffect, useRef, useState } from 'react'\nimport { v4 as uuid } from 'uuid'\n\nimport type { FieldsDrawerProps } from './Drawer.js'\n\nimport { useEditorConfigContext } from '../../lexical/config/client/EditorConfigProvider.js'\n\nexport const DrawerContent: React.FC<Omit<FieldsDrawerProps, 'drawerSlug' | 'drawerTitle'>> = ({\n data,\n featureKey,\n fieldMapOverride,\n handleDrawerSubmit,\n schemaFieldsPathOverride,\n schemaPath,\n schemaPathSuffix,\n}) => {\n const { t } = useTranslation()\n const { id, collectionSlug, getDocPreferences, globalSlug } = useDocumentInfo()\n const { fields: parentDocumentFields } = useDocumentForm()\n const isEditable = useLexicalEditable()\n\n const onChangeAbortControllerRef = useRef(new AbortController())\n\n const [initialState, setInitialState] = useState<false | FormState | undefined>(false)\n\n const {\n fieldProps: { featureClientSchemaMap },\n } = useEditorConfigContext()\n\n const { getFormState } = useServerFunctions()\n\n const schemaFieldsPath =\n schemaFieldsPathOverride ??\n `${schemaPath}.lexical_internal_feature.${featureKey}${schemaPathSuffix ? `.${schemaPathSuffix}` : ''}`\n\n const fields: any = fieldMapOverride ?? featureClientSchemaMap[featureKey]?.[schemaFieldsPath] // Field Schema\n\n useEffect(() => {\n const controller = new AbortController()\n\n const awaitInitialState = async () => {\n const { state } = await getFormState({\n id,\n collectionSlug,\n data: data ?? {},\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {\n excludeFiles: true,\n }),\n globalSlug,\n initialBlockData: data,\n operation: 'update',\n readOnly: !isEditable,\n renderAllFields: true,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n setInitialState(state)\n }\n\n void awaitInitialState()\n\n return () => {\n abortAndIgnore(controller)\n }\n }, [\n schemaFieldsPath,\n id,\n data,\n getFormState,\n collectionSlug,\n isEditable,\n globalSlug,\n getDocPreferences,\n parentDocumentFields,\n ])\n\n const onChange = useCallback(\n async ({ formState: prevFormState }: { formState: FormState }) => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n\n const controller = new AbortController()\n onChangeAbortControllerRef.current = controller\n\n const { state } = await getFormState({\n id,\n collectionSlug,\n docPermissions: {\n fields: true,\n },\n docPreferences: await getDocPreferences(),\n documentFormState: deepCopyObjectSimpleWithoutReactComponents(parentDocumentFields, {\n excludeFiles: true,\n }),\n formState: prevFormState,\n globalSlug,\n initialBlockFormState: prevFormState,\n operation: 'update',\n readOnly: !isEditable,\n schemaPath: schemaFieldsPath,\n signal: controller.signal,\n })\n\n if (!state) {\n return prevFormState\n }\n\n return state\n },\n [\n getFormState,\n id,\n isEditable,\n collectionSlug,\n getDocPreferences,\n parentDocumentFields,\n globalSlug,\n schemaFieldsPath,\n ],\n )\n\n // cleanup effect\n useEffect(() => {\n return () => {\n abortAndIgnore(onChangeAbortControllerRef.current)\n }\n }, [])\n\n if (initialState === false) {\n return null\n }\n\n return (\n <Form\n beforeSubmit={[onChange]}\n disableValidationOnSubmit\n fields={Array.isArray(fields) ? fields : []}\n initialState={initialState}\n onChange={[onChange]}\n onSubmit={handleDrawerSubmit}\n uuid={uuid()}\n >\n <RenderFields\n fields={Array.isArray(fields) ? fields : []}\n forceRender\n parentIndexPath=\"\"\n parentPath=\"\" // See Blocks feature path for details as for why this is empty\n parentSchemaPath={schemaFieldsPath}\n permissions={true}\n readOnly={!isEditable}\n />\n <FormSubmit>{t('fields:saveChanges')}</FormSubmit>\n </Form>\n )\n}\n", "'use client'\nimport type { LexicalCommand } from 'lexical'\n\nimport { createCommand } from 'lexical'\n\nexport const INSERT_UPLOAD_WITH_DRAWER_COMMAND: LexicalCommand<{\n replace: { nodeKey: string } | false\n}> = createCommand('INSERT_UPLOAD_WITH_DRAWER_COMMAND')\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["c", "_c", "Drawer", "EditDepthProvider", "useModal", "useLexicalEditable", "Form", "FormSubmit", "RenderFields", "useDocumentForm", "useDocumentInfo", "useServerFunctions", "useTranslation", "abortAndIgnore", "deepCopyObjectSimpleWithoutReactComponents", "useCallback", "useEffect", "useRef", "useState", "v4", "uuid", "DrawerContent", "data", "featureKey", "fieldMapOverride", "handleDrawerSubmit", "schemaFieldsPathOverride", "schemaPath", "schemaPathSuffix", "t", "useTranslation", "id", "collectionSlug", "getDocPreferences", "globalSlug", "useDocumentInfo", "fields", "parentDocumentFields", "useDocumentForm", "isEditable", "useLexicalEditable", "onChangeAbortControllerRef", "useRef", "AbortController", "initialState", "setInitialState", "useState", "fieldProps", "featureClientSchemaMap", "useEditorConfigContext", "getFormState", "useServerFunctions", "schemaFieldsPath", "useEffect", "controller", "state", "docPermissions", "docPreferences", "documentFormState", "deepCopyObjectSimpleWithoutReactComponents", "excludeFiles", "initialBlockData", "operation", "readOnly", "renderAllFields", "signal", "abortAndIgnore", "onChange", "useCallback", "formState", "prevFormState", "current", "initialBlockFormState", "_jsxs", "Form", "beforeSubmit", "disableValidationOnSubmit", "Array", "isArray", "onSubmit", "uuid", "_jsx", "RenderFields", "forceRender", "parentIndexPath", "parentPath", "parentSchemaPath", "permissions", "FormSubmit", "FieldsDrawer", "t0", "$", "_c", "className", "data", "drawerSlug", "drawerTitle", "featureKey", "fieldMapOverride", "handleDrawerSubmit", "schemaFieldsPathOverride", "schemaPath", "schemaPathSuffix", "closeModal", "useModal", "t1", "t2", "args", "args2", "setTimeout", "t3", "_jsx", "EditDepthProvider", "children", "Drawer", "slug", "title", "DrawerContent", "createCommand", "INSERT_UPLOAD_WITH_DRAWER_COMMAND"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{a as $,b as S}from"./chunk-
|
|
2
|
-
//# sourceMappingURL=component-
|
|
1
|
+
"use client";import{a as $,b as S}from"./chunk-QJ5EETIB.js";import{a as C}from"./chunk-INBEEENE.js";import{a as N}from"./chunk-F26IQ5RE.js";import{b as m}from"./chunk-BZZVLW4U.js";import{jsx as a,jsxs as n}from"react/jsx-runtime";import{useLexicalComposerContext as Y}from"@lexical/react/LexicalComposerContext.js";import{useLexicalEditable as Z}from"@lexical/react/useLexicalEditable";import{getTranslation as R}from"@payloadcms/translations";import{Button as p,formatDrawerSlug as ee,Thumbnail as te,useConfig as ae,useEditDepth as oe,usePayloadAPI as le,useTranslation as ie}from"@payloadcms/ui";import{$getNodeByKey as y}from"lexical";import{formatAdminURL as se,isImage as re}from"payload/shared";import{useCallback as h,useId as ne,useReducer as de,useRef as ce,useState as ue}from"react";var E={depth:0},Se=L=>{let{className:e,data:{fields:U,relationTo:f,value:d},format:P,nodeKey:l}=L;if(typeof d=="object")throw new Error("Upload value should be a string or number. The Lexical Upload component should not receive the populated value object.");let{config:{routes:{api:T},serverURL:F},getEntityConfig:j}=ae(),I=ce(null),{uuid:z}=m(),A=oe(),[i]=Y(),{editorConfig:B,fieldProps:{schemaPath:k}}=m(),c=Z(),{i18n:g,t:s}=ie(),[_,K]=de(r=>r+1,0),[o]=ue(()=>j({collectionSlug:f})),M=ne(),b=ee({slug:"lexical-upload-drawer-"+z+M,depth:A}),{toggleDrawer:O}=C(b,!0),{closeDocumentDrawer:w,DocumentDrawer:W,DocumentDrawerToggler:H}=N({id:d,collectionSlug:o.slug}),[{data:t},{setParams:D}]=le(se({apiRoute:T,path:`/${o.slug}/${d}`,serverURL:F}),{initialParams:E}),v=t?.thumbnailURL||t?.url,q=h(()=>{i.update(()=>{y(l)?.remove()})},[i,l]),G=h(r=>{D({...E,cacheBust:_}),K(),w()},[D,_,w]),x=B?.resolvedFeatureMap?.get("upload")?.sanitizedClientFeatureProps.collections?.[o.slug]?.hasExtraFields,J=h((r,V)=>{i.update(()=>{let u=y(l);if(u){let X={...u.getData(),fields:V};u.setData(X)}})},[i,l]),Q=v&&t?.width&&t?.height?t.width>t.height?"landscape":"portrait":"landscape";return n("div",{className:`${e}__contents ${e}__contents--${Q}`,"data-align":P||void 0,"data-filename":t?.filename,ref:I,children:[n("div",{className:`${e}__card`,children:[n("div",{className:`${e}__media`,children:[a(te,{collectionSlug:f,fileSrc:re(t?.mimeType)?v:null,height:t?.height,size:"none",width:t?.width}),c&&a("div",{className:`${e}__overlay ${e}__floater`,children:n("div",{className:`${e}__actions`,role:"toolbar",children:[x?a(p,{buttonStyle:"icon-label",className:`${e}__upload-drawer-toggler`,disabled:!c,el:"button",icon:"edit",onClick:O,round:!0,size:"medium",tooltip:s("fields:editRelationship")}):null,a(p,{buttonStyle:"icon-label",className:`${e}__swap-drawer-toggler`,disabled:!c,el:"button",icon:"swap",onClick:()=>{i.dispatchCommand(S,{replace:{nodeKey:l}})},round:!0,size:"medium",tooltip:s("fields:swapUpload")}),a(p,{buttonStyle:"icon-label",className:`${e}__removeButton`,disabled:!c,icon:"x",onClick:r=>{r.preventDefault(),q()},round:!0,size:"medium",tooltip:s("fields:removeUpload")})]})})]}),n("div",{className:`${e}__metaOverlay ${e}__floater`,children:[a(H,{className:`${e}__doc-drawer-toggler`,children:a("strong",{className:`${e}__filename`,children:t?.filename||s("general:untitled")})}),a("div",{className:`${e}__collectionLabel`,children:R(o.labels.singular,g)})]})]}),d?a(W,{onSave:G}):null,x?a($,{data:U,drawerSlug:b,drawerTitle:s("general:editLabel",{label:R(o.labels.singular,g)}),featureKey:"upload",handleDrawerSubmit:J,schemaPath:k,schemaPathSuffix:o.slug}):null]})};export{Se as UploadComponent};
|
|
2
|
+
//# sourceMappingURL=component-XIHC3W6W.js.map
|