vap1 0.0.1

package/deps/_editor/tools/_BlockButton.js

@@ -0,0 +1,77 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BlockButton = exports.TEXT_ALIGN_TYPES = void 0;
+const react_1 = __importDefault(require("react"));
+const slate_react_1 = require("slate-react");
+const Icon_1 = require("../../../components/_adapt/Icon");
+const utils_1 = require("../../../utils");
+const slate_1 = require("slate");
+const LIST_TYPES = ['numberedList', 'bulletedList'];
+exports.TEXT_ALIGN_TYPES = ['left', 'center', 'right', 'justify'];
+const toggleBlock = (editor, format) => {
+    const isActive = isBlockActive(editor, format, exports.TEXT_ALIGN_TYPES.includes(format) ? 'align' : 'type');
+    const isList = LIST_TYPES.includes(format);
+    slate_1.Transforms.unwrapNodes(editor, {
+        match: n => !slate_1.Editor.isEditor(n) &&
+            slate_1.Element.isElement(n) &&
+            LIST_TYPES.includes(n.type) &&
+            !exports.TEXT_ALIGN_TYPES.includes(format),
+        split: true,
+    });
+    let newProperties;
+    if (exports.TEXT_ALIGN_TYPES.includes(format)) {
+        newProperties = {
+            align: isActive ? undefined : format,
+        };
+    }
+    else {
+        newProperties = {
+            type: isActive ? 'paragraph' : isList ? 'list-item' : format,
+        };
+    }
+    slate_1.Transforms.setNodes(editor, newProperties);
+    if (!isActive && isList) {
+        const block = { type: format, children: [] };
+        slate_1.Transforms.wrapNodes(editor, block);
+    }
+};
+const isBlockActive = (editor, format, blockType = 'type') => {
+    const { selection } = editor;
+    if (!selection)
+        return false;
+    const [match] = Array.from(slate_1.Editor.nodes(editor, {
+        at: slate_1.Editor.unhangRange(editor, selection),
+        match: n => !slate_1.Editor.isEditor(n) &&
+            slate_1.Element.isElement(n) &&
+            n[blockType] === format,
+    }));
+    return !!match;
+};
+const BlockButton = ({ icon, ik, cmd, disabled }) => {
+    const editor = (0, slate_react_1.useSlate)();
+    const clazz = ['editor-icon', 'editor-icon-block'];
+    const isActive = isBlockActive(editor, cmd, exports.TEXT_ALIGN_TYPES.includes(cmd) ? 'align' : 'type');
+    if (isActive) {
+        clazz.push('editor-icon-marked');
+    }
+    if (disabled) {
+        clazz.push('editor-icon-disabled');
+    }
+    return react_1.default.createElement(Icon_1.Icon, { className: clazz.join(' '), type: icon, title: utils_1.i18n.txt(ik), onClick: () => toggleBlock(editor, cmd) });
+    // return (
+    //     <Button
+    //         active={ }
+    //         onMouseDown={event => {
+    //             event.preventDefault()
+    //             toggleBlock(editor, cmd)
+    //         }}
+    //     >
+    //         <Icon>{icon}</Icon>
+    //     </Button>
+    // )
+    // return <Icon className={clazz.join(' ')} type={icon} title={i18n.txt(ik)}></Icon>
+};
+exports.BlockButton = BlockButton;

package/deps/_editor/tools/_InsertButton.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { ButtonProps } from '../base/types';
+export declare const HR: React.FC<ButtonProps>;
+export declare const Audio: React.FC<ButtonProps>;
+export declare const Video: React.FC<ButtonProps>;
+export declare const Picture: React.FC<ButtonProps>;

package/deps/_editor/tools/_InsertButton.js

