@payloadcms/richtext-slate 3.0.0-alpha.48 → 3.0.0-alpha.49

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.
Files changed (64) hide show
  1. package/dist/field/RichText.d.ts +3 -1
  2. package/dist/field/RichText.d.ts.map +1 -1
  3. package/dist/field/RichText.js +10 -5
  4. package/dist/field/RichText.js.map +1 -1
  5. package/dist/field/elements/Button.js +1 -1
  6. package/dist/field/elements/Button.js.map +1 -1
  7. package/dist/field/elements/EnabledRelationshipsCondition.d.ts.map +1 -1
  8. package/dist/field/elements/EnabledRelationshipsCondition.js +2 -1
  9. package/dist/field/elements/EnabledRelationshipsCondition.js.map +1 -1
  10. package/dist/field/elements/isBlockElement.d.ts +1 -1
  11. package/dist/field/elements/isBlockElement.d.ts.map +1 -1
  12. package/dist/field/elements/link/Button/index.d.ts.map +1 -1
  13. package/dist/field/elements/link/Button/index.js +9 -4
  14. package/dist/field/elements/link/Button/index.js.map +1 -1
  15. package/dist/field/elements/link/Element/index.d.ts.map +1 -1
  16. package/dist/field/elements/link/Element/index.js +11 -1
  17. package/dist/field/elements/link/Element/index.js.map +1 -1
  18. package/dist/field/elements/link/LinkDrawer/index.d.ts.map +1 -1
  19. package/dist/field/elements/link/LinkDrawer/index.js +18 -10
  20. package/dist/field/elements/link/LinkDrawer/index.js.map +1 -1
  21. package/dist/field/elements/link/LinkDrawer/types.d.ts +1 -1
  22. package/dist/field/elements/link/LinkDrawer/types.d.ts.map +1 -1
  23. package/dist/field/elements/link/LinkDrawer/types.js.map +1 -1
  24. package/dist/field/elements/relationship/Button/index.d.ts.map +1 -1
  25. package/dist/field/elements/relationship/Button/index.js +2 -1
  26. package/dist/field/elements/relationship/Button/index.js.map +1 -1
  27. package/dist/field/elements/relationship/Element/index.d.ts +1 -1
  28. package/dist/field/elements/relationship/Element/index.d.ts.map +1 -1
  29. package/dist/field/elements/relationship/Element/index.js +6 -1
  30. package/dist/field/elements/relationship/Element/index.js.map +1 -1
  31. package/dist/field/elements/upload/Button/index.d.ts.map +1 -1
  32. package/dist/field/elements/upload/Button/index.js +2 -1
  33. package/dist/field/elements/upload/Button/index.js.map +1 -1
  34. package/dist/field/elements/upload/Element/UploadDrawer/index.d.ts +3 -3
  35. package/dist/field/elements/upload/Element/UploadDrawer/index.d.ts.map +1 -1
  36. package/dist/field/elements/upload/Element/UploadDrawer/index.js +15 -7
  37. package/dist/field/elements/upload/Element/UploadDrawer/index.js.map +1 -1
  38. package/dist/field/elements/upload/Element/index.d.ts +1 -1
  39. package/dist/field/elements/upload/Element/index.d.ts.map +1 -1
  40. package/dist/field/elements/upload/Element/index.js +10 -2
  41. package/dist/field/elements/upload/Element/index.js.map +1 -1
  42. package/dist/field/index.d.ts +1 -1
  43. package/dist/field/index.d.ts.map +1 -1
  44. package/dist/field/index.js +4 -4
  45. package/dist/field/index.js.map +1 -1
  46. package/dist/field/providers/ElementButtonProvider.d.ts +1 -1
  47. package/dist/field/providers/ElementButtonProvider.d.ts.map +1 -1
  48. package/dist/field/providers/ElementButtonProvider.js.map +1 -1
  49. package/dist/field/providers/ElementProvider.d.ts +1 -1
  50. package/dist/field/providers/ElementProvider.d.ts.map +1 -1
  51. package/dist/field/providers/ElementProvider.js.map +1 -1
  52. package/dist/field/providers/LeafButtonProvider.d.ts +1 -1
  53. package/dist/field/providers/LeafButtonProvider.d.ts.map +1 -1
  54. package/dist/field/providers/LeafButtonProvider.js.map +1 -1
  55. package/dist/field/providers/LeafProvider.d.ts +1 -1
  56. package/dist/field/providers/LeafProvider.d.ts.map +1 -1
  57. package/dist/field/providers/LeafProvider.js.map +1 -1
  58. package/dist/generateComponentMap.d.ts.map +1 -1
  59. package/dist/generateComponentMap.js +1 -3
  60. package/dist/generateComponentMap.js.map +1 -1
  61. package/dist/utilities/useSlatePlugin.js +3 -3
  62. package/dist/utilities/useSlatePlugin.js.map +1 -1
  63. package/package.json +7 -13
  64. package/src/index.tsx +82 -0
@@ -1,4 +1,4 @@
1
- import type { FormFieldBase } from '@payloadcms/ui/types';
1
+ import type { FormFieldBase } from '@payloadcms/ui/fields/shared';
2
2
  import type { BaseEditor } from 'slate';
3
3
  import type { HistoryEditor } from 'slate-history';
4
4
  import type { ReactEditor } from 'slate-react';
@@ -17,7 +17,9 @@ export declare const RichText: React.FC<FormFieldBase & {
17
17
  elements: EnabledFeatures['elements'];
18
18
  leaves: EnabledFeatures['leaves'];
19
19
  name: string;
20
+ placeholder?: string;
20
21
  plugins: RichTextPlugin[];
21
22
  richTextComponentMap: Map<string, React.ReactNode>;
23
+ width?: string;
22
24
  }>;
23
25
  //# sourceMappingURL=RichText.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../src/field/RichText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AACzD,OAAO,KAAK,EAAE,UAAU,EAAiB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAM9C,OAAO,KAAkD,MAAM,OAAO,CAAA;AAKtE,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD,OAAO,cAAc,CAAA;AAWrB,OAAO,QAAQ,OAAO,CAAC;IACrB,UAAU,WAAW;QACnB,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,CAAA;QAChD,OAAO,EAAE,WAAW,CAAA;QACpB,IAAI,EAAE,QAAQ,CAAA;KACf;CACF;AA0YD,eAAO,MAAM,QAAQ;cAtYP,eAAe,CAAC,UAAU,CAAC;YAC7B,eAAe,CAAC,QAAQ,CAAC;UAC3B,MAAM;aACH,cAAc,EAAE;0BACH,IAAI,MAAM,EAAE,MAAM,SAAS,CAAC;EAkYF,CAAA"}
1
+ {"version":3,"file":"RichText.d.ts","sourceRoot":"","sources":["../../src/field/RichText.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAA;AACjE,OAAO,KAAK,EAAE,UAAU,EAAiB,MAAM,OAAO,CAAA;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,eAAe,CAAA;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAW9C,OAAO,KAAkD,MAAM,OAAO,CAAA;AAKtE,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAA;AAMjD,OAAO,cAAc,CAAA;AAWrB,OAAO,QAAQ,OAAO,CAAC;IACrB,UAAU,WAAW;QACnB,MAAM,EAAE,UAAU,GAAG,WAAW,GAAG,aAAa,CAAA;QAChD,OAAO,EAAE,WAAW,CAAA;QACpB,IAAI,EAAE,QAAQ,CAAA;KACf;CACF;AAmZD,eAAO,MAAM,QAAQ;cA/YP,eAAe,CAAC,UAAU,CAAC;YAC7B,eAAe,CAAC,QAAQ,CAAC;UAC3B,MAAM;kBACE,MAAM;aACX,cAAc,EAAE;0BACH,IAAI,MAAM,EAAE,MAAM,SAAS,CAAC;YAC1C,MAAM;EAyYkC,CAAA"}
@@ -1,7 +1,12 @@
1
1
  'use client';
2
2
  import { getTranslation } from '@payloadcms/translations';
3
- import { useEditDepth, useField, useTranslation } from '@payloadcms/ui';
4
- import { withCondition } from '@payloadcms/ui/forms';
3
+ import { FieldDescription } from '@payloadcms/ui/forms/FieldDescription';
4
+ import { FieldError } from '@payloadcms/ui/forms/FieldError';
5
+ import { FieldLabel } from '@payloadcms/ui/forms/FieldLabel';
6
+ import { useField } from '@payloadcms/ui/forms/useField';
7
+ import { withCondition } from '@payloadcms/ui/forms/withCondition';
8
+ import { useEditDepth } from '@payloadcms/ui/providers/EditDepth';
9
+ import { useTranslation } from '@payloadcms/ui/providers/Translation';
5
10
  import isHotkey from 'is-hotkey';
6
11
  import React, { useCallback, useEffect, useMemo, useRef } from 'react';
7
12
  import { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate';
@@ -21,7 +26,7 @@ import { LeafButtonProvider } from './providers/LeafButtonProvider.js';
21
26
  import { LeafProvider } from './providers/LeafProvider.js';
22
27
  const baseClass = 'rich-text';
23
28
  const RichTextField = (props)=>{
24
- const { name, Description, Error, Label, className, elements, leaves, path: pathFromProps, placeholder, plugins, readOnly, required, style, validate = richTextValidate, width } = props;
29
+ const { name, CustomDescription, CustomError, CustomLabel, className, descriptionProps, elements, errorProps, labelProps, leaves, path: pathFromProps, placeholder, plugins, readOnly, required, style, validate = richTextValidate, width } = props;
25
30
  const { i18n } = useTranslation();
26
31
  const editorRef = useRef(null);
27
32
  const toolbarRef = useRef(null);
@@ -263,7 +268,7 @@ const RichTextField = (props)=>{
263
268
  }
264
269
  }, /*#__PURE__*/ React.createElement("div", {
265
270
  className: `${baseClass}__wrap`
266
- }, Error, Label, /*#__PURE__*/ React.createElement(Slate, {
271
+ }, CustomError !== undefined ? CustomError : /*#__PURE__*/ React.createElement(FieldError, errorProps || {}), CustomLabel !== undefined ? CustomLabel : /*#__PURE__*/ React.createElement(FieldLabel, labelProps || {}), /*#__PURE__*/ React.createElement(Slate, {
267
272
  editor: editor,
268
273
  key: JSON.stringify({
269
274
  initialValue,
@@ -369,7 +374,7 @@ const RichTextField = (props)=>{
369
374
  renderElement: renderElement,
370
375
  renderLeaf: renderLeaf,
371
376
  spellCheck: true
372
- })))), Description));
377
+ })))), CustomDescription !== undefined ? CustomDescription : /*#__PURE__*/ React.createElement(FieldDescription, descriptionProps || {})));
373
378
  };
374
379
  export const RichText = withCondition(RichTextField);
