@payloadcms/richtext-lexical 3.0.2 → 3.0.3-canary.5abb7d5

package/dist/features/relationship/client/components/RelationshipComponent.js.map

@@ -1 +1 @@
-{"version":3,"file":"RelationshipComponent.js","names":["useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","useConfig","usePayloadAPI","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","React","useCallback","useEffect","useReducer","useRef","useState","useEditorConfigContext","useLexicalDocumentDrawer","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","$isRelationshipNode","baseClass","initialParams","depth","Component","props","data","relationTo","value","nodeKey","Error","relationshipElemRef","editor","isSelected","setSelected","clearSelection","fieldProps","readOnly","config","collections","routes","api","serverURL","relatedCollection","setRelatedCollection","find","coll","slug","i18n","t","cacheBust","dispatchCacheBust","state","setParams","closeDocumentDrawer","DocumentDrawer","DocumentDrawerToggler","id","collectionSlug","removeRelationship","update","remove","updateRelationship","doc","$onDelete","payload","deleteSelection","event","preventDefault","getNodes","forEach","node","onClick","target","current","contains","shiftKey","registerCommand","_jsxs","className","filter","Boolean","join","contentEditable","ref","_jsx","label","labels","singular","admin","useAsTitle","isEditable","buttonStyle","disabled","el","icon","dispatchCommand","replace","round","tooltip","e","onSave","RelationshipComponent"],"sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"sourcesContent":["'use client'\nimport type { ElementFormatType } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, useConfig, usePayloadAPI, useTranslation } from '@payloadcms/ui'\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'\n\nimport type { RelationshipData } from '../../server/nodes/RelationshipNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDocumentDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDocumentDrawer.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport { $isRelationshipNode } from '../nodes/RelationshipNode.js'\nimport './index.scss'\n\nconst baseClass = 'lexical-relationship'\n\nconst initialParams = {\n  depth: 0,\n}\n\ntype Props = {\n  className?: string\n  data: RelationshipData\n  format?: ElementFormatType\n  nodeKey?: string\n}\n\nconst Component: React.FC<Props> = (props) => {\n  const {\n    data: { relationTo, value },\n    nodeKey,\n  } = props\n\n  if (typeof value === 'object') {\n    throw new Error(\n      'Relationship value should be a string or number. The Lexical Relationship component should not receive the populated value object.',\n    )\n  }\n\n  const relationshipElemRef = useRef<HTMLDivElement | null>(null)\n\n  const [editor] = useLexicalComposerContext()\n  const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey!)\n  const {\n    fieldProps: { readOnly },\n  } = useEditorConfigContext()\n  const {\n    config: {\n      collections,\n      routes: { api },\n      serverURL,\n    },\n  } = useConfig()\n\n  const [relatedCollection, setRelatedCollection] = useState(\n    () => collections.find((coll) => coll.slug === relationTo)!,\n  )\n\n  const { i18n, t } = useTranslation()\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n  const [{ data }, { setParams }] = usePayloadAPI(\n    `${serverURL}${api}/${relatedCollection.slug}/${value}`,\n    { initialParams },\n  )\n\n  const { closeDocumentDrawer, DocumentDrawer, DocumentDrawerToggler } = useLexicalDocumentDrawer({\n    id: value,\n    collectionSlug: relatedCollection.slug,\n  })\n\n  const removeRelationship = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey!)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const updateRelationship = React.useCallback(\n    ({ doc }) => {\n      setParams({\n        ...initialParams,\n        cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n      })\n\n      closeDocumentDrawer()\n      dispatchCacheBust()\n    },\n    [cacheBust, setParams, closeDocumentDrawer],\n  )\n\n  const $onDelete = useCallback(\n    (payload: KeyboardEvent) => {\n      const deleteSelection = $getSelection()\n      if (isSelected && $isNodeSelection(deleteSelection)) {\n        const event: KeyboardEvent = payload\n        event.preventDefault()\n        editor.update(() => {\n          deleteSelection.getNodes().forEach((node) => {\n            if ($isRelationshipNode(node)) {\n              node.remove()\n            }\n          })\n        })\n      }\n      return false\n    },\n    [editor, isSelected],\n  )\n  const onClick = useCallback(\n    (payload: MouseEvent) => {\n      const event = payload\n      // Check if relationshipElemRef.target or anything WITHIN relationshipElemRef.target was clicked\n      if (\n        event.target === relationshipElemRef.current ||\n        relationshipElemRef.current?.contains(event.target as Node)\n      ) {\n        if (event.shiftKey) {\n          setSelected(!isSelected)\n        } else {\n          if (!isSelected) {\n            clearSelection()\n            setSelected(true)\n          }\n        }\n        return true\n      }\n\n      return false\n    },\n    [isSelected, setSelected, clearSelection],\n  )\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n      editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n    )\n  }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n  return (\n    <div\n      className={[baseClass, isSelected && `${baseClass}--selected`].filter(Boolean).join(' ')}\n      contentEditable={false}\n      ref={relationshipElemRef}\n    >\n      <div className={`${baseClass}__wrap`}>\n        <p className={`${baseClass}__label`}>\n          {t('fields:labelRelationship', {\n            label: relatedCollection.labels?.singular\n              ? getTranslation(relatedCollection.labels?.singular, i18n)\n              : relatedCollection.slug,\n          })}\n        </p>\n        <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n          <p className={`${baseClass}__title`}>\n            {data ? data[relatedCollection?.admin?.useAsTitle || 'id'] : value}\n          </p>\n        </DocumentDrawerToggler>\n      </div>\n      {editor.isEditable() && (\n        <div className={`${baseClass}__actions`}>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__swapButton`}\n            disabled={readOnly}\n            el=\"button\"\n            icon=\"swap\"\n            onClick={() => {\n              if (nodeKey) {\n                editor.dispatchCommand(INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND, {\n                  replace: { nodeKey },\n                })\n              }\n            }}\n            round\n            tooltip={t('fields:swapRelationship')}\n          />\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__removeButton`}\n            disabled={readOnly}\n            icon=\"x\"\n            onClick={(e) => {\n              e.preventDefault()\n              removeRelationship()\n            }}\n            round\n            tooltip={t('fields:removeRelationship')}\n          />\n        </div>\n      )}\n\n      {!!value && <DocumentDrawer onSave={updateRelationship} />}\n    </div>\n  )\n}\n\nexport const RelationshipComponent = (props: Props): React.ReactNode => {\n  return <Component {...props} />\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"RelationshipComponent.js","names":["useLexicalComposerContext","useLexicalNodeSelection","mergeRegister","getTranslation","Button","useConfig","usePayloadAPI","useTranslation","$getNodeByKey","$getSelection","$isNodeSelection","CLICK_COMMAND","COMMAND_PRIORITY_LOW","KEY_BACKSPACE_COMMAND","KEY_DELETE_COMMAND","React","useCallback","useEffect","useReducer","useRef","useState","useEditorConfigContext","useLexicalDocumentDrawer","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","$isRelationshipNode","baseClass","initialParams","depth","Component","props","data","relationTo","value","nodeKey","Error","relationshipElemRef","editor","isSelected","setSelected","clearSelection","fieldProps","readOnly","config","collections","routes","api","serverURL","relatedCollection","setRelatedCollection","find","coll","slug","i18n","t","cacheBust","dispatchCacheBust","state","setParams","closeDocumentDrawer","DocumentDrawer","DocumentDrawerToggler","id","collectionSlug","removeRelationship","update","remove","updateRelationship","$onDelete","payload","deleteSelection","event","preventDefault","getNodes","forEach","node","onClick","target","current","contains","shiftKey","registerCommand","_jsxs","className","filter","Boolean","join","contentEditable","ref","_jsx","label","labels","singular","admin","useAsTitle","isEditable","buttonStyle","disabled","el","icon","dispatchCommand","replace","round","tooltip","e","onSave","RelationshipComponent"],"sources":["../../../../../src/features/relationship/client/components/RelationshipComponent.tsx"],"sourcesContent":["'use client'\nimport type { ElementFormatType } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useLexicalNodeSelection } from '@lexical/react/useLexicalNodeSelection.js'\nimport { mergeRegister } from '@lexical/utils'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button, useConfig, usePayloadAPI, useTranslation } from '@payloadcms/ui'\nimport {\n  $getNodeByKey,\n  $getSelection,\n  $isNodeSelection,\n  CLICK_COMMAND,\n  COMMAND_PRIORITY_LOW,\n  KEY_BACKSPACE_COMMAND,\n  KEY_DELETE_COMMAND,\n} from 'lexical'\nimport React, { useCallback, useEffect, useReducer, useRef, useState } from 'react'\n\nimport type { RelationshipData } from '../../server/nodes/RelationshipNode.js'\n\nimport { useEditorConfigContext } from '../../../../lexical/config/client/EditorConfigProvider.js'\nimport { useLexicalDocumentDrawer } from '../../../../utilities/fieldsDrawer/useLexicalDocumentDrawer.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from '../drawer/commands.js'\nimport { $isRelationshipNode } from '../nodes/RelationshipNode.js'\nimport './index.scss'\n\nconst baseClass = 'lexical-relationship'\n\nconst initialParams = {\n  depth: 0,\n}\n\ntype Props = {\n  className?: string\n  data: RelationshipData\n  format?: ElementFormatType\n  nodeKey?: string\n}\n\nconst Component: React.FC<Props> = (props) => {\n  const {\n    data: { relationTo, value },\n    nodeKey,\n  } = props\n\n  if (typeof value === 'object') {\n    throw new Error(\n      'Relationship value should be a string or number. The Lexical Relationship component should not receive the populated value object.',\n    )\n  }\n\n  const relationshipElemRef = useRef<HTMLDivElement | null>(null)\n\n  const [editor] = useLexicalComposerContext()\n  const [isSelected, setSelected, clearSelection] = useLexicalNodeSelection(nodeKey!)\n  const {\n    fieldProps: { readOnly },\n  } = useEditorConfigContext()\n  const {\n    config: {\n      collections,\n      routes: { api },\n      serverURL,\n    },\n  } = useConfig()\n\n  const [relatedCollection, setRelatedCollection] = useState(\n    () => collections.find((coll) => coll.slug === relationTo)!,\n  )\n\n  const { i18n, t } = useTranslation()\n  const [cacheBust, dispatchCacheBust] = useReducer((state) => state + 1, 0)\n  const [{ data }, { setParams }] = usePayloadAPI(\n    `${serverURL}${api}/${relatedCollection.slug}/${value}`,\n    { initialParams },\n  )\n\n  const { closeDocumentDrawer, DocumentDrawer, DocumentDrawerToggler } = useLexicalDocumentDrawer({\n    id: value,\n    collectionSlug: relatedCollection.slug,\n  })\n\n  const removeRelationship = useCallback(() => {\n    editor.update(() => {\n      $getNodeByKey(nodeKey!)?.remove()\n    })\n  }, [editor, nodeKey])\n\n  const updateRelationship = React.useCallback(() => {\n    setParams({\n      ...initialParams,\n      cacheBust, // do this to get the usePayloadAPI to re-fetch the data even though the URL string hasn't changed\n    })\n\n    closeDocumentDrawer()\n    dispatchCacheBust()\n  }, [cacheBust, setParams, closeDocumentDrawer])\n\n  const $onDelete = useCallback(\n    (payload: KeyboardEvent) => {\n      const deleteSelection = $getSelection()\n      if (isSelected && $isNodeSelection(deleteSelection)) {\n        const event: KeyboardEvent = payload\n        event.preventDefault()\n        editor.update(() => {\n          deleteSelection.getNodes().forEach((node) => {\n            if ($isRelationshipNode(node)) {\n              node.remove()\n            }\n          })\n        })\n      }\n      return false\n    },\n    [editor, isSelected],\n  )\n  const onClick = useCallback(\n    (payload: MouseEvent) => {\n      const event = payload\n      // Check if relationshipElemRef.target or anything WITHIN relationshipElemRef.target was clicked\n      if (\n        event.target === relationshipElemRef.current ||\n        relationshipElemRef.current?.contains(event.target as Node)\n      ) {\n        if (event.shiftKey) {\n          setSelected(!isSelected)\n        } else {\n          if (!isSelected) {\n            clearSelection()\n            setSelected(true)\n          }\n        }\n        return true\n      }\n\n      return false\n    },\n    [isSelected, setSelected, clearSelection],\n  )\n\n  useEffect(() => {\n    return mergeRegister(\n      editor.registerCommand<MouseEvent>(CLICK_COMMAND, onClick, COMMAND_PRIORITY_LOW),\n\n      editor.registerCommand(KEY_DELETE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n      editor.registerCommand(KEY_BACKSPACE_COMMAND, $onDelete, COMMAND_PRIORITY_LOW),\n    )\n  }, [clearSelection, editor, isSelected, nodeKey, $onDelete, setSelected, onClick])\n\n  return (\n    <div\n      className={[baseClass, isSelected && `${baseClass}--selected`].filter(Boolean).join(' ')}\n      contentEditable={false}\n      ref={relationshipElemRef}\n    >\n      <div className={`${baseClass}__wrap`}>\n        <p className={`${baseClass}__label`}>\n          {t('fields:labelRelationship', {\n            label: relatedCollection.labels?.singular\n              ? getTranslation(relatedCollection.labels?.singular, i18n)\n              : relatedCollection.slug,\n          })}\n        </p>\n        <DocumentDrawerToggler className={`${baseClass}__doc-drawer-toggler`}>\n          <p className={`${baseClass}__title`}>\n            {data ? data[relatedCollection?.admin?.useAsTitle || 'id'] : value}\n          </p>\n        </DocumentDrawerToggler>\n      </div>\n      {editor.isEditable() && (\n        <div className={`${baseClass}__actions`}>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__swapButton`}\n            disabled={readOnly}\n            el=\"button\"\n            icon=\"swap\"\n            onClick={() => {\n              if (nodeKey) {\n                editor.dispatchCommand(INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND, {\n                  replace: { nodeKey },\n                })\n              }\n            }}\n            round\n            tooltip={t('fields:swapRelationship')}\n          />\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__removeButton`}\n            disabled={readOnly}\n            icon=\"x\"\n            onClick={(e) => {\n              e.preventDefault()\n              removeRelationship()\n            }}\n            round\n            tooltip={t('fields:removeRelationship')}\n          />\n        </div>\n      )}\n\n      {!!value && <DocumentDrawer onSave={updateRelationship} />}\n    </div>\n  )\n}\n\nexport const RelationshipComponent = (props: Props): React.ReactNode => {\n  return <Component {...props} />\n}\n"],"mappings":"AAAA;;;AAGA,SAASA,yBAAyB,QAAQ;AAC1C,SAASC,uBAAuB,QAAQ;AACxC,SAASC,aAAa,QAAQ;AAC9B,SAASC,cAAc,QAAQ;AAC/B,SAASC,MAAM,EAAEC,SAAS,EAAEC,aAAa,EAAEC,cAAc,QAAQ;AACjE,SACEC,aAAa,EACbC,aAAa,EACbC,gBAAgB,EAChBC,aAAa,EACbC,oBAAoB,EACpBC,qBAAqB,EACrBC,kBAAkB,QACb;AACP,OAAOC,KAAA,IAASC,WAAW,EAAEC,SAAS,EAAEC,UAAU,EAAEC,MAAM,EAAEC,QAAQ,QAAQ;AAI5E,SAASC,sBAAsB,QAAQ;AACvC,SAASC,wBAAwB,QAAQ;AACzC,SAASC,uCAAuC,QAAQ;AACxD,SAASC,mBAAmB,QAAQ;AAGpC,MAAMC,SAAA,GAAY;AAElB,MAAMC,aAAA,GAAgB;EACpBC,KAAA,EAAO;AACT;AASA,MAAMC,SAAA,GAA8BC,KAAA;EAClC,MAAM;IACJC,IAAA,EAAM;MAAEC,UAAU;MAAEC;IAAK,CAAE;IAC3BC;EAAO,CACR,GAAGJ,KAAA;EAEJ,IAAI,OAAOG,KAAA,KAAU,UAAU;IAC7B,MAAM,IAAIE,KAAA,CACR;EAEJ;EAEA,MAAMC,mBAAA,GAAsBhB,MAAA,CAA8B;EAE1D,MAAM,CAACiB,MAAA,CAAO,GAAGpC,yBAAA;EACjB,MAAM,CAACqC,UAAA,EAAYC,WAAA,EAAaC,cAAA,CAAe,GAAGtC,uBAAA,CAAwBgC,OAAA;EAC1E,MAAM;IACJO,UAAA,EAAY;MAAEC;IAAQ;EAAE,CACzB,GAAGpB,sBAAA;EACJ,MAAM;IACJqB,MAAA,EAAQ;MACNC,WAAW;MACXC,MAAA,EAAQ;QAAEC;MAAG,CAAE;MACfC;IAAS;EACV,CACF,GAAGzC,SAAA;EAEJ,MAAM,CAAC0C,iBAAA,EAAmBC,oBAAA,CAAqB,GAAG5B,QAAA,CAChD,MAAMuB,WAAA,CAAYM,IAAI,CAAEC,IAAA,IAASA,IAAA,CAAKC,IAAI,KAAKpB,UAAA;EAGjD,MAAM;IAAEqB,IAAI;IAAEC;EAAC,CAAE,GAAG9C,cAAA;EACpB,MAAM,CAAC+C,SAAA,EAAWC,iBAAA,CAAkB,GAAGrC,UAAA,CAAYsC,KAAA,IAAUA,KAAA,GAAQ,GAAG;EACxE,MAAM,CAAC;IAAE1B;EAAI,CAAE,EAAE;IAAE2B;EAAS,CAAE,CAAC,GAAGnD,aAAA,CAChC,GAAGwC,SAAA,GAAYD,GAAA,IAAOE,iBAAA,CAAkBI,IAAI,IAAInB,KAAA,EAAO,EACvD;IAAEN;EAAc;EAGlB,MAAM;IAAEgC,mBAAmB;IAAEC,cAAc;IAAEC;EAAqB,CAAE,GAAGtC,wBAAA,CAAyB;IAC9FuC,EAAA,EAAI7B,KAAA;IACJ8B,cAAA,EAAgBf,iBAAA,CAAkBI;EACpC;EAEA,MAAMY,kBAAA,GAAqB/C,WAAA,CAAY;IACrCoB,MAAA,CAAO4B,MAAM,CAAC;MACZxD,aAAA,CAAcyB,OAAA,GAAWgC,MAAA;IAC3B;EACF,GAAG,CAAC7B,MAAA,EAAQH,OAAA,CAAQ;EAEpB,MAAMiC,kBAAA,GAAqBnD,KAAA,CAAMC,WAAW,CAAC;IAC3CyC,SAAA,CAAU;MACR,GAAG/B,aAAa;MAChB4B;IACF;IAEAI,mBAAA;IACAH,iBAAA;EACF,GAAG,CAACD,SAAA,EAAWG,SAAA,EAAWC,mBAAA,CAAoB;EAE9C,MAAMS,SAAA,GAAYnD,WAAA,CACfoD,OAAA;IACC,MAAMC,eAAA,GAAkB5D,aAAA;IACxB,IAAI4B,UAAA,IAAc3B,gBAAA,CAAiB2D,eAAA,GAAkB;MACnD,MAAMC,KAAA,GAAuBF,OAAA;MAC7BE,KAAA,CAAMC,cAAc;MACpBnC,MAAA,CAAO4B,MAAM,CAAC;QACZK,eAAA,CAAgBG,QAAQ,GAAGC,OAAO,CAAEC,IAAA;UAClC,IAAIlD,mBAAA,CAAoBkD,IAAA,GAAO;YAC7BA,IAAA,CAAKT,MAAM;UACb;QACF;MACF;IACF;IACA,OAAO;EACT,GACA,CAAC7B,MAAA,EAAQC,UAAA,CAAW;EAEtB,MAAMsC,OAAA,GAAU3D,WAAA,CACboD,SAAA;IACC,MAAME,OAAA,GAAQF,SAAA;IACd;IACA,IACEE,OAAA,CAAMM,MAAM,KAAKzC,mBAAA,CAAoB0C,OAAO,IAC5C1C,mBAAA,CAAoB0C,OAAO,EAAEC,QAAA,CAASR,OAAA,CAAMM,MAAM,GAClD;MACA,IAAIN,OAAA,CAAMS,QAAQ,EAAE;QAClBzC,WAAA,CAAY,CAACD,UAAA;MACf,OAAO;QACL,IAAI,CAACA,UAAA,EAAY;UACfE,cAAA;UACAD,WAAA,CAAY;QACd;MACF;MACA,OAAO;IACT;IAEA,OAAO;EACT,GACA,CAACD,UAAA,EAAYC,WAAA,EAAaC,cAAA,CAAe;EAG3CtB,SAAA,CAAU;IACR,OAAOf,aAAA,CACLkC,MAAA,CAAO4C,eAAe,CAAarE,aAAA,EAAegE,OAAA,EAAS/D,oBAAA,GAE3DwB,MAAA,CAAO4C,eAAe,CAAClE,kBAAA,EAAoBqD,SAAA,EAAWvD,oBAAA,GACtDwB,MAAA,CAAO4C,eAAe,CAACnE,qBAAA,EAAuBsD,SAAA,EAAWvD,oBAAA;EAE7D,GAAG,CAAC2B,cAAA,EAAgBH,MAAA,EAAQC,UAAA,EAAYJ,OAAA,EAASkC,SAAA,EAAW7B,WAAA,EAAaqC,OAAA,CAAQ;EAEjF,oBACEM,KAAA,CAAC;IACCC,SAAA,EAAW,CAACzD,SAAA,EAAWY,UAAA,IAAc,GAAGZ,SAAA,YAAqB,CAAC,CAAC0D,MAAM,CAACC,OAAA,EAASC,IAAI,CAAC;IACpFC,eAAA,EAAiB;IACjBC,GAAA,EAAKpD,mBAAA;4BAEL8C,KAAA,CAAC;MAAIC,SAAA,EAAW,GAAGzD,SAAA,QAAiB;8BAClC+D,IAAA,CAAC;QAAEN,SAAA,EAAW,GAAGzD,SAAA,SAAkB;kBAChC4B,CAAA,CAAE,4BAA4B;UAC7BoC,KAAA,EAAO1C,iBAAA,CAAkB2C,MAAM,EAAEC,QAAA,GAC7BxF,cAAA,CAAe4C,iBAAA,CAAkB2C,MAAM,EAAEC,QAAA,EAAUvC,IAAA,IACnDL,iBAAA,CAAkBI;QACxB;uBAEFqC,IAAA,CAAC5B,qBAAA;QAAsBsB,SAAA,EAAW,GAAGzD,SAAA,sBAA+B;kBAClE,aAAA+D,IAAA,CAAC;UAAEN,SAAA,EAAW,GAAGzD,SAAA,SAAkB;oBAChCK,IAAA,GAAOA,IAAI,CAACiB,iBAAA,EAAmB6C,KAAA,EAAOC,UAAA,IAAc,KAAK,GAAG7D;;;QAIlEI,MAAA,CAAO0D,UAAU,mBAChBb,KAAA,CAAC;MAAIC,SAAA,EAAW,GAAGzD,SAAA,WAAoB;8BACrC+D,IAAA,CAACpF,MAAA;QACC2F,WAAA,EAAY;QACZb,SAAA,EAAW,GAAGzD,SAAA,cAAuB;QACrCuE,QAAA,EAAUvD,QAAA;QACVwD,EAAA,EAAG;QACHC,IAAA,EAAK;QACLvB,OAAA,EAASA,CAAA;UACP,IAAI1C,OAAA,EAAS;YACXG,MAAA,CAAO+D,eAAe,CAAC5E,uCAAA,EAAyC;cAC9D6E,OAAA,EAAS;gBAAEnE;cAAQ;YACrB;UACF;QACF;QACAoE,KAAK;QACLC,OAAA,EAASjD,CAAA,CAAE;uBAEbmC,IAAA,CAACpF,MAAA;QACC2F,WAAA,EAAY;QACZb,SAAA,EAAW,GAAGzD,SAAA,gBAAyB;QACvCuE,QAAA,EAAUvD,QAAA;QACVyD,IAAA,EAAK;QACLvB,OAAA,EAAU4B,CAAA;UACRA,CAAA,CAAEhC,cAAc;UAChBR,kBAAA;QACF;QACAsC,KAAK;QACLC,OAAA,EAASjD,CAAA,CAAE;;QAKhB,CAAC,CAACrB,KAAA,iBAASwD,IAAA,CAAC7B,cAAA;MAAe6C,MAAA,EAAQtC;;;AAG1C;AAEA,OAAO,MAAMuC,qBAAA,GAAyB5E,KAAA;EACpC,oBAAO2D,IAAA,CAAC5D,SAAA;IAAW,GAAGC;;AACxB","ignoreList":[]}

package/dist/features/relationship/client/drawer/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$getNodeByKey","COMMAND_PRIORITY_EDITOR","React","useCallback","useEffect","useState","useLexicalListDrawer","$createRelationshipNode","INSERT_RELATIONSHIP_COMMAND","EnabledRelationshipsCondition","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","insertRelationship","editor","relationTo","replaceNodeKey","value","dispatchCommand","update","node","replace","RelationshipDrawerComponent","t0","$","enabledCollectionSlugs","t1","selectedCollectionSlug","setSelectedCollectionSlug","setReplaceNodeKey","t2","undefined","t3","collectionSlugs","selectedCollection","closeListDrawer","isListDrawerOpen","ListDrawer","openListDrawer","t4","t5","registerCommand","payload","nodeKey","t6","t7","collectionSlug","docID","onSelect","t8","t9","_jsx","RelationshipDrawer","props","length"],"sources":["../../../../../src/features/relationship/client/drawer/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $getNodeByKey, COMMAND_PRIORITY_EDITOR } from 'lexical'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useLexicalListDrawer } from '../../../../utilities/fieldsDrawer/useLexicalListDrawer.js'\nimport { $createRelationshipNode } from '../nodes/RelationshipNode.js'\nimport { INSERT_RELATIONSHIP_COMMAND } from '../plugins/index.js'\nimport { EnabledRelationshipsCondition } from '../utils/EnabledRelationshipsCondition.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from './commands.js'\n\nconst insertRelationship = ({\n  editor,\n  relationTo,\n  replaceNodeKey,\n  value,\n}: {\n  editor: LexicalEditor\n  relationTo: string\n  replaceNodeKey: null | string\n  value: number | string\n}) => {\n  if (!replaceNodeKey) {\n    editor.dispatchCommand(INSERT_RELATIONSHIP_COMMAND, {\n      relationTo,\n      value,\n    })\n  } else {\n    editor.update(() => {\n      const node = $getNodeByKey(replaceNodeKey)\n      if (node) {\n        node.replace($createRelationshipNode({ relationTo, value }))\n      }\n    })\n  }\n}\n\ntype Props = {\n  enabledCollectionSlugs: null | string[]\n}\n\nconst RelationshipDrawerComponent: React.FC<Props> = ({ enabledCollectionSlugs }) => {\n  const [editor] = useLexicalComposerContext()\n  const [selectedCollectionSlug, setSelectedCollectionSlug] = useState(\n    () => enabledCollectionSlugs?.[0],\n  )\n  const [replaceNodeKey, setReplaceNodeKey] = useState<null | string>(null)\n\n  const { closeListDrawer, isListDrawerOpen, ListDrawer, openListDrawer } = useLexicalListDrawer({\n    collectionSlugs: enabledCollectionSlugs ? enabledCollectionSlugs : undefined,\n    selectedCollection: selectedCollectionSlug,\n  })\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND,\n      (payload) => {\n        setReplaceNodeKey(payload?.replace ? payload?.replace.nodeKey : null)\n        openListDrawer()\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor, openListDrawer])\n\n  const onSelect = useCallback(\n    ({ collectionSlug, docID }) => {\n      insertRelationship({\n        editor,\n        relationTo: collectionSlug,\n        replaceNodeKey,\n        value: docID,\n      })\n      closeListDrawer()\n    },\n    [editor, closeListDrawer, replaceNodeKey],\n  )\n\n  useEffect(() => {\n    // always reset back to first option\n    // TODO: this is not working, see the ListDrawer component\n    setSelectedCollectionSlug(enabledCollectionSlugs?.[0])\n  }, [isListDrawerOpen, enabledCollectionSlugs])\n\n  return <ListDrawer onSelect={onSelect} />\n}\n\nexport const RelationshipDrawer = (props: Props): React.ReactNode => {\n  return (props?.enabledCollectionSlugs?.length ?? -1) > 0 ? ( // If enabledCollectionSlugs it overrides what EnabledRelationshipsCondition is doing\n    <RelationshipDrawerComponent {...props} />\n  ) : (\n    <EnabledRelationshipsCondition {...props}>\n      <RelationshipDrawerComponent {...props} />\n    </EnabledRelationshipsCondition>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","$getNodeByKey","COMMAND_PRIORITY_EDITOR","React","useCallback","useEffect","useState","useLexicalListDrawer","$createRelationshipNode","INSERT_RELATIONSHIP_COMMAND","EnabledRelationshipsCondition","INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND","insertRelationship","editor","relationTo","replaceNodeKey","value","dispatchCommand","update","node","replace","RelationshipDrawerComponent","t0","$","enabledCollectionSlugs","t1","selectedCollectionSlug","setSelectedCollectionSlug","setReplaceNodeKey","t2","undefined","t3","collectionSlugs","selectedCollection","closeListDrawer","isListDrawerOpen","ListDrawer","openListDrawer","t4","t5","registerCommand","payload","nodeKey","t6","t7","collectionSlug","docID","onSelect","t8","t9","_jsx","RelationshipDrawer","props","length"],"sources":["../../../../../src/features/relationship/client/drawer/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { $getNodeByKey, COMMAND_PRIORITY_EDITOR } from 'lexical'\nimport React, { useCallback, useEffect, useState } from 'react'\n\nimport { useLexicalListDrawer } from '../../../../utilities/fieldsDrawer/useLexicalListDrawer.js'\nimport { $createRelationshipNode } from '../nodes/RelationshipNode.js'\nimport { INSERT_RELATIONSHIP_COMMAND } from '../plugins/index.js'\nimport { EnabledRelationshipsCondition } from '../utils/EnabledRelationshipsCondition.js'\nimport { INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND } from './commands.js'\n\nconst insertRelationship = ({\n  editor,\n  relationTo,\n  replaceNodeKey,\n  value,\n}: {\n  editor: LexicalEditor\n  relationTo: string\n  replaceNodeKey: null | string\n  value: number | string\n}) => {\n  if (!replaceNodeKey) {\n    editor.dispatchCommand(INSERT_RELATIONSHIP_COMMAND, {\n      relationTo,\n      value,\n    })\n  } else {\n    editor.update(() => {\n      const node = $getNodeByKey(replaceNodeKey)\n      if (node) {\n        node.replace($createRelationshipNode({ relationTo, value }))\n      }\n    })\n  }\n}\n\ntype Props = {\n  enabledCollectionSlugs: null | string[]\n}\n\nconst RelationshipDrawerComponent: React.FC<Props> = ({ enabledCollectionSlugs }) => {\n  const [editor] = useLexicalComposerContext()\n  const [selectedCollectionSlug, setSelectedCollectionSlug] = useState(\n    () => enabledCollectionSlugs?.[0],\n  )\n  const [replaceNodeKey, setReplaceNodeKey] = useState<null | string>(null)\n\n  const { closeListDrawer, isListDrawerOpen, ListDrawer, openListDrawer } = useLexicalListDrawer({\n    collectionSlugs: enabledCollectionSlugs ? enabledCollectionSlugs : undefined,\n    selectedCollection: selectedCollectionSlug,\n  })\n\n  useEffect(() => {\n    return editor.registerCommand<{\n      replace: { nodeKey: string } | false\n    }>(\n      INSERT_RELATIONSHIP_WITH_DRAWER_COMMAND,\n      (payload) => {\n        setReplaceNodeKey(payload?.replace ? payload?.replace.nodeKey : null)\n        openListDrawer()\n        return true\n      },\n      COMMAND_PRIORITY_EDITOR,\n    )\n  }, [editor, openListDrawer])\n\n  const onSelect = useCallback(\n    ({ collectionSlug, docID }: { collectionSlug: string; docID: number | string }) => {\n      insertRelationship({\n        editor,\n        relationTo: collectionSlug,\n        replaceNodeKey,\n        value: docID,\n      })\n      closeListDrawer()\n    },\n    [editor, closeListDrawer, replaceNodeKey],\n  )\n\n  useEffect(() => {\n    // always reset back to first option\n    // TODO: this is not working, see the ListDrawer component\n    setSelectedCollectionSlug(enabledCollectionSlugs?.[0])\n  }, [isListDrawerOpen, enabledCollectionSlugs])\n\n  return <ListDrawer onSelect={onSelect} />\n}\n\nexport const RelationshipDrawer = (props: Props): React.ReactNode => {\n  return (props?.enabledCollectionSlugs?.length ?? -1) > 0 ? ( // If enabledCollectionSlugs it overrides what EnabledRelationshipsCondition is doing\n    <RelationshipDrawerComponent {...props} />\n  ) : (\n    <EnabledRelationshipsCondition {...props}>\n      <RelationshipDrawerComponent {...props} />\n    </EnabledRelationshipsCondition>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/relationship/server/nodes/RelationshipNode.d.ts

