lkb-fields-document 1.0.0 → 1.0.1

package/dist/Field-28177061.cjs.js

@@ -1,1628 +0,0 @@
-'use client';
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var field = require('@keystar/ui/field');
-var style = require('@keystar/ui/style');
-var typography = require('@keystar/ui/typography');
-var React = require('react');
-var isHotkey = require('is-hotkey');
-var slate = require('slate');
-var slateReact = require('slate-react');
-var editorShared = require('./editor-shared-cc1293ed.cjs.js');
-var utils = require('./utils-6409f730.cjs.js');
-var icon = require('@keystar/ui/icon');
-var boldIcon = require('@keystar/ui/icon/icons/boldIcon');
-var italicIcon = require('@keystar/ui/icon/icons/italicIcon');
-var plusIcon = require('@keystar/ui/icon/icons/plusIcon');
-var chevronDownIcon = require('@keystar/ui/icon/icons/chevronDownIcon');
-var codeIcon = require('@keystar/ui/icon/icons/codeIcon');
-var removeFormattingIcon = require('@keystar/ui/icon/icons/removeFormattingIcon');
-var strikethroughIcon = require('@keystar/ui/icon/icons/strikethroughIcon');
-var subscriptIcon = require('@keystar/ui/icon/icons/subscriptIcon');
-var superscriptIcon = require('@keystar/ui/icon/icons/superscriptIcon');
-var typeIcon = require('@keystar/ui/icon/icons/typeIcon');
-var underlineIcon = require('@keystar/ui/icon/icons/underlineIcon');
-var maximizeIcon = require('@keystar/ui/icon/icons/maximizeIcon');
-var minimizeIcon = require('@keystar/ui/icon/icons/minimizeIcon');
-var editor = require('@keystar/ui/editor');
-var linkIcon = require('@keystar/ui/icon/icons/linkIcon');
-var externalLinkIcon = require('@keystar/ui/icon/icons/externalLinkIcon');
-var editIcon = require('@keystar/ui/icon/icons/editIcon');
-var toolbarState = require('./toolbar-state-3359e2f3.cjs.js');
-var index = require('./index-06c36775.cjs.js');
-var button = require('@keystar/ui/button');
-var dialog = require('@keystar/ui/dialog');
-var layout = require('@keystar/ui/layout');
-var tooltip = require('@keystar/ui/tooltip');
-require('@react-aria/i18n');
-require('@keystar/ui/number-field');
-var picker = require('@keystar/ui/picker');
-require('@keystar/ui/combobox');
-var textField = require('@keystar/ui/text-field');
-var tag = require('@keystar/ui/tag');
-var jsxRuntime = require('react/jsx-runtime');
-require('@keystar/ui/checkbox');
-var slots = require('@keystar/ui/slots');
-var unlinkIcon = require('@keystar/ui/icon/icons/unlinkIcon');
-var layouts = require('./layouts-ba9a558b.cjs.js');
-var shared = require('./shared-0533009e.cjs.js');
-var listIcon = require('@keystar/ui/icon/icons/listIcon');
-var listOrderedIcon = require('@keystar/ui/icon/icons/listOrderedIcon');
-var quoteIcon = require('@keystar/ui/icon/icons/quoteIcon');
-var alignLeftIcon = require('@keystar/ui/icon/icons/alignLeftIcon');
-var alignRightIcon = require('@keystar/ui/icon/icons/alignRightIcon');
-var alignCenterIcon = require('@keystar/ui/icon/icons/alignCenterIcon');
-var menu = require('@keystar/ui/menu');
-var minusIcon = require('@keystar/ui/icon/icons/minusIcon');
-var actionGroup = require('@keystar/ui/action-group');
-var matchSorter = require('match-sorter');
-var scrollIntoView = require('scroll-into-view-if-needed');
-var overlays$1 = require('@react-aria/overlays');
-var list = require('@react-stately/list');
-var overlays = require('@react-stately/overlays');
-var overlays$2 = require('@keystar/ui/overlays');
-var listbox = require('@keystar/ui/listbox');
-var core = require('@keystar/ui/core');
-require('slate-history');
-require('@emotion/weak-memoize');
-require('mdast-util-from-markdown');
-require('mdast-util-gfm-autolink-literal/from-markdown');
-require('micromark-extension-gfm-autolink-literal');
-require('mdast-util-gfm-strikethrough/from-markdown');
-require('micromark-extension-gfm-strikethrough');
-require('@keystar/ui/icon/icons/trash2Icon');
-require('./api-73636987.cjs.js');
-require('lkb-core');
-require('@keystar/ui/drag-and-drop');
-require('./form-from-preview-2042b9ef.cjs.js');
-require('lkb-core/admin-ui/context');
-require('lkb-core/fields/types/relationship/views');
-require('lkb-core/admin-ui/utils');
-require('@keystar/ui/list-view');
-require('@keystar/ui/icon/icons/trashIcon');
-require('@react-aria/utils');
-require('@braintree/sanitize-url');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
-
-var isHotkey__default = /*#__PURE__*/_interopDefault(isHotkey);
-var scrollIntoView__default = /*#__PURE__*/_interopDefault(scrollIntoView);
-
-function LinkElement({
-  attributes,
-  children,
-  element: __elementForGettingPath
-}) {
-  const editor = slateReact.useSlateStatic();
-  const [currentElement, setNode] = toolbarState.useElementWithSetNodes(editor, __elementForGettingPath);
-  const href = currentElement.href;
-
-  // const [localForceValidation, setLocalForceValidation] = useState(false)
-  const [dialogOpen, setDialogOpen] = React.useState(false);
-  const activePopoverElement = toolbarState.useActiveBlockPopover();
-  const selected = activePopoverElement === __elementForGettingPath;
-  React.useEffect(() => {
-    if (selected && !href) {
-      setDialogOpen(true);
-    }
-  }, [href, selected]);
-  const unlink = toolbarState.useEventCallback(() => {
-    slate.Transforms.unwrapNodes(editor, {
-      at: slateReact.ReactEditor.findPath(editor, __elementForGettingPath)
-    });
-  });
-  // const forceValidation = useForceValidation()
-  // TODO: show the invalid state
-  // const showInvalidState = isValidURL(href) ? false : forceValidation || localForceValidation
-  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsxs(toolbarState.BlockPopoverTrigger, {
-      element: __elementForGettingPath,
-      children: [/*#__PURE__*/jsxRuntime.jsx("a", {
-        href: href,
-        ...attributes,
-        children: children
-      }), /*#__PURE__*/jsxRuntime.jsx(toolbarState.BlockPopover, {
-        placement: "bottom start",
-        children: /*#__PURE__*/jsxRuntime.jsxs(layout.Flex, {
-          gap: "small",
-          padding: "regular",
-          children: [/*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-              prominence: "low",
-              onPress: () => setDialogOpen(true),
-              children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                src: editIcon.editIcon
-              })
-            }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-              children: "Edit"
-            })]
-          }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-              prominence: "low",
-              onPress: () => {
-                window.open(href, '_blank', 'noopener,noreferrer');
-              },
-              children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                src: externalLinkIcon.externalLinkIcon
-              })
-            }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-              children: /*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-                truncate: 3,
-                children: href
-              })
-            })]
-          }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-            children: [/*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-              prominence: "low",
-              onPress: unlink,
-              children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                src: unlinkIcon.unlinkIcon
-              })
-            }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-              children: "Unlink"
-            })]
-          })]
-        })
-      })]
-    }), /*#__PURE__*/jsxRuntime.jsx(dialog.DialogContainer, {
-      onDismiss: () => {
-        setDialogOpen(false);
-        toolbarState.focusWithPreviousSelection(editor);
-      },
-      children: dialogOpen && /*#__PURE__*/jsxRuntime.jsx(LinkDialog, {
-        text: slate.Node.string(currentElement),
-        href: href,
-        onSubmit: ({
-          href
-        }) => {
-          setNode({
-            href
-          });
-        }
-      })
-    })]
-  });
-}
-function LinkDialog({
-  onSubmit,
-  ...props
-}) {
-  let [href, setHref] = React.useState(props.href || '');
-  let [touched, setTouched] = React.useState(false);
-  let {
-    dismiss
-  } = dialog.useDialogContainer();
-  const showInvalidState = touched && !index.isValidURL(href);
-  return /*#__PURE__*/jsxRuntime.jsx(dialog.Dialog, {
-    size: "small",
-    children: /*#__PURE__*/jsxRuntime.jsxs("form", {
-      style: {
-        display: 'contents'
-      },
-      onSubmit: event => {
-        if (event.target !== event.currentTarget) return;
-        event.preventDefault();
-        if (!showInvalidState) {
-          dismiss();
-          onSubmit({
-            href
-          });
-        }
-      },
-      children: [/*#__PURE__*/jsxRuntime.jsxs(typography.Heading, {
-        children: [props.href ? '编辑' : '添加', "\u94FE\u63A5"]
-      }), /*#__PURE__*/jsxRuntime.jsx(slots.Content, {
-        children: /*#__PURE__*/jsxRuntime.jsxs(layout.Flex, {
-          gap: "large",
-          direction: "column",
-          children: [/*#__PURE__*/jsxRuntime.jsx(textField.TextField, {
-            label: "\u6587\u672C",
-            value: props.text,
-            isReadOnly: true
-          }), /*#__PURE__*/jsxRuntime.jsx(textField.TextField, {
-            autoFocus: true,
-            isRequired: true,
-            onBlur: () => setTouched(true),
-            label: "\u94FE\u63A5",
-            onChange: setHref,
-            value: href,
-            errorMessage: showInvalidState && '请输入有效的链接地址.'
-          })]
-        })
-      }), /*#__PURE__*/jsxRuntime.jsxs(button.ButtonGroup, {
-        children: [/*#__PURE__*/jsxRuntime.jsx(button.Button, {
-          onPress: dismiss,
-          children: "\u53D6\u6D88"
-        }), /*#__PURE__*/jsxRuntime.jsx(button.Button, {
-          prominence: "high",
-          type: "submit",
-          children: "\u4FDD\u5B58"
-        })]
-      })]
-    })
-  });
-}
-let _linkIcon = /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-  src: linkIcon.linkIcon
-});
-function LinkButton() {
-  const {
-    editor,
-    links: {
-      isDisabled,
-      isSelected
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(button.ActionButton, {
-    prominence: "low",
-    isDisabled: isDisabled,
-    isSelected: isSelected,
-    onPress: () => {
-      editorShared.wrapLink(editor, '');
-      slateReact.ReactEditor.focus(editor);
-    },
-    children: _linkIcon
-  }), [isSelected, isDisabled, editor]);
-}
-const linkButton = /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-  children: [/*#__PURE__*/jsxRuntime.jsx(LinkButton, {}), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-    children: /*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-      children: "Link"
-    })
-  })]
-});
-
-function ListButtons(props) {
-  const {
-    editor: editor$1,
-    lists
-  } = toolbarState.useToolbarState();
-  const items = React.useMemo(() => {
-    return [!!props.lists.unordered && {
-      label: '无序列表',
-      key: 'unordered',
-      shortcut: '-⎵',
-      icon: listIcon.listIcon
-    }, !!props.lists.unordered && {
-      label: '有序列表',
-      key: 'ordered',
-      shortcut: '1.⎵',
-      icon: listOrderedIcon.listOrderedIcon
-    }].filter(removeFalse);
-  }, [props.lists]);
-  return React.useMemo(() => {
-    const disabledKeys = [];
-    if (lists.ordered.isDisabled) disabledKeys.push('ordered');
-    if (lists.unordered.isDisabled) disabledKeys.push('unordered');
-    const activeListType = lists.ordered.isSelected ? 'ordered' : lists.unordered.isSelected ? 'unordered' : null;
-    return /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarGroup, {
-      value: activeListType,
-      disabledKeys: disabledKeys,
-      onChange: key => {
-        const format = `${key}-list`;
-        shared.toggleList(editor$1, format);
-        slateReact.ReactEditor.focus(editor$1);
-      },
-      selectionMode: "single",
-      children: items.map(item => /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-        children: [/*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarItem, {
-          value: item.key,
-          children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-            src: item.icon
-          })
-        }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.Tooltip, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-            children: item.label
-          }), /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-            children: item.shortcut
-          })]
-        })]
-      }, item.key))
-    });
-  }, [editor$1, lists.ordered.isDisabled, lists.ordered.isSelected, lists.unordered.isDisabled, lists.unordered.isSelected, props.lists.ordered, props.lists.unordered]);
-}
-function removeFalse(val) {
-  return val !== false;
-}
-
-const BlockquoteElement = ({
-  attributes,
-  children
-}) => {
-  return /*#__PURE__*/jsxRuntime.jsx("blockquote", {
-    ...attributes,
-    children: children
-  });
-};
-const BlockquoteButton = () => {
-  const {
-    editor: editor$1,
-    blockquote: {
-      isDisabled,
-      isSelected
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-    isSelected: isSelected,
-    isDisabled: isDisabled,
-    onPress: () => {
-      editorShared.insertBlockquote(editor$1);
-      slateReact.ReactEditor.focus(editor$1);
-    },
-    children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: quoteIcon.quoteIcon
-    })
-  }), [editor$1, isDisabled, isSelected]);
-};
-const blockquoteButton = /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-  children: [/*#__PURE__*/jsxRuntime.jsx(BlockquoteButton, {}), /*#__PURE__*/jsxRuntime.jsxs(tooltip.Tooltip, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-      children: "\u5F15\u7528"
-    }), /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-      children: '>⎵'
-    })]
-  })]
-});
-
-function CodeButton() {
-  const {
-    editor: editor$1,
-    code: {
-      isDisabled,
-      isSelected
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-    isSelected: isSelected,
-    isDisabled: isDisabled,
-    onPress: () => {
-      if (isSelected) {
-        slate.Transforms.unwrapNodes(editor$1, {
-          match: node => node.type === 'code'
-        });
-      } else {
-        slate.Transforms.wrapNodes(editor$1, {
-          type: 'code',
-          children: [{
-            text: ''
-          }]
-        });
-      }
-      slateReact.ReactEditor.focus(editor$1);
-    },
-    children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: codeIcon.codeIcon
-    })
-  }), [isDisabled, isSelected, editor$1]);
-}
-const codeButton = /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-  children: [/*#__PURE__*/jsxRuntime.jsx(CodeButton, {}), /*#__PURE__*/jsxRuntime.jsxs(tooltip.Tooltip, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-      children: "\u4EE3\u7801\u5757"
-    }), /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-      children: "```"
-    })]
-  })]
-});
-
-const values = {
-  start: {
-    key: 'start',
-    label: '左对齐',
-    icon: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: alignLeftIcon.alignLeftIcon
-    })
-  },
-  center: {
-    key: 'center',
-    label: '居中对齐',
-    icon: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: alignCenterIcon.alignCenterIcon
-    })
-  },
-  end: {
-    key: 'end',
-    label: '右对齐',
-    icon: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: alignRightIcon.alignRightIcon
-    })
-  }
-};
-const TextAlignMenu = ({
-  alignment
-}) => {
-  const toolbarState$1 = toolbarState.useToolbarState();
-  const items = React.useMemo(() => [values.start, ...Object.keys(alignment).map(x => values[x])], [alignment]);
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsxs(menu.MenuTrigger, {
-    children: [/*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-      children: [/*#__PURE__*/jsxRuntime.jsxs(editor.EditorToolbarButton, {
-        children: [values[toolbarState$1.alignment.selected].icon, /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-          src: chevronDownIcon.chevronDownIcon
-        })]
-      }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-        children: /*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-          children: "\u6587\u672C\u5BF9\u9F50"
-        })
-      })]
-    }), /*#__PURE__*/jsxRuntime.jsx(menu.Menu, {
-      selectionMode: "single",
-      selectedKeys: [toolbarState$1.alignment.selected],
-      items: items,
-      onAction: key => {
-        if (key === 'start') {
-          slate.Transforms.unsetNodes(toolbarState$1.editor, 'textAlign', {
-            match: node => node.type === 'paragraph' || node.type === 'heading'
-          });
-        } else {
-          slate.Transforms.setNodes(toolbarState$1.editor, {
-            textAlign: key
-          }, {
-            match: node => node.type === 'paragraph' || node.type === 'heading'
-          });
-        }
-        slateReact.ReactEditor.focus(toolbarState$1.editor);
-      },
-      children: item => {
-        return /*#__PURE__*/jsxRuntime.jsxs(tag.Item, {
-          textValue: item.label,
-          children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-            children: item.label
-          }), item.icon]
-        }, item.key);
-      }
-    })]
-  }), [items, toolbarState$1.alignment.selected, toolbarState$1.editor]);
-};
-
-const DividerButtonInner = () => {
-  const {
-    editor: editor$1,
-    dividers: {
-      isDisabled
-    }
-  } = toolbarState.useToolbarState();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-    isDisabled: isDisabled,
-    isSelected: false,
-    onPress: () => {
-      editorShared.insertDivider(editor$1);
-    },
-    children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-      src: minusIcon.minusIcon
-    })
-  }), [editor$1, isDisabled]);
-};
-const DividerButton = /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-  delay: 200,
-  children: [/*#__PURE__*/jsxRuntime.jsx(DividerButtonInner, {}), /*#__PURE__*/jsxRuntime.jsxs(tooltip.Tooltip, {
-    children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-      children: "\u6DFB\u52A0\u5206\u9694\u7EBF"
-    }), /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-      children: "---"
-    })]
-  })]
-});
-
-function Toolbar({
-  documentFeatures,
-  viewState
-}) {
-  const relationship = React.useContext(toolbarState.DocumentFieldRelationshipsContext);
-  const blockComponent = React.useContext(toolbarState.ComponentBlockContext);
-  const hasBlockItems = Object.entries(relationship).length || Object.keys(blockComponent).length;
-  const hasMarks = Object.values(documentFeatures.formatting.inlineMarks).some(x => x);
-  const hasAlignment = documentFeatures.formatting.alignment.center || documentFeatures.formatting.alignment.end;
-  const hasLists = documentFeatures.formatting.listTypes.unordered || documentFeatures.formatting.listTypes.ordered;
-  return /*#__PURE__*/jsxRuntime.jsxs(ToolbarWrapper, {
-    children: [/*#__PURE__*/jsxRuntime.jsxs(ToolbarScrollArea, {
-      children: [!!documentFeatures.formatting.headingLevels.length && /*#__PURE__*/jsxRuntime.jsx(HeadingMenu, {
-        headingLevels: documentFeatures.formatting.headingLevels
-      }), /*#__PURE__*/jsxRuntime.jsxs(editor.EditorToolbar, {
-        children: [hasMarks && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarSeparator, {}), /*#__PURE__*/jsxRuntime.jsx(InlineMarks, {
-            marks: documentFeatures.formatting.inlineMarks
-          })]
-        }), /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarSeparator, {}), (hasAlignment || hasLists) && /*#__PURE__*/jsxRuntime.jsxs(editor.EditorToolbarGroup, {
-          children: [hasAlignment && /*#__PURE__*/jsxRuntime.jsx(TextAlignMenu, {
-            alignment: documentFeatures.formatting.alignment
-          }), hasLists && /*#__PURE__*/jsxRuntime.jsx(ListButtons, {
-            lists: documentFeatures.formatting.listTypes
-          })]
-        }), /*#__PURE__*/jsxRuntime.jsxs(editor.EditorToolbarGroup, {
-          children: [documentFeatures.dividers && DividerButton, documentFeatures.links && linkButton, documentFeatures.formatting.blockTypes.blockquote && blockquoteButton, !!documentFeatures.layouts.length && /*#__PURE__*/jsxRuntime.jsx(layouts.LayoutsButton, {
-            layouts: documentFeatures.layouts
-          }), documentFeatures.formatting.blockTypes.code && codeButton]
-        }), React.useMemo(() => {
-          return viewState && /*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarGroup, {
-            children: /*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-              children: [/*#__PURE__*/jsxRuntime.jsx(editor.EditorToolbarButton, {
-                isSelected: viewState.expanded,
-                onPress: () => {
-                  viewState.toggle();
-                },
-                children: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-                  src: viewState.expanded ? minimizeIcon.minimizeIcon : maximizeIcon.maximizeIcon
-                })
-              }), /*#__PURE__*/jsxRuntime.jsx(tooltip.Tooltip, {
-                children: viewState.expanded ? '折叠' : '展开'
-              })]
-            })
-          });
-        }, [viewState])]
-      })]
-    }), !!hasBlockItems && /*#__PURE__*/jsxRuntime.jsx(InsertBlockMenu, {})]
-  });
-}
-const headingMenuVals = new Map([['normal', 'normal'], ['1', 1], ['2', 2], ['3', 3], ['4', 4], ['5', 5], ['6', 6]]);
-const HeadingMenu = ({
-  headingLevels
-}) => {
-  const {
-    editor,
-    textStyles
-  } = toolbarState.useToolbarState();
-  const isDisabled = textStyles.allowedHeadingLevels.length === 0;
-  const items = React.useMemo(() => {
-    let resolvedItems = [{
-      name: '段落',
-      id: 'normal'
-    }];
-    headingLevels.forEach(level => {
-      resolvedItems.push({
-        name: `标题 ${level}`,
-        id: level.toString()
-      });
-    });
-    return resolvedItems;
-  }, [headingLevels]);
-  const selected = textStyles.selected.toString();
-  return React.useMemo(() => /*#__PURE__*/jsxRuntime.jsx(picker.Picker, {
-    flexShrink: 0,
-    width: "scale.1700",
-    prominence: "low",
-    items: items,
-    isDisabled: isDisabled,
-    selectedKey: selected,
-    onSelectionChange: selected => {
-      let key = headingMenuVals.get(selected);
-      if (key === 'normal') {
-        slate.Editor.withoutNormalizing(editor, () => {
-          slate.Transforms.unsetNodes(editor, 'level', {
-            match: n => n.type === 'heading'
-          });
-          slate.Transforms.setNodes(editor, {
-            type: 'paragraph'
-          }, {
-            match: n => n.type === 'heading'
-          });
-        });
-      } else if (key) {
-        slate.Transforms.setNodes(editor, {
-          type: 'heading',
-          level: key
-        }, {
-          match: node => node.type === 'paragraph' || node.type === 'heading'
-        });
-      }
-      slateReact.ReactEditor.focus(editor);
-    },
-    children: item => /*#__PURE__*/jsxRuntime.jsx(picker.Item, {
-      children: item.name
-    }, item.id)
-  }), [editor, isDisabled, items, selected]);
-};
-function InsertBlockMenu() {
-  const editor = slateReact.useSlateStatic();
-  const componentBlocks = React.useContext(toolbarState.ComponentBlockContext);
-  return /*#__PURE__*/jsxRuntime.jsxs(menu.MenuTrigger, {
-    align: "end",
-    children: [/*#__PURE__*/jsxRuntime.jsxs(tooltip.TooltipTrigger, {
-      children: [/*#__PURE__*/jsxRuntime.jsxs(button.ActionButton, {
-        marginY: "regular",
-        marginEnd: "medium",
-        children: [/*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-          src: plusIcon.plusIcon
-        }), /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-          src: chevronDownIcon.chevronDownIcon
-        })]
-      }), /*#__PURE__*/jsxRuntime.jsxs(tooltip.Tooltip, {
-        children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-          children: "Insert"
-        }), /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-          children: "/"
-        })]
-      })]
-    }), /*#__PURE__*/jsxRuntime.jsx(menu.Menu, {
-      onAction: key => {
-        toolbarState.insertComponentBlock(editor, componentBlocks, key);
-      },
-      items: Object.entries(componentBlocks),
-      children: ([key, item]) => /*#__PURE__*/jsxRuntime.jsx(picker.Item, {
-        children: item.label
-      }, key)
-    })]
-  });
-}
-const inlineMarks = [{
-  key: 'bold',
-  label: 'Bold',
-  icon: boldIcon.boldIcon,
-  shortcut: `B`
-}, {
-  key: 'italic',
-  label: 'Italic',
-  icon: italicIcon.italicIcon,
-  shortcut: `I`
-}, {
-  key: 'underline',
-  label: 'Underline',
-  icon: underlineIcon.underlineIcon,
-  shortcut: `U`
-}, {
-  key: 'strikethrough',
-  label: 'Strikethrough',
-  icon: strikethroughIcon.strikethroughIcon
-}, {
-  key: 'code',
-  label: 'Code',
-  icon: codeIcon.codeIcon
-}, {
-  key: 'superscript',
-  label: 'Superscript',
-  icon: superscriptIcon.superscriptIcon
-}, {
-  key: 'subscript',
-  label: 'Subscript',
-  icon: subscriptIcon.subscriptIcon
-}, {
-  key: 'clearFormatting',
-  label: 'Clear formatting',
-  icon: removeFormattingIcon.removeFormattingIcon
-}];
-function InlineMarks({
-  marks: _marksShown
-}) {
-  const {
-    editor,
-    clearFormatting: {
-      isDisabled
-    },
-    marks
-  } = toolbarState.useToolbarState();
-  const marksShown = useMemoStringified(_marksShown);
-  const selectedKeys = useMemoStringified(Object.keys(marks).filter(key => marks[key].isSelected));
-  const disabledKeys = useMemoStringified(Object.keys(marks).filter(key => marks[key].isDisabled).concat(isDisabled ? 'clearFormatting' : []));
-  return React.useMemo(() => {
-    const items = inlineMarks.filter(item => item.key === 'clearFormatting' || marksShown[item.key]);
-    return /*#__PURE__*/jsxRuntime.jsx(actionGroup.ActionGroup, {
-      UNSAFE_className: style.css({
-        minWidth: `calc(${style.tokenSchema.size.element.medium} * 4)`
-      }),
-      prominence: "low",
-      density: "compact",
-      buttonLabelBehavior: "hide",
-      overflowMode: "collapse",
-      summaryIcon: /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-        src: typeIcon.typeIcon
-      }),
-      items: items,
-      selectionMode: "multiple",
-      selectedKeys: selectedKeys,
-      disabledKeys: disabledKeys,
-      onAction: key => {
-        if (key === 'clearFormatting') {
-          utils.clearFormatting(editor);
-        } else {
-          var _Editor$marks;
-          const mark = key;
-          if ((_Editor$marks = slate.Editor.marks(editor)) !== null && _Editor$marks !== void 0 && _Editor$marks[mark]) {
-            slate.Editor.removeMark(editor, mark);
-          } else {
-            slate.Editor.addMark(editor, mark, true);
-          }
-        }
-        slateReact.ReactEditor.focus(editor);
-      },
-      children: item => {
-        return /*#__PURE__*/jsxRuntime.jsxs(picker.Item, {
-          textValue: item.label,
-          children: [/*#__PURE__*/jsxRuntime.jsx(typography.Text, {
-            children: item.label
-          }), 'shortcut' in item && /*#__PURE__*/jsxRuntime.jsx(typography.Kbd, {
-            meta: true,
-            children: item.shortcut
-          }), /*#__PURE__*/jsxRuntime.jsx(icon.Icon, {
-            src: item.icon
-          })]
-        }, item.key);
-      }
-    });
-  }, [disabledKeys, editor, marksShown, selectedKeys]);
-}
-function useMemoStringified(value) {
-  return React.useMemo(() => value, [JSON.stringify(value)]);
-}
-function useEntryLayoutSplitPaneContext() {
-  return null;
-}
-const ToolbarContainer = ({
-  children
-}) => {
-  return /*#__PURE__*/jsxRuntime.jsx("div", {
-    className: style.css({
-      display: 'flex'
-    }),
-    children: children
-  });
-};
-const ToolbarWrapper = ({
-  children
-}) => {
-  let entryLayoutPane = useEntryLayoutSplitPaneContext();
-  return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-    children: /*#__PURE__*/jsxRuntime.jsx("div", {
-      "data-layout": entryLayoutPane,
-      className: style.css({
-        backdropFilter: 'blur(8px)',
-        backgroundClip: 'padding-box',
-        backgroundColor: `color-mix(in srgb, transparent, ${style.tokenSchema.color.background.canvas} 90%)`,
-        borderBottom: `${style.tokenSchema.size.border.regular} solid color-mix(in srgb, transparent, ${style.tokenSchema.color.foreground.neutral} 10%)`,
-        borderStartEndRadius: style.tokenSchema.size.radius.medium,
-        borderStartStartRadius: style.tokenSchema.size.radius.medium,
-        minWidth: 0,
-        position: 'sticky',
-        top: 0,
-        zIndex: 2,
-        '&[data-layout="main"]': {
-          borderRadius: 0
-        }
-      }),
-      children: /*#__PURE__*/jsxRuntime.jsx(ToolbarContainer, {
-        children: children
-      })
-    })
-  });
-};
-const ToolbarScrollArea = props => {
-  let entryLayoutPane = useEntryLayoutSplitPaneContext();
-  return /*#__PURE__*/jsxRuntime.jsx(layout.Flex, {
-    "data-layout": entryLayoutPane,
-    paddingY: "regular",
-    paddingX: "medium",
-    gap: "large",
-    flex: true,
-    minWidth: 0,
-    UNSAFE_className: style.css({
-      msOverflowStyle: 'none' /* for Internet Explorer, Edge */,
-      scrollbarWidth: 'none' /* for Firefox */,
-      overflowX: 'auto',
-      /* for Chrome, Safari, and Opera */
-      '&::-webkit-scrollbar': {
-        display: 'none'
-      },
-      '&[data-layout="main"]': {
-        paddingInline: 0
-      }
-    }),
-    ...props
-  });
-};
-
-function HeadingElement({
-  attributes,
-  children,
-  element
-}) {
-  const Tag = `h${element.level}`;
-  return /*#__PURE__*/jsxRuntime.jsx(Tag, {
-    ...attributes,
-    style: {
-      textAlign: element.textAlign
-    },
-    children: children
-  });
-}
-
-const renderElement = props => {
-  switch (props.element.type) {
-    case 'layout':
-      return /*#__PURE__*/jsxRuntime.jsx(layouts.LayoutContainer, {
-        attributes: props.attributes,
-        children: props.children,
-        element: props.element
-      });
-    case 'layout-area':
-      return /*#__PURE__*/jsxRuntime.jsx(layouts.LayoutArea, {
-        ...props
-      });
-    case 'code':
-      return /*#__PURE__*/jsxRuntime.jsx(CodeElement, {
-        ...props
-      });
-    case 'component-block':
-      {
-        return /*#__PURE__*/jsxRuntime.jsx(toolbarState.ComponentBlocksElement, {
-          attributes: props.attributes,
-          children: props.children,
-          element: props.element
-        });
-      }
-    case 'component-inline-prop':
-    case 'component-block-prop':
-      return /*#__PURE__*/jsxRuntime.jsx(toolbarState.ComponentInlineProp, {
-        ...props
-      });
-    case 'heading':
-      return /*#__PURE__*/jsxRuntime.jsx(HeadingElement, {
-        attributes: props.attributes,
-        children: props.children,
-        element: props.element
-      });
-    case 'link':
-      return /*#__PURE__*/jsxRuntime.jsx(LinkElement, {
-        attributes: props.attributes,
-        children: props.children,
-        element: props.element
-      });
-    case 'ordered-list':
-      return /*#__PURE__*/jsxRuntime.jsx("ol", {
-        ...props.attributes,
-        children: props.children
-      });
-    case 'unordered-list':
-      return /*#__PURE__*/jsxRuntime.jsx("ul", {
-        ...props.attributes,
-        children: props.children
-      });
-    case 'list-item':
-      return /*#__PURE__*/jsxRuntime.jsx("li", {
-        ...props.attributes,
-        children: props.children
-      });
-    case 'list-item-content':
-      return /*#__PURE__*/jsxRuntime.jsx("span", {
-        ...props.attributes,
-        children: props.children
-      });
-    case 'blockquote':
-      return /*#__PURE__*/jsxRuntime.jsx(BlockquoteElement, {
-        ...props
-      });
-    case 'relationship':
-      return /*#__PURE__*/jsxRuntime.jsx(toolbarState.RelationshipElement, {
-        attributes: props.attributes,
-        children: props.children,
-        element: props.element
-      });
-    case 'divider':
-      return /*#__PURE__*/jsxRuntime.jsx(DividerElement, {
-        ...props
-      });
-    default:
-      return /*#__PURE__*/jsxRuntime.jsx("p", {
-        style: {
-          textAlign: props.element.textAlign
-        },
-        ...props.attributes,
-        children: props.children
-      });
-  }
-};
-
-/* Block Elements */
-
-const CodeElement = ({
-  attributes,
-  children
-}) => {
-  return /*#__PURE__*/jsxRuntime.jsx("pre", {
-    spellCheck: "false",
-    ...attributes,
-    children: /*#__PURE__*/jsxRuntime.jsx("code", {
-      children: children
-    })
-  });
-};
-function DividerElement({
-  attributes,
-  children
-}) {
-  const selected = slateReact.useSelected();
-  return /*#__PURE__*/jsxRuntime.jsxs("div", {
-    ...attributes,
-    style: {
-      caretColor: 'transparent'
-    },
-    children: [/*#__PURE__*/jsxRuntime.jsx("hr", {
-      style: {
-        backgroundColor: selected ? style.tokenSchema.color.alias.borderSelected : style.tokenSchema.color.alias.borderIdle
-      }
-    }), children]
-  });
-}
-
-function getOptions(toolbarState$1, componentBlocks, relationships) {
-  const options = [...Object.entries(relationships).map(([relationship, {
-    label
-  }]) => ({
-    label,
-    insert: editor => {
-      slate.Transforms.insertNodes(editor, {
-        type: 'relationship',
-        relationship,
-        data: null,
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  })), ...Object.keys(componentBlocks).map(key => ({
-    label: componentBlocks[key].label,
-    insert: editor => {
-      toolbarState.insertComponentBlock(editor, componentBlocks, key);
-    }
-  })), ...toolbarState$1.textStyles.allowedHeadingLevels.filter(a => toolbarState$1.editorDocumentFeatures.formatting.headingLevels.includes(a)).map(level => ({
-    label: `Heading ${level}`,
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'heading',
-        level,
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  })), !toolbarState$1.blockquote.isDisabled && toolbarState$1.editorDocumentFeatures.formatting.blockTypes.blockquote && {
-    label: 'Blockquote',
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'blockquote',
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  }, !toolbarState$1.code.isDisabled && toolbarState$1.editorDocumentFeatures.formatting.blockTypes.code && {
-    label: 'Code block',
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'code',
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  }, !toolbarState$1.dividers.isDisabled && toolbarState$1.editorDocumentFeatures.dividers && {
-    label: 'Divider',
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'divider',
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  }, !!toolbarState$1.editorDocumentFeatures.layouts.length && {
-    label: 'Layout',
-    insert(editor) {
-      shared.insertLayout(editor, toolbarState$1.editorDocumentFeatures.layouts[0]);
-    }
-  }, !toolbarState$1.lists.ordered.isDisabled && toolbarState$1.editorDocumentFeatures.formatting.listTypes.ordered && {
-    label: 'Numbered List',
-    keywords: ['ordered list'],
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'ordered-list',
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  }, !toolbarState$1.lists.unordered.isDisabled && toolbarState$1.editorDocumentFeatures.formatting.listTypes.unordered && {
-    label: 'Bullet List',
-    keywords: ['unordered list'],
-    insert(editor) {
-      utils.insertNodesButReplaceIfSelectionIsAtEmptyParagraphOrHeading(editor, {
-        type: 'unordered-list',
-        children: [{
-          text: ''
-        }]
-      });
-    }
-  }];
-  return options.filter(x => typeof x !== 'boolean');
-}
-function insertOption(editor, text, option) {
-  const path = slateReact.ReactEditor.findPath(editor, text);
-  slate.Transforms.delete(editor, {
-    at: {
-      focus: slate.Editor.start(editor, path),
-      anchor: slate.Editor.end(editor, path)
-    }
-  });
-  option.insert(editor);
-}
-function InsertMenu({
-  children,
-  text
-}) {
-  const toolbarState$1 = toolbarState.useToolbarState();
-  const {
-    editor
-  } = toolbarState$1;
-  const componentBlocks = React.useContext(toolbarState.ComponentBlockContext);
-  const relationships = toolbarState.useDocumentFieldRelationships();
-  const options = matchSorter.matchSorter(getOptions(toolbarState$1, componentBlocks, relationships), text.text.slice(1), {
-    keys: ['label', 'keywords']
-  }).map((option, index) => ({
-    ...option,
-    index
-  }));
-  const stateRef = React.useRef({
-    options,
-    text
-  });
-  React.useEffect(() => {
-    stateRef.current = {
-      options,
-      text
-    };
-  });
-  const listenerRef = React.useRef(_event => {});
-  React.useEffect(() => {
-    listenerRef.current = event => {
-      if (event.defaultPrevented) return;
-      switch (event.key) {
-        case 'ArrowDown':
-          {
-            if (stateRef.current.options.length) {
-              event.preventDefault();
-              state.selectionManager.setFocused(true);
-              state.selectionManager.setFocusedKey((Number(state.selectionManager.focusedKey) === stateRef.current.options.length - 1 ? 0 : Number(state.selectionManager.focusedKey) + 1).toString());
-            }
-            return;
-          }
-        case 'ArrowUp':
-          {
-            if (stateRef.current.options.length) {
-              event.preventDefault();
-              state.selectionManager.setFocused(true);
-              state.selectionManager.setFocusedKey((state.selectionManager.focusedKey === '0' ? stateRef.current.options.length - 1 : Number(state.selectionManager.focusedKey) - 1).toString());
-            }
-            return;
-          }
-        case 'Enter':
-          {
-            const option = stateRef.current.options[Number(state.selectionManager.focusedKey)];
-            if (option) {
-              insertOption(editor, stateRef.current.text, option);
-              event.preventDefault();
-            }
-            return;
-          }
-        case 'Escape':
-          {
-            const path = slateReact.ReactEditor.findPath(editor, stateRef.current.text);
-            slate.Transforms.unsetNodes(editor, 'insertMenu', {
-              at: path
-            });
-            event.preventDefault();
-            return;
-          }
-      }
-    };
-  });
-  React.useEffect(() => {
-    const domNode = slateReact.ReactEditor.toDOMNode(editor, editor);
-    let listener = event => listenerRef.current(event);
-    domNode.addEventListener('keydown', listener);
-    return () => {
-      domNode.removeEventListener('keydown', listener);
-    };
-  }, [editor]);
-  const triggerRef = React.useRef(null);
-  const overlayState = overlays.useOverlayTriggerState({
-    isOpen: true
-  });
-  const {
-    triggerProps: {
-      onPress,
-      ...triggerProps
-    },
-    overlayProps
-  } = overlays$1.useOverlayTrigger({
-    type: 'listbox'
-  }, overlayState, triggerRef);
-  let state = list.useListState({
-    items: options,
-    children: item => /*#__PURE__*/jsxRuntime.jsx(listbox.Item, {
-      children: item.label
-    }, item.index)
-  });
-  React.useEffect(() => {
-    if (!state.selectionManager.isFocused && state.collection.size) {
-      state.selectionManager.setFocused(true);
-      state.selectionManager.setFocusedKey('0');
-    }
-  }, [state]);
-  const scrollableRef = React.useRef(null);
-  React.useEffect(() => {
-    var _scrollableRef$curren;
-    const element = (_scrollableRef$curren = scrollableRef.current) === null || _scrollableRef$curren === void 0 || (_scrollableRef$curren = _scrollableRef$curren.querySelector('[role="listbox"] [role="presentation"]')) === null || _scrollableRef$curren === void 0 ? void 0 : _scrollableRef$curren.children[state.selectionManager.focusedKey];
-    if (element) {
-      scrollIntoView__default["default"](element, {
-        scrollMode: 'if-needed',
-        boundary: scrollableRef.current,
-        block: 'nearest'
-      });
-    }
-  }, [state.selectionManager.focusedKey]);
-  const listboxRef = React.useRef(null);
-  let layout = listbox.useListBoxLayout();
-  return /*#__PURE__*/jsxRuntime.jsxs(React.Fragment, {
-    children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-      ...triggerProps,
-      role: "button",
-      className: style.css({
-        color: style.tokenSchema.color.foreground.accent,
-        fontWeight: style.tokenSchema.typography.fontWeight.medium
-      }),
-      ref: triggerRef,
-      children: children
-    }), /*#__PURE__*/jsxRuntime.jsx(overlays$2.Popover, {
-      width: "alias.singleLineWidth",
-      placement: "bottom start",
-      isNonModal: true,
-      hideArrow: true,
-      ...overlayProps,
-      state: overlayState,
-      triggerRef: triggerRef,
-      children: /*#__PURE__*/jsxRuntime.jsx("div", {
-        className: style.css({
-          overflow: 'scroll',
-          maxHeight: 300
-        }),
-        ref: scrollableRef,
-        children: /*#__PURE__*/jsxRuntime.jsx(listbox.ListBoxBase, {
-          state: state,
-          shouldUseVirtualFocus: true,
-          layout: layout,
-          ref: listboxRef,
-          onAction: key => {
-            insertOption(editor, text, options[key]);
-          }
-        })
-      })
-    })]
-  });
-}
-
-function Placeholder({
-  placeholder,
-  children
-}) {
-  const [width, setWidth] = React.useState(0);
-  return /*#__PURE__*/jsxRuntime.jsxs("span", {
-    className: style.css({
-      position: 'relative',
-      display: 'inline-block',
-      width
-    }),
-    children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-      contentEditable: false,
-      className: style.css({
-        position: 'absolute',
-        pointerEvents: 'none',
-        display: 'inline-block',
-        left: 0,
-        top: 0,
-        maxWidth: '100%',
-        whiteSpace: 'nowrap',
-        opacity: '0.5',
-        userSelect: 'none',
-        fontStyle: 'normal',
-        fontWeight: 'normal',
-        textDecoration: 'none',
-        textAlign: 'left'
-      }),
-      children: /*#__PURE__*/jsxRuntime.jsx("span", {
-        ref: node => {
-          if (node) {
-            const offsetWidth = node.offsetWidth;
-            if (offsetWidth !== width) {
-              setWidth(offsetWidth);
-            }
-          }
-        },
-        children: placeholder
-      })
-    }), children]
-  });
-}
-const Leaf = ({
-  leaf,
-  text,
-  children,
-  attributes
-}) => {
-  const {
-    underline,
-    strikethrough,
-    bold,
-    italic,
-    code,
-    keyboard,
-    superscript,
-    subscript,
-    placeholder,
-    insertMenu
-  } = leaf;
-  if (placeholder !== undefined) {
-    children = /*#__PURE__*/jsxRuntime.jsx(Placeholder, {
-      placeholder: placeholder,
-      children: children
-    });
-  }
-  if (insertMenu) {
-    children = /*#__PURE__*/jsxRuntime.jsx(InsertMenu, {
-      text: text,
-      children: children
-    });
-  }
-  if (code) {
-    children = /*#__PURE__*/jsxRuntime.jsx("code", {
-      children: children
-    });
-  }
-  if (bold) {
-    children = /*#__PURE__*/jsxRuntime.jsx("strong", {
-      children: children
-    });
-  }
-  if (strikethrough) {
-    children = /*#__PURE__*/jsxRuntime.jsx("s", {
-      children: children
-    });
-  }
-  if (italic) {
-    children = /*#__PURE__*/jsxRuntime.jsx("em", {
-      children: children
-    });
-  }
-  if (keyboard) {
-    children = /*#__PURE__*/jsxRuntime.jsx("kbd", {
-      children: children
-    });
-  }
-  if (superscript) {
-    children = /*#__PURE__*/jsxRuntime.jsx("sup", {
-      children: children
-    });
-  }
-  if (subscript) {
-    children = /*#__PURE__*/jsxRuntime.jsx("sub", {
-      children: children
-    });
-  }
-  if (underline) {
-    children = /*#__PURE__*/jsxRuntime.jsx("u", {
-      children: children
-    });
-  }
-  return /*#__PURE__*/jsxRuntime.jsx("span", {
-    ...attributes,
-    children: children
-  });
-};
-const renderLeaf = props => {
-  return /*#__PURE__*/jsxRuntime.jsx(Leaf, {
-    ...props
-  });
-};
-
-const styles = style.css({
-  flex: 1,
-  background: style.tokenSchema.color.background.canvas,
-  borderColor: style.tokenSchema.color.alias.borderIdle,
-  outline: 0,
-  padding: style.tokenSchema.size.space.medium,
-  minHeight: 120,
-  scrollbarGutter: 'stable',
-  overflowY: 'auto',
-  height: 224,
-  resize: 'vertical',
-  borderBottomLeftRadius: style.tokenSchema.size.radius.medium,
-  borderBottomRightRadius: style.tokenSchema.size.radius.medium,
-  '&[data-expanded=true]': {
-    // the !important is necessary to override the height set by resizing as an inline style
-    height: 'auto !important',
-    resize: 'none'
-  },
-  'ol ol ol ol ol ol ol ol ol': {
-    listStyle: 'lower-roman'
-  },
-  'ol ol ol ol ol ol ol ol': {
-    listStyle: 'lower-alpha'
-  },
-  'ol ol ol ol ol ol ol': {
-    listStyle: 'decimal'
-  },
-  'ol ol ol ol ol ol': {
-    listStyle: 'lower-roman'
-  },
-  'ol ol ol ol ol': {
-    listStyle: 'lower-alpha'
-  },
-  'ol ol ol ol': {
-    listStyle: 'decimal'
-  },
-  'ol ol ol': {
-    listStyle: 'lower-roman'
-  },
-  'ol ol': {
-    listStyle: 'lower-alpha'
-  },
-  ol: {
-    listStyle: 'decimal'
-  },
-  'ul ul ul ul ul ul ul ul ul': {
-    listStyle: 'square'
-  },
-  'ul ul ul ul ul ul ul ul': {
-    listStyle: 'circle'
-  },
-  'ul ul ul ul ul ul ul': {
-    listStyle: 'disc'
-  },
-  'ul ul ul ul ul ul': {
-    listStyle: 'square'
-  },
-  'ul ul ul ul ul': {
-    listStyle: 'circle'
-  },
-  'ul ul ul ul': {
-    listStyle: 'disc'
-  },
-  'ul ul ul': {
-    listStyle: 'square'
-  },
-  'ul ul': {
-    listStyle: 'circle'
-  },
-  ul: {
-    listStyle: 'disc'
-  }
-});
-const HOTKEYS = {
-  'mod+b': 'bold',
-  'mod+i': 'italic',
-  'mod+u': 'underline'
-};
-function isMarkActive(editor, mark) {
-  const marks = slate.Editor.marks(editor);
-  if (marks !== null && marks !== void 0 && marks[mark]) {
-    return true;
-  }
-  // see the stuff about marks in toolbar-state for why this is here
-  for (const entry of slate.Editor.nodes(editor, {
-    match: slate.Text.isText
-  })) {
-    if (entry[0][mark]) {
-      return true;
-    }
-  }
-  return false;
-}
-const getKeyDownHandler = editor => event => {
-  if (event.defaultPrevented) return;
-  for (const hotkey in HOTKEYS) {
-    if (isHotkey__default["default"](hotkey, event.nativeEvent)) {
-      event.preventDefault();
-      const mark = HOTKEYS[hotkey];
-      const isActive = isMarkActive(editor, mark);
-      if (isActive) {
-        slate.Editor.removeMark(editor, mark);
-      } else {
-        slate.Editor.addMark(editor, mark, true);
-      }
-      return;
-    }
-  }
-  if (isHotkey__default["default"]('mod+\\', event.nativeEvent)) {
-    utils.clearFormatting(editor);
-    return;
-  }
-  if (isHotkey__default["default"]('mod+k', event.nativeEvent)) {
-    event.preventDefault();
-    editorShared.wrapLink(editor, '');
-    return;
-  }
-  if (event.key === 'Tab') {
-    const didAction = event.shiftKey ? shared.unnestList(editor) : shared.nestList(editor);
-    if (didAction) {
-      event.preventDefault();
-      return;
-    }
-  }
-  if (event.key === 'Tab' && editor.selection) {
-    const layoutArea = slate.Editor.above(editor, {
-      match: node => node.type === 'layout-area'
-    });
-    if (layoutArea) {
-      const layoutAreaToEnter = event.shiftKey ? slate.Editor.before(editor, layoutArea[1], {
-        unit: 'block'
-      }) : slate.Editor.after(editor, layoutArea[1], {
-        unit: 'block'
-      });
-      slate.Transforms.setSelection(editor, {
-        anchor: layoutAreaToEnter,
-        focus: layoutAreaToEnter
-      });
-      event.preventDefault();
-    }
-  }
-};
-function DocumentEditor({
-  onChange,
-  value,
-  componentBlocks,
-  relationships,
-  documentFeatures,
-  initialExpanded = true,
-  ...props
-}) {
-  const [expanded, setExpanded] = React.useState(initialExpanded);
-  const editor = React.useMemo(() => editorShared.createDocumentEditor(documentFeatures, componentBlocks, relationships, {
-    ReactEditor: slateReact.ReactEditor,
-    withReact: slateReact.withReact
-  }), [documentFeatures, componentBlocks, relationships]);
-  return /*#__PURE__*/jsxRuntime.jsx(core.KeystarProvider, {
-    children: /*#__PURE__*/jsxRuntime.jsx("div", {
-      className: style.css({
-        border: `${style.tokenSchema.size.border.regular} solid ${style.tokenSchema.color.border.neutral}`,
-        borderRadius: style.tokenSchema.size.radius.medium
-      }),
-      children: /*#__PURE__*/jsxRuntime.jsxs(DocumentEditorProvider, {
-        componentBlocks: componentBlocks,
-        documentFeatures: documentFeatures,
-        relationships: relationships,
-        editor: editor,
-        value: value,
-        onChange: value => {
-          onChange === null || onChange === void 0 || onChange(value);
-          // this fixes a strange issue in Safari where the selection stays inside of the editor
-          // after a blur event happens but the selection is still in the editor
-          // so the cursor is visually in the wrong place and it inserts text backwards
-          const selection = window.getSelection();
-          if (selection && !slateReact.ReactEditor.isFocused(editor)) {
-            const editorNode = slateReact.ReactEditor.toDOMNode(editor, editor);
-            if (selection.anchorNode === editorNode) {
-              slateReact.ReactEditor.focus(editor);
-            }
-          }
-        },
-        children: [React.useMemo(() => onChange !== undefined && /*#__PURE__*/jsxRuntime.jsx(Toolbar, {
-          documentFeatures: documentFeatures,
-          viewState: {
-            expanded,
-            toggle: () => {
-              setExpanded(v => !v);
-            }
-          }
-        }), [expanded, documentFeatures, onChange]), /*#__PURE__*/jsxRuntime.jsx(typography.Prose, {
-          size: "regular",
-          children: /*#__PURE__*/jsxRuntime.jsx(DocumentEditorEditable, {
-            "data-expanded": expanded,
-            ...props,
-            readOnly: onChange === undefined
-          })
-        })]
-      })
-    })
-  });
-}
-function DocumentEditorProvider({
-  children,
-  editor,
-  onChange,
-  value,
-  componentBlocks,
-  documentFeatures,
-  relationships
-}) {
-  const identity = React.useMemo(() => Math.random().toString(36), [editor]);
-  return /*#__PURE__*/jsxRuntime.jsx(slateReact.Slate
-  // this fixes issues with Slate crashing when a fast refresh occcurs
-  , {
-    editor: editor,
-    initialValue: value,
-    onChange: value => {
-      onChange(value);
-      // this fixes a strange issue in Safari where the selection stays inside of the editor
-      // after a blur event happens but the selection is still in the editor
-      // so the cursor is visually in the wrong place and it inserts text backwards
-      const selection = window.getSelection();
-      if (selection && !slateReact.ReactEditor.isFocused(editor)) {
-        const editorNode = slateReact.ReactEditor.toDOMNode(editor, editor);
-        if (selection.anchorNode === editorNode) {
-          slateReact.ReactEditor.focus(editor);
-        }
-      }
-    },
-    children: /*#__PURE__*/jsxRuntime.jsx(toolbarState.ToolbarStateProvider, {
-      componentBlocks: componentBlocks,
-      editorDocumentFeatures: documentFeatures,
-      relationships: relationships,
-      children: children
-    })
-  }, identity);
-}
-function DocumentEditorEditable(props) {
-  var _props$className;
-  const editor = slateReact.useSlate();
-  const componentBlocks = React.useContext(toolbarState.ComponentBlockContext);
-  const onKeyDown = React.useMemo(() => getKeyDownHandler(editor), [editor]);
-  return /*#__PURE__*/jsxRuntime.jsx(toolbarState.ActiveBlockPopoverProvider, {
-    editor: editor,
-    children: /*#__PURE__*/jsxRuntime.jsx(slateReact.Editable, {
-      decorate: React.useCallback(([node, path]) => {
-        const decorations = [];
-        if (node.type === 'component-block') {
-          if (node.children.length === 1 && slate.Element.isElement(node.children[0]) && node.children[0].type === 'component-inline-prop' && node.children[0].propPath === undefined) {
-            return decorations;
-          }
-          node.children.forEach((child, index) => {
-            if (slate.Node.string(child) === '' && slate.Element.isElement(child) && (child.type === 'component-block-prop' || child.type === 'component-inline-prop') && child.propPath !== undefined) {
-              const start = slate.Editor.start(editor, [...path, index]);
-              const placeholder = utils.getPlaceholderTextForPropPath(child.propPath, componentBlocks[node.component].schema, node.props);
-              if (placeholder) {
-                decorations.push({
-                  placeholder,
-                  anchor: start,
-                  focus: start
-                });
-              }
-            }
-          });
-        }
-        return decorations;
-      }, [editor, componentBlocks]),
-      className: `${styles} ${(_props$className = props.className) !== null && _props$className !== void 0 ? _props$className : ''}`,
-      onKeyDown: onKeyDown,
-      renderElement: renderElement,
-      renderLeaf: renderLeaf,
-      ...props
-    })
-  });
-}
-
-// Field 组件用于在编辑视图中显示字段值
-function Field(props) {
-  const {
-    autoFocus,
-    field: field$1,
-    forceValidation,
-    onChange,
-    value
-  } = props;
-  return /*#__PURE__*/jsxRuntime.jsx(field.Field, {
-    label: field$1.label,
-    description: field$1.description,
-    children: inputProps => /*#__PURE__*/jsxRuntime.jsx(toolbarState.ForceValidationProvider, {
-      value: !!forceValidation,
-      children: /*#__PURE__*/jsxRuntime.jsx(DocumentEditor, {
-        ...inputProps,
-        autoFocus: autoFocus,
-        componentBlocks: field$1.componentBlocks,
-        documentFeatures: field$1.documentFeatures,
-        onChange: onChange,
-        relationships: field$1.relationships,
-        value: value
-      })
-    })
-  });
-}
-
-exports["default"] = Field;