@@ -0,0 +1,65 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Picture = exports.Video = exports.Audio = exports.HR = void 0;
+const react_1 = __importDefault(require("react"));
+const slate_react_1 = require("slate-react");
+const UploadImage_1 = require("../../../components/Upload/UploadImage");
+const UForm_1 = require("../../../components/UForm");
+const Icon_1 = require("../../../components/_adapt/Icon");
+const utils_1 = require("../../../utils");
+const slate_1 = require("slate");
+const Dropdown_1 = require("../../../components/_adapt/Dropdown");
+const Modal_1 = require("../../../components/_adapt/Modal");
+const hooks_1 = require("../../../hooks");
+const insertImage = (editor, url) => {
+    const text = { text: '' };
+    const image = { type: 'image', url, children: [text] };
+    slate_1.Transforms.insertNodes(editor, image);
+};
+const HR = ({ icon, ik, cmd, disabled }) => {
+    const editor = (0, slate_react_1.useSlate)();
+    return react_1.default.createElement(Icon_1.Icon, { className: 'editor-icon', type: icon, title: utils_1.i18n.txt(ik), onClick: () => slate_1.Transforms.insertNodes(editor, { type: 'hr', children: [{ text: '' }] }) });
+};
+exports.HR = HR;
+const Audio = ({ icon, ik, cmd }) => {
+    const clazz = ['editor-icon'];
+    return react_1.default.createElement(Icon_1.Icon, { className: clazz.join(' '), type: icon, title: utils_1.i18n.txt(ik) });
+};
+exports.Audio = Audio;
+const Video = ({ icon, ik, cmd }) => {
+    const clazz = ['editor-icon'];
+    return react_1.default.createElement(Icon_1.Icon, { className: clazz.join(' '), type: icon, title: utils_1.i18n.txt(ik) });
+};
+exports.Video = Video;
+const Picture = ({ icon, ik, cmd, disabled }) => {
+    const uploadState = (0, hooks_1.useToggle)();
+    const inputState = (0, hooks_1.useToggle)();
+    const selectState = (0, hooks_1.useToggle)();
+    const editor = (0, slate_react_1.useSlate)();
+    const clazz = ['editor-icon', 'vicon', 'vicon-' + icon];
+    if (disabled) {
+        clazz.push('editor-icon-disabled');
+    }
+    return react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(Dropdown_1.Dropdown, { placement: "bottomLeft", arrow: true, menu: {
+                items: [
+                    { key: 1, label: "上传图片", onClick: uploadState[1] },
+                    // { key: 2, label: "从图库中选择", onClick: selectState[1] },
+                    { key: 3, label: "输入图片URL", onClick: inputState[1] },
+                ]
+            } },
+            react_1.default.createElement("span", { className: clazz.join(' '), title: utils_1.i18n.txt(ik) })),
+        react_1.default.createElement(Modal_1.Modal, { title: "\u4E0A\u4F20\u56FE\u7247", open: uploadState[0], onCancel: uploadState[1], footer: null },
+            react_1.default.createElement(UploadImage_1.UploadImage, { onChange: (url) => {
+                } })),
+        react_1.default.createElement(Modal_1.Modal, { title: "\u4ECE\u56FE\u5E93\u4E2D\u9009\u62E9", open: selectState[0], onCancel: selectState[1], footer: null }),
+        react_1.default.createElement(UForm_1.UFormModal, { title: "\u8F93\u5165\u56FE\u7247\u5730\u5740", open: inputState[0], onCancel: inputState[1], default: { url: 'http://localhost/images/logo.png' }, fields: [
+                { field: 'url', title: '图片地址', required: true }
+            ], onOk: (data) => {
+                insertImage(editor, data.url);
+            } }));
+};
+exports.Picture = Picture;

package/deps/_editor/tools/_MarkButton.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import type { CommandType, ButtonDefine } from '../base/types';
+export declare const MarkButton: React.FC<ButtonDefine & {
+    cmd: CommandType;
+    disabled: boolean;
+}>;

package/deps/_editor/tools/_MarkButton.js