@@ -25,7 +25,7 @@ export declare class RelationshipServerNode extends DecoratorBlockNode {
     static importDOM(): DOMConversionMap<HTMLDivElement> | null;
     static importJSON(serializedNode: SerializedRelationshipNode): RelationshipServerNode;
     static isInline(): false;
-    decorate(editor: LexicalEditor, config: EditorConfig): JSX.Element | null;
+    decorate(_editor: LexicalEditor, _config: EditorConfig): JSX.Element | null;
     exportDOM(): DOMExportOutput;
     exportJSON(): SerializedRelationshipNode;
     getData(): RelationshipData;

package/dist/features/relationship/server/nodes/RelationshipNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RelationshipNode.d.ts","sourceRoot":"","sources":["../../../../../src/features/relationship/server/nodes/RelationshipNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6CAA6C,CAAA;AAC/F,OAAO,KAAK,EACV,gBAAgB,EAEhB,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,OAAO,EACP,MAAM,EACP,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AACrE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAA;AAEhF,MAAM,MAAM,gBAAgB,GAAG;KAC5B,eAAe,IAAI,cAAc,GAAG;QACnC,UAAU,EAAE,eAAe,CAAA;QAC3B,KAAK,EAAE,sBAAsB,CAAC,eAAe,CAAC,GAAG,MAAM,GAAG,MAAM,CAAA;KACjE;CACF,CAAC,cAAc,CAAC,CAAA;AAEjB,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,IAAI,EAAE,cAAc,CAAA;CACrB,GAAG,MAAM,CAAC,gBAAgB,EAAE,4BAA4B,CAAC,CAAA;AAgB1D,qBAAa,sBAAuB,SAAQ,kBAAkB;IAC5D,MAAM,EAAE,gBAAgB,CAAA;gBAEZ,EACV,IAAI,EACJ,MAAM,EACN,GAAG,GACJ,EAAE;QACD,IAAI,EAAE,gBAAgB,CAAA;QACtB,MAAM,CAAC,EAAE,iBAAiB,CAAA;QAC1B,GAAG,CAAC,EAAE,OAAO,CAAA;KACd;IAKD,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,sBAAsB,GAAG,sBAAsB;IAQlE,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,SAAS,IAAI,gBAAgB,CAAC,cAAc,CAAC,GAAG,IAAI;IAiB3D,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,0BAA0B,GAAG,sBAAsB;IAcrF,MAAM,CAAC,QAAQ,IAAI,KAAK;IAIxB,QAAQ,CAAC,MAAM,EAAE,aAAa,EAAE,MAAM,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI;IAIzE,SAAS,IAAI,eAAe;IAU5B,UAAU,IAAI,0BAA0B;IASxC,OAAO,IAAI,gBAAgB;IAI3B,cAAc,IAAI,MAAM;IAIxB,OAAO,CAAC,IAAI,EAAE,gBAAgB,GAAG,IAAI;CAItC;AAED,wBAAgB,6BAA6B,CAAC,IAAI,EAAE,gBAAgB,GAAG,sBAAsB,CAI5F;AAED,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,sBAAsB,GAAG,SAAS,GAC5D,IAAI,IAAI,sBAAsB,CAEhC"}
+{"version":3,"file":"RelationshipNode.d.ts","sourceRoot":"","sources":["../../../../../src/features/relationship/server/nodes/RelationshipNode.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6CAA6C,CAAA;AAC/F,OAAO,KAAK,EACV,gBAAgB,EAEhB,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,aAAa,EACb,WAAW,EACX,OAAO,EACP,MAAM,EACP,MAAM,SAAS,CAAA;AAChB,OAAO,KAAK,EAAE,cAAc,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAA;AACrE,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAEhC,OAAO,EAAE,kBAAkB,EAAE,MAAM,6CAA6C,CAAA;AAEhF,MAAM,MAAM,gBAAgB,GAAG;KAC5B,eAAe,IAAI,cAAc,GAAG;QACnC,UAAU,EAAE,eAAe,CAAA;QAC3B,KAAK,EAAE,sBAAsB,CAAC,eAAe,CAAC,GAAG,MAAM,GAAG,MAAM,CAAA;KACjE;CACF,CAAC,cAAc,CAAC,CAAA;AAEjB,MAAM,MAAM,0BAA0B,GAAG;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAA;IAChB,IAAI,EAAE,cAAc,CAAA;CACrB,GAAG,MAAM,CAAC,gBAAgB,EAAE,4BAA4B,CAAC,CAAA;AAgB1D,qBAAa,sBAAuB,SAAQ,kBAAkB;IAC5D,MAAM,EAAE,gBAAgB,CAAA;gBAEZ,EACV,IAAI,EACJ,MAAM,EACN,GAAG,GACJ,EAAE;QACD,IAAI,EAAE,gBAAgB,CAAA;QACtB,MAAM,CAAC,EAAE,iBAAiB,CAAA;QAC1B,GAAG,CAAC,EAAE,OAAO,CAAA;KACd;IAKD,MAAM,CAAC,KAAK,CAAC,IAAI,EAAE,sBAAsB,GAAG,sBAAsB;IAQlE,MAAM,CAAC,OAAO,IAAI,MAAM;IAIxB,MAAM,CAAC,SAAS,IAAI,gBAAgB,CAAC,cAAc,CAAC,GAAG,IAAI;IAiB3D,MAAM,CAAC,UAAU,CAAC,cAAc,EAAE,0BAA0B,GAAG,sBAAsB;IAcrF,MAAM,CAAC,QAAQ,IAAI,KAAK;IAIxB,QAAQ,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI;IAI3E,SAAS,IAAI,eAAe;IAa5B,UAAU,IAAI,0BAA0B;IASxC,OAAO,IAAI,gBAAgB;IAI3B,cAAc,IAAI,MAAM;IAIxB,OAAO,CAAC,IAAI,EAAE,gBAAgB,GAAG,IAAI;CAItC;AAED,wBAAgB,6BAA6B,CAAC,IAAI,EAAE,gBAAgB,GAAG,sBAAsB,CAI5F;AAED,wBAAgB,yBAAyB,CACvC,IAAI,EAAE,WAAW,GAAG,IAAI,GAAG,sBAAsB,GAAG,SAAS,GAC5D,IAAI,IAAI,sBAAsB,CAEhC"}

package/dist/features/relationship/server/nodes/RelationshipNode.js

@@ -61,12 +61,12 @@ export class RelationshipServerNode extends DecoratorBlockNode {
   static isInline() {
     return false;
   }
-  decorate(editor, config) {
+  decorate(_editor, _config) {
     return null;
   }
   exportDOM() {
     const element = document.createElement('div');
-    element.setAttribute('data-lexical-relationship-id', String(this.__data?.value));
+    element.setAttribute('data-lexical-relationship-id', String(typeof this.__data?.value === 'object' ? this.__data?.value?.id : this.__data?.value));
     element.setAttribute('data-lexical-relationship-relationTo', this.__data?.relationTo);
     const text = document.createTextNode(this.getTextContent());
     element.append(text);
@@ -86,7 +86,7 @@ export class RelationshipServerNode extends DecoratorBlockNode {
     return this.getLatest().__data;
   }
   getTextContent() {
-    return `${this.__data?.relationTo} relation to ${this.__data?.value}`;
+    return `${this.__data?.relationTo} relation to ${typeof this.__data?.value === 'object' ? this.__data?.value?.id : this.__data?.value}`;
   }
   setData(data) {
     const writable = this.getWritable();

package/dist/features/relationship/server/nodes/RelationshipNode.js.map

@@ -1 +1 @@
-{"version":3,"file":"RelationshipNode.js","names":["DecoratorBlockNode","$relationshipElementToServerNode","domNode","id","getAttribute","relationTo","node","$createServerRelationshipNode","value","RelationshipServerNode","__data","constructor","data","format","key","clone","__format","__key","getType","importDOM","div","hasAttribute","conversion","priority","importJSON","serializedNode","version","importedData","setFormat","isInline","decorate","editor","config","exportDOM","element","document","createElement","setAttribute","String","text","createTextNode","getTextContent","append","exportJSON","getData","type","getLatest","setData","writable","getWritable","$isServerRelationshipNode"],"sources":["../../../../../src/features/relationship/server/nodes/RelationshipNode.tsx"],"sourcesContent":["import type { SerializedDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode.js'\nimport type {\n  DOMConversionMap,\n  DOMConversionOutput,\n  DOMExportOutput,\n  EditorConfig,\n  ElementFormatType,\n  LexicalEditor,\n  LexicalNode,\n  NodeKey,\n  Spread,\n} from 'lexical'\nimport type { CollectionSlug, DataFromCollectionSlug } from 'payload'\nimport type { JSX } from 'react'\n\nimport { DecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode.js'\n\nexport type RelationshipData = {\n  [TCollectionSlug in CollectionSlug]: {\n    relationTo: TCollectionSlug\n    value: DataFromCollectionSlug<TCollectionSlug> | number | string\n  }\n}[CollectionSlug]\n\nexport type SerializedRelationshipNode = {\n  children?: never // required so that our typed editor state doesn't automatically add children\n  type: 'relationship'\n} & Spread<RelationshipData, SerializedDecoratorBlockNode>\n\nfunction $relationshipElementToServerNode(domNode: HTMLDivElement): DOMConversionOutput | null {\n  const id = domNode.getAttribute('data-lexical-relationship-id')\n  const relationTo = domNode.getAttribute('data-lexical-relationship-relationTo')\n\n  if (id != null && relationTo != null) {\n    const node = $createServerRelationshipNode({\n      relationTo,\n      value: id,\n    })\n    return { node }\n  }\n  return null\n}\n\nexport class RelationshipServerNode extends DecoratorBlockNode {\n  __data: RelationshipData\n\n  constructor({\n    data,\n    format,\n    key,\n  }: {\n    data: RelationshipData\n    format?: ElementFormatType\n    key?: NodeKey\n  }) {\n    super(format, key)\n    this.__data = data\n  }\n\n  static clone(node: RelationshipServerNode): RelationshipServerNode {\n    return new this({\n      data: node.__data,\n      format: node.__format,\n      key: node.__key,\n    })\n  }\n\n  static getType(): string {\n    return 'relationship'\n  }\n\n  static importDOM(): DOMConversionMap<HTMLDivElement> | null {\n    return {\n      div: (domNode: HTMLDivElement) => {\n        if (\n          !domNode.hasAttribute('data-lexical-relationship-relationTo') ||\n          !domNode.hasAttribute('data-lexical-relationship-id')\n        ) {\n          return null\n        }\n        return {\n          conversion: $relationshipElementToServerNode,\n          priority: 2,\n        }\n      },\n    }\n  }\n\n  static importJSON(serializedNode: SerializedRelationshipNode): RelationshipServerNode {\n    if (serializedNode.version === 1 && (serializedNode?.value as unknown as { id: string })?.id) {\n      serializedNode.value = (serializedNode.value as unknown as { id: string }).id\n    }\n\n    const importedData: RelationshipData = {\n      relationTo: serializedNode.relationTo,\n      value: serializedNode.value,\n    }\n    const node = $createServerRelationshipNode(importedData)\n    node.setFormat(serializedNode.format)\n    return node\n  }\n\n  static isInline(): false {\n    return false\n  }\n\n  decorate(editor: LexicalEditor, config: EditorConfig): JSX.Element | null {\n    return null\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement('div')\n    element.setAttribute('data-lexical-relationship-id', String(this.__data?.value))\n    element.setAttribute('data-lexical-relationship-relationTo', this.__data?.relationTo)\n\n    const text = document.createTextNode(this.getTextContent())\n    element.append(text)\n    return { element }\n  }\n\n  exportJSON(): SerializedRelationshipNode {\n    return {\n      ...super.exportJSON(),\n      ...this.getData(),\n      type: 'relationship',\n      version: 2,\n    }\n  }\n\n  getData(): RelationshipData {\n    return this.getLatest().__data\n  }\n\n  getTextContent(): string {\n    return `${this.__data?.relationTo} relation to ${this.__data?.value}`\n  }\n\n  setData(data: RelationshipData): void {\n    const writable = this.getWritable()\n    writable.__data = data\n  }\n}\n\nexport function $createServerRelationshipNode(data: RelationshipData): RelationshipServerNode {\n  return new RelationshipServerNode({\n    data,\n  })\n}\n\nexport function $isServerRelationshipNode(\n  node: LexicalNode | null | RelationshipServerNode | undefined,\n): node is RelationshipServerNode {\n  return node instanceof RelationshipServerNode\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"RelationshipNode.js","names":["DecoratorBlockNode","$relationshipElementToServerNode","domNode","id","getAttribute","relationTo","node","$createServerRelationshipNode","value","RelationshipServerNode","__data","constructor","data","format","key","clone","__format","__key","getType","importDOM","div","hasAttribute","conversion","priority","importJSON","serializedNode","version","importedData","setFormat","isInline","decorate","_editor","_config","exportDOM","element","document","createElement","setAttribute","String","text","createTextNode","getTextContent","append","exportJSON","getData","type","getLatest","setData","writable","getWritable","$isServerRelationshipNode"],"sources":["../../../../../src/features/relationship/server/nodes/RelationshipNode.tsx"],"sourcesContent":["import type { SerializedDecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode.js'\nimport type {\n  DOMConversionMap,\n  DOMConversionOutput,\n  DOMExportOutput,\n  EditorConfig,\n  ElementFormatType,\n  LexicalEditor,\n  LexicalNode,\n  NodeKey,\n  Spread,\n} from 'lexical'\nimport type { CollectionSlug, DataFromCollectionSlug } from 'payload'\nimport type { JSX } from 'react'\n\nimport { DecoratorBlockNode } from '@lexical/react/LexicalDecoratorBlockNode.js'\n\nexport type RelationshipData = {\n  [TCollectionSlug in CollectionSlug]: {\n    relationTo: TCollectionSlug\n    value: DataFromCollectionSlug<TCollectionSlug> | number | string\n  }\n}[CollectionSlug]\n\nexport type SerializedRelationshipNode = {\n  children?: never // required so that our typed editor state doesn't automatically add children\n  type: 'relationship'\n} & Spread<RelationshipData, SerializedDecoratorBlockNode>\n\nfunction $relationshipElementToServerNode(domNode: HTMLDivElement): DOMConversionOutput | null {\n  const id = domNode.getAttribute('data-lexical-relationship-id')\n  const relationTo = domNode.getAttribute('data-lexical-relationship-relationTo')\n\n  if (id != null && relationTo != null) {\n    const node = $createServerRelationshipNode({\n      relationTo,\n      value: id,\n    })\n    return { node }\n  }\n  return null\n}\n\nexport class RelationshipServerNode extends DecoratorBlockNode {\n  __data: RelationshipData\n\n  constructor({\n    data,\n    format,\n    key,\n  }: {\n    data: RelationshipData\n    format?: ElementFormatType\n    key?: NodeKey\n  }) {\n    super(format, key)\n    this.__data = data\n  }\n\n  static clone(node: RelationshipServerNode): RelationshipServerNode {\n    return new this({\n      data: node.__data,\n      format: node.__format,\n      key: node.__key,\n    })\n  }\n\n  static getType(): string {\n    return 'relationship'\n  }\n\n  static importDOM(): DOMConversionMap<HTMLDivElement> | null {\n    return {\n      div: (domNode: HTMLDivElement) => {\n        if (\n          !domNode.hasAttribute('data-lexical-relationship-relationTo') ||\n          !domNode.hasAttribute('data-lexical-relationship-id')\n        ) {\n          return null\n        }\n        return {\n          conversion: $relationshipElementToServerNode,\n          priority: 2,\n        }\n      },\n    }\n  }\n\n  static importJSON(serializedNode: SerializedRelationshipNode): RelationshipServerNode {\n    if (serializedNode.version === 1 && (serializedNode?.value as unknown as { id: string })?.id) {\n      serializedNode.value = (serializedNode.value as unknown as { id: string }).id\n    }\n\n    const importedData: RelationshipData = {\n      relationTo: serializedNode.relationTo,\n      value: serializedNode.value,\n    }\n    const node = $createServerRelationshipNode(importedData)\n    node.setFormat(serializedNode.format)\n    return node\n  }\n\n  static isInline(): false {\n    return false\n  }\n\n  decorate(_editor: LexicalEditor, _config: EditorConfig): JSX.Element | null {\n    return null\n  }\n\n  exportDOM(): DOMExportOutput {\n    const element = document.createElement('div')\n    element.setAttribute(\n      'data-lexical-relationship-id',\n      String(typeof this.__data?.value === 'object' ? this.__data?.value?.id : this.__data?.value),\n    )\n    element.setAttribute('data-lexical-relationship-relationTo', this.__data?.relationTo)\n\n    const text = document.createTextNode(this.getTextContent())\n    element.append(text)\n    return { element }\n  }\n\n  exportJSON(): SerializedRelationshipNode {\n    return {\n      ...super.exportJSON(),\n      ...this.getData(),\n      type: 'relationship',\n      version: 2,\n    }\n  }\n\n  getData(): RelationshipData {\n    return this.getLatest().__data\n  }\n\n  getTextContent(): string {\n    return `${this.__data?.relationTo} relation to ${typeof this.__data?.value === 'object' ? this.__data?.value?.id : this.__data?.value}`\n  }\n\n  setData(data: RelationshipData): void {\n    const writable = this.getWritable()\n    writable.__data = data\n  }\n}\n\nexport function $createServerRelationshipNode(data: RelationshipData): RelationshipServerNode {\n  return new RelationshipServerNode({\n    data,\n  })\n}\n\nexport function $isServerRelationshipNode(\n  node: LexicalNode | null | RelationshipServerNode | undefined,\n): node is RelationshipServerNode {\n  return node instanceof RelationshipServerNode\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/fixed/client/Toolbar/index.d.ts

@@ -1,5 +1,5 @@
-import type { PluginComponentWithAnchor } from '../../../../typesClient.js';
+import type { PluginComponent } from '../../../../typesClient.js';
 import type { FixedToolbarFeatureProps } from '../../server/index.js';
 import './index.scss';
-export declare const FixedToolbarPlugin: PluginComponentWithAnchor<FixedToolbarFeatureProps>;
+export declare const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps>;
 //# sourceMappingURL=index.d.ts.map

package/dist/features/toolbars/fixed/client/Toolbar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAA;AAE3E,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AAKrE,OAAO,cAAc,CAAA;AAiPrB,eAAO,MAAM,kBAAkB,EAAE,yBAAyB,CAAC,wBAAwB,CAqClF,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAA;AAEjE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,uBAAuB,CAAA;AAKrE,OAAO,cAAc,CAAA;AAqPrB,eAAO,MAAM,kBAAkB,EAAE,eAAe,CAAC,wBAAwB,CAkCxE,CAAA"}

package/dist/features/toolbars/fixed/client/Toolbar/index.js

@@ -31,7 +31,7 @@ function ButtonGroupItem({
   }, item.key);
 }
 function ToolbarGroupComponent(t0) {
-  const $ = _c(26);
+  const $ = _c(18);
   const {
     anchorElem,
     editor,
@@ -112,68 +112,48 @@ function ToolbarGroupComponent(t0) {
   const onActiveChange = t4;
   const t5 = `fixed-toolbar__group fixed-toolbar__group-${group.key}`;
   let t6;
-  if ($[8] !== group || $[9] !== DropdownIcon || $[10] !== anchorElem || $[11] !== editor || $[12] !== dropdownLabel || $[13] !== onActiveChange) {
-    t6 = group.type === "dropdown" && group.items.length && (DropdownIcon ? _jsx(ToolbarDropdown, {
-      anchorElem,
-      editor,
-      group,
-      Icon: DropdownIcon,
-      itemsContainerClassNames: ["fixed-toolbar__dropdown-items"],
-      label: dropdownLabel,
-      maxActiveItems: 1,
-      onActiveChange
-    }) : _jsx(ToolbarDropdown, {
-      anchorElem,
-      editor,
-      group,
-      itemsContainerClassNames: ["fixed-toolbar__dropdown-items"],
-      label: dropdownLabel,
-      maxActiveItems: 1,
-      onActiveChange
-    }));
+  if ($[8] !== group || $[9] !== DropdownIcon || $[10] !== anchorElem || $[11] !== editor || $[12] !== dropdownLabel || $[13] !== onActiveChange || $[14] !== editorConfig.features.toolbarFixed || $[15] !== index || $[16] !== t5) {
+    t6 = _jsxs("div", {
+      className: t5,
+      children: [group.type === "dropdown" && group.items.length ? DropdownIcon ? _jsx(ToolbarDropdown, {
+        anchorElem,
+        editor,
+        group,
+        Icon: DropdownIcon,
+        itemsContainerClassNames: ["fixed-toolbar__dropdown-items"],
+        label: dropdownLabel,
+        maxActiveItems: 1,
+        onActiveChange
+      }) : _jsx(ToolbarDropdown, {
+        anchorElem,
+        editor,
+        group,
+        itemsContainerClassNames: ["fixed-toolbar__dropdown-items"],
+        label: dropdownLabel,
+        maxActiveItems: 1,
+        onActiveChange
+      }) : null, group.type === "buttons" && group.items.length ? group.items.map(item_0 => _jsx(ButtonGroupItem, {
+        anchorElem,
+        editor,
+        item: item_0
+      }, item_0.key)) : null, index < editorConfig.features.toolbarFixed?.groups.length - 1 && _jsx("div", {
+        className: "divider"
+      })]
+    }, group.key);
     $[8] = group;
     $[9] = DropdownIcon;
     $[10] = anchorElem;
     $[11] = editor;
     $[12] = dropdownLabel;
     $[13] = onActiveChange;
-    $[14] = t6;
+    $[14] = editorConfig.features.toolbarFixed;
+    $[15] = index;
+    $[16] = t5;
+    $[17] = t6;
   } else {
-    t6 = $[14];
+    t6 = $[17];
   }
-  let t7;
-  if ($[15] !== group || $[16] !== anchorElem || $[17] !== editor) {
-    t7 = group.type === "buttons" && group.items.length && group.items.map(item_0 => _jsx(ButtonGroupItem, {
-      anchorElem,
-      editor,
-      item: item_0
-    }, item_0.key));
-    $[15] = group;
-    $[16] = anchorElem;
-    $[17] = editor;
-    $[18] = t7;
-  } else {
-    t7 = $[18];
-  }
-  let t8;
-  if ($[19] !== editorConfig.features.toolbarFixed || $[20] !== index || $[21] !== t6 || $[22] !== t7 || $[23] !== t5 || $[24] !== group.key) {
-    t8 = _jsxs("div", {
-      className: t5,
-      children: [t6, t7, index < editorConfig.features.toolbarFixed?.groups.length - 1 && _jsx("div", {
-        className: "divider"
-      })]
-    }, group.key);
-    $[19] = editorConfig.features.toolbarFixed;
-    $[20] = index;
-    $[21] = t6;
-    $[22] = t7;
-    $[23] = t5;
-    $[24] = group.key;
-    $[25] = t8;
-  } else {
-    t8 = $[25];
-  }
-  return t8;
+  return t6;
 }
 function FixedToolbar({
   anchorElem,
@@ -215,14 +195,18 @@ function FixedToolbar({
     // we only need to check for vertical overlap
     const overlapping = !(currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom);
     if (overlapping) {
-      currentToolbarElem.className = 'fixed-toolbar fixed-toolbar--overlapping';
-      parentToolbarElem.className = 'fixed-toolbar fixed-toolbar--hide';
+      currentToolbarElem.classList.remove('fixed-toolbar');
+      currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping');
+      parentToolbarElem.classList.remove('fixed-toolbar');
+      parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide');
     } else {
       if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {
         return;
       }
-      currentToolbarElem.className = 'fixed-toolbar';
-      parentToolbarElem.className = 'fixed-toolbar';
+      currentToolbarElem.classList.remove('fixed-toolbar--overlapping');
+      currentToolbarElem.classList.add('fixed-toolbar');
+      parentToolbarElem.classList.remove('fixed-toolbar--hide');
+      parentToolbarElem.classList.add('fixed-toolbar');
     }
   }, 50, [currentToolbarRef, parentToolbarElem, y]);
   return /*#__PURE__*/_jsx("div", {
@@ -259,9 +243,8 @@ const getParentEditorWithFixedToolbar = editorConfigContext => {
   return false;
 };
 export const FixedToolbarPlugin = t0 => {
-  const $ = _c(7);
+  const $ = _c(6);
   const {
-    anchorElem,
     clientProps
   } = t0;
   const [currentEditor] = useLexicalComposerContext();
@@ -273,7 +256,7 @@ export const FixedToolbarPlugin = t0 => {
   const editorConfig = clientProps.applyToFocusedEditor ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig : currentEditorConfig;
   let t1;
   let t2;
-  if ($[0] !== editorConfigContext || $[1] !== clientProps?.disableIfParentHasFixedToolbar || $[2] !== editorConfig || $[3] !== anchorElem || $[4] !== editor) {
+  if ($[0] !== editorConfigContext || $[1] !== clientProps?.disableIfParentHasFixedToolbar || $[2] !== editorConfig || $[3] !== editor) {
     t2 = Symbol.for("react.early_return_sentinel");
     bb0: {
       const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext);
@@ -288,7 +271,7 @@ export const FixedToolbarPlugin = t0 => {
         break bb0;
       }
       t1 = _jsx(FixedToolbar, {
-        anchorElem,
+        anchorElem: document.body,
         editor,
         editorConfig,
         parentWithFixedToolbar
@@ -297,13 +280,12 @@ export const FixedToolbarPlugin = t0 => {
     $[0] = editorConfigContext;
     $[1] = clientProps?.disableIfParentHasFixedToolbar;
     $[2] = editorConfig;
-    $[3] = anchorElem;
-    $[4] = editor;
-    $[5] = t1;
-    $[6] = t2;
+    $[3] = editor;
+    $[4] = t1;
+    $[5] = t2;
   } else {
-    t1 = $[5];
-    t2 = $[6];
+    t1 = $[4];
+    t2 = $[5];
   }
   if (t2 !== Symbol.for("react.early_return_sentinel")) {
     return t2;

package/dist/features/toolbars/fixed/client/Toolbar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","editorConfig","group","index","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","dropdownLabel","setDropdownLabel","useState","undefined","DropdownIcon","setDropdownIcon","t2","t3","type","items","length","useEffect","t4","t5","activeItems","label","substring","onActiveChange","t6","Icon","itemsContainerClassNames","maxActiveItems","t7","map","item_0","t8","features","toolbarFixed","_jsxs","className","children","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","onFocus","event","stopPropagation","ref","isEditable","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","Symbol","for","bb0"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponentWithAnchor } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n  anchorElem,\n  editor,\n  item,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}): React.ReactNode {\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n      )\n    )\n  }\n\n  if (!item.ChildComponent) {\n    return null\n  }\n\n  return (\n    <ToolbarButton editor={editor} item={item} key={item.key}>\n      <item.ChildComponent />\n    </ToolbarButton>\n  )\n}\n\nfunction ToolbarGroupComponent({\n  anchorElem,\n  editor,\n  editorConfig,\n  group,\n  index,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  group: ToolbarGroup\n  index: number\n}): React.ReactNode {\n  const { i18n } = useTranslation()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n  const [dropdownLabel, setDropdownLabel] = React.useState<string | undefined>(undefined)\n  const [DropdownIcon, setDropdownIcon] = React.useState<React.FC | undefined>(undefined)\n\n  React.useEffect(() => {\n    if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n      setDropdownIcon(() => group.ChildComponent!)\n    } else {\n      setDropdownIcon(undefined)\n    }\n  }, [group])\n\n  const onActiveChange = React.useCallback(\n    ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n      if (!activeItems.length) {\n        if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n          setDropdownIcon(() => group.ChildComponent!)\n          setDropdownLabel(undefined)\n        } else {\n          setDropdownIcon(undefined)\n          setDropdownLabel(undefined)\n        }\n        return\n      }\n      const item = activeItems[0]\n\n      let label = item.key\n      if (item.label) {\n        label =\n          typeof item.label === 'function'\n            ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n            : item.label\n      }\n      // Crop title to max. 25 characters\n      if (label.length > 25) {\n        label = label.substring(0, 25) + '...'\n      }\n      setDropdownLabel(label)\n      setDropdownIcon(() => item.ChildComponent)\n    },\n    [group, i18n, featureClientSchemaMap, schemaPath],\n  )\n\n  return (\n    <div className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`} key={group.key}>\n      {group.type === 'dropdown' &&\n        group.items.length &&\n        (DropdownIcon ? (\n          <ToolbarDropdown\n            anchorElem={anchorElem}\n            editor={editor}\n            group={group}\n            Icon={DropdownIcon}\n            itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n            label={dropdownLabel}\n            maxActiveItems={1}\n            onActiveChange={onActiveChange}\n          />\n        ) : (\n          <ToolbarDropdown\n            anchorElem={anchorElem}\n            editor={editor}\n            group={group}\n            itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n            label={dropdownLabel}\n            maxActiveItems={1}\n            onActiveChange={onActiveChange}\n          />\n        ))}\n      {group.type === 'buttons' &&\n        group.items.length &&\n        group.items.map((item) => {\n          return (\n            <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n          )\n        })}\n      {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n    </div>\n  )\n}\n\nfunction FixedToolbar({\n  anchorElem,\n  clientProps,\n  editor,\n  editorConfig,\n  parentWithFixedToolbar,\n}: {\n  anchorElem: HTMLElement\n  clientProps?: FixedToolbarFeatureProps\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n  const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n\n  const { y } = useScrollInfo()\n\n  // Memoize the parent toolbar element\n  const parentToolbarElem = useMemo(() => {\n    if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n      return null\n    }\n\n    const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n    let sibling = parentEditorElem.previousElementSibling\n    while (sibling) {\n      if (sibling.classList.contains('fixed-toolbar')) {\n        return sibling\n      }\n      sibling = sibling.previousElementSibling\n    }\n    return null\n  }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n  useThrottledEffect(\n    () => {\n      if (!parentToolbarElem) {\n        // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n        return\n      }\n      const currentToolbarElem = currentToolbarRef.current\n      if (!currentToolbarElem) {\n        return\n      }\n\n      const currentRect = currentToolbarElem.getBoundingClientRect()\n      const parentRect = parentToolbarElem.getBoundingClientRect()\n\n      // we only need to check for vertical overlap\n      const overlapping = !(\n        currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n      )\n\n      if (overlapping) {\n        currentToolbarElem.className = 'fixed-toolbar fixed-toolbar--overlapping'\n        parentToolbarElem.className = 'fixed-toolbar fixed-toolbar--hide'\n      } else {\n        if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n          return\n        }\n        currentToolbarElem.className = 'fixed-toolbar'\n        parentToolbarElem.className = 'fixed-toolbar'\n      }\n    },\n    50,\n    [currentToolbarRef, parentToolbarElem, y],\n  )\n\n  return (\n    <div\n      className=\"fixed-toolbar\"\n      onFocus={(event) => {\n        // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n        // the parent editor will be focused, and the child editor will lose focus.\n        event.stopPropagation()\n      }}\n      ref={currentToolbarRef}\n    >\n      {editor.isEditable() && (\n        <React.Fragment>\n          {editorConfig?.features &&\n            editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n              return (\n                <ToolbarGroupComponent\n                  anchorElem={anchorElem}\n                  editor={editor}\n                  editorConfig={editorConfig}\n                  group={group}\n                  index={i}\n                  key={group.key}\n                />\n              )\n            })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nconst getParentEditorWithFixedToolbar = (\n  editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n  if (editorConfigContext.parentEditor?.editorConfig) {\n    if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n      return editorConfigContext.parentEditor\n    } else {\n      if (editorConfigContext.parentEditor) {\n        return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n      }\n    }\n  }\n  return false\n}\n\nexport const FixedToolbarPlugin: PluginComponentWithAnchor<FixedToolbarFeatureProps> = ({\n  anchorElem,\n  clientProps,\n}) => {\n  const [currentEditor] = useLexicalComposerContext()\n  const editorConfigContext = useEditorConfigContext()\n\n  const { editorConfig: currentEditorConfig } = editorConfigContext\n\n  const editor = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editor || currentEditor\n    : currentEditor\n\n  const editorConfig = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n    : currentEditorConfig\n\n  const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n  if (clientProps?.disableIfParentHasFixedToolbar) {\n    if (parentWithFixedToolbar) {\n      return null\n    }\n  }\n\n  if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n    return null\n  }\n\n  return (\n    <FixedToolbar\n      anchorElem={anchorElem}\n      editor={editor}\n      editorConfig={editorConfig}\n      parentWithFixedToolbar={parentWithFixedToolbar}\n    />\n  )\n}\n"],"mappings":"AAAA;;AAAA,SAAAA,CAAA,IAAAC,EAAA;;AAGA,SAASC,yBAAyB,QAAQ;AAC1C,SAASC,aAAa,EAAEC,kBAAkB,EAAEC,cAAc,QAAQ;AAClE,YAAYC,KAAA,MAAW;AACvB,SAASC,OAAO,QAAQ;AAQxB,SAASC,sBAAsB,QAAQ;AACvC,SAASC,aAAa,QAAQ;AAC9B,SAASC,eAAe,QAAQ;AAGhC,SAASC,gBAAgB;EACvBC,UAAU;EACVC,MAAM;EACNC;AAAI,CAKL;EACC,IAAIA,IAAA,CAAKC,SAAS,EAAE;IAClB,OACED,IAAA,EAAMC,SAAA,iBACJC,IAAA,CAACF,IAAA,CAAKC,SAAS;MAACH,UAAA,EAAYA,UAAA;MAAYC,MAAA,EAAQA,MAAA;MAAQC,IAAA,EAAMA;OAAWA,IAAA,CAAKG,GAAG;EAGvF;EAEA,IAAI,CAACH,IAAA,CAAKI,cAAc,EAAE;IACxB,OAAO;EACT;EAEA,oBACEF,IAAA,CAACP,aAAA;IAAcI,MAAA,EAAQA,MAAA;IAAQC,IAAA,EAAMA,IAAA;cACnC,aAAAE,IAAA,CAACF,IAAA,CAAKI,cAAc;KAD0BJ,IAAA,CAAKG,GAAG;AAI5D;AAEA,SAAAE,sBAAAC,EAAA;EAAA,MAAAC,CAAA,GAAApB,EAAA;EAA+B;IAAAW,UAAA;IAAAC,MAAA;IAAAS,YAAA;IAAAC,KAAA;IAAAC;EAAA,IAAAJ,EAY9B;EACC;IAAAK;EAAA,IAAiBpB,cAAA;EACjB;IAAAqB,UAAA,EAAAC;EAAA,IAEInB,sBAAA;EADU;IAAAoB,sBAAA;IAAAC;EAAA,IAAAF,EAAsC;EAEpD,OAAAG,aAAA,EAAAC,gBAAA,IAA0CzB,KAAA,CAAA0B,QAAA,CAAAC,SAAmC;EAC7E,OAAAC,YAAA,EAAAC,eAAA,IAAwC7B,KAAA,CAAA0B,QAAA,CAAAC,SAAqC;EAAA,IAAAG,EAAA;EAAA,IAAAC,EAAA;EAAA,IAAAhB,CAAA,QAAAE,KAAA;IAE7Da,EAAA,GAAAA,CAAA;MAAA,IACVb,KAAA,EAAAe,IAAA,KAAgB,cAAcf,KAAA,CAAAgB,KAAA,CAAAC,MAAkB,IAAIjB,KAAA,CAAAL,cAAoB;QAC1EiB,eAAA,OAAsBZ,KAAA,CAAAL,cAAoB;MAAA;QAE1CiB,eAAA,CAAAF,SAAgB;MAAA;IAAA;IAEjBI,EAAA,IAACd,KAAA;IAAMF,CAAA,MAAAE,KAAA;IAAAF,CAAA,MAAAe,EAAA;IAAAf,CAAA,MAAAgB,EAAA;EAAA;IAAAD,EAAA,GAAAf,CAAA;IAAAgB,EAAA,GAAAhB,CAAA;EAAA;EANVf,KAAA,CAAAmC,SAAA,CAAgBL,EAMhB,EAAGC,EAAO;EAAA,IAAAK,EAAA;EAAA,IAAArB,CAAA,QAAAE,KAAA,IAAAF,CAAA,QAAAO,sBAAA,IAAAP,CAAA,QAAAI,IAAA,IAAAJ,CAAA,QAAAQ,UAAA;IAGRa,EAAA,GAAAC,EAAA;MAAC;QAAAC;MAAA,IAAAD,EAAoD;MAAA,KAC9CC,WAAA,CAAAJ,MAAA;QAAA,IACCjB,KAAA,EAAAe,IAAA,KAAgB,cAAcf,KAAA,CAAAgB,KAAA,CAAAC,MAAkB,IAAIjB,KAAA,CAAAL,cAAoB;UAC1EiB,eAAA,OAAsBZ,KAAA,CAAAL,cAAoB;UAC1Ca,gBAAA,CAAAE,SAAiB;QAAA;UAEjBE,eAAA,CAAAF,SAAgB;UAChBF,gBAAA,CAAAE,SAAiB;QAAA;QAAA;MAAA;MAIrB,MAAAnB,IAAA,GAAa8B,WAAW;MAExB,IAAAC,KAAA,GAAY/B,IAAA,CAAAG,GAAA;MAAQ,IAChBH,IAAA,CAAA+B,KAAA;QACFA,KAAA,CAAAA,CAAA,CACEA,MAAA,CAAO/B,IAAA,CAAA+B,KAAA,KAAe,aAClB/B,IAAA,CAAA+B,KAAA;UAAAjB,sBAAA;UAAAH,IAAA;UAAAI;QAAA,CAAsD,IACtDf,IAAA,CAAA+B,KAAU;MAHhB;MAAA,IAMEA,KAAA,CAAAL,MAAA,KAAe;QACjBK,KAAA,CAAAA,CAAA,CAAQA,KAAA,CAAAC,SAAA,MAAmB,IAAM;MAAjC;MAEFf,gBAAA,CAAiBc,KAAA;MACjBV,eAAA,OAAsBrB,IAAA,CAAAI,cAAmB;IAAA;IAC3CG,CAAA,MAAAE,KAAA;IAAAF,CAAA,MAAAO,sBAAA;IAAAP,CAAA,MAAAI,IAAA;IAAAJ,CAAA,MAAAQ,UAAA;IAAAR,CAAA,MAAAqB,EAAA;EAAA;IAAAA,EAAA,GAAArB,CAAA;EAAA;EA3BF,MAAA0B,cAAA,GAAuBL,EA4B4B;EAIjC,MAAAC,EAAA,gDAA6CpB,KAAA,CAAAN,GAAA,EAAW;EAAA,IAAA+B,EAAA;EAAA,IAAA3B,CAAA,QAAAE,KAAA,IAAAF,CAAA,QAAAa,YAAA,IAAAb,CAAA,SAAAT,UAAA,IAAAS,CAAA,SAAAR,MAAA,IAAAQ,CAAA,SAAAS,aAAA,IAAAT,CAAA,SAAA0B,cAAA;IACrEC,EAAA,GAAAzB,KAAA,CAAAe,IAAA,KAAe,cACdf,KAAA,CAAAgB,KAAA,CAAAC,MAAkB,KACjBN,YAAA,GACClB,IAAA,CAAAN,eAAA;MAAAE,UAAA;MAAAC,MAAA;MAAAU,KAAA;MAAA0B,IAAA,EAIQf,YAAA;MAAAgB,wBAAA,GACqB;MAAAL,KAAA,EACpBf,aAAA;MAAAqB,cAAA;MAAAJ;IAAA,C,IAKT/B,IAAA,CAAAN,eAAA;MAAAE,UAAA;MAAAC,MAAA;MAAAU,KAAA;MAAA2B,wBAAA,GAI6B;MAAAL,KAAA,EACpBf,aAAA;MAAAqB,cAAA;MAAAJ;IAAA,C,CAIX;IAAA1B,CAAA,MAAAE,KAAA;IAAAF,CAAA,MAAAa,YAAA;IAAAb,CAAA,OAAAT,UAAA;IAAAS,CAAA,OAAAR,MAAA;IAAAQ,CAAA,OAAAS,aAAA;IAAAT,CAAA,OAAA0B,cAAA;IAAA1B,CAAA,OAAA2B,EAAA;EAAA;IAAAA,EAAA,GAAA3B,CAAA;EAAA;EAAA,IAAA+B,EAAA;EAAA,IAAA/B,CAAA,SAAAE,KAAA,IAAAF,CAAA,SAAAT,UAAA,IAAAS,CAAA,SAAAR,MAAA;IACDuC,EAAA,GAAA7B,KAAA,CAAAe,IAAA,KAAe,aACdf,KAAA,CAAAgB,KAAA,CAAAC,MAAkB,IAClBjB,KAAA,CAAAgB,KAAA,CAAAc,GAAA,CAAAC,MAAA,IAEItC,IAAA,CAAAL,eAAA;MAAAC,UAAA;MAAAC,MAAA;MAAAC,IAAA,EAA+DA;IAAA,GAAWA,MAAA,CAAAG,GAAQ,CAEtF;IAAAI,CAAA,OAAAE,KAAA;IAAAF,CAAA,OAAAT,UAAA;IAAAS,CAAA,OAAAR,MAAA;IAAAQ,CAAA,OAAA+B,EAAA;EAAA;IAAAA,EAAA,GAAA/B,CAAA;EAAA;EAAA,IAAAkC,EAAA;EAAA,IAAAlC,CAAA,SAAAC,YAAA,CAAAkC,QAAA,CAAAC,YAAA,IAAApC,CAAA,SAAAG,KAAA,IAAAH,CAAA,SAAA2B,EAAA,IAAA3B,CAAA,SAAA+B,EAAA,IAAA/B,CAAA,SAAAsB,EAAA,IAAAtB,CAAA,SAAAE,KAAA,CAAAN,GAAA;IA/BJsC,EAAA,GAAAG,KAAA,CAAC;MAAAC,SAAA,EAAehB,EAAwD;MAAAiB,QAAA,GACrEZ,EAuBC,EACDI,EAMC,EACD5B,KAAA,GAAQF,YAAA,CAAAkC,QAAA,CAAAC,YAAA,EAAAI,MAAA,CAAArB,MAAA,IAAoD,IAAKxB,IAAA,CAAC;QAAA2C,SAAA,EAAc;MAAA,C;OAhCJpC,KAAA,CAAAN,GAAS;IAAAI,CAAA,OAAAC,YAAA,CAAAkC,QAAA,CAAAC,YAAA;IAAApC,CAAA,OAAAG,KAAA;IAAAH,CAAA,OAAA2B,EAAA;IAAA3B,CAAA,OAAA+B,EAAA;IAAA/B,CAAA,OAAAsB,EAAA;IAAAtB,CAAA,OAAAE,KAAA,CAAAN,GAAA;IAAAI,CAAA,OAAAkC,EAAA;EAAA;IAAAA,EAAA,GAAAlC,CAAA;EAAA;EAAA,OAAxFkC,EAAwF;AAAA;AAqC5F,SAASO,aAAa;EACpBlD,UAAU;EACVmD,WAAW;EACXlD,MAAM;EACNS,YAAY;EACZ0C;AAAsB,CAOvB;EACC,MAAMC,iBAAA,GAAoB3D,KAAA,CAAM4D,MAAM,CAAiB;EAEvD,MAAM;IAAEC;EAAC,CAAE,GAAGhE,aAAA;EAEd;EACA,MAAMiE,iBAAA,GAAoB7D,OAAA,CAAQ;IAChC,IAAI,CAACyD,sBAAA,IAA0BD,WAAA,EAAaM,8BAAA,EAAgC;MAC1E,OAAO;IACT;IAEA,MAAMC,gBAAA,GAAmBN,sBAAA,CAAuBO,kBAAkB,CAACC,OAAO;IAC1E,IAAIC,OAAA,GAAUH,gBAAA,CAAiBI,sBAAsB;IACrD,OAAOD,OAAA,EAAS;MACd,IAAIA,OAAA,CAAQE,SAAS,CAACC,QAAQ,CAAC,kBAAkB;QAC/C,OAAOH,OAAA;MACT;MACAA,OAAA,GAAUA,OAAA,CAAQC,sBAAsB;IAC1C;IACA,OAAO;EACT,GAAG,CAACX,WAAA,EAAaM,8BAAA,EAAgCL,sBAAA,CAAuB;EAExE5D,kBAAA,CACE;IACE,IAAI,CAACgE,iBAAA,EAAmB;MACtB;MACA;IACF;IACA,MAAMS,kBAAA,GAAqBZ,iBAAA,CAAkBO,OAAO;IACpD,IAAI,CAACK,kBAAA,EAAoB;MACvB;IACF;IAEA,MAAMC,WAAA,GAAcD,kBAAA,CAAmBE,qBAAqB;IAC5D,MAAMC,UAAA,GAAaZ,iBAAA,CAAkBW,qBAAqB;IAE1D;IACA,MAAME,WAAA,GAAc,EAClBH,WAAA,CAAYI,MAAM,GAAGF,UAAA,CAAWG,GAAG,IAAIL,WAAA,CAAYK,GAAG,GAAGH,UAAA,CAAWE,MAAM,CAAD;IAG3E,IAAID,WAAA,EAAa;MACfJ,kBAAA,CAAmBlB,SAAS,GAAG;MAC/BS,iBAAA,CAAkBT,SAAS,GAAG;IAChC,OAAO;MACL,IAAI,CAACkB,kBAAA,CAAmBF,SAAS,CAACC,QAAQ,CAAC,+BAA+B;QACxE;MACF;MACAC,kBAAA,CAAmBlB,SAAS,GAAG;MAC/BS,iBAAA,CAAkBT,SAAS,GAAG;IAChC;EACF,GACA,IACA,CAACM,iBAAA,EAAmBG,iBAAA,EAAmBD,CAAA,CAAE;EAG3C,oBACEnD,IAAA,CAAC;IACC2C,SAAA,EAAU;IACVyB,OAAA,EAAUC,KAAA;MACR;MACA;MACAA,KAAA,CAAMC,eAAe;IACvB;IACAC,GAAA,EAAKtB,iBAAA;cAEJpD,MAAA,CAAO2E,UAAU,mBAChBxE,IAAA,CAACV,KAAA,CAAMmF,QAAQ;gBACZnE,YAAA,EAAckC,QAAA,IACblC,YAAA,CAAakC,QAAQ,EAAEC,YAAA,EAAcI,MAAA,CAAOR,GAAA,CAAI,CAAC9B,KAAA,EAAOmE,CAAA;QACtD,oBACE1E,IAAA,CAACG,qBAAA;UACCP,UAAA,EAAYA,UAAA;UACZC,MAAA,EAAQA,MAAA;UACRS,YAAA,EAAcA,YAAA;UACdC,KAAA,EAAOA,KAAA;UACPC,KAAA,EAAOkE;WACFnE,KAAA,CAAMN,GAAG;MAGpB;;;AAKZ;AAEA,MAAM0E,+BAAA,GACJC,mBAAA;EAEA,IAAIA,mBAAA,CAAoBC,YAAY,EAAEvE,YAAA,EAAc;IAClD,IAAIsE,mBAAA,CAAoBC,YAAY,EAAEvE,YAAA,CAAawE,kBAAA,CAAmBC,GAAA,CAAI,iBAAiB;MACzF,OAAOH,mBAAA,CAAoBC,YAAY;IACzC,OAAO;MACL,IAAID,mBAAA,CAAoBC,YAAY,EAAE;QACpC,OAAOF,+BAAA,CAAgCC,mBAAA,CAAoBC,YAAY;MACzE;IACF;EACF;EACA,OAAO;AACT;AAEA,OAAO,MAAMG,kBAAA,GAA0E5E,EAAA;EAAA,MAAAC,CAAA,GAAApB,EAAA;EAAC;IAAAW,UAAA;IAAAmD;EAAA,IAAA3C,EAGvF;EACC,OAAA6E,aAAA,IAAwB/F,yBAAA;EACxB,MAAA0F,mBAAA,GAA4BpF,sBAAA;EAE5B;IAAAc,YAAA,EAAA4E;EAAA,IAA8CN,mBAAA;EAE9C,MAAA/E,MAAA,GAAekD,WAAA,CAAAoC,oBAAA,GACXP,mBAAA,CAAAQ,aAAA,EAAAvF,MAAA,IAA6CoF,aAAA,GAC7CA,aAAA;EAEJ,MAAA3E,YAAA,GAAqByC,WAAA,CAAAoC,oBAAA,GACjBP,mBAAA,CAAAQ,aAAA,EAAA9E,YAAA,IAAmD4E,mBAAA,GACnDA,mBAAA;EAAA,IAAAvE,EAAA;EAAA,IAAAS,EAAA;EAAA,IAAAf,CAAA,QAAAuE,mBAAA,IAAAvE,CAAA,QAAA0C,WAAA,EAAAM,8BAAA,IAAAhD,CAAA,QAAAC,YAAA,IAAAD,CAAA,QAAAT,UAAA,IAAAS,CAAA,QAAAR,MAAA;IAMOuB,EAAA,GAAAiE,MAAA,CAAAC,GAAA;IAAAC,GAAA;MAJX,MAAAvC,sBAAA,GAA+B2B,+BAAA,CAAgCC,mBAAA;MAAA,IAE3D7B,WAAA,EAAAM,8BAAA;QAAA,IACEL,sBAAA;UACK5B,EAAA;UAAA,MAAAmE,GAAA;QAAA;MAAA;MAAA,KAINjF,YAAA,EAAAkC,QAAA,EAAAC,YAAA,EAAAI,MAAA,EAAArB,MAAA;QACIJ,EAAA;QAAA,MAAAmE,GAAA;MAAA;MAIP5E,EAAA,GAAAX,IAAA,CAAA8C,YAAA;QAAAlD,UAAA;QAAAC,MAAA;QAAAS,YAAA;QAAA0C;MAAA,C;;;;;;;;;;;;;;;;SAAArC,E;CAOJ","ignoreList":[]}
+{"version":3,"file":"index.js","names":["c","_c","useLexicalComposerContext","useScrollInfo","useThrottledEffect","useTranslation","React","useMemo","useEditorConfigContext","ToolbarButton","ToolbarDropdown","ButtonGroupItem","anchorElem","editor","item","Component","_jsx","key","ChildComponent","ToolbarGroupComponent","t0","$","editorConfig","group","index","i18n","fieldProps","t1","featureClientSchemaMap","schemaPath","dropdownLabel","setDropdownLabel","useState","undefined","DropdownIcon","setDropdownIcon","t2","t3","type","items","length","useEffect","t4","t5","activeItems","label","substring","onActiveChange","t6","features","toolbarFixed","_jsxs","className","children","Icon","itemsContainerClassNames","maxActiveItems","map","item_0","groups","FixedToolbar","clientProps","parentWithFixedToolbar","currentToolbarRef","useRef","y","parentToolbarElem","disableIfParentHasFixedToolbar","parentEditorElem","editorContainerRef","current","sibling","previousElementSibling","classList","contains","currentToolbarElem","currentRect","getBoundingClientRect","parentRect","overlapping","bottom","top","remove","add","onFocus","event","stopPropagation","ref","isEditable","Fragment","i","getParentEditorWithFixedToolbar","editorConfigContext","parentEditor","resolvedFeatureMap","has","FixedToolbarPlugin","currentEditor","currentEditorConfig","applyToFocusedEditor","focusedEditor","Symbol","for","bb0","document","body"],"sources":["../../../../../../src/features/toolbars/fixed/client/Toolbar/index.tsx"],"sourcesContent":["'use client'\nimport type { LexicalEditor } from 'lexical'\n\nimport { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext.js'\nimport { useScrollInfo, useThrottledEffect, useTranslation } from '@payloadcms/ui'\nimport * as React from 'react'\nimport { useMemo } from 'react'\n\nimport type { EditorConfigContextType } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport type { SanitizedClientEditorConfig } from '../../../../../lexical/config/types.js'\nimport type { PluginComponent } from '../../../../typesClient.js'\nimport type { ToolbarGroup, ToolbarGroupItem } from '../../../types.js'\nimport type { FixedToolbarFeatureProps } from '../../server/index.js'\n\nimport { useEditorConfigContext } from '../../../../../lexical/config/client/EditorConfigProvider.js'\nimport { ToolbarButton } from '../../../shared/ToolbarButton/index.js'\nimport { ToolbarDropdown } from '../../../shared/ToolbarDropdown/index.js'\nimport './index.scss'\n\nfunction ButtonGroupItem({\n  anchorElem,\n  editor,\n  item,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  item: ToolbarGroupItem\n}): React.ReactNode {\n  if (item.Component) {\n    return (\n      item?.Component && (\n        <item.Component anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n      )\n    )\n  }\n\n  if (!item.ChildComponent) {\n    return null\n  }\n\n  return (\n    <ToolbarButton editor={editor} item={item} key={item.key}>\n      <item.ChildComponent />\n    </ToolbarButton>\n  )\n}\n\nfunction ToolbarGroupComponent({\n  anchorElem,\n  editor,\n  editorConfig,\n  group,\n  index,\n}: {\n  anchorElem: HTMLElement\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  group: ToolbarGroup\n  index: number\n}): React.ReactNode {\n  const { i18n } = useTranslation<{}, string>()\n  const {\n    fieldProps: { featureClientSchemaMap, schemaPath },\n  } = useEditorConfigContext()\n  const [dropdownLabel, setDropdownLabel] = React.useState<string | undefined>(undefined)\n  const [DropdownIcon, setDropdownIcon] = React.useState<React.FC | undefined>(undefined)\n\n  React.useEffect(() => {\n    if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n      setDropdownIcon(() => group.ChildComponent!)\n    } else {\n      setDropdownIcon(undefined)\n    }\n  }, [group])\n\n  const onActiveChange = React.useCallback(\n    ({ activeItems }: { activeItems: ToolbarGroupItem[] }) => {\n      if (!activeItems.length) {\n        if (group?.type === 'dropdown' && group.items.length && group.ChildComponent) {\n          setDropdownIcon(() => group.ChildComponent!)\n          setDropdownLabel(undefined)\n        } else {\n          setDropdownIcon(undefined)\n          setDropdownLabel(undefined)\n        }\n        return\n      }\n      const item = activeItems[0]\n\n      let label = item.key\n      if (item.label) {\n        label =\n          typeof item.label === 'function'\n            ? item.label({ featureClientSchemaMap, i18n, schemaPath })\n            : item.label\n      }\n      // Crop title to max. 25 characters\n      if (label.length > 25) {\n        label = label.substring(0, 25) + '...'\n      }\n      setDropdownLabel(label)\n      setDropdownIcon(() => item.ChildComponent)\n    },\n    [group, i18n, featureClientSchemaMap, schemaPath],\n  )\n\n  return (\n    <div className={`fixed-toolbar__group fixed-toolbar__group-${group.key}`} key={group.key}>\n      {group.type === 'dropdown' && group.items.length ? (\n        DropdownIcon ? (\n          <ToolbarDropdown\n            anchorElem={anchorElem}\n            editor={editor}\n            group={group}\n            Icon={DropdownIcon}\n            itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n            label={dropdownLabel}\n            maxActiveItems={1}\n            onActiveChange={onActiveChange}\n          />\n        ) : (\n          <ToolbarDropdown\n            anchorElem={anchorElem}\n            editor={editor}\n            group={group}\n            itemsContainerClassNames={['fixed-toolbar__dropdown-items']}\n            label={dropdownLabel}\n            maxActiveItems={1}\n            onActiveChange={onActiveChange}\n          />\n        )\n      ) : null}\n      {group.type === 'buttons' && group.items.length\n        ? group.items.map((item) => {\n            return (\n              <ButtonGroupItem anchorElem={anchorElem} editor={editor} item={item} key={item.key} />\n            )\n          })\n        : null}\n      {index < editorConfig.features.toolbarFixed?.groups.length - 1 && <div className=\"divider\" />}\n    </div>\n  )\n}\n\nfunction FixedToolbar({\n  anchorElem,\n  clientProps,\n  editor,\n  editorConfig,\n  parentWithFixedToolbar,\n}: {\n  anchorElem: HTMLElement\n  clientProps?: FixedToolbarFeatureProps\n  editor: LexicalEditor\n  editorConfig: SanitizedClientEditorConfig\n  parentWithFixedToolbar: EditorConfigContextType | false\n}): React.ReactNode {\n  const currentToolbarRef = React.useRef<HTMLDivElement>(null)\n\n  const { y } = useScrollInfo()\n\n  // Memoize the parent toolbar element\n  const parentToolbarElem = useMemo(() => {\n    if (!parentWithFixedToolbar || clientProps?.disableIfParentHasFixedToolbar) {\n      return null\n    }\n\n    const parentEditorElem = parentWithFixedToolbar.editorContainerRef.current\n    let sibling = parentEditorElem.previousElementSibling\n    while (sibling) {\n      if (sibling.classList.contains('fixed-toolbar')) {\n        return sibling\n      }\n      sibling = sibling.previousElementSibling\n    }\n    return null\n  }, [clientProps?.disableIfParentHasFixedToolbar, parentWithFixedToolbar])\n\n  useThrottledEffect(\n    () => {\n      if (!parentToolbarElem) {\n        // this also checks for clientProps?.disableIfParentHasFixedToolbar indirectly, see the parentToolbarElem useMemo\n        return\n      }\n      const currentToolbarElem = currentToolbarRef.current\n      if (!currentToolbarElem) {\n        return\n      }\n\n      const currentRect = currentToolbarElem.getBoundingClientRect()\n      const parentRect = parentToolbarElem.getBoundingClientRect()\n\n      // we only need to check for vertical overlap\n      const overlapping = !(\n        currentRect.bottom < parentRect.top || currentRect.top > parentRect.bottom\n      )\n\n      if (overlapping) {\n        currentToolbarElem.classList.remove('fixed-toolbar')\n        currentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--overlapping')\n        parentToolbarElem.classList.remove('fixed-toolbar')\n        parentToolbarElem.classList.add('fixed-toolbar', 'fixed-toolbar--hide')\n      } else {\n        if (!currentToolbarElem.classList.contains('fixed-toolbar--overlapping')) {\n          return\n        }\n        currentToolbarElem.classList.remove('fixed-toolbar--overlapping')\n        currentToolbarElem.classList.add('fixed-toolbar')\n        parentToolbarElem.classList.remove('fixed-toolbar--hide')\n        parentToolbarElem.classList.add('fixed-toolbar')\n      }\n    },\n    50,\n    [currentToolbarRef, parentToolbarElem, y],\n  )\n\n  return (\n    <div\n      className=\"fixed-toolbar\"\n      onFocus={(event) => {\n        // Prevent other focus events being triggered. Otherwise, if this was to be clicked while in a child editor,\n        // the parent editor will be focused, and the child editor will lose focus.\n        event.stopPropagation()\n      }}\n      ref={currentToolbarRef}\n    >\n      {editor.isEditable() && (\n        <React.Fragment>\n          {editorConfig?.features &&\n            editorConfig.features?.toolbarFixed?.groups.map((group, i) => {\n              return (\n                <ToolbarGroupComponent\n                  anchorElem={anchorElem}\n                  editor={editor}\n                  editorConfig={editorConfig}\n                  group={group}\n                  index={i}\n                  key={group.key}\n                />\n              )\n            })}\n        </React.Fragment>\n      )}\n    </div>\n  )\n}\n\nconst getParentEditorWithFixedToolbar = (\n  editorConfigContext: EditorConfigContextType,\n): EditorConfigContextType | false => {\n  if (editorConfigContext.parentEditor?.editorConfig) {\n    if (editorConfigContext.parentEditor?.editorConfig.resolvedFeatureMap.has('toolbarFixed')) {\n      return editorConfigContext.parentEditor\n    } else {\n      if (editorConfigContext.parentEditor) {\n        return getParentEditorWithFixedToolbar(editorConfigContext.parentEditor)\n      }\n    }\n  }\n  return false\n}\n\nexport const FixedToolbarPlugin: PluginComponent<FixedToolbarFeatureProps> = ({ clientProps }) => {\n  const [currentEditor] = useLexicalComposerContext()\n  const editorConfigContext = useEditorConfigContext()\n\n  const { editorConfig: currentEditorConfig } = editorConfigContext\n\n  const editor = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editor || currentEditor\n    : currentEditor\n\n  const editorConfig = clientProps.applyToFocusedEditor\n    ? editorConfigContext.focusedEditor?.editorConfig || currentEditorConfig\n    : currentEditorConfig\n\n  const parentWithFixedToolbar = getParentEditorWithFixedToolbar(editorConfigContext)\n\n  if (clientProps?.disableIfParentHasFixedToolbar) {\n    if (parentWithFixedToolbar) {\n      return null\n    }\n  }\n\n  if (!editorConfig?.features?.toolbarFixed?.groups?.length) {\n    return null\n  }\n\n  return (\n    <FixedToolbar\n      anchorElem={document.body}\n      editor={editor}\n      editorConfig={editorConfig}\n      parentWithFixedToolbar={parentWithFixedToolbar}\n    />\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/features/toolbars/inline/client/Toolbar/index.js

@@ -35,7 +35,7 @@ function ButtonGroupItem({
   }, item.key);
 }
 function ToolbarGroupComponent(t0) {
-  const $ = _c(22);
+  const $ = _c(14);
   const {
     anchorElem,
     editor,
@@ -90,63 +90,43 @@ function ToolbarGroupComponent(t0) {
   const onActiveChange = t3;
   const t4 = `inline-toolbar-popup__group inline-toolbar-popup__group-${group.key}`;
   let t5;
-  if ($[5] !== group || $[6] !== DropdownIcon || $[7] !== anchorElem || $[8] !== editor || $[9] !== onActiveChange) {
-    t5 = group.type === "dropdown" && group.items.length && (DropdownIcon ? _jsx(ToolbarDropdown, {
-      anchorElem,
-      editor,
-      group,
-      Icon: DropdownIcon,
-      maxActiveItems: 1,
-      onActiveChange
-    }) : _jsx(ToolbarDropdown, {
-      anchorElem,
-      editor,
-      group,
-      maxActiveItems: 1,
-      onActiveChange
-    }));
+  if ($[5] !== group || $[6] !== DropdownIcon || $[7] !== anchorElem || $[8] !== editor || $[9] !== onActiveChange || $[10] !== editorConfig.features.toolbarInline || $[11] !== index || $[12] !== t4) {
+    t5 = _jsxs("div", {
+      className: t4,
+      children: [group.type === "dropdown" && group.items.length ? DropdownIcon ? _jsx(ToolbarDropdown, {
+        anchorElem,
+        editor,
+        group,
+        Icon: DropdownIcon,
+        maxActiveItems: 1,
+        onActiveChange
+      }) : _jsx(ToolbarDropdown, {
+        anchorElem,
+        editor,
+        group,
+        maxActiveItems: 1,
+        onActiveChange
+      }) : null, group.type === "buttons" && group.items.length ? group.items.map(item_0 => _jsx(ButtonGroupItem, {
+        anchorElem,
+        editor,
+        item: item_0
+      }, item_0.key)) : null, index < editorConfig.features.toolbarInline?.groups.length - 1 && _jsx("div", {
+        className: "divider"
+      })]
+    }, group.key);
     $[5] = group;
     $[6] = DropdownIcon;
     $[7] = anchorElem;
     $[8] = editor;
     $[9] = onActiveChange;
-    $[10] = t5;
+    $[10] = editorConfig.features.toolbarInline;
+    $[11] = index;
+    $[12] = t4;
+    $[13] = t5;
   } else {
-    t5 = $[10];
+    t5 = $[13];
   }
-  let t6;
-  if ($[11] !== group || $[12] !== anchorElem || $[13] !== editor) {
-    t6 = group.type === "buttons" && group.items.length && group.items.map(item_0 => _jsx(ButtonGroupItem, {
-      anchorElem,
-      editor,
-      item: item_0
-    }, item_0.key));
-    $[11] = group;
-    $[12] = anchorElem;
-    $[13] = editor;
-    $[14] = t6;
-  } else {
-    t6 = $[14];
-  }
-  let t7;
-  if ($[15] !== editorConfig.features.toolbarInline || $[16] !== index || $[17] !== t5 || $[18] !== t6 || $[19] !== t4 || $[20] !== group.key) {
-    t7 = _jsxs("div", {
-      className: t4,
-      children: [t5, t6, index < editorConfig.features.toolbarInline?.groups.length - 1 && _jsx("div", {
-        className: "divider"
-      })]
-    }, group.key);
-    $[15] = editorConfig.features.toolbarInline;
-    $[16] = index;
-    $[17] = t5;
-    $[18] = t6;
-    $[19] = t4;
-    $[20] = group.key;
-    $[21] = t7;
-  } else {
-    t7 = $[21];
-  }
-  return t7;
+  return t5;
 }
 function InlineToolbar({
   anchorElem,