375
380
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/types'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { useEditDepth, useField, useTranslation } from '@payloadcms/ui'\nimport { withCondition } from '@payloadcms/ui/forms'\nimport isHotkey from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n interface CustomTypes {\n Editor: BaseEditor & ReactEditor & HistoryEditor\n Element: ElementNode\n Text: TextNode\n }\n}\n\nconst RichTextField: React.FC<\n FormFieldBase & {\n elements: EnabledFeatures['elements']\n leaves: EnabledFeatures['leaves']\n name: string\n plugins: RichTextPlugin[]\n richTextComponentMap: Map<string, React.ReactNode>\n }\n> = (props) => {\n const {\n name,\n Description,\n Error,\n Label,\n className,\n elements,\n leaves,\n path: pathFromProps,\n placeholder,\n plugins,\n readOnly,\n required,\n style,\n validate = richTextValidate,\n width,\n } = props\n\n const { i18n } = useTranslation()\n const editorRef = useRef(null)\n const toolbarRef = useRef(null)\n\n const drawerDepth = useEditDepth()\n const drawerIsOpen = drawerDepth > 1\n\n const memoizedValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, { ...validationOptions, required })\n }\n },\n [validate, required],\n )\n\n const { initialValue, path, schemaPath, setValue, showError, value } = useField({\n path: pathFromProps || name,\n validate: memoizedValidate,\n })\n\n const editor = useMemo(() => {\n let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n CreatedEditor = withHTML(CreatedEditor)\n\n if (plugins.length) {\n CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n return plugin(editorWithPlugins)\n }, CreatedEditor)\n }\n\n return CreatedEditor\n }, [plugins])\n\n const renderElement = useCallback(\n ({ attributes, children, element }) => {\n // return <div {...attributes}>{children}</div>\n\n const matchedElement = elements[element.type]\n const Element = matchedElement?.Element\n\n let attr = { ...attributes }\n\n // this converts text alignment to margin when dealing with void elements\n if (element.textAlign) {\n if (element.type === 'relationship' || element.type === 'upload') {\n switch (element.textAlign) {\n case 'left':\n attr = { ...attr, style: { marginRight: 'auto' } }\n break\n case 'right':\n attr = { ...attr, style: { marginLeft: 'auto' } }\n break\n case 'center':\n attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n break\n default:\n attr = { ...attr, style: { textAlign: element.textAlign } }\n break\n }\n } else if (element.type === 'li') {\n switch (element.textAlign) {\n case 'right':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n break\n case 'center':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n break\n case 'left':\n default:\n attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n break\n }\n } else {\n attr = { ...attr, style: { textAlign: element.textAlign } }\n }\n }\n\n if (Element) {\n const el = (\n <ElementProvider\n attributes={attr}\n childNodes={children}\n editorRef={editorRef}\n element={element}\n fieldProps={props}\n path={path}\n schemaPath={schemaPath}\n >\n {Element}\n </ElementProvider>\n )\n\n return el\n }\n\n return <div {...attr}>{children}</div>\n },\n [elements, path, props, schemaPath],\n )\n\n const renderLeaf = useCallback(\n ({ attributes, children, leaf }) => {\n const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n if (matchedLeaves.length > 0) {\n return matchedLeaves.reduce(\n (result, [, leafConfig], i) => {\n if (leafConfig?.Leaf) {\n const Leaf = leafConfig.Leaf\n\n return (\n <LeafProvider\n attributes={attributes}\n editorRef={editorRef}\n fieldProps={props}\n key={i}\n leaf={leaf}\n path={path}\n result={result}\n schemaPath={schemaPath}\n >\n {Leaf}\n </LeafProvider>\n )\n }\n\n return result\n },\n <span {...attributes}>{children}</span>,\n )\n }\n\n return <span {...attributes}>{children}</span>\n },\n [path, props, schemaPath, leaves],\n )\n\n // All slate changes fire the onChange event\n // including selection changes\n // so we will filter the set_selection operations out\n // and only fire setValue when onChange is because of value\n const handleChange = useCallback(\n (val: unknown) => {\n const ops = editor?.operations.filter((o: BaseOperation) => {\n if (o) {\n return o.type !== 'set_selection'\n }\n return false\n })\n\n if (ops && Array.isArray(ops) && ops.length > 0) {\n if (!readOnly && val !== defaultRichTextValue && val !== value) {\n setValue(val)\n }\n }\n },\n [editor?.operations, readOnly, setValue, value],\n )\n\n useEffect(() => {\n function setClickableState(clickState: 'disabled' | 'enabled') {\n const selectors = 'button, a, [role=\"button\"]'\n const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n toolbarRef.current?.querySelectorAll(selectors)\n\n ;(toolbarButtons || []).forEach((child) => {\n const isButton = child.tagName === 'BUTTON'\n const isDisabling = clickState === 'disabled'\n child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n })\n }\n\n if (readOnly) {\n setClickableState('disabled')\n }\n\n return () => {\n if (readOnly) {\n setClickableState('enabled')\n }\n }\n }, [readOnly])\n\n // useEffect(() => {\n // // If there is a change to the initial value, we need to reset Slate history\n // // and clear selection because the old selection may no longer be valid\n // // as returned JSON may be modified in hooks and have a different shape\n // if (editor.selection) {\n // console.log('deselecting');\n // ReactEditor.deselect(editor);\n // }\n // }, [path, editor]);\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n readOnly && `${baseClass}--read-only`,\n ]\n .filter(Boolean)\n .join(' ')\n\n let valueToRender = value\n\n if (typeof valueToRender === 'string') {\n try {\n const parsedJSON = JSON.parse(valueToRender)\n valueToRender = parsedJSON\n } catch (err) {\n valueToRender = null\n }\n }\n\n if (!valueToRender) valueToRender = defaultRichTextValue\n\n return (\n <div\n className={classes}\n style={{\n ...style,\n width,\n }}\n >\n <div className={`${baseClass}__wrap`}>\n {Error}\n {Label}\n <Slate\n editor={editor}\n key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n onChange={handleChange}\n value={valueToRender as any[]}\n >\n <div className={`${baseClass}__wrapper`}>\n {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n <div\n className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n .filter(Boolean)\n .join(' ')}\n ref={toolbarRef}\n >\n <div className={`${baseClass}__toolbar-wrap`}>\n {Object.values(elements).map((element) => {\n const Button = element?.Button\n\n if (Button) {\n return (\n <ElementButtonProvider\n fieldProps={props}\n key={element.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </ElementButtonProvider>\n )\n }\n\n return null\n })}\n {Object.values(leaves).map((leaf) => {\n const Button = leaf?.Button\n\n if (Button) {\n return (\n <LeafButtonProvider\n fieldProps={props}\n key={leaf.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </LeafButtonProvider>\n )\n }\n\n return null\n })}\n </div>\n </div>\n )}\n <div className={`${baseClass}__editor`} ref={editorRef}>\n <Editable\n className={`${baseClass}__input`}\n id={`field-${path.replace(/\\./g, '__')}`}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n if (event.shiftKey) {\n event.preventDefault()\n editor.insertText('\\n')\n } else {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement)) {\n // Allow hard enter to \"break out\" of certain elements\n if (editor.shouldBreakOutOnEnter(selectedElement)) {\n event.preventDefault()\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n if (\n Text.isText(selectedLeaf) &&\n String(selectedLeaf.text).length === editor.selection.anchor.offset\n ) {\n Transforms.insertNodes(editor, { children: [{ text: '' }] })\n } else {\n Transforms.splitNodes(editor)\n Transforms.setNodes(editor, {})\n }\n }\n }\n }\n }\n\n if (event.key === 'Backspace') {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n event.preventDefault()\n Transforms.unwrapNodes(editor, {\n match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n mode: 'lowest',\n split: true,\n })\n\n Transforms.setNodes(editor, { type: undefined })\n }\n } else if (editor.isVoid(selectedElement)) {\n Transforms.removeNodes(editor)\n }\n }\n\n Object.keys(hotkeys).forEach((hotkey) => {\n if (isHotkey(hotkey, event as any)) {\n event.preventDefault()\n const mark = hotkeys[hotkey]\n toggleLeaf(editor, mark)\n }\n })\n }}\n placeholder={getTranslation(placeholder, i18n)}\n readOnly={readOnly}\n renderElement={renderElement}\n renderLeaf={renderLeaf}\n spellCheck\n />\n </div>\n </div>\n </Slate>\n {Description}\n </div>\n </div>\n )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","useEditDepth","useField","useTranslation","withCondition","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","Description","Error","Label","className","elements","leaves","path","pathFromProps","placeholder","plugins","readOnly","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","initialValue","schemaPath","setValue","showError","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","key","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","stringify","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","undefined","isVoid","removeNodes","hotkey","mark","spellCheck","RichText"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/field/RichText.tsx"],"sourcesContent":["'use client'\n\nimport type { FormFieldBase } from '@payloadcms/ui/fields/shared'\nimport type { BaseEditor, BaseOperation } from 'slate'\nimport type { HistoryEditor } from 'slate-history'\nimport type { ReactEditor } from 'slate-react'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport { FieldDescription } from '@payloadcms/ui/forms/FieldDescription'\nimport { FieldError } from '@payloadcms/ui/forms/FieldError'\nimport { FieldLabel } from '@payloadcms/ui/forms/FieldLabel'\nimport { useField } from '@payloadcms/ui/forms/useField'\nimport { withCondition } from '@payloadcms/ui/forms/withCondition'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport isHotkey from 'is-hotkey'\nimport React, { useCallback, useEffect, useMemo, useRef } from 'react'\nimport { Node, Element as SlateElement, Text, Transforms, createEditor } from 'slate'\nimport { withHistory } from 'slate-history'\nimport { Editable, Slate, withReact } from 'slate-react'\n\nimport type { ElementNode, RichTextPlugin, TextNode } from '../types.js'\nimport type { EnabledFeatures } from './types.js'\n\nimport { defaultRichTextValue } from '../data/defaultValue.js'\nimport { richTextValidate } from '../data/validation.js'\nimport { listTypes } from './elements/listTypes.js'\nimport { hotkeys } from './hotkeys.js'\nimport './index.scss'\nimport { toggleLeaf } from './leaves/toggle.js'\nimport { withEnterBreakOut } from './plugins/withEnterBreakOut.js'\nimport { withHTML } from './plugins/withHTML.js'\nimport { ElementButtonProvider } from './providers/ElementButtonProvider.js'\nimport { ElementProvider } from './providers/ElementProvider.js'\nimport { LeafButtonProvider } from './providers/LeafButtonProvider.js'\nimport { LeafProvider } from './providers/LeafProvider.js'\n\nconst baseClass = 'rich-text'\n\ndeclare module 'slate' {\n interface CustomTypes {\n Editor: BaseEditor & ReactEditor & HistoryEditor\n Element: ElementNode\n Text: TextNode\n }\n}\n\nconst RichTextField: React.FC<\n FormFieldBase & {\n elements: EnabledFeatures['elements']\n leaves: EnabledFeatures['leaves']\n name: string\n placeholder?: string\n plugins: RichTextPlugin[]\n richTextComponentMap: Map<string, React.ReactNode>\n width?: string\n }\n> = (props) => {\n const {\n name,\n CustomDescription,\n CustomError,\n CustomLabel,\n className,\n descriptionProps,\n elements,\n errorProps,\n labelProps,\n leaves,\n path: pathFromProps,\n placeholder,\n plugins,\n readOnly,\n required,\n style,\n validate = richTextValidate,\n width,\n } = props\n\n const { i18n } = useTranslation()\n const editorRef = useRef(null)\n const toolbarRef = useRef(null)\n\n const drawerDepth = useEditDepth()\n const drawerIsOpen = drawerDepth > 1\n\n const memoizedValidate = useCallback(\n (value, validationOptions) => {\n if (typeof validate === 'function') {\n return validate(value, { ...validationOptions, required })\n }\n },\n [validate, required],\n )\n\n const { initialValue, path, schemaPath, setValue, showError, value } = useField({\n path: pathFromProps || name,\n validate: memoizedValidate,\n })\n\n const editor = useMemo(() => {\n let CreatedEditor = withEnterBreakOut(withHistory(withReact(createEditor())))\n\n CreatedEditor = withHTML(CreatedEditor)\n\n if (plugins.length) {\n CreatedEditor = plugins.reduce((editorWithPlugins, plugin) => {\n return plugin(editorWithPlugins)\n }, CreatedEditor)\n }\n\n return CreatedEditor\n }, [plugins])\n\n const renderElement = useCallback(\n ({ attributes, children, element }) => {\n // return <div {...attributes}>{children}</div>\n\n const matchedElement = elements[element.type]\n const Element = matchedElement?.Element\n\n let attr = { ...attributes }\n\n // this converts text alignment to margin when dealing with void elements\n if (element.textAlign) {\n if (element.type === 'relationship' || element.type === 'upload') {\n switch (element.textAlign) {\n case 'left':\n attr = { ...attr, style: { marginRight: 'auto' } }\n break\n case 'right':\n attr = { ...attr, style: { marginLeft: 'auto' } }\n break\n case 'center':\n attr = { ...attr, style: { marginLeft: 'auto', marginRight: 'auto' } }\n break\n default:\n attr = { ...attr, style: { textAlign: element.textAlign } }\n break\n }\n } else if (element.type === 'li') {\n switch (element.textAlign) {\n case 'right':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'right' } }\n break\n case 'center':\n attr = { ...attr, style: { listStylePosition: 'inside', textAlign: 'center' } }\n break\n case 'left':\n default:\n attr = { ...attr, style: { listStylePosition: 'outside', textAlign: 'left' } }\n break\n }\n } else {\n attr = { ...attr, style: { textAlign: element.textAlign } }\n }\n }\n\n if (Element) {\n const el = (\n <ElementProvider\n attributes={attr}\n childNodes={children}\n editorRef={editorRef}\n element={element}\n fieldProps={props}\n path={path}\n schemaPath={schemaPath}\n >\n {Element}\n </ElementProvider>\n )\n\n return el\n }\n\n return <div {...attr}>{children}</div>\n },\n [elements, path, props, schemaPath],\n )\n\n const renderLeaf = useCallback(\n ({ attributes, children, leaf }) => {\n const matchedLeaves = Object.entries(leaves).filter(([leafName]) => leaf[leafName])\n\n if (matchedLeaves.length > 0) {\n return matchedLeaves.reduce(\n (result, [, leafConfig], i) => {\n if (leafConfig?.Leaf) {\n const Leaf = leafConfig.Leaf\n\n return (\n <LeafProvider\n attributes={attributes}\n editorRef={editorRef}\n fieldProps={props}\n key={i}\n leaf={leaf}\n path={path}\n result={result}\n schemaPath={schemaPath}\n >\n {Leaf}\n </LeafProvider>\n )\n }\n\n return result\n },\n <span {...attributes}>{children}</span>,\n )\n }\n\n return <span {...attributes}>{children}</span>\n },\n [path, props, schemaPath, leaves],\n )\n\n // All slate changes fire the onChange event\n // including selection changes\n // so we will filter the set_selection operations out\n // and only fire setValue when onChange is because of value\n const handleChange = useCallback(\n (val: unknown) => {\n const ops = editor?.operations.filter((o: BaseOperation) => {\n if (o) {\n return o.type !== 'set_selection'\n }\n return false\n })\n\n if (ops && Array.isArray(ops) && ops.length > 0) {\n if (!readOnly && val !== defaultRichTextValue && val !== value) {\n setValue(val)\n }\n }\n },\n [editor?.operations, readOnly, setValue, value],\n )\n\n useEffect(() => {\n function setClickableState(clickState: 'disabled' | 'enabled') {\n const selectors = 'button, a, [role=\"button\"]'\n const toolbarButtons: (HTMLAnchorElement | HTMLButtonElement)[] =\n toolbarRef.current?.querySelectorAll(selectors)\n\n ;(toolbarButtons || []).forEach((child) => {\n const isButton = child.tagName === 'BUTTON'\n const isDisabling = clickState === 'disabled'\n child.setAttribute('tabIndex', isDisabling ? '-1' : '0')\n if (isButton) child.setAttribute('disabled', isDisabling ? 'disabled' : null)\n })\n }\n\n if (readOnly) {\n setClickableState('disabled')\n }\n\n return () => {\n if (readOnly) {\n setClickableState('enabled')\n }\n }\n }, [readOnly])\n\n // useEffect(() => {\n // // If there is a change to the initial value, we need to reset Slate history\n // // and clear selection because the old selection may no longer be valid\n // // as returned JSON may be modified in hooks and have a different shape\n // if (editor.selection) {\n // console.log('deselecting');\n // ReactEditor.deselect(editor);\n // }\n // }, [path, editor]);\n\n const classes = [\n baseClass,\n 'field-type',\n className,\n showError && 'error',\n readOnly && `${baseClass}--read-only`,\n ]\n .filter(Boolean)\n .join(' ')\n\n let valueToRender = value\n\n if (typeof valueToRender === 'string') {\n try {\n const parsedJSON = JSON.parse(valueToRender)\n valueToRender = parsedJSON\n } catch (err) {\n valueToRender = null\n }\n }\n\n if (!valueToRender) valueToRender = defaultRichTextValue\n\n return (\n <div\n className={classes}\n style={{\n ...style,\n width,\n }}\n >\n <div className={`${baseClass}__wrap`}>\n {CustomError !== undefined ? CustomError : <FieldError {...(errorProps || {})} />}\n {CustomLabel !== undefined ? CustomLabel : <FieldLabel {...(labelProps || {})} />}\n <Slate\n editor={editor}\n key={JSON.stringify({ initialValue, path })} // makes sure slate is completely re-rendered when initialValue changes, bypassing the slate-internal value memoization. That way, external changes to the form will update the editor\n onChange={handleChange}\n value={valueToRender as any[]}\n >\n <div className={`${baseClass}__wrapper`}>\n {Object.keys(elements)?.length + Object.keys(leaves)?.length > 0 && (\n <div\n className={[`${baseClass}__toolbar`, drawerIsOpen && `${baseClass}__drawerIsOpen`]\n .filter(Boolean)\n .join(' ')}\n ref={toolbarRef}\n >\n <div className={`${baseClass}__toolbar-wrap`}>\n {Object.values(elements).map((element) => {\n const Button = element?.Button\n\n if (Button) {\n return (\n <ElementButtonProvider\n fieldProps={props}\n key={element.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </ElementButtonProvider>\n )\n }\n\n return null\n })}\n {Object.values(leaves).map((leaf) => {\n const Button = leaf?.Button\n\n if (Button) {\n return (\n <LeafButtonProvider\n fieldProps={props}\n key={leaf.name}\n path={path}\n schemaPath={schemaPath}\n >\n {Button}\n </LeafButtonProvider>\n )\n }\n\n return null\n })}\n </div>\n </div>\n )}\n <div className={`${baseClass}__editor`} ref={editorRef}>\n <Editable\n className={`${baseClass}__input`}\n id={`field-${path.replace(/\\./g, '__')}`}\n onKeyDown={(event) => {\n if (event.key === 'Enter') {\n if (event.shiftKey) {\n event.preventDefault()\n editor.insertText('\\n')\n } else {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement)) {\n // Allow hard enter to \"break out\" of certain elements\n if (editor.shouldBreakOutOnEnter(selectedElement)) {\n event.preventDefault()\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n\n if (\n Text.isText(selectedLeaf) &&\n String(selectedLeaf.text).length === editor.selection.anchor.offset\n ) {\n Transforms.insertNodes(editor, { children: [{ text: '' }] })\n } else {\n Transforms.splitNodes(editor)\n Transforms.setNodes(editor, {})\n }\n }\n }\n }\n }\n\n if (event.key === 'Backspace') {\n const selectedElement = Node.descendant(\n editor,\n editor.selection.anchor.path.slice(0, -1),\n )\n\n if (SlateElement.isElement(selectedElement) && selectedElement.type === 'li') {\n const selectedLeaf = Node.descendant(editor, editor.selection.anchor.path)\n if (Text.isText(selectedLeaf) && String(selectedLeaf.text).length === 0) {\n event.preventDefault()\n Transforms.unwrapNodes(editor, {\n match: (n) => SlateElement.isElement(n) && listTypes.includes(n.type),\n mode: 'lowest',\n split: true,\n })\n\n Transforms.setNodes(editor, { type: undefined })\n }\n } else if (editor.isVoid(selectedElement)) {\n Transforms.removeNodes(editor)\n }\n }\n\n Object.keys(hotkeys).forEach((hotkey) => {\n if (isHotkey(hotkey, event as any)) {\n event.preventDefault()\n const mark = hotkeys[hotkey]\n toggleLeaf(editor, mark)\n }\n })\n }}\n placeholder={getTranslation(placeholder, i18n)}\n readOnly={readOnly}\n renderElement={renderElement}\n renderLeaf={renderLeaf}\n spellCheck\n />\n </div>\n </div>\n </Slate>\n {CustomDescription !== undefined ? (\n CustomDescription\n ) : (\n <FieldDescription {...(descriptionProps || {})} />\n )}\n </div>\n </div>\n )\n}\n\nexport const RichText = withCondition(RichTextField)\n"],"names":["getTranslation","FieldDescription","FieldError","FieldLabel","useField","withCondition","useEditDepth","useTranslation","isHotkey","React","useCallback","useEffect","useMemo","useRef","Node","Element","SlateElement","Text","Transforms","createEditor","withHistory","Editable","Slate","withReact","defaultRichTextValue","richTextValidate","listTypes","hotkeys","toggleLeaf","withEnterBreakOut","withHTML","ElementButtonProvider","ElementProvider","LeafButtonProvider","LeafProvider","baseClass","RichTextField","props","name","CustomDescription","CustomError","CustomLabel","className","descriptionProps","elements","errorProps","labelProps","leaves","path","pathFromProps","placeholder","plugins","readOnly","required","style","validate","width","i18n","editorRef","toolbarRef","drawerDepth","drawerIsOpen","memoizedValidate","value","validationOptions","initialValue","schemaPath","setValue","showError","editor","CreatedEditor","length","reduce","editorWithPlugins","plugin","renderElement","attributes","children","element","matchedElement","type","attr","textAlign","marginRight","marginLeft","listStylePosition","el","childNodes","fieldProps","div","renderLeaf","leaf","matchedLeaves","Object","entries","filter","leafName","result","leafConfig","i","Leaf","key","span","handleChange","val","ops","operations","o","Array","isArray","setClickableState","clickState","selectors","toolbarButtons","current","querySelectorAll","forEach","child","isButton","tagName","isDisabling","setAttribute","classes","Boolean","join","valueToRender","parsedJSON","JSON","parse","err","undefined","stringify","onChange","keys","ref","values","map","Button","id","replace","onKeyDown","event","shiftKey","preventDefault","insertText","selectedElement","descendant","selection","anchor","slice","isElement","shouldBreakOutOnEnter","selectedLeaf","isText","String","text","offset","insertNodes","splitNodes","setNodes","unwrapNodes","match","n","includes","mode","split","isVoid","removeNodes","hotkey","mark","spellCheck","RichText"],"mappings":"AAAA;AAOA,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,gBAAgB,QAAQ,wCAAuC;AACxE,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,UAAU,QAAQ,kCAAiC;AAC5D,SAASC,QAAQ,QAAQ,gCAA+B;AACxD,SAASC,aAAa,QAAQ,qCAAoC;AAClE,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,OAAOC,cAAc,YAAW;AAChC,OAAOC,SAASC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,QAAQ,QAAO;AACtE,SAASC,IAAI,EAAEC,WAAWC,YAAY,EAAEC,IAAI,EAAEC,UAAU,EAAEC,YAAY,QAAQ,QAAO;AACrF,SAASC,WAAW,QAAQ,gBAAe;AAC3C,SAASC,QAAQ,EAAEC,KAAK,EAAEC,SAAS,QAAQ,cAAa;AAKxD,SAASC,oBAAoB,QAAQ,0BAAyB;AAC9D,SAASC,gBAAgB,QAAQ,wBAAuB;AACxD,SAASC,SAAS,QAAQ,0BAAyB;AACnD,SAASC,OAAO,QAAQ,eAAc;AACtC,OAAO,eAAc;AACrB,SAASC,UAAU,QAAQ,qBAAoB;AAC/C,SAASC,iBAAiB,QAAQ,iCAAgC;AAClE,SAASC,QAAQ,QAAQ,wBAAuB;AAChD,SAASC,qBAAqB,QAAQ,uCAAsC;AAC5E,SAASC,eAAe,QAAQ,iCAAgC;AAChE,SAASC,kBAAkB,QAAQ,oCAAmC;AACtE,SAASC,YAAY,QAAQ,8BAA6B;AAE1D,MAAMC,YAAY;AAUlB,MAAMC,gBAUF,CAACC;IACH,MAAM,EACJC,IAAI,EACJC,iBAAiB,EACjBC,WAAW,EACXC,WAAW,EACXC,SAAS,EACTC,gBAAgB,EAChBC,QAAQ,EACRC,UAAU,EACVC,UAAU,EACVC,MAAM,EACNC,MAAMC,aAAa,EACnBC,WAAW,EACXC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,KAAK,EACLC,WAAW9B,gBAAgB,EAC3B+B,KAAK,EACN,GAAGnB;IAEJ,MAAM,EAAEoB,IAAI,EAAE,GAAGlD;IACjB,MAAMmD,YAAY7C,OAAO;IACzB,MAAM8C,aAAa9C,OAAO;IAE1B,MAAM+C,cAActD;IACpB,MAAMuD,eAAeD,cAAc;IAEnC,MAAME,mBAAmBpD,YACvB,CAACqD,OAAOC;QACN,IAAI,OAAOT,aAAa,YAAY;YAClC,OAAOA,SAASQ,OAAO;gBAAE,GAAGC,iBAAiB;gBAAEX;YAAS;QAC1D;IACF,GACA;QAACE;QAAUF;KAAS;IAGtB,MAAM,EAAEY,YAAY,EAAEjB,IAAI,EAAEkB,UAAU,EAAEC,QAAQ,EAAEC,SAAS,EAAEL,KAAK,EAAE,GAAG3D,SAAS;QAC9E4C,MAAMC,iBAAiBX;QACvBiB,UAAUO;IACZ;IAEA,MAAMO,SAASzD,QAAQ;QACrB,IAAI0D,gBAAgBzC,kBAAkBT,YAAYG,UAAUJ;QAE5DmD,gBAAgBxC,SAASwC;QAEzB,IAAInB,QAAQoB,MAAM,EAAE;YAClBD,gBAAgBnB,QAAQqB,MAAM,CAAC,CAACC,mBAAmBC;gBACjD,OAAOA,OAAOD;YAChB,GAAGH;QACL;QAEA,OAAOA;IACT,GAAG;QAACnB;KAAQ;IAEZ,MAAMwB,gBAAgBjE,YACpB,CAAC,EAAEkE,UAAU,EAAEC,QAAQ,EAAEC,OAAO,EAAE;QAChC,+CAA+C;QAE/C,MAAMC,iBAAiBnC,QAAQ,CAACkC,QAAQE,IAAI,CAAC;QAC7C,MAAMjE,UAAUgE,gBAAgBhE;QAEhC,IAAIkE,OAAO;YAAE,GAAGL,UAAU;QAAC;QAE3B,yEAAyE;QACzE,IAAIE,QAAQI,SAAS,EAAE;YACrB,IAAIJ,QAAQE,IAAI,KAAK,kBAAkBF,QAAQE,IAAI,KAAK,UAAU;gBAChE,OAAQF,QAAQI,SAAS;oBACvB,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE6B,aAAa;4BAAO;wBAAE;wBACjD;oBACF,KAAK;wBACHF,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE8B,YAAY;4BAAO;wBAAE;wBAChD;oBACF,KAAK;wBACHH,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE8B,YAAY;gCAAQD,aAAa;4BAAO;wBAAE;wBACrE;oBACF;wBACEF,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE4B,WAAWJ,QAAQI,SAAS;4BAAC;wBAAE;wBAC1D;gBACJ;YACF,OAAO,IAAIJ,QAAQE,IAAI,KAAK,MAAM;gBAChC,OAAQF,QAAQI,SAAS;oBACvB,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE+B,mBAAmB;gCAAUH,WAAW;4BAAQ;wBAAE;wBAC7E;oBACF,KAAK;wBACHD,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE+B,mBAAmB;gCAAUH,WAAW;4BAAS;wBAAE;wBAC9E;oBACF,KAAK;oBACL;wBACED,OAAO;4BAAE,GAAGA,IAAI;4BAAE3B,OAAO;gCAAE+B,mBAAmB;gCAAWH,WAAW;4BAAO;wBAAE;wBAC7E;gBACJ;YACF,OAAO;gBACLD,OAAO;oBAAE,GAAGA,IAAI;oBAAE3B,OAAO;wBAAE4B,WAAWJ,QAAQI,SAAS;oBAAC;gBAAE;YAC5D;QACF;QAEA,IAAInE,SAAS;YACX,MAAMuE,mBACJ,oBAACtD;gBACC4C,YAAYK;gBACZM,YAAYV;gBACZnB,WAAWA;gBACXoB,SAASA;gBACTU,YAAYnD;gBACZW,MAAMA;gBACNkB,YAAYA;eAEXnD;YAIL,OAAOuE;QACT;QAEA,qBAAO,oBAACG,OAAQR,MAAOJ;IACzB,GACA;QAACjC;QAAUI;QAAMX;QAAO6B;KAAW;IAGrC,MAAMwB,aAAahF,YACjB,CAAC,EAAEkE,UAAU,EAAEC,QAAQ,EAAEc,IAAI,EAAE;QAC7B,MAAMC,gBAAgBC,OAAOC,OAAO,CAAC/C,QAAQgD,MAAM,CAAC,CAAC,CAACC,SAAS,GAAKL,IAAI,CAACK,SAAS;QAElF,IAAIJ,cAAcrB,MAAM,GAAG,GAAG;YAC5B,OAAOqB,cAAcpB,MAAM,CACzB,CAACyB,QAAQ,GAAGC,WAAW,EAAEC;gBACvB,IAAID,YAAYE,MAAM;oBACpB,MAAMA,OAAOF,WAAWE,IAAI;oBAE5B,qBACE,oBAAClE;wBACC0C,YAAYA;wBACZlB,WAAWA;wBACX8B,YAAYnD;wBACZgE,KAAKF;wBACLR,MAAMA;wBACN3C,MAAMA;wBACNiD,QAAQA;wBACR/B,YAAYA;uBAEXkC;gBAGP;gBAEA,OAAOH;YACT,iBACA,oBAACK,QAAS1B,YAAaC;QAE3B;QAEA,qBAAO,oBAACyB,QAAS1B,YAAaC;IAChC,GACA;QAAC7B;QAAMX;QAAO6B;QAAYnB;KAAO;IAGnC,4CAA4C;IAC5C,8BAA8B;IAC9B,qDAAqD;IACrD,2DAA2D;IAC3D,MAAMwD,eAAe7F,YACnB,CAAC8F;QACC,MAAMC,MAAMpC,QAAQqC,WAAWX,OAAO,CAACY;YACrC,IAAIA,GAAG;gBACL,OAAOA,EAAE3B,IAAI,KAAK;YACpB;YACA,OAAO;QACT;QAEA,IAAIyB,OAAOG,MAAMC,OAAO,CAACJ,QAAQA,IAAIlC,MAAM,GAAG,GAAG;YAC/C,IAAI,CAACnB,YAAYoD,QAAQhF,wBAAwBgF,QAAQzC,OAAO;gBAC9DI,SAASqC;YACX;QACF;IACF,GACA;QAACnC,QAAQqC;QAAYtD;QAAUe;QAAUJ;KAAM;IAGjDpD,UAAU;QACR,SAASmG,kBAAkBC,UAAkC;YAC3D,MAAMC,YAAY;YAClB,MAAMC,iBACJtD,WAAWuD,OAAO,EAAEC,iBAAiBH;YAErCC,CAAAA,kBAAkB,EAAE,AAAD,EAAGG,OAAO,CAAC,CAACC;gBAC/B,MAAMC,WAAWD,MAAME,OAAO,KAAK;gBACnC,MAAMC,cAAcT,eAAe;gBACnCM,MAAMI,YAAY,CAAC,YAAYD,cAAc,OAAO;gBACpD,IAAIF,UAAUD,MAAMI,YAAY,CAAC,YAAYD,cAAc,aAAa;YAC1E;QACF;QAEA,IAAIpE,UAAU;YACZ0D,kBAAkB;QACpB;QAEA,OAAO;YACL,IAAI1D,UAAU;gBACZ0D,kBAAkB;YACpB;QACF;IACF,GAAG;QAAC1D;KAAS;IAEb,oBAAoB;IACpB,iFAAiF;IACjF,4EAA4E;IAC5E,4EAA4E;IAC5E,4BAA4B;IAC5B,kCAAkC;IAClC,oCAAoC;IACpC,MAAM;IACN,sBAAsB;IAEtB,MAAMsE,UAAU;QACdvF;QACA;QACAO;QACA0B,aAAa;QACbhB,YAAY,CAAC,EAAEjB,UAAU,WAAW,CAAC;KACtC,CACE4D,MAAM,CAAC4B,SACPC,IAAI,CAAC;IAER,IAAIC,gBAAgB9D;IAEpB,IAAI,OAAO8D,kBAAkB,UAAU;QACrC,IAAI;YACF,MAAMC,aAAaC,KAAKC,KAAK,CAACH;YAC9BA,gBAAgBC;QAClB,EAAE,OAAOG,KAAK;YACZJ,gBAAgB;QAClB;IACF;IAEA,IAAI,CAACA,eAAeA,gBAAgBrG;IAEpC,qBACE,oBAACiE;QACC/C,WAAWgF;QACXpE,OAAO;YACL,GAAGA,KAAK;YACRE;QACF;qBAEA,oBAACiC;QAAI/C,WAAW,CAAC,EAAEP,UAAU,MAAM,CAAC;OACjCK,gBAAgB0F,YAAY1F,4BAAc,oBAACtC,YAAgB2C,cAAc,CAAC,IAC1EJ,gBAAgByF,YAAYzF,4BAAc,oBAACtC,YAAgB2C,cAAc,CAAC,kBAC3E,oBAACxB;QACC+C,QAAQA;QACRgC,KAAK0B,KAAKI,SAAS,CAAC;YAAElE;YAAcjB;QAAK;QACzCoF,UAAU7B;QACVxC,OAAO8D;qBAEP,oBAACpC;QAAI/C,WAAW,CAAC,EAAEP,UAAU,SAAS,CAAC;OACpC0D,OAAOwC,IAAI,CAACzF,WAAW2B,SAASsB,OAAOwC,IAAI,CAACtF,SAASwB,SAAS,mBAC7D,oBAACkB;QACC/C,WAAW;YAAC,CAAC,EAAEP,UAAU,SAAS,CAAC;YAAE0B,gBAAgB,CAAC,EAAE1B,UAAU,cAAc,CAAC;SAAC,CAC/E4D,MAAM,CAAC4B,SACPC,IAAI,CAAC;QACRU,KAAK3E;qBAEL,oBAAC8B;QAAI/C,WAAW,CAAC,EAAEP,UAAU,cAAc,CAAC;OACzC0D,OAAO0C,MAAM,CAAC3F,UAAU4F,GAAG,CAAC,CAAC1D;QAC5B,MAAM2D,SAAS3D,SAAS2D;QAExB,IAAIA,QAAQ;YACV,qBACE,oBAAC1G;gBACCyD,YAAYnD;gBACZgE,KAAKvB,QAAQxC,IAAI;gBACjBU,MAAMA;gBACNkB,YAAYA;eAEXuE;QAGP;QAEA,OAAO;IACT,IACC5C,OAAO0C,MAAM,CAACxF,QAAQyF,GAAG,CAAC,CAAC7C;QAC1B,MAAM8C,SAAS9C,MAAM8C;QAErB,IAAIA,QAAQ;YACV,qBACE,oBAACxG;gBACCuD,YAAYnD;gBACZgE,KAAKV,KAAKrD,IAAI;gBACdU,MAAMA;gBACNkB,YAAYA;eAEXuE;QAGP;QAEA,OAAO;IACT,oBAIN,oBAAChD;QAAI/C,WAAW,CAAC,EAAEP,UAAU,QAAQ,CAAC;QAAEmG,KAAK5E;qBAC3C,oBAACrC;QACCqB,WAAW,CAAC,EAAEP,UAAU,OAAO,CAAC;QAChCuG,IAAI,CAAC,MAAM,EAAE1F,KAAK2F,OAAO,CAAC,OAAO,MAAM,CAAC;QACxCC,WAAW,CAACC;YACV,IAAIA,MAAMxC,GAAG,KAAK,SAAS;gBACzB,IAAIwC,MAAMC,QAAQ,EAAE;oBAClBD,MAAME,cAAc;oBACpB1E,OAAO2E,UAAU,CAAC;gBACpB,OAAO;oBACL,MAAMC,kBAAkBnI,KAAKoI,UAAU,CACrC7E,QACAA,OAAO8E,SAAS,CAACC,MAAM,CAACpG,IAAI,CAACqG,KAAK,CAAC,GAAG,CAAC;oBAGzC,IAAIrI,aAAasI,SAAS,CAACL,kBAAkB;wBAC3C,sDAAsD;wBACtD,IAAI5E,OAAOkF,qBAAqB,CAACN,kBAAkB;4BACjDJ,MAAME,cAAc;4BACpB,MAAMS,eAAe1I,KAAKoI,UAAU,CAAC7E,QAAQA,OAAO8E,SAAS,CAACC,MAAM,CAACpG,IAAI;4BAEzE,IACE/B,KAAKwI,MAAM,CAACD,iBACZE,OAAOF,aAAaG,IAAI,EAAEpF,MAAM,KAAKF,OAAO8E,SAAS,CAACC,MAAM,CAACQ,MAAM,EACnE;gCACA1I,WAAW2I,WAAW,CAACxF,QAAQ;oCAAEQ,UAAU;wCAAC;4CAAE8E,MAAM;wCAAG;qCAAE;gCAAC;4BAC5D,OAAO;gCACLzI,WAAW4I,UAAU,CAACzF;gCACtBnD,WAAW6I,QAAQ,CAAC1F,QAAQ,CAAC;4BAC/B;wBACF;oBACF;gBACF;YACF;YAEA,IAAIwE,MAAMxC,GAAG,KAAK,aAAa;gBAC7B,MAAM4C,kBAAkBnI,KAAKoI,UAAU,CACrC7E,QACAA,OAAO8E,SAAS,CAACC,MAAM,CAACpG,IAAI,CAACqG,KAAK,CAAC,GAAG,CAAC;gBAGzC,IAAIrI,aAAasI,SAAS,CAACL,oBAAoBA,gBAAgBjE,IAAI,KAAK,MAAM;oBAC5E,MAAMwE,eAAe1I,KAAKoI,UAAU,CAAC7E,QAAQA,OAAO8E,SAAS,CAACC,MAAM,CAACpG,IAAI;oBACzE,IAAI/B,KAAKwI,MAAM,CAACD,iBAAiBE,OAAOF,aAAaG,IAAI,EAAEpF,MAAM,KAAK,GAAG;wBACvEsE,MAAME,cAAc;wBACpB7H,WAAW8I,WAAW,CAAC3F,QAAQ;4BAC7B4F,OAAO,CAACC,IAAMlJ,aAAasI,SAAS,CAACY,MAAMxI,UAAUyI,QAAQ,CAACD,EAAElF,IAAI;4BACpEoF,MAAM;4BACNC,OAAO;wBACT;wBAEAnJ,WAAW6I,QAAQ,CAAC1F,QAAQ;4BAAEW,MAAMkD;wBAAU;oBAChD;gBACF,OAAO,IAAI7D,OAAOiG,MAAM,CAACrB,kBAAkB;oBACzC/H,WAAWqJ,WAAW,CAAClG;gBACzB;YACF;YAEAwB,OAAOwC,IAAI,CAAC1G,SAASyF,OAAO,CAAC,CAACoD;gBAC5B,IAAIhK,SAASgK,QAAQ3B,QAAe;oBAClCA,MAAME,cAAc;oBACpB,MAAM0B,OAAO9I,OAAO,CAAC6I,OAAO;oBAC5B5I,WAAWyC,QAAQoG;gBACrB;YACF;QACF;QACAvH,aAAalD,eAAekD,aAAaO;QACzCL,UAAUA;QACVuB,eAAeA;QACfe,YAAYA;QACZgF,YAAAA;WAKPnI,sBAAsB2F,YACrB3F,kCAEA,oBAACtC,kBAAsB0C,oBAAoB,CAAC;AAKtD;AAEA,OAAO,MAAMgI,WAAWtK,cAAc+B,eAAc"}
@@ -1,5 +1,5 @@
1
1
  'use client';
2
- import { Tooltip } from '@payloadcms/ui';
2
+ import { Tooltip } from '@payloadcms/ui/elements/Tooltip';
3
3
  import React, { useCallback, useState } from 'react';
4
4
  import { useSlate } from 'slate-react';
5
5
  import '../buttons.scss';
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/field/elements/Button.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport { Tooltip } from '@payloadcms/ui'\nimport React, { useCallback, useState } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isElementActive } from './isActive.js'\nimport { toggleElement } from './toggle.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ElementButton: React.FC<ButtonProps> = (props) => {\n const { type = 'type', children, className, el = 'button', format, onClick, tooltip } = props\n\n const editor = useSlate()\n const [showTooltip, setShowTooltip] = useState(false)\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n setShowTooltip(false)\n toggleElement(editor, format, type)\n },\n [editor, format, type],\n )\n\n const Tag: ElementType = el\n\n return (\n <Tag\n {...(el === 'button' && { type: 'button' })}\n className={[\n baseClass,\n className,\n isElementActive(editor, format, type) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n >\n {tooltip && <Tooltip show={showTooltip}>{tooltip}</Tooltip>}\n {children}\n </Tag>\n )\n}\n"],"names":["Tooltip","React","useCallback","useState","useSlate","isElementActive","toggleElement","baseClass","ElementButton","props","type","children","className","el","format","onClick","tooltip","editor","showTooltip","setShowTooltip","defaultOnClick","event","preventDefault","Tag","filter","Boolean","join","onMouseEnter","onMouseLeave","show"],"mappings":"AAAA;AAGA,SAASA,OAAO,QAAQ,iBAAgB;AACxC,OAAOC,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AACpD,SAASC,QAAQ,QAAQ,cAAa;AAItC,OAAO,kBAAiB;AACxB,SAASC,eAAe,QAAQ,gBAAe;AAC/C,SAASC,aAAa,QAAQ,cAAa;AAE3C,OAAO,MAAMC,YAAY,oBAAmB;AAE5C,OAAO,MAAMC,gBAAuC,CAACC;IACnD,MAAM,EAAEC,OAAO,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,KAAK,QAAQ,EAAEC,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGP;IAExF,MAAMQ,SAASb;IACf,MAAM,CAACc,aAAaC,eAAe,GAAGhB,SAAS;IAE/C,MAAMiB,iBAAiBlB,YACrB,CAACmB;QACCA,MAAMC,cAAc;QACpBH,eAAe;QACfb,cAAcW,QAAQH,QAAQJ;IAChC,GACA;QAACO;QAAQH;QAAQJ;KAAK;IAGxB,MAAMa,MAAmBV;IAEzB,qBACE,oBAACU;QACE,GAAIV,OAAO,YAAY;YAAEH,MAAM;QAAS,CAAC;QAC1CE,WAAW;YACTL;YACAK;YACAP,gBAAgBY,QAAQH,QAAQJ,SAAS,CAAC,EAAEH,UAAU,gBAAgB,CAAC;SACxE,CACEiB,MAAM,CAACC,SACPC,IAAI,CAAC;QACRX,SAASA,WAAWK;QACpBO,cAAc,IAAMR,eAAe;QACnCS,cAAc,IAAMT,eAAe;OAElCH,yBAAW,oBAAChB;QAAQ6B,MAAMX;OAAcF,UACxCL;AAGP,EAAC"}
1
+ {"version":3,"sources":["../../../src/field/elements/Button.tsx"],"sourcesContent":["'use client'\nimport type { ElementType } from 'react'\n\nimport { Tooltip } from '@payloadcms/ui/elements/Tooltip'\nimport React, { useCallback, useState } from 'react'\nimport { useSlate } from 'slate-react'\n\nimport type { ButtonProps } from './types.js'\n\nimport '../buttons.scss'\nimport { isElementActive } from './isActive.js'\nimport { toggleElement } from './toggle.js'\n\nexport const baseClass = 'rich-text__button'\n\nexport const ElementButton: React.FC<ButtonProps> = (props) => {\n const { type = 'type', children, className, el = 'button', format, onClick, tooltip } = props\n\n const editor = useSlate()\n const [showTooltip, setShowTooltip] = useState(false)\n\n const defaultOnClick = useCallback(\n (event) => {\n event.preventDefault()\n setShowTooltip(false)\n toggleElement(editor, format, type)\n },\n [editor, format, type],\n )\n\n const Tag: ElementType = el\n\n return (\n <Tag\n {...(el === 'button' && { type: 'button' })}\n className={[\n baseClass,\n className,\n isElementActive(editor, format, type) && `${baseClass}__button--active`,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={onClick || defaultOnClick}\n onMouseEnter={() => setShowTooltip(true)}\n onMouseLeave={() => setShowTooltip(false)}\n >\n {tooltip && <Tooltip show={showTooltip}>{tooltip}</Tooltip>}\n {children}\n </Tag>\n )\n}\n"],"names":["Tooltip","React","useCallback","useState","useSlate","isElementActive","toggleElement","baseClass","ElementButton","props","type","children","className","el","format","onClick","tooltip","editor","showTooltip","setShowTooltip","defaultOnClick","event","preventDefault","Tag","filter","Boolean","join","onMouseEnter","onMouseLeave","show"],"mappings":"AAAA;AAGA,SAASA,OAAO,QAAQ,kCAAiC;AACzD,OAAOC,SAASC,WAAW,EAAEC,QAAQ,QAAQ,QAAO;AACpD,SAASC,QAAQ,QAAQ,cAAa;AAItC,OAAO,kBAAiB;AACxB,SAASC,eAAe,QAAQ,gBAAe;AAC/C,SAASC,aAAa,QAAQ,cAAa;AAE3C,OAAO,MAAMC,YAAY,oBAAmB;AAE5C,OAAO,MAAMC,gBAAuC,CAACC;IACnD,MAAM,EAAEC,OAAO,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,KAAK,QAAQ,EAAEC,MAAM,EAAEC,OAAO,EAAEC,OAAO,EAAE,GAAGP;IAExF,MAAMQ,SAASb;IACf,MAAM,CAACc,aAAaC,eAAe,GAAGhB,SAAS;IAE/C,MAAMiB,iBAAiBlB,YACrB,CAACmB;QACCA,MAAMC,cAAc;QACpBH,eAAe;QACfb,cAAcW,QAAQH,QAAQJ;IAChC,GACA;QAACO;QAAQH;QAAQJ;KAAK;IAGxB,MAAMa,MAAmBV;IAEzB,qBACE,oBAACU;QACE,GAAIV,OAAO,YAAY;YAAEH,MAAM;QAAS,CAAC;QAC1CE,WAAW;YACTL;YACAK;YACAP,gBAAgBY,QAAQH,QAAQJ,SAAS,CAAC,EAAEH,UAAU,gBAAgB,CAAC;SACxE,CACEiB,MAAM,CAACC,SACPC,IAAI,CAAC;QACRX,SAASA,WAAWK;QACpBO,cAAc,IAAMR,eAAe;QACnCS,cAAc,IAAMT,eAAe;OAElCH,yBAAW,oBAAChB;QAAQ6B,MAAMX;OAAcF,UACxCL;AAGP,EAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"EnabledRelationshipsCondition.d.ts","sourceRoot":"","sources":["../../../src/field/elements/EnabledRelationshipsCondition.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAwB9B,eAAO,MAAM,6BAA6B,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAavD,CAAA"}
1
+ {"version":3,"file":"EnabledRelationshipsCondition.d.ts","sourceRoot":"","sources":["../../../src/field/elements/EnabledRelationshipsCondition.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAwB9B,eAAO,MAAM,6BAA6B,EAAE,KAAK,CAAC,EAAE,CAAC,GAAG,CAavD,CAAA"}
@@ -1,5 +1,6 @@
1
1
  'use client';
2
- import { useAuth, useConfig } from '@payloadcms/ui/providers';
2
+ import { useAuth } from '@payloadcms/ui/providers/Auth';
3
+ import { useConfig } from '@payloadcms/ui/providers/Config';
3
4
  import * as React from 'react';
4
5
  const filterRichTextCollections = (collections, options)=>{
5
6
  return collections.filter(({ admin: { enableRichTextRelationship, hidden }, upload })=>{
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/field/elements/EnabledRelationshipsCondition.tsx"],"sourcesContent":["'use client'\n\nimport type { User } from 'payload/auth'\nimport type { SanitizedCollectionConfig } from 'payload/types'\n\nimport { useAuth, useConfig } from '@payloadcms/ui/providers'\nimport * as React from 'react'\n\ntype options = {\n uploads: boolean\n user: User\n}\n\ntype FilteredCollectionsT = (\n collections: SanitizedCollectionConfig[],\n options?: options,\n) => SanitizedCollectionConfig[]\nconst filterRichTextCollections: FilteredCollectionsT = (collections, options) => {\n return collections.filter(({ admin: { enableRichTextRelationship, hidden }, upload }) => {\n if (hidden === true || (typeof hidden === 'function' && hidden({ user: options.user }))) {\n return false\n }\n if (options?.uploads) {\n return enableRichTextRelationship && Boolean(upload) === true\n }\n\n return upload ? false : enableRichTextRelationship\n })\n}\n\nexport const EnabledRelationshipsCondition: React.FC<any> = (props) => {\n const { children, uploads = false, ...rest } = props\n const { collections } = useConfig()\n const { user } = useAuth()\n const [enabledCollectionSlugs] = React.useState(() =>\n filterRichTextCollections(collections, { uploads, user }).map(({ slug }) => slug),\n )\n\n if (!enabledCollectionSlugs.length) {\n return null\n }\n\n return React.cloneElement(children, { ...rest, enabledCollectionSlugs })\n}\n"],"names":["useAuth","useConfig","React","filterRichTextCollections","collections","options","filter","admin","enableRichTextRelationship","hidden","upload","user","uploads","Boolean","EnabledRelationshipsCondition","props","children","rest","enabledCollectionSlugs","useState","map","slug","length","cloneElement"],"mappings":"AAAA;AAKA,SAASA,OAAO,EAAEC,SAAS,QAAQ,2BAA0B;AAC7D,YAAYC,WAAW,QAAO;AAW9B,MAAMC,4BAAkD,CAACC,aAAaC;IACpE,OAAOD,YAAYE,MAAM,CAAC,CAAC,EAAEC,OAAO,EAAEC,0BAA0B,EAAEC,MAAM,EAAE,EAAEC,MAAM,EAAE;QAClF,IAAID,WAAW,QAAS,OAAOA,WAAW,cAAcA,OAAO;YAAEE,MAAMN,QAAQM,IAAI;QAAC,IAAK;YACvF,OAAO;QACT;QACA,IAAIN,SAASO,SAAS;YACpB,OAAOJ,8BAA8BK,QAAQH,YAAY;QAC3D;QAEA,OAAOA,SAAS,QAAQF;IAC1B;AACF;AAEA,OAAO,MAAMM,gCAA+C,CAACC;IAC3D,MAAM,EAAEC,QAAQ,EAAEJ,UAAU,KAAK,EAAE,GAAGK,MAAM,GAAGF;IAC/C,MAAM,EAAEX,WAAW,EAAE,GAAGH;IACxB,MAAM,EAAEU,IAAI,EAAE,GAAGX;IACjB,MAAM,CAACkB,uBAAuB,GAAGhB,MAAMiB,QAAQ,CAAC,IAC9ChB,0BAA0BC,aAAa;YAAEQ;YAASD;QAAK,GAAGS,GAAG,CAAC,CAAC,EAAEC,IAAI,EAAE,GAAKA;IAG9E,IAAI,CAACH,uBAAuBI,MAAM,EAAE;QAClC,OAAO;IACT;IAEA,qBAAOpB,MAAMqB,YAAY,CAACP,UAAU;QAAE,GAAGC,IAAI;QAAEC;IAAuB;AACxE,EAAC"}
1
+ {"version":3,"sources":["../../../src/field/elements/EnabledRelationshipsCondition.tsx"],"sourcesContent":["'use client'\n\nimport type { ClientUser } from 'payload/auth'\nimport type { ClientCollectionConfig } from 'payload/types'\n\nimport { useAuth } from '@payloadcms/ui/providers/Auth'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport * as React from 'react'\n\ntype options = {\n uploads: boolean\n user: ClientUser\n}\n\ntype FilteredCollectionsT = (\n collections: ClientCollectionConfig[],\n options?: options,\n) => ClientCollectionConfig[]\nconst filterRichTextCollections: FilteredCollectionsT = (collections, options) => {\n return collections.filter(({ admin: { enableRichTextRelationship, hidden }, upload }) => {\n if (hidden === true || (typeof hidden === 'function' && hidden({ user: options.user }))) {\n return false\n }\n if (options?.uploads) {\n return enableRichTextRelationship && Boolean(upload) === true\n }\n\n return upload ? false : enableRichTextRelationship\n })\n}\n\nexport const EnabledRelationshipsCondition: React.FC<any> = (props) => {\n const { children, uploads = false, ...rest } = props\n const { collections } = useConfig()\n const { user } = useAuth()\n const [enabledCollectionSlugs] = React.useState(() =>\n filterRichTextCollections(collections, { uploads, user }).map(({ slug }) => slug),\n )\n\n if (!enabledCollectionSlugs.length) {\n return null\n }\n\n return React.cloneElement(children, { ...rest, enabledCollectionSlugs })\n}\n"],"names":["useAuth","useConfig","React","filterRichTextCollections","collections","options","filter","admin","enableRichTextRelationship","hidden","upload","user","uploads","Boolean","EnabledRelationshipsCondition","props","children","rest","enabledCollectionSlugs","useState","map","slug","length","cloneElement"],"mappings":"AAAA;AAKA,SAASA,OAAO,QAAQ,gCAA+B;AACvD,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,YAAYC,WAAW,QAAO;AAW9B,MAAMC,4BAAkD,CAACC,aAAaC;IACpE,OAAOD,YAAYE,MAAM,CAAC,CAAC,EAAEC,OAAO,EAAEC,0BAA0B,EAAEC,MAAM,EAAE,EAAEC,MAAM,EAAE;QAClF,IAAID,WAAW,QAAS,OAAOA,WAAW,cAAcA,OAAO;YAAEE,MAAMN,QAAQM,IAAI;QAAC,IAAK;YACvF,OAAO;QACT;QACA,IAAIN,SAASO,SAAS;YACpB,OAAOJ,8BAA8BK,QAAQH,YAAY;QAC3D;QAEA,OAAOA,SAAS,QAAQF;IAC1B;AACF;AAEA,OAAO,MAAMM,gCAA+C,CAACC;IAC3D,MAAM,EAAEC,QAAQ,EAAEJ,UAAU,KAAK,EAAE,GAAGK,MAAM,GAAGF;IAC/C,MAAM,EAAEX,WAAW,EAAE,GAAGH;IACxB,MAAM,EAAEU,IAAI,EAAE,GAAGX;IACjB,MAAM,CAACkB,uBAAuB,GAAGhB,MAAMiB,QAAQ,CAAC,IAC9ChB,0BAA0BC,aAAa;YAAEQ;YAASD;QAAK,GAAGS,GAAG,CAAC,CAAC,EAAEC,IAAI,EAAE,GAAKA;IAG9E,IAAI,CAACH,uBAAuBI,MAAM,EAAE;QAClC,OAAO;IACT;IAEA,qBAAOpB,MAAMqB,YAAY,CAACP,UAAU;QAAE,GAAGC,IAAI;QAAEC;IAAuB;AACxE,EAAC"}
@@ -5,5 +5,5 @@ import { Editor } from 'slate';
5
5
  *
6
6
  * Related Issue: https://github.com/ianstormtaylor/slate/issues/5287
7
7
  */
8
- export declare const isBlockElement: (editor: Editor, node: any) => node is import("../../types.js").ElementNode;
8
+ export declare const isBlockElement: (editor: Editor, node: any) => node is import("slate").Element;
9
9
  //# sourceMappingURL=isBlockElement.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"isBlockElement.d.ts","sourceRoot":"","sources":["../../../src/field/elements/isBlockElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAW,MAAM,OAAO,CAAA;AAkBvC;;;;;GAKG;AAEH,eAAO,MAAM,cAAc,WAAY,MAAM,QAAQ,GAAG,iDACP,CAAA"}
1
+ {"version":3,"file":"isBlockElement.d.ts","sourceRoot":"","sources":["../../../src/field/elements/isBlockElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAW,MAAM,OAAO,CAAA;AAkBvC;;;;;GAKG;AAEH,eAAO,MAAM,cAAc,WAAY,MAAM,QAAQ,GAAG,oCACP,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/Button/index.tsx"],"names":[],"mappings":"AAcA,OAAO,KAA6B,MAAM,OAAO,CAAA;AAkDjD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAmE9B,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/Button/index.tsx"],"names":[],"mappings":"AAYA,OAAO,KAA6B,MAAM,OAAO,CAAA;AAkDjD,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAmE9B,CAAA"}
@@ -1,7 +1,12 @@
1
1
  'use client';
2
2
  import * as facelessUIImport from '@faceless-ui/modal';
3
- import { getFormState, reduceFieldsToValues, useConfig, useDocumentInfo, useDrawerSlug, useTranslation } from '@payloadcms/ui';
4
- import { useFieldPath } from '@payloadcms/ui/forms';
3
+ import { useDrawerSlug } from '@payloadcms/ui/elements/Drawer';
4
+ import { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider';
5
+ import { useConfig } from '@payloadcms/ui/providers/Config';
6
+ import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
7
+ import { useTranslation } from '@payloadcms/ui/providers/Translation';
8
+ import { getFormState } from '@payloadcms/ui/utilities/getFormState';
9
+ import { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues';
5
10
  import React, { Fragment, useState } from 'react';
6
11
  import { Editor, Range, Transforms } from 'slate';
7
12
  import { ReactEditor, useSlate } from 'slate-react';
@@ -13,7 +18,7 @@ import { LinkDrawer } from '../LinkDrawer/index.js';
13
18
  import { linkFieldsSchemaPath } from '../shared.js';
14
19
  import { unwrapLink } from '../utilities.js';
15
20
  /**
16
- * This function is called when an new link is created - not when an existing link is edited.
21
+ * This function is called when a new link is created - not when an existing link is edited.
17
22
  */ const insertLink = (editor, fields)=>{
18
23
  const isCollapsed = editor.selection && Range.isCollapsed(editor.selection);
19
24
  const data = reduceFieldsToValues(fields, true);
@@ -69,7 +74,7 @@ export const LinkButton = ()=>{
69
74
  const { closeModal, openModal } = useModal();
70
75
  const drawerSlug = useDrawerSlug('rich-text-link');
71
76
  const { id, collectionSlug } = useDocumentInfo();
72
- const { schemaPath } = useFieldPath();
77
+ const { schemaPath } = useFieldProps();
73
78
  const { richTextComponentMap } = fieldProps;
74
79
  const fieldMap = richTextComponentMap.get(linkFieldsSchemaPath);
75
80
  return /*#__PURE__*/ React.createElement(Fragment, null, /*#__PURE__*/ React.createElement(ElementButton, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/field/elements/link/Button/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport {\n getFormState,\n reduceFieldsToValues,\n useConfig,\n useDocumentInfo,\n useDrawerSlug,\n useTranslation,\n} from '@payloadcms/ui'\nimport { useFieldPath } from '@payloadcms/ui/forms'\nimport React, { Fragment, useState } from 'react'\nimport { Editor, Range, Transforms } from 'slate'\nimport { ReactEditor, useSlate } from 'slate-react'\n\nimport { LinkIcon } from '../../../icons/Link/index.js'\nimport { useElementButton } from '../../../providers/ElementButtonProvider.js'\nimport { ElementButton } from '../../Button.js'\nimport { isElementActive } from '../../isActive.js'\nimport { LinkDrawer } from '../LinkDrawer/index.js'\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport { unwrapLink } from '../utilities.js'\n\n/**\n * This function is called when an new link is created - not when an existing link is edited.\n */\nconst insertLink = (editor, fields) => {\n const isCollapsed = editor.selection && Range.isCollapsed(editor.selection)\n const data = reduceFieldsToValues(fields, true)\n\n const newLink = {\n type: 'link',\n children: [],\n doc: data.doc,\n fields: data.fields, // Any custom user-added fields are part of data.fields\n linkType: data.linkType,\n newTab: data.newTab,\n url: data.url,\n }\n\n if (isCollapsed || !editor.selection) {\n // If selection anchor and focus are the same,\n // Just inject a new node with children already set\n Transforms.insertNodes(editor, {\n ...newLink,\n children: [{ text: String(data.text) }],\n })\n } else if (editor.selection) {\n // Otherwise we need to wrap the selected node in a link,\n // Delete its old text,\n // Move the selection one position forward into the link,\n // And insert the text back into the new link\n Transforms.wrapNodes(editor, newLink, { split: true })\n Transforms.delete(editor, { at: editor.selection.focus.path, unit: 'word' })\n Transforms.move(editor, { distance: 1, unit: 'offset' })\n Transforms.insertText(editor, String(data.text), { at: editor.selection.focus.path })\n }\n\n ReactEditor.focus(editor)\n}\n\nexport const LinkButton: React.FC = () => {\n const { useModal } = facelessUIImport\n\n const { fieldProps } = useElementButton()\n const [initialState, setInitialState] = useState<FormState>({})\n\n const { t } = useTranslation()\n const editor = useSlate()\n const config = useConfig()\n\n const { closeModal, openModal } = useModal()\n const drawerSlug = useDrawerSlug('rich-text-link')\n const { id, collectionSlug } = useDocumentInfo()\n const { schemaPath } = useFieldPath()\n\n const { richTextComponentMap } = fieldProps\n\n const fieldMap = richTextComponentMap.get(linkFieldsSchemaPath)\n\n return (\n <Fragment>\n <ElementButton\n className=\"link\"\n format=\"link\"\n onClick={async () => {\n if (isElementActive(editor, 'link')) {\n unwrapLink(editor)\n } else {\n openModal(drawerSlug)\n const isCollapsed = editor.selection && Range.isCollapsed(editor.selection)\n if (!isCollapsed) {\n const data = {\n text: editor.selection ? Editor.string(editor, editor.selection) : '',\n }\n const state = await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n collectionSlug,\n data,\n operation: 'update',\n schemaPath: `${schemaPath}.${linkFieldsSchemaPath}`,\n },\n serverURL: config.serverURL,\n })\n setInitialState(state)\n }\n }\n }}\n tooltip={t('fields:addLink')}\n >\n <LinkIcon />\n </ElementButton>\n <LinkDrawer\n drawerSlug={drawerSlug}\n fieldMap={Array.isArray(fieldMap) ? fieldMap : []}\n handleClose={() => {\n closeModal(drawerSlug)\n }}\n handleModalSubmit={(fields) => {\n insertLink(editor, fields)\n closeModal(drawerSlug)\n }}\n initialState={initialState}\n />\n </Fragment>\n )\n}\n"],"names":["facelessUIImport","getFormState","reduceFieldsToValues","useConfig","useDocumentInfo","useDrawerSlug","useTranslation","useFieldPath","React","Fragment","useState","Editor","Range","Transforms","ReactEditor","useSlate","LinkIcon","useElementButton","ElementButton","isElementActive","LinkDrawer","linkFieldsSchemaPath","unwrapLink","insertLink","editor","fields","isCollapsed","selection","data","newLink","type","children","doc","linkType","newTab","url","insertNodes","text","String","wrapNodes","split","delete","at","focus","path","unit","move","distance","insertText","LinkButton","useModal","fieldProps","initialState","setInitialState","t","config","closeModal","openModal","drawerSlug","id","collectionSlug","schemaPath","richTextComponentMap","fieldMap","get","className","format","onClick","string","state","apiRoute","routes","api","body","operation","serverURL","tooltip","Array","isArray","handleClose","handleModalSubmit"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../src/field/elements/link/Button/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { useDrawerSlug } from '@payloadcms/ui/elements/Drawer'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { getFormState } from '@payloadcms/ui/utilities/getFormState'\nimport { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues'\nimport React, { Fragment, useState } from 'react'\nimport { Editor, Range, Transforms } from 'slate'\nimport { ReactEditor, useSlate } from 'slate-react'\n\nimport { LinkIcon } from '../../../icons/Link/index.js'\nimport { useElementButton } from '../../../providers/ElementButtonProvider.js'\nimport { ElementButton } from '../../Button.js'\nimport { isElementActive } from '../../isActive.js'\nimport { LinkDrawer } from '../LinkDrawer/index.js'\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport { unwrapLink } from '../utilities.js'\n\n/**\n * This function is called when a new link is created - not when an existing link is edited.\n */\nconst insertLink = (editor, fields) => {\n const isCollapsed = editor.selection && Range.isCollapsed(editor.selection)\n const data = reduceFieldsToValues(fields, true)\n\n const newLink = {\n type: 'link',\n children: [],\n doc: data.doc,\n fields: data.fields, // Any custom user-added fields are part of data.fields\n linkType: data.linkType,\n newTab: data.newTab,\n url: data.url,\n }\n\n if (isCollapsed || !editor.selection) {\n // If selection anchor and focus are the same,\n // Just inject a new node with children already set\n Transforms.insertNodes(editor, {\n ...newLink,\n children: [{ text: String(data.text) }],\n })\n } else if (editor.selection) {\n // Otherwise we need to wrap the selected node in a link,\n // Delete its old text,\n // Move the selection one position forward into the link,\n // And insert the text back into the new link\n Transforms.wrapNodes(editor, newLink, { split: true })\n Transforms.delete(editor, { at: editor.selection.focus.path, unit: 'word' })\n Transforms.move(editor, { distance: 1, unit: 'offset' })\n Transforms.insertText(editor, String(data.text), { at: editor.selection.focus.path })\n }\n\n ReactEditor.focus(editor)\n}\n\nexport const LinkButton: React.FC = () => {\n const { useModal } = facelessUIImport\n\n const { fieldProps } = useElementButton()\n const [initialState, setInitialState] = useState<FormState>({})\n\n const { t } = useTranslation()\n const editor = useSlate()\n const config = useConfig()\n\n const { closeModal, openModal } = useModal()\n const drawerSlug = useDrawerSlug('rich-text-link')\n const { id, collectionSlug } = useDocumentInfo()\n const { schemaPath } = useFieldProps()\n\n const { richTextComponentMap } = fieldProps\n\n const fieldMap = richTextComponentMap.get(linkFieldsSchemaPath)\n\n return (\n <Fragment>\n <ElementButton\n className=\"link\"\n format=\"link\"\n onClick={async () => {\n if (isElementActive(editor, 'link')) {\n unwrapLink(editor)\n } else {\n openModal(drawerSlug)\n const isCollapsed = editor.selection && Range.isCollapsed(editor.selection)\n if (!isCollapsed) {\n const data = {\n text: editor.selection ? Editor.string(editor, editor.selection) : '',\n }\n const state = await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n collectionSlug,\n data,\n operation: 'update',\n schemaPath: `${schemaPath}.${linkFieldsSchemaPath}`,\n },\n serverURL: config.serverURL,\n })\n setInitialState(state)\n }\n }\n }}\n tooltip={t('fields:addLink')}\n >\n <LinkIcon />\n </ElementButton>\n <LinkDrawer\n drawerSlug={drawerSlug}\n fieldMap={Array.isArray(fieldMap) ? fieldMap : []}\n handleClose={() => {\n closeModal(drawerSlug)\n }}\n handleModalSubmit={(fields) => {\n insertLink(editor, fields)\n closeModal(drawerSlug)\n }}\n initialState={initialState}\n />\n </Fragment>\n )\n}\n"],"names":["facelessUIImport","useDrawerSlug","useFieldProps","useConfig","useDocumentInfo","useTranslation","getFormState","reduceFieldsToValues","React","Fragment","useState","Editor","Range","Transforms","ReactEditor","useSlate","LinkIcon","useElementButton","ElementButton","isElementActive","LinkDrawer","linkFieldsSchemaPath","unwrapLink","insertLink","editor","fields","isCollapsed","selection","data","newLink","type","children","doc","linkType","newTab","url","insertNodes","text","String","wrapNodes","split","delete","at","focus","path","unit","move","distance","insertText","LinkButton","useModal","fieldProps","initialState","setInitialState","t","config","closeModal","openModal","drawerSlug","id","collectionSlug","schemaPath","richTextComponentMap","fieldMap","get","className","format","onClick","string","state","apiRoute","routes","api","body","operation","serverURL","tooltip","Array","isArray","handleClose","handleModalSubmit"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/Element/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAU/D,OAAO,cAAc,CAAA;AA6BrB,eAAO,MAAM,WAAW,yBAoKvB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/Element/index.tsx"],"names":[],"mappings":"AAkBA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAU/D,OAAO,cAAc,CAAA;AA6BrB,eAAO,MAAM,WAAW,yBAoKvB,CAAA"}
@@ -1,7 +1,17 @@
1
1
  'use client';
2
2
  import * as facelessUIImport from '@faceless-ui/modal';
3
3
  import { getTranslation } from '@payloadcms/translations';
4
- import { Button, Popup, Translation, getFormState, reduceFieldsToValues, useAuth, useConfig, useDocumentInfo, useDrawerSlug, useLocale, useTranslation } from '@payloadcms/ui';
4
+ import { Button } from '@payloadcms/ui/elements/Button';
5
+ import { useDrawerSlug } from '@payloadcms/ui/elements/Drawer';
6
+ import { Popup } from '@payloadcms/ui/elements/Popup';
7
+ import { Translation } from '@payloadcms/ui/elements/Translation';
8
+ import { useAuth } from '@payloadcms/ui/providers/Auth';
9
+ import { useConfig } from '@payloadcms/ui/providers/Config';
10
+ import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
11
+ import { useLocale } from '@payloadcms/ui/providers/Locale';
12
+ import { useTranslation } from '@payloadcms/ui/providers/Translation';
13
+ import { getFormState } from '@payloadcms/ui/utilities/getFormState';
14
+ import { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues';
5
15
  import { deepCopyObject } from 'payload/utilities';
6
16
  import React, { useCallback, useEffect, useState } from 'react';
7
17
  import { Editor, Node, Transforms } from 'slate';
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/field/elements/link/Element/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport {\n Button,\n Popup,\n Translation,\n getFormState,\n reduceFieldsToValues,\n useAuth,\n useConfig,\n useDocumentInfo,\n useDrawerSlug,\n useLocale,\n useTranslation,\n} from '@payloadcms/ui'\nimport { deepCopyObject } from 'payload/utilities'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { Editor, Node, Transforms } from 'slate'\nimport { ReactEditor, useSlate } from 'slate-react'\n\nimport type { LinkElementType } from '../types.js'\n\nimport { useElement } from '../../../providers/ElementProvider.js'\nimport { LinkDrawer } from '../LinkDrawer/index.js'\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport { unwrapLink } from '../utilities.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-link'\n\n/**\n * This function is called when an existing link is edited.\n * When a link is first created, another function is called: {@link ../Button/index.tsx#insertLink}\n */\nconst insertChange = (editor, fields) => {\n const data = reduceFieldsToValues(fields, true)\n\n const [, parentPath] = Editor.above(editor)\n\n const newNode: Record<string, unknown> = {\n doc: data.doc,\n linkType: data.linkType,\n newTab: data.newTab,\n url: data.url,\n }\n\n Transforms.setNodes(editor, newNode, { at: parentPath })\n\n Transforms.delete(editor, { at: editor.selection.focus.path, unit: 'block' })\n Transforms.move(editor, { distance: 1, unit: 'offset' })\n Transforms.insertText(editor, String(data.text), { at: editor.selection.focus.path })\n\n ReactEditor.focus(editor)\n}\n\nexport const LinkElement = () => {\n const { attributes, children, editorRef, element, fieldProps, schemaPath } =\n useElement<LinkElementType>()\n const { useModal } = facelessUIImport\n\n const fieldMapPath = `${schemaPath}.${linkFieldsSchemaPath}`\n\n const { richTextComponentMap } = fieldProps\n const fieldMap = richTextComponentMap.get(linkFieldsSchemaPath)\n\n const editor = useSlate()\n const config = useConfig()\n const { user } = useAuth()\n const { code: locale } = useLocale()\n const { i18n, t } = useTranslation()\n const { closeModal, openModal, toggleModal } = useModal()\n const [renderModal, setRenderModal] = useState(false)\n const [renderPopup, setRenderPopup] = useState(false)\n const [initialState, setInitialState] = useState<FormState>({})\n const { id, collectionSlug } = useDocumentInfo()\n\n const drawerSlug = useDrawerSlug('rich-text-link')\n\n const handleTogglePopup = useCallback((render) => {\n if (!render) {\n setRenderPopup(render)\n }\n }, [])\n\n useEffect(() => {\n const awaitInitialState = async () => {\n const data = {\n doc: element.doc,\n fields: deepCopyObject(element.fields),\n linkType: element.linkType,\n newTab: element.newTab,\n text: Node.string(element),\n url: element.url,\n }\n\n const state = await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n collectionSlug,\n data,\n operation: 'update',\n schemaPath: fieldMapPath,\n },\n serverURL: config.serverURL,\n })\n\n setInitialState(state)\n }\n\n void awaitInitialState()\n }, [renderModal, element, user, locale, t, collectionSlug, config, id, fieldMapPath])\n\n return (\n <span className={baseClass} {...attributes}>\n <span contentEditable={false} style={{ userSelect: 'none' }}>\n {renderModal && (\n <LinkDrawer\n drawerSlug={drawerSlug}\n fieldMap={Array.isArray(fieldMap) ? fieldMap : []}\n handleClose={() => {\n toggleModal(drawerSlug)\n setRenderModal(false)\n }}\n handleModalSubmit={(fields) => {\n insertChange(editor, fields)\n closeModal(drawerSlug)\n }}\n initialState={initialState}\n />\n )}\n <Popup\n boundingRef={editorRef}\n buttonType=\"none\"\n forceOpen={renderPopup}\n horizontalAlign=\"left\"\n onToggleOpen={handleTogglePopup}\n render={() => (\n <div className={`${baseClass}__popup`}>\n {element.linkType === 'internal' && element.doc?.relationTo && element.doc?.value && (\n <Translation\n elements={{\n '0': ({ children }) => (\n <a\n className={`${baseClass}__link-label`}\n href={`${config.routes.admin}/collections/${element.doc.relationTo}/${element.doc.value}`}\n rel=\"noreferrer\"\n target=\"_blank\"\n title={`${config.routes.admin}/collections/${element.doc.relationTo}/${element.doc.value}`}\n >\n {children}\n </a>\n ),\n }}\n i18nKey=\"fields:linkedTo\"\n t={t}\n variables={{\n label: getTranslation(\n config.collections.find(({ slug }) => slug === element.doc.relationTo)?.labels\n ?.singular,\n i18n,\n ),\n }}\n />\n )}\n {(element.linkType === 'custom' || !element.linkType) && (\n <a\n className={`${baseClass}__link-label`}\n href={element.url}\n rel=\"noreferrer\"\n target=\"_blank\"\n title={element.url}\n >\n {element.url}\n </a>\n )}\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__link-edit`}\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n setRenderPopup(false)\n openModal(drawerSlug)\n setRenderModal(true)\n }}\n round\n tooltip={t('general:edit')}\n />\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__link-close`}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n unwrapLink(editor)\n }}\n round\n tooltip={t('general:remove')}\n />\n </div>\n )}\n size=\"fit-content\"\n verticalAlign=\"bottom\"\n />\n </span>\n <span\n className={[`${baseClass}__popup-toggler`].filter(Boolean).join(' ')}\n onClick={() => setRenderPopup(true)}\n onKeyDown={(e) => {\n if (e.key === 'Enter') setRenderPopup(true)\n }}\n role=\"button\"\n tabIndex={0}\n >\n {children}\n </span>\n </span>\n )\n}\n"],"names":["facelessUIImport","getTranslation","Button","Popup","Translation","getFormState","reduceFieldsToValues","useAuth","useConfig","useDocumentInfo","useDrawerSlug","useLocale","useTranslation","deepCopyObject","React","useCallback","useEffect","useState","Editor","Node","Transforms","ReactEditor","useSlate","useElement","LinkDrawer","linkFieldsSchemaPath","unwrapLink","baseClass","insertChange","editor","fields","data","parentPath","above","newNode","doc","linkType","newTab","url","setNodes","at","delete","selection","focus","path","unit","move","distance","insertText","String","text","LinkElement","attributes","children","editorRef","element","fieldProps","schemaPath","useModal","fieldMapPath","richTextComponentMap","fieldMap","get","config","user","code","locale","i18n","t","closeModal","openModal","toggleModal","renderModal","setRenderModal","renderPopup","setRenderPopup","initialState","setInitialState","id","collectionSlug","drawerSlug","handleTogglePopup","render","awaitInitialState","string","state","apiRoute","routes","api","body","operation","serverURL","span","className","contentEditable","style","userSelect","Array","isArray","handleClose","handleModalSubmit","boundingRef","buttonType","forceOpen","horizontalAlign","onToggleOpen","div","relationTo","value","elements","a","href","admin","rel","target","title","i18nKey","variables","label","collections","find","slug","labels","singular","buttonStyle","icon","onClick","e","preventDefault","round","tooltip","size","verticalAlign","filter","Boolean","join","onKeyDown","key","role","tabIndex"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../src/field/elements/link/Element/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormState } from 'payload/types'\n\nimport * as facelessUIImport from '@faceless-ui/modal'\nimport { getTranslation } from '@payloadcms/translations'\nimport { Button } from '@payloadcms/ui/elements/Button'\nimport { useDrawerSlug } from '@payloadcms/ui/elements/Drawer'\nimport { Popup } from '@payloadcms/ui/elements/Popup'\nimport { Translation } from '@payloadcms/ui/elements/Translation'\nimport { useAuth } from '@payloadcms/ui/providers/Auth'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useLocale } from '@payloadcms/ui/providers/Locale'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { getFormState } from '@payloadcms/ui/utilities/getFormState'\nimport { reduceFieldsToValues } from '@payloadcms/ui/utilities/reduceFieldsToValues'\nimport { deepCopyObject } from 'payload/utilities'\nimport React, { useCallback, useEffect, useState } from 'react'\nimport { Editor, Node, Transforms } from 'slate'\nimport { ReactEditor, useSlate } from 'slate-react'\n\nimport type { LinkElementType } from '../types.js'\n\nimport { useElement } from '../../../providers/ElementProvider.js'\nimport { LinkDrawer } from '../LinkDrawer/index.js'\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport { unwrapLink } from '../utilities.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-link'\n\n/**\n * This function is called when an existing link is edited.\n * When a link is first created, another function is called: {@link ../Button/index.tsx#insertLink}\n */\nconst insertChange = (editor, fields) => {\n const data = reduceFieldsToValues(fields, true)\n\n const [, parentPath] = Editor.above(editor)\n\n const newNode: Record<string, unknown> = {\n doc: data.doc,\n linkType: data.linkType,\n newTab: data.newTab,\n url: data.url,\n }\n\n Transforms.setNodes(editor, newNode, { at: parentPath })\n\n Transforms.delete(editor, { at: editor.selection.focus.path, unit: 'block' })\n Transforms.move(editor, { distance: 1, unit: 'offset' })\n Transforms.insertText(editor, String(data.text), { at: editor.selection.focus.path })\n\n ReactEditor.focus(editor)\n}\n\nexport const LinkElement = () => {\n const { attributes, children, editorRef, element, fieldProps, schemaPath } =\n useElement<LinkElementType>()\n const { useModal } = facelessUIImport\n\n const fieldMapPath = `${schemaPath}.${linkFieldsSchemaPath}`\n\n const { richTextComponentMap } = fieldProps\n const fieldMap = richTextComponentMap.get(linkFieldsSchemaPath)\n\n const editor = useSlate()\n const config = useConfig()\n const { user } = useAuth()\n const { code: locale } = useLocale()\n const { i18n, t } = useTranslation()\n const { closeModal, openModal, toggleModal } = useModal()\n const [renderModal, setRenderModal] = useState(false)\n const [renderPopup, setRenderPopup] = useState(false)\n const [initialState, setInitialState] = useState<FormState>({})\n const { id, collectionSlug } = useDocumentInfo()\n\n const drawerSlug = useDrawerSlug('rich-text-link')\n\n const handleTogglePopup = useCallback((render) => {\n if (!render) {\n setRenderPopup(render)\n }\n }, [])\n\n useEffect(() => {\n const awaitInitialState = async () => {\n const data = {\n doc: element.doc,\n fields: deepCopyObject(element.fields),\n linkType: element.linkType,\n newTab: element.newTab,\n text: Node.string(element),\n url: element.url,\n }\n\n const state = await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n collectionSlug,\n data,\n operation: 'update',\n schemaPath: fieldMapPath,\n },\n serverURL: config.serverURL,\n })\n\n setInitialState(state)\n }\n\n void awaitInitialState()\n }, [renderModal, element, user, locale, t, collectionSlug, config, id, fieldMapPath])\n\n return (\n <span className={baseClass} {...attributes}>\n <span contentEditable={false} style={{ userSelect: 'none' }}>\n {renderModal && (\n <LinkDrawer\n drawerSlug={drawerSlug}\n fieldMap={Array.isArray(fieldMap) ? fieldMap : []}\n handleClose={() => {\n toggleModal(drawerSlug)\n setRenderModal(false)\n }}\n handleModalSubmit={(fields) => {\n insertChange(editor, fields)\n closeModal(drawerSlug)\n }}\n initialState={initialState}\n />\n )}\n <Popup\n boundingRef={editorRef}\n buttonType=\"none\"\n forceOpen={renderPopup}\n horizontalAlign=\"left\"\n onToggleOpen={handleTogglePopup}\n render={() => (\n <div className={`${baseClass}__popup`}>\n {element.linkType === 'internal' && element.doc?.relationTo && element.doc?.value && (\n <Translation\n elements={{\n '0': ({ children }) => (\n <a\n className={`${baseClass}__link-label`}\n href={`${config.routes.admin}/collections/${element.doc.relationTo}/${element.doc.value}`}\n rel=\"noreferrer\"\n target=\"_blank\"\n title={`${config.routes.admin}/collections/${element.doc.relationTo}/${element.doc.value}`}\n >\n {children}\n </a>\n ),\n }}\n i18nKey=\"fields:linkedTo\"\n t={t}\n variables={{\n label: getTranslation(\n config.collections.find(({ slug }) => slug === element.doc.relationTo)?.labels\n ?.singular,\n i18n,\n ),\n }}\n />\n )}\n {(element.linkType === 'custom' || !element.linkType) && (\n <a\n className={`${baseClass}__link-label`}\n href={element.url}\n rel=\"noreferrer\"\n target=\"_blank\"\n title={element.url}\n >\n {element.url}\n </a>\n )}\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__link-edit`}\n icon=\"edit\"\n onClick={(e) => {\n e.preventDefault()\n setRenderPopup(false)\n openModal(drawerSlug)\n setRenderModal(true)\n }}\n round\n tooltip={t('general:edit')}\n />\n <Button\n buttonStyle=\"icon-label\"\n className={`${baseClass}__link-close`}\n icon=\"x\"\n onClick={(e) => {\n e.preventDefault()\n unwrapLink(editor)\n }}\n round\n tooltip={t('general:remove')}\n />\n </div>\n )}\n size=\"fit-content\"\n verticalAlign=\"bottom\"\n />\n </span>\n <span\n className={[`${baseClass}__popup-toggler`].filter(Boolean).join(' ')}\n onClick={() => setRenderPopup(true)}\n onKeyDown={(e) => {\n if (e.key === 'Enter') setRenderPopup(true)\n }}\n role=\"button\"\n tabIndex={0}\n >\n {children}\n </span>\n </span>\n )\n}\n"],"names":["facelessUIImport","getTranslation","Button","useDrawerSlug","Popup","Translation","useAuth","useConfig","useDocumentInfo","useLocale","useTranslation","getFormState","reduceFieldsToValues","deepCopyObject","React","useCallback","useEffect","useState","Editor","Node","Transforms","ReactEditor","useSlate","useElement","LinkDrawer","linkFieldsSchemaPath","unwrapLink","baseClass","insertChange","editor","fields","data","parentPath","above","newNode","doc","linkType","newTab","url","setNodes","at","delete","selection","focus","path","unit","move","distance","insertText","String","text","LinkElement","attributes","children","editorRef","element","fieldProps","schemaPath","useModal","fieldMapPath","richTextComponentMap","fieldMap","get","config","user","code","locale","i18n","t","closeModal","openModal","toggleModal","renderModal","setRenderModal","renderPopup","setRenderPopup","initialState","setInitialState","id","collectionSlug","drawerSlug","handleTogglePopup","render","awaitInitialState","string","state","apiRoute","routes","api","body","operation","serverURL","span","className","contentEditable","style","userSelect","Array","isArray","handleClose","handleModalSubmit","boundingRef","buttonType","forceOpen","horizontalAlign","onToggleOpen","div","relationTo","value","elements","a","href","admin","rel","target","title","i18nKey","variables","label","collections","find","slug","labels","singular","buttonStyle","icon","onClick","e","preventDefault","round","tooltip","size","verticalAlign","filter","Boolean","join","onKeyDown","key","role","tabIndex"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/LinkDrawer/index.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAGvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuCtC,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/LinkDrawer/index.tsx"],"names":[],"mappings":"AAeA,OAAO,KAA8B,MAAM,OAAO,CAAA;AAElD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAGvC,OAAO,cAAc,CAAA;AAIrB,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqCtC,CAAA"}
@@ -1,14 +1,22 @@
1
1
  'use client';
2
- import { Drawer, Form, FormSubmit, RenderFields, getFormState, useConfig, useDocumentInfo, useEditDepth, useFieldPath, useTranslation } from '@payloadcms/ui';
3
- import { FieldPathProvider } from '@payloadcms/ui/forms';
4
- import { useHotkey } from '@payloadcms/ui/hooks';
2
+ import { Drawer } from '@payloadcms/ui/elements/Drawer';
3
+ import { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider';
4
+ import { Form } from '@payloadcms/ui/forms/Form';
5
+ import { RenderFields } from '@payloadcms/ui/forms/RenderFields';
6
+ import { FormSubmit } from '@payloadcms/ui/forms/Submit';
7
+ import { useHotkey } from '@payloadcms/ui/hooks/useHotkey';
8
+ import { useConfig } from '@payloadcms/ui/providers/Config';
9
+ import { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo';
10
+ import { useEditDepth } from '@payloadcms/ui/providers/EditDepth';
11
+ import { useTranslation } from '@payloadcms/ui/providers/Translation';
12
+ import { getFormState } from '@payloadcms/ui/utilities/getFormState';
5
13
  import React, { useCallback, useRef } from 'react';
6
14
  import { linkFieldsSchemaPath } from '../shared.js';
7
15
  import './index.scss';
8
16
  const baseClass = 'rich-text-link-edit-modal';
9
17
  export const LinkDrawer = ({ drawerSlug, fieldMap, handleModalSubmit, initialState })=>{
10
18
  const { t } = useTranslation();
11
- const { schemaPath } = useFieldPath();
19
+ const { schemaPath } = useFieldProps();
12
20
  const fieldMapPath = `${schemaPath}.${linkFieldsSchemaPath}`;
13
21
  const { id } = useDocumentInfo();
14
22
  const config = useConfig();
@@ -29,10 +37,7 @@ export const LinkDrawer = ({ drawerSlug, fieldMap, handleModalSubmit, initialSta
29
37
  fieldMapPath,
30
38
  id
31
39
  ]);
32
- return /*#__PURE__*/ React.createElement(FieldPathProvider, {
33
- path: "",
34
- schemaPath: ""
35
- }, /*#__PURE__*/ React.createElement(Drawer, {
40
+ return /*#__PURE__*/ React.createElement(Drawer, {
36
41
  className: baseClass,
37
42
  slug: drawerSlug,
38
43
  title: t('fields:editLink')
@@ -44,8 +49,11 @@ export const LinkDrawer = ({ drawerSlug, fieldMap, handleModalSubmit, initialSta
44
49
  onSubmit: handleModalSubmit
45
50
  }, /*#__PURE__*/ React.createElement(RenderFields, {
46
51
  fieldMap: fieldMap,
47
- forceRender: true
48
- }), /*#__PURE__*/ React.createElement(LinkSubmit, null))));
52
+ forceRender: true,
53
+ path: "",
54
+ readOnly: false,
55
+ schemaPath: ""
56
+ }), /*#__PURE__*/ React.createElement(LinkSubmit, null)));
49
57
  };
50
58
  const LinkSubmit = ()=>{
51
59
  const { t } = useTranslation();
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/field/elements/link/LinkDrawer/index.tsx"],"sourcesContent":["'use client'\n\nimport {\n Drawer,\n Form,\n type FormProps,\n FormSubmit,\n RenderFields,\n getFormState,\n useConfig,\n useDocumentInfo,\n useEditDepth,\n useFieldPath,\n useTranslation,\n} from '@payloadcms/ui'\nimport { FieldPathProvider } from '@payloadcms/ui/forms'\nimport { useHotkey } from '@payloadcms/ui/hooks'\nimport React, { useCallback, useRef } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-link-edit-modal'\n\nexport const LinkDrawer: React.FC<Props> = ({\n drawerSlug,\n fieldMap,\n handleModalSubmit,\n initialState,\n}) => {\n const { t } = useTranslation()\n const { schemaPath } = useFieldPath()\n const fieldMapPath = `${schemaPath}.${linkFieldsSchemaPath}`\n const { id } = useDocumentInfo()\n const config = useConfig()\n\n const onChange: FormProps['onChange'][0] = useCallback(\n async ({ formState: prevFormState }) => {\n return await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n formState: prevFormState,\n operation: 'update',\n schemaPath: fieldMapPath,\n },\n serverURL: config.serverURL,\n })\n },\n\n [config.routes.api, config.serverURL, fieldMapPath, id],\n )\n\n return (\n <FieldPathProvider path=\"\" schemaPath=\"\">\n <Drawer className={baseClass} slug={drawerSlug} title={t('fields:editLink')}>\n <Form initialState={initialState} onChange={[onChange]} onSubmit={handleModalSubmit}>\n <RenderFields fieldMap={fieldMap} forceRender />\n <LinkSubmit />\n </Form>\n </Drawer>\n </FieldPathProvider>\n )\n}\n\nconst LinkSubmit: React.FC = () => {\n const { t } = useTranslation()\n const ref = useRef<HTMLButtonElement>(null)\n const editDepth = useEditDepth()\n\n useHotkey({ cmdCtrlKey: true, editDepth, keyCodes: ['s'] }, (e) => {\n e.preventDefault()\n e.stopPropagation()\n if (ref?.current) {\n ref.current.click()\n }\n })\n\n return <FormSubmit ref={ref}>{t('general:submit')}</FormSubmit>\n}\n"],"names":["Drawer","Form","FormSubmit","RenderFields","getFormState","useConfig","useDocumentInfo","useEditDepth","useFieldPath","useTranslation","FieldPathProvider","useHotkey","React","useCallback","useRef","linkFieldsSchemaPath","baseClass","LinkDrawer","drawerSlug","fieldMap","handleModalSubmit","initialState","t","schemaPath","fieldMapPath","id","config","onChange","formState","prevFormState","apiRoute","routes","api","body","operation","serverURL","path","className","slug","title","onSubmit","forceRender","LinkSubmit","ref","editDepth","cmdCtrlKey","keyCodes","e","preventDefault","stopPropagation","current","click"],"mappings":"AAAA;AAEA,SACEA,MAAM,EACNC,IAAI,EAEJC,UAAU,EACVC,YAAY,EACZC,YAAY,EACZC,SAAS,EACTC,eAAe,EACfC,YAAY,EACZC,YAAY,EACZC,cAAc,QACT,iBAAgB;AACvB,SAASC,iBAAiB,QAAQ,uBAAsB;AACxD,SAASC,SAAS,QAAQ,uBAAsB;AAChD,OAAOC,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAO;AAIlD,SAASC,oBAAoB,QAAQ,eAAc;AACnD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,aAA8B,CAAC,EAC1CC,UAAU,EACVC,QAAQ,EACRC,iBAAiB,EACjBC,YAAY,EACb;IACC,MAAM,EAAEC,CAAC,EAAE,GAAGb;IACd,MAAM,EAAEc,UAAU,EAAE,GAAGf;IACvB,MAAMgB,eAAe,CAAC,EAAED,WAAW,CAAC,EAAER,qBAAqB,CAAC;IAC5D,MAAM,EAAEU,EAAE,EAAE,GAAGnB;IACf,MAAMoB,SAASrB;IAEf,MAAMsB,WAAqCd,YACzC,OAAO,EAAEe,WAAWC,aAAa,EAAE;QACjC,OAAO,MAAMzB,aAAa;YACxB0B,UAAUJ,OAAOK,MAAM,CAACC,GAAG;YAC3BC,MAAM;gBACJR;gBACAG,WAAWC;gBACXK,WAAW;gBACXX,YAAYC;YACd;YACAW,WAAWT,OAAOS,SAAS;QAC7B;IACF,GAEA;QAACT,OAAOK,MAAM,CAACC,GAAG;QAAEN,OAAOS,SAAS;QAAEX;QAAcC;KAAG;IAGzD,qBACE,oBAACf;QAAkB0B,MAAK;QAAGb,YAAW;qBACpC,oBAACvB;QAAOqC,WAAWrB;QAAWsB,MAAMpB;QAAYqB,OAAOjB,EAAE;qBACvD,oBAACrB;QAAKoB,cAAcA;QAAcM,UAAU;YAACA;SAAS;QAAEa,UAAUpB;qBAChE,oBAACjB;QAAagB,UAAUA;QAAUsB,aAAAA;sBAClC,oBAACC;AAKX,EAAC;AAED,MAAMA,aAAuB;IAC3B,MAAM,EAAEpB,CAAC,EAAE,GAAGb;IACd,MAAMkC,MAAM7B,OAA0B;IACtC,MAAM8B,YAAYrC;IAElBI,UAAU;QAAEkC,YAAY;QAAMD;QAAWE,UAAU;YAAC;SAAI;IAAC,GAAG,CAACC;QAC3DA,EAAEC,cAAc;QAChBD,EAAEE,eAAe;QACjB,IAAIN,KAAKO,SAAS;YAChBP,IAAIO,OAAO,CAACC,KAAK;QACnB;IACF;IAEA,qBAAO,oBAACjD;QAAWyC,KAAKA;OAAMrB,EAAE;AAClC"}
1
+ {"version":3,"sources":["../../../../../src/field/elements/link/LinkDrawer/index.tsx"],"sourcesContent":["'use client'\n\nimport type { FormProps } from '@payloadcms/ui/forms/Form'\n\nimport { Drawer } from '@payloadcms/ui/elements/Drawer'\nimport { useFieldProps } from '@payloadcms/ui/forms/FieldPropsProvider'\nimport { Form } from '@payloadcms/ui/forms/Form'\nimport { RenderFields } from '@payloadcms/ui/forms/RenderFields'\nimport { FormSubmit } from '@payloadcms/ui/forms/Submit'\nimport { useHotkey } from '@payloadcms/ui/hooks/useHotkey'\nimport { useConfig } from '@payloadcms/ui/providers/Config'\nimport { useDocumentInfo } from '@payloadcms/ui/providers/DocumentInfo'\nimport { useEditDepth } from '@payloadcms/ui/providers/EditDepth'\nimport { useTranslation } from '@payloadcms/ui/providers/Translation'\nimport { getFormState } from '@payloadcms/ui/utilities/getFormState'\nimport React, { useCallback, useRef } from 'react'\n\nimport type { Props } from './types.js'\n\nimport { linkFieldsSchemaPath } from '../shared.js'\nimport './index.scss'\n\nconst baseClass = 'rich-text-link-edit-modal'\n\nexport const LinkDrawer: React.FC<Props> = ({\n drawerSlug,\n fieldMap,\n handleModalSubmit,\n initialState,\n}) => {\n const { t } = useTranslation()\n const { schemaPath } = useFieldProps()\n const fieldMapPath = `${schemaPath}.${linkFieldsSchemaPath}`\n const { id } = useDocumentInfo()\n const config = useConfig()\n\n const onChange: FormProps['onChange'][0] = useCallback(\n async ({ formState: prevFormState }) => {\n return await getFormState({\n apiRoute: config.routes.api,\n body: {\n id,\n formState: prevFormState,\n operation: 'update',\n schemaPath: fieldMapPath,\n },\n serverURL: config.serverURL,\n })\n },\n\n [config.routes.api, config.serverURL, fieldMapPath, id],\n )\n\n return (\n <Drawer className={baseClass} slug={drawerSlug} title={t('fields:editLink')}>\n <Form initialState={initialState} onChange={[onChange]} onSubmit={handleModalSubmit}>\n <RenderFields fieldMap={fieldMap} forceRender path=\"\" readOnly={false} schemaPath=\"\" />\n <LinkSubmit />\n </Form>\n </Drawer>\n )\n}\n\nconst LinkSubmit: React.FC = () => {\n const { t } = useTranslation()\n const ref = useRef<HTMLButtonElement>(null)\n const editDepth = useEditDepth()\n\n useHotkey({ cmdCtrlKey: true, editDepth, keyCodes: ['s'] }, (e) => {\n e.preventDefault()\n e.stopPropagation()\n if (ref?.current) {\n ref.current.click()\n }\n })\n\n return <FormSubmit ref={ref}>{t('general:submit')}</FormSubmit>\n}\n"],"names":["Drawer","useFieldProps","Form","RenderFields","FormSubmit","useHotkey","useConfig","useDocumentInfo","useEditDepth","useTranslation","getFormState","React","useCallback","useRef","linkFieldsSchemaPath","baseClass","LinkDrawer","drawerSlug","fieldMap","handleModalSubmit","initialState","t","schemaPath","fieldMapPath","id","config","onChange","formState","prevFormState","apiRoute","routes","api","body","operation","serverURL","className","slug","title","onSubmit","forceRender","path","readOnly","LinkSubmit","ref","editDepth","cmdCtrlKey","keyCodes","e","preventDefault","stopPropagation","current","click"],"mappings":"AAAA;AAIA,SAASA,MAAM,QAAQ,iCAAgC;AACvD,SAASC,aAAa,QAAQ,0CAAyC;AACvE,SAASC,IAAI,QAAQ,4BAA2B;AAChD,SAASC,YAAY,QAAQ,oCAAmC;AAChE,SAASC,UAAU,QAAQ,8BAA6B;AACxD,SAASC,SAAS,QAAQ,iCAAgC;AAC1D,SAASC,SAAS,QAAQ,kCAAiC;AAC3D,SAASC,eAAe,QAAQ,wCAAuC;AACvE,SAASC,YAAY,QAAQ,qCAAoC;AACjE,SAASC,cAAc,QAAQ,uCAAsC;AACrE,SAASC,YAAY,QAAQ,wCAAuC;AACpE,OAAOC,SAASC,WAAW,EAAEC,MAAM,QAAQ,QAAO;AAIlD,SAASC,oBAAoB,QAAQ,eAAc;AACnD,OAAO,eAAc;AAErB,MAAMC,YAAY;AAElB,OAAO,MAAMC,aAA8B,CAAC,EAC1CC,UAAU,EACVC,QAAQ,EACRC,iBAAiB,EACjBC,YAAY,EACb;IACC,MAAM,EAAEC,CAAC,EAAE,GAAGZ;IACd,MAAM,EAAEa,UAAU,EAAE,GAAGrB;IACvB,MAAMsB,eAAe,CAAC,EAAED,WAAW,CAAC,EAAER,qBAAqB,CAAC;IAC5D,MAAM,EAAEU,EAAE,EAAE,GAAGjB;IACf,MAAMkB,SAASnB;IAEf,MAAMoB,WAAqCd,YACzC,OAAO,EAAEe,WAAWC,aAAa,EAAE;QACjC,OAAO,MAAMlB,aAAa;YACxBmB,UAAUJ,OAAOK,MAAM,CAACC,GAAG;YAC3BC,MAAM;gBACJR;gBACAG,WAAWC;gBACXK,WAAW;gBACXX,YAAYC;YACd;YACAW,WAAWT,OAAOS,SAAS;QAC7B;IACF,GAEA;QAACT,OAAOK,MAAM,CAACC,GAAG;QAAEN,OAAOS,SAAS;QAAEX;QAAcC;KAAG;IAGzD,qBACE,oBAACxB;QAAOmC,WAAWpB;QAAWqB,MAAMnB;QAAYoB,OAAOhB,EAAE;qBACvD,oBAACnB;QAAKkB,cAAcA;QAAcM,UAAU;YAACA;SAAS;QAAEY,UAAUnB;qBAChE,oBAAChB;QAAae,UAAUA;QAAUqB,aAAAA;QAAYC,MAAK;QAAGC,UAAU;QAAOnB,YAAW;sBAClF,oBAACoB;AAIT,EAAC;AAED,MAAMA,aAAuB;IAC3B,MAAM,EAAErB,CAAC,EAAE,GAAGZ;IACd,MAAMkC,MAAM9B,OAA0B;IACtC,MAAM+B,YAAYpC;IAElBH,UAAU;QAAEwC,YAAY;QAAMD;QAAWE,UAAU;YAAC;SAAI;IAAC,GAAG,CAACC;QAC3DA,EAAEC,cAAc;QAChBD,EAAEE,eAAe;QACjB,IAAIN,KAAKO,SAAS;YAChBP,IAAIO,OAAO,CAACC,KAAK;QACnB;IACF;IAEA,qBAAO,oBAAC/C;QAAWuC,KAAKA;OAAMtB,EAAE;AAClC"}
@@ -1,4 +1,4 @@
1
- import type { FieldMap } from '@payloadcms/ui';
1
+ import type { FieldMap } from '@payloadcms/ui/utilities/buildComponentMap';
2
2
  import type { FormState } from 'payload/types';
3
3
  export type Props = {
4
4
  drawerSlug: string;
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/LinkDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAE9C,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,QAAQ,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,iBAAiB,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IAC7E,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB,CAAA"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/link/LinkDrawer/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4CAA4C,CAAA;AAC1E,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AAE9C,MAAM,MAAM,KAAK,GAAG;IAClB,UAAU,EAAE,MAAM,CAAA;IAClB,QAAQ,EAAE,QAAQ,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,iBAAiB,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IAC7E,YAAY,CAAC,EAAE,SAAS,CAAA;CACzB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/field/elements/link/LinkDrawer/types.ts"],"sourcesContent":["import type { FieldMap } from '@payloadcms/ui'\nimport type { FormState } from 'payload/types'\n\nexport type Props = {\n drawerSlug: string\n fieldMap: FieldMap\n handleClose: () => void\n handleModalSubmit: (fields: FormState, data: Record<string, unknown>) => void\n initialState?: FormState\n}\n"],"names":[],"mappings":"AAGA,WAMC"}
1
+ {"version":3,"sources":["../../../../../src/field/elements/link/LinkDrawer/types.ts"],"sourcesContent":["import type { FieldMap } from '@payloadcms/ui/utilities/buildComponentMap'\nimport type { FormState } from 'payload/types'\n\nexport type Props = {\n drawerSlug: string\n fieldMap: FieldMap\n handleClose: () => void\n handleModalSubmit: (fields: FormState, data: Record<string, unknown>) => void\n initialState?: FormState\n}\n"],"names":[],"mappings":"AAGA,WAMC"}
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/relationship/Button/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAqD,MAAM,OAAO,CAAA;AAOzE,OAAO,cAAc,CAAA;AAmBrB,KAAK,KAAK,GAAG;IACX,sBAAsB,EAAE,MAAM,EAAE,CAAA;IAChC,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAmDD,eAAO,MAAM,MAAM,UAAW,KAAK,KAAG,MAAM,SAM3C,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/field/elements/relationship/Button/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAqD,MAAM,OAAO,CAAA;AAOzE,OAAO,cAAc,CAAA;AAmBrB,KAAK,KAAK,GAAG;IACX,sBAAsB,EAAE,MAAM,EAAE,CAAA;IAChC,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAmDD,eAAO,MAAM,MAAM,UAAW,KAAK,KAAG,MAAM,SAM3C,CAAA"}
@@ -1,5 +1,6 @@
1
1
  'use client';
2
- import { useListDrawer, useTranslation } from '@payloadcms/ui';
2
+ import { useListDrawer } from '@payloadcms/ui/elements/ListDrawer';
3
+ import { useTranslation } from '@payloadcms/ui/providers/Translation';
3
4
  import React, { Fragment, useCallback, useEffect, useState } from 'react';
4
5
  import { ReactEditor, useSlate } from 'slate-react';
5
6
  import { RelationshipIcon } from '../../../icons/Relationship/index.js';