@@ -0,0 +1,45 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MarkButton = void 0;
+const react_1 = __importDefault(require("react"));
+const Icon_1 = require("../../../components/_adapt/Icon");
+const slate_1 = require("slate");
+const slate_react_1 = require("slate-react");
+const utils_1 = require("../../../utils");
+const isMarkActive = (editor, cmd) => {
+    const marks = slate_1.Editor.marks(editor);
+    return marks ? marks[cmd] === true : false;
+};
+const toggleMark = (editor, cmd) => {
+    var _a, _b;
+    if (isMarkActive(editor, cmd)) {
+        if (((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset)) {
+            editor.select(editor.selection.focus.path);
+        }
+        slate_1.Editor.removeMark(editor, cmd);
+    }
+    else {
+        slate_1.Editor.addMark(editor, cmd, true);
+    }
+};
+const MarkButton = ({ icon, ik, cmd, disabled }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const clazz = ['editor-icon', 'editor-icon-mark'];
+    if (disabled) {
+        clazz.push('editor-icon-disabled');
+    }
+    else {
+        if (isMarkActive(editor, cmd)) {
+            clazz.push('editor-icon-marked');
+        }
+        else if (((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset)) {
+            clazz.push('editor-icon-disabled');
+        }
+    }
+    return react_1.default.createElement(Icon_1.Icon, { className: clazz.join(' '), type: icon, title: utils_1.i18n.txt(ik), onClick: () => toggleMark(editor, cmd) });
+};
+exports.MarkButton = MarkButton;

package/deps/_editor/tools/_TxtButton.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ButtonProps } from '../base/types';
+export declare const Link: React.FC<ButtonProps>;
+export declare const FontFamily: React.FC<ButtonProps>;
+export declare const FontSize: React.FC<ButtonProps>;
+export declare const Color: React.FC<ButtonProps>;
+export declare const BgColor: React.FC<ButtonProps>;

package/deps/_editor/tools/_TxtButton.js

@@ -0,0 +1,187 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.BgColor = exports.Color = exports.FontSize = exports.FontFamily = exports.Link = void 0;
+const react_1 = __importDefault(require("react"));
+const slate_1 = require("slate");
+const slate_react_1 = require("slate-react");
+const types_1 = require("../base/types");
+const utils_1 = require("../../../utils");
+const antd_1 = require("antd");
+const Button_1 = require("../../../components/_adapt/Button");
+const Select_1 = require("../../../components/_adapt/Select");
+const UForm_1 = require("../../../components/UForm");
+const Icon_1 = require("../../../components/_adapt/Icon");
+const hooks_1 = require("../../../hooks");
+const ColorPicker_1 = require("../../../components/_adapt/todo/ColorPicker");
+const markValue = (editor, cmd) => {
+    const marks = slate_1.Editor.marks(editor);
+    if (marks && marks[cmd]) {
+        return marks[cmd];
+    }
+    return null;
+};
+const setValue = (editor, cmd, value) => {
+    var _a, _b;
+    if (value == null || value == '') {
+        const notSelected = ((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset);
+        if (notSelected) {
+            editor.select(editor.selection.focus.path);
+        }
+        slate_1.Editor.removeMark(editor, cmd);
+    }
+    else {
+        // if (hasSection) {
+        slate_1.Editor.addMark(editor, cmd, value);
+        // editor.select(editor.selection.focus.path);
+        // }
+    }
+};
+const Link = ({ icon, ik, cmd, disabled }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const [openModal, showModal] = (0, hooks_1.useToggle)();
+    const value = markValue(editor, cmd);
+    const clazz = ['editor-icon', 'editor-icon-mark'];
+    if (value)
+        clazz.push('editor-icon-marked');
+    if (disabled || (value == null && ((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset))) {
+        clazz.push('editor-icon-disabled');
+    }
+    return react_1.default.createElement(react_1.default.Fragment, null,
+        value ? react_1.default.createElement(antd_1.Popover, { placement: "bottomLeft", content: react_1.default.createElement("div", { style: { width: 320 } },
+                react_1.default.createElement("p", null,
+                    "\u94FE\u63A5\u5230 : ",
+                    react_1.default.createElement("a", { href: value, target: '_blank' }, value)),
+                react_1.default.createElement("p", null,
+                    react_1.default.createElement(Button_1.Button, { type: 'primary', style: { marginRight: 6 }, onClick: () => showModal() }, "\u4FEE\u6539\u5730\u5740"),
+                    react_1.default.createElement(Button_1.Button, { danger: true, onClick: () => setValue(editor, cmd, null) }, "\u5220\u9664\u94FE\u63A5"))) },
+            react_1.default.createElement("span", { className: 'vicon vicon-link editor-icon editor-icon-mark editor-icon-marked vicon-clickable', title: utils_1.i18n.txt(ik), onClick: () => showModal() })) : react_1.default.createElement(Icon_1.Icon, { className: clazz.join(' '), type: icon, title: utils_1.i18n.txt(ik), onClick: showModal }),
+        react_1.default.createElement(UForm_1.UFormModal, { title: '添加链接', open: openModal, onCancel: showModal, data: { url: value }, fields: [
+                { field: 'url', type: 'url', title: '链接地址' },
+            ], onOk: (data) => {
+                showModal();
+                setValue(editor, cmd, data.url);
+            } }));
+};
+exports.Link = Link;
+const FontFamily = ({ icon, ik, cmd }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const value = markValue(editor, cmd) || undefined;
+    const notSelected = ((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset);
+    return react_1.default.createElement(Select_1.Select, { size: 'small', value: value, disabled: value === undefined && notSelected, style: { width: 72, marginRight: 6 }, placeholder: "\u5B57\u4F53", 
+        // onSelect={()=>{
+        // }}
+        // onClick={(evt) => PageUtil.stopEvent(evt)}
+        onChange: val => {
+            if (val == 0) {
+                setValue(editor, cmd, null);
+            }
+            else {
+                setValue(editor, cmd, val);
+            }
+        } },
+        react_1.default.createElement(Select_1.Select.Option, { value: 1 },
+            react_1.default.createElement("span", { style: { fontFamily: types_1.FontFamilyTexts[1] } }, "\u9ED1\u4F53")),
+        react_1.default.createElement(Select_1.Select.Option, { value: 2 },
+            react_1.default.createElement("span", { style: { fontFamily: types_1.FontFamilyTexts[2] } }, "\u5B8B\u4F53")),
+        react_1.default.createElement(Select_1.Select.Option, { value: 3 },
+            react_1.default.createElement("span", { style: { fontFamily: types_1.FontFamilyTexts[3] } }, "\u6977\u4F53")),
+        react_1.default.createElement(Select_1.Select.Option, { value: 4 },
+            react_1.default.createElement("span", { style: { fontFamily: types_1.FontFamilyTexts[4] } }, "\u82F1\u6587")),
+        react_1.default.createElement(Select_1.Select.Option, { value: 0 }, "\u6E05\u9664"));
+};
+exports.FontFamily = FontFamily;
+const FontSize = ({ icon, ik, cmd, disabled }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const value = markValue(editor, cmd) || 12;
+    const clazz = ['editor-tool-font'];
+    if (disabled || (((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset))) {
+        clazz.push('editor-icon-disabled');
+    }
+    return react_1.default.createElement(antd_1.Popover, { placement: "bottomLeft", content: react_1.default.createElement("div", { style: { width: 240, }, onClick: utils_1.PageUtil.stopEvent },
+            react_1.default.createElement(antd_1.Slider, { value: value, min: 12, max: 60, onChange: (val) => setValue(editor, cmd, val) })) },
+        react_1.default.createElement("span", { className: clazz.join(' ') },
+            "\u5B57\u53F7 : ",
+            react_1.default.createElement("b", { className: 'vapfont' },
+                value,
+                "px")));
+};
+exports.FontSize = FontSize;
+const ColorProps = {
+    format: "hex",
+    presets: [
+        {
+            label: '常用',
+            colors: [
+                '#000000',
+                '#000000E0',
+                '#000000A6',
+                '#00000073',
+                '#00000040',
+                '#00000026',
+                '#0000001A',
+                '#00000012',
+                '#0000000A',
+                '#00000005',
+                '#F5222D',
+                '#FA8C16',
+                '#FADB14',
+                '#8BBB11',
+                '#52C41A',
+                '#13A8A8',
+                '#1677FF',
+                '#2F54EB',
+                '#722ED1',
+                '#EB2F96',
+                '#F5222D4D',
+                '#FA8C164D',
+                '#FADB144D',
+                '#8BBB114D',
+                '#52C41A4D',
+                '#13A8A84D',
+                '#1677FF4D',
+                '#2F54EB4D',
+                '#722ED14D',
+                '#EB2F964D',
+            ],
+        },
+    ]
+};
+const Color = ({ icon, ik, cmd, disabled }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const value = markValue(editor, cmd);
+    const clazz = ['editor-icon', 'editor-icon-mark', 'vicon', 'vicon-' + icon];
+    if (disabled || (((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset))) {
+        clazz.push('editor-icon-disabled');
+    }
+    const style = {};
+    if (value) {
+        style.color = value;
+        style.fontWeight = 'bold';
+    }
+    return react_1.default.createElement(ColorPicker_1.ColorPicker, Object.assign({}, ColorProps, { onChange: (val, hex) => setValue(editor, cmd, hex) }),
+        react_1.default.createElement("span", { className: clazz.join(' '), style: style }));
+};
+exports.Color = Color;
+const BgColor = ({ icon, ik, cmd, disabled }) => {
+    var _a, _b;
+    const editor = (0, slate_react_1.useSlate)();
+    const value = markValue(editor, cmd);
+    const clazz = ['editor-icon', 'editor-icon-mark', 'vicon', 'vicon-' + icon];
+    if (disabled || (((_a = editor.selection) === null || _a === void 0 ? void 0 : _a.focus.offset) == ((_b = editor.selection) === null || _b === void 0 ? void 0 : _b.anchor.offset))) {
+        clazz.push('editor-icon-disabled');
+    }
+    const style = {};
+    if (value) {
+        style.backgroundColor = value;
+    }
+    return react_1.default.createElement(ColorPicker_1.ColorPicker, Object.assign({}, ColorProps, { onChange: (val, hex) => setValue(editor, cmd, hex) }),
+        react_1.default.createElement("span", { className: clazz.join(' '), style: style }));
+};
+exports.BgColor = BgColor;

package/deps/_editor/utils/ParseHtml.js

@@ -0,0 +1,220 @@
+// import React, { useCallback, useMemo } from 'react'
+// import { jsx } from 'slate-hyperscript'
+// import { Transforms, createEditor, Descendant } from 'slate'
+// import { withHistory } from 'slate-history'
+// import { css } from '@emotion/css'
+// import {
+//   Slate,
+//   Editable,
+//   withReact,
+//   useSelected,
+//   useFocused,
+// } from 'slate-react'
+// const ELEMENT_TAGS = {
+//   A: el => ({ type: 'link', url: el.getAttribute('href') }),
+//   BLOCKQUOTE: () => ({ type: 'quote' }),
+//   H1: () => ({ type: 'heading-one' }),
+//   H2: () => ({ type: 'heading-two' }),
+//   H3: () => ({ type: 'heading-three' }),
+//   H4: () => ({ type: 'heading-four' }),
+//   H5: () => ({ type: 'heading-five' }),
+//   H6: () => ({ type: 'heading-six' }),
+//   IMG: el => ({ type: 'image', url: el.getAttribute('src') }),
+//   LI: () => ({ type: 'list-item' }),
+//   OL: () => ({ type: 'numbered-list' }),
+//   P: () => ({ type: 'paragraph' }),
+//   PRE: () => ({ type: 'code' }),
+//   UL: () => ({ type: 'bulleted-list' }),
+// }
+// // COMPAT: `B` is omitted here because Google Docs uses `<b>` in weird ways.
+// const TEXT_TAGS = {
+//   CODE: () => ({ code: true }),
+//   DEL: () => ({ strikethrough: true }),
+//   EM: () => ({ italic: true }),
+//   I: () => ({ italic: true }),
+//   S: () => ({ strikethrough: true }),
+//   STRONG: () => ({ bold: true }),
+//   U: () => ({ underline: true }),
+// }
+// export const deserialize = el => {
+//   if (el.nodeType === 3) {
+//     return el.textContent
+//   } else if (el.nodeType !== 1) {
+//     return null
+//   } else if (el.nodeName === 'BR') {
+//     return '\n'
+//   }
+//   const { nodeName } = el
+//   let parent = el
+//   if (
+//     nodeName === 'PRE' &&
+//     el.childNodes[0] &&
+//     el.childNodes[0].nodeName === 'CODE'
+//   ) {
+//     parent = el.childNodes[0]
+//   }
+//   let children = Array.from(parent.childNodes)
+//     .map(deserialize)
+//     .flat()
+//   if (children.length === 0) {
+//     children = [{ text: '' }]
+//   }
+//   if (el.nodeName === 'BODY') {
+//     return jsx('fragment', {}, children)
+//   }
+//   if (ELEMENT_TAGS[nodeName]) {
+//     const attrs = ELEMENT_TAGS[nodeName](el)
+//     return jsx('element', attrs, children)
+//   }
+//   if (TEXT_TAGS[nodeName]) {
+//     const attrs = TEXT_TAGS[nodeName](el)
+//     return children.map(child => jsx('text', attrs, child))
+//   }
+//   return children
+// }
+// const PasteHtmlExample = () => {
+//   const renderElement = useCallback(props => <Element {...props} />, [])
+//   const renderLeaf = useCallback(props => <Leaf {...props} />, [])
+//   const editor = useMemo(
+//     () => withHtml(withReact(withHistory(createEditor()))),
+//     []
+//   )
+//   return (
+//     <Slate editor={editor} value={initialValue}>
+//       <Editable
+//         renderElement={renderElement}
+//         renderLeaf={renderLeaf}
+//         placeholder="Paste in some HTML..."
+//       />
+//     </Slate>
+//   )
+// }
+// const withHtml = editor => {
+//   const { insertData, isInline, isVoid } = editor
+//   editor.isInline = element => {
+//     return element.type === 'link' ? true : isInline(element)
+//   }
+//   editor.isVoid = element => {
+//     return element.type === 'image' ? true : isVoid(element)
+//   }
+//   editor.insertData = data => {
+//     const html = data.getData('text/html')
+//     if (html) {
+//       const parsed = new DOMParser().parseFromString(html, 'text/html')
+//       const fragment = deserialize(parsed.body)
+//       Transforms.insertFragment(editor, fragment)
+//       return
+//     }
+//     insertData(data)
+//   }
+//   return editor
+// }
+// const Element = props => {
+//   const { attributes, children, element } = props
+//   switch (element.type) {
+//     default:
+//       return <p {...attributes}>{children}</p>
+//     case 'quote':
+//       return <blockquote {...attributes}>{children}</blockquote>
+//     case 'code':
+//       return (
+//         <pre>
+//           <code {...attributes}>{children}</code>
+//         </pre>
+//       )
+//     case 'bulleted-list':
+//       return <ul {...attributes}>{children}</ul>
+//     case 'heading-one':
+//       return <h1 {...attributes}>{children}</h1>
+//     case 'heading-two':
+//       return <h2 {...attributes}>{children}</h2>
+//     case 'heading-three':
+//       return <h3 {...attributes}>{children}</h3>
+//     case 'heading-four':
+//       return <h4 {...attributes}>{children}</h4>
+//     case 'heading-five':
+//       return <h5 {...attributes}>{children}</h5>
+//     case 'heading-six':
+//       return <h6 {...attributes}>{children}</h6>
+//     case 'list-item':
+//       return <li {...attributes}>{children}</li>
+//     case 'numbered-list':
+//       return <ol {...attributes}>{children}</ol>
+//     case 'link':
+//       return (
+//         <a href={element.url} {...attributes}>
+//           {children}
+//         </a>
+//       )
+//     case 'image':
+//       return <ImageElement {...props} />
+//   }
+// }
+// const ImageElement = ({ attributes, children, element }) => {
+//   const selected = useSelected()
+//   const focused = useFocused()
+//   return (
+//     <div {...attributes}>
+//       {children}
+//       <img
+//         src={element.url}
+//         className={css`
+//           display: block;
+//           max-width: 100%;
+//           max-height: 20em;
+//           box-shadow: ${selected && focused ? '0 0 0 2px blue;' : 'none'};
+//         `}
+//       />
+//     </div>
+//   )
+// }
+// const Leaf = ({ attributes, children, leaf }) => {
+//   if (leaf.bold) {
+//     children = <strong>{children}</strong>
+//   }
+//   if (leaf.code) {
+//     children = <code>{children}</code>
+//   }
+//   if (leaf.italic) {
+//     children = <em>{children}</em>
+//   }
+//   if (leaf.underline) {
+//     children = <u>{children}</u>
+//   }
+//   if (leaf.strikethrough) {
+//     children = <del>{children}</del>
+//   }
+//   return <span {...attributes}>{children}</span>
+// }
+// const initialValue: Descendant[] = [
+//   {
+//     type: 'paragraph',
+//     children: [
+//       {
+//         text:
+//           "By default, pasting content into a Slate editor will use the clipboard's ",
+//       },
+//       { text: "'text/plain'", code: true },
+//       {
+//         text:
+//           " data. That's okay for some use cases, but sometimes you want users to be able to paste in content and have it maintain its formatting. To do this, your editor needs to handle ",
+//       },
+//       { text: "'text/html'", code: true },
+//       { text: ' data. ' },
+//     ],
+//   },
+//   {
+//     type: 'paragraph',
+//     children: [{ text: 'This is an example of doing exactly that!' }],
+//   },
+//   {
+//     type: 'paragraph',
+//     children: [
+//       {
+//         text:
+//           "Try it out for yourself! Copy and paste some rendered HTML rich text content (not the source code) from another site into this editor and it's formatting should be preserved.",
+//       },
+//     ],
+//   },
+// ]
+// export default PasteHtmlExample

package/deps/api-audit.d.ts

@@ -0,0 +1 @@
+export declare const useLookUp: () => void;

package/deps/api-audit.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useLookUp = void 0;
+const useLookUp = () => {
+};
+exports.useLookUp = useLookUp;

package/deps/api-data.js

@@ -0,0 +1 @@
+// export const