@voplus/morpho-document 4.0.3 → 4.0.5

package/es/components/TagView/index.js

@@ -1,51 +1,51 @@
-import "./index.less";
-import { Button, Popover, Select, Spin, Tag, Tooltip } from "antd";
-import { useDocumentStore } from "@voplus/morpho-document-core";
-import React, { useEffect, useState } from "react";
-import { State, colorList } from "./state";
-import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
-import classnames from "classnames";
-import { faPlus } from "@fortawesome/pro-light-svg-icons";
-import { observe } from "@voplus/morpho-ui";
-import { runInAction } from "mobx";
-const TagView = (props) => {
-    const { id, tags, editable, className } = props;
-    const documentStore = useDocumentStore();
-    const [state] = useState(new State(id, documentStore));
-    useEffect(() => {
-        state.init();
-    }, [id]);
-    useEffect(() => {
-        if (state.visible)
-            state.init();
-    }, [state.visible]);
-    useEffect(() => {
-        runInAction(() => (state.tags = tags || []));
-    }, [tags]);
-    const content = observe(() => (React.createElement("div", { className: "add-tag-dialog" },
-        React.createElement("div", { className: "tag-view-color" }, colorList.map((item) => (React.createElement("div", { key: item.value, className: "tag-color-item", style: state.color === item.value ? { borderColor: item.borderColor || item.color } : {} },
-            React.createElement("span", { className: "color", onClick: () => state.selectColor(item.value), style: {
-                    backgroundColor: item.color,
-                    borderColor: item.borderColor,
-                } }))))),
-        state.editTagName && (React.createElement("div", { className: "reselect-information" },
-            React.createElement(Tag, { color: state.info.color }, state.editTagName),
-            React.createElement(Button, { type: "link", onClick: () => (state.info = {}) }, "Close Reselect"))),
-        React.createElement(Select, { autoFocus: true, showSearch: true, value: state.name, disabled: !!state.editTagName, showArrow: false, filterOption: false, notFoundContent: state.loading ? React.createElement(Spin, null) : null, placeholder: state.name, onSearch: state.onSearch, onSelect: state.onChange, onInputKeyDown: state.onkeydown }, state.list.map((d, index) => (React.createElement(Select.Option, { key: index, value: d.name }, d.name)))),
-        React.createElement("div", null, state.addTags.map((tag, index) => (React.createElement(Tooltip, { key: index, title: state.editTagName === tag.name ? "" : "Click to reselect color" },
-            React.createElement(Tag, { color: tag.color, closable: true, onClick: () => (state.info = tag), onClose: (e) => state.onRemove(e, tag.name) }, tag.name))))),
-        React.createElement("div", { className: "add-tag-dialog-footer" },
-            React.createElement(Button, { type: "link", className: "cancel", onClick: () => runInAction(() => (state.visible = false)) }, "Cancel"),
-            React.createElement(Button, { type: "link", loading: state.saveLoading, onClick: state.onOk }, "Ok")))));
-    return observe(() => (React.createElement("div", { className: classnames(className, "tag-view") },
-        state.tags.map((tag, index) => (React.createElement(Tag, { key: index, color: tag.color, closable: !!editable, onClose: (e) => {
-                e.preventDefault();
-                state.onClose(tag.name);
-            } }, tag.name))),
-        !!editable && (React.createElement(Popover, { content: content, title: "", trigger: "click", open: state.visible, onOpenChange: state.onVisibleChange },
-            React.createElement(Tag, { className: classnames("add-tag-btn", { show: state.show }) },
-                React.createElement(FAIcon, { icon: faPlus }),
-                " tag"))))));
-};
-export default TagView;
+import "./index.less";
+import { Button, Popover, Select, Spin, Tag, Tooltip } from "antd";
+import { useDocumentStore } from "@voplus/morpho-document-core";
+import React, { useEffect, useState } from "react";
+import { State, colorList } from "./state";
+import { FontAwesomeIcon as FAIcon } from "@fortawesome/react-fontawesome";
+import classnames from "classnames";
+import { faPlus } from "@fortawesome/pro-light-svg-icons";
+import { observe } from "@voplus/morpho-ui";
+import { runInAction } from "mobx";
+const TagView = (props) => {
+    const { id, tags, editable, className } = props;
+    const documentStore = useDocumentStore();
+    const [state] = useState(new State(id, documentStore));
+    useEffect(() => {
+        state.init();
+    }, [id]);
+    useEffect(() => {
+        if (state.visible)
+            state.init();
+    }, [state.visible]);
+    useEffect(() => {
+        runInAction(() => (state.tags = tags || []));
+    }, [tags]);
+    const content = observe(() => (React.createElement("div", { className: "add-tag-dialog" },
+        React.createElement("div", { className: "tag-view-color" }, colorList.map((item) => (React.createElement("div", { key: item.value, className: "tag-color-item", style: state.color === item.value ? { borderColor: item.borderColor || item.color } : {} },
+            React.createElement("span", { className: "color", onClick: () => state.selectColor(item.value), style: {
+                    backgroundColor: item.color,
+                    borderColor: item.borderColor,
+                } }))))),
+        state.editTagName && (React.createElement("div", { className: "reselect-information" },
+            React.createElement(Tag, { color: state.info.color }, state.editTagName),
+            React.createElement(Button, { type: "link", onClick: () => (state.info = {}) }, "Close Reselect"))),
+        React.createElement(Select, { autoFocus: true, showSearch: true, value: state.name, disabled: !!state.editTagName, showArrow: false, filterOption: false, notFoundContent: state.loading ? React.createElement(Spin, null) : null, placeholder: state.name, onSearch: state.onSearch, onSelect: state.onChange, onInputKeyDown: state.onkeydown }, state.list.map((d, index) => (React.createElement(Select.Option, { key: index, value: d.name }, d.name)))),
+        React.createElement("div", null, state.addTags.map((tag, index) => (React.createElement(Tooltip, { key: index, title: state.editTagName === tag.name ? "" : "Click to reselect color" },
+            React.createElement(Tag, { color: tag.color, closable: true, onClick: () => (state.info = tag), onClose: (e) => state.onRemove(e, tag.name) }, tag.name))))),
+        React.createElement("div", { className: "add-tag-dialog-footer" },
+            React.createElement(Button, { type: "link", className: "cancel", onClick: () => runInAction(() => (state.visible = false)) }, "Cancel"),
+            React.createElement(Button, { type: "link", loading: state.saveLoading, onClick: state.onOk }, "Ok")))));
+    return observe(() => (React.createElement("div", { className: classnames(className, "tag-view") },
+        state.tags.map((tag, index) => (React.createElement(Tag, { key: index, color: tag.color, closable: !!editable, onClose: (e) => {
+                e.preventDefault();
+                state.onClose(tag.name);
+            } }, tag.name))),
+        !!editable && (React.createElement(Popover, { content: content, title: "", trigger: "click", open: state.visible, onOpenChange: state.onVisibleChange },
+            React.createElement(Tag, { className: classnames("add-tag-btn", { show: state.show }) },
+                React.createElement(FAIcon, { icon: faPlus }),
+                " tag"))))));
+};
+export default TagView;
 //# sourceMappingURL=index.js.map

package/es/components/TagView/index.less

@@ -1,106 +1,106 @@
-:global {
-	.tag-view {
-		&:hover .add-tag-btn {
-			display: inline-block;
-		}
-		.ant-tag {
-			margin: 0 0 0 5px;
-			padding: 0 5px;
-			font-size: 12px;
-			line-height: 15px;
-			cursor: pointer;
-			display: inline-flex;
-			align-items: center;
-			.anticon-close {
-				display: none;
-			}
-			&:hover .anticon-close {
-				display: inline-block;
-			}
-		}
-		.add-tag-btn {
-			display: none;
-			background-color: "#fff";
-			border-style: dashed;
-			&.show {
-				display: inline-block;
-			}
-		}
-	}
-	.add-tag-dialog {
-		width: 336px;
-		.ant-tag {
-			margin-top: 10px;
-			cursor: pointer;
-			display: inline-flex;
-			align-items: center;
-		}
-		.tag-view-color {
-			display: flex;
-			align-items: center;
-			padding-bottom: 10px;
-			.tag-color-item {
-				padding: 2px;
-				border: 1px solid transparent;
-				.color {
-					display: block;
-					width: 20px;
-					height: 20px;
-					border-radius: 50%;
-					cursor: pointer;
-					border: 1px solid transparent;
-				}
-			}
-		}
-		.reselect-information {
-			display: flex;
-			justify-content: space-between;
-			align-items: center;
-			padding-bottom: 10px;
-			.ant-tag {
-				margin-top: 0;
-			}
-			.ant-btn {
-				padding: 0;
-				height: 24px;
-			}
-		}
-		.item-color + .item-color {
-			margin-left: 8px;
-		}
-		.color-dropdown {
-			display: inline-block;
-			width: 20px;
-			height: 20px;
-			padding: 2px;
-			border: 1px solid #e6e6e6;
-			cursor: pointer;
-			> span {
-				display: block;
-				width: 14px;
-				height: 14px;
-				line-height: 14px;
-				font-size: 12px;
-				text-align: center;
-				color: #fff;
-				background-color: #000;
-			}
-		}
-		.add-tag-dialog-footer {
-			text-align: right;
-			padding-top: 5px;
-			.ant-btn {
-				height: 28px;
-				padding: 0;
-				font-size: 15px;
-			}
-			.cancel {
-				margin-right: 10px;
-				color: #888;
-			}
-		}
-		.ant-select {
-			width: 100%;
-		}
-	}
-}
+:global {
+	.tag-view {
+		&:hover .add-tag-btn {
+			display: inline-block;
+		}
+		.ant-tag {
+			margin: 0 0 0 5px;
+			padding: 0 5px;
+			font-size: 12px;
+			line-height: 15px;
+			cursor: pointer;
+			display: inline-flex;
+			align-items: center;
+			.anticon-close {
+				display: none;
+			}
+			&:hover .anticon-close {
+				display: inline-block;
+			}
+		}
+		.add-tag-btn {
+			display: none;
+			background-color: "#fff";
+			border-style: dashed;
+			&.show {
+				display: inline-block;
+			}
+		}
+	}
+	.add-tag-dialog {
+		width: 336px;
+		.ant-tag {
+			margin-top: 10px;
+			cursor: pointer;
+			display: inline-flex;
+			align-items: center;
+		}
+		.tag-view-color {
+			display: flex;
+			align-items: center;
+			padding-bottom: 10px;
+			.tag-color-item {
+				padding: 2px;
+				border: 1px solid transparent;
+				.color {
+					display: block;
+					width: 20px;
+					height: 20px;
+					border-radius: 50%;
+					cursor: pointer;
+					border: 1px solid transparent;
+				}
+			}
+		}
+		.reselect-information {
+			display: flex;
+			justify-content: space-between;
+			align-items: center;
+			padding-bottom: 10px;
+			.ant-tag {
+				margin-top: 0;
+			}
+			.ant-btn {
+				padding: 0;
+				height: 24px;
+			}
+		}
+		.item-color + .item-color {
+			margin-left: 8px;
+		}
+		.color-dropdown {
+			display: inline-block;
+			width: 20px;
+			height: 20px;
+			padding: 2px;
+			border: 1px solid #e6e6e6;
+			cursor: pointer;
+			> span {
+				display: block;
+				width: 14px;
+				height: 14px;
+				line-height: 14px;
+				font-size: 12px;
+				text-align: center;
+				color: #fff;
+				background-color: #000;
+			}
+		}
+		.add-tag-dialog-footer {
+			text-align: right;
+			padding-top: 5px;
+			.ant-btn {
+				height: 28px;
+				padding: 0;
+				font-size: 15px;
+			}
+			.cancel {
+				margin-right: 10px;
+				color: #888;
+			}
+		}
+		.ant-select {
+			width: 100%;
+		}
+	}
+}

package/es/components/TagView/state.d.ts

@@ -1,58 +1,58 @@
-import { DocumentStore, ITag } from "@voplus/morpho-document-core";
-export declare type TagViewProps = {
-    id: string;
-    tags?: ITag[];
-    /** editable of new tag */
-    editable?: boolean;
-    className?: string;
-};
-/** colors of preset */
-export declare const colorList: ({
-    value: string;
-    color: string;
-    borderColor?: undefined;
-} | {
-    value: string;
-    color: string;
-    borderColor: string;
-})[];
-export declare class State {
-    private id;
-    private documentStore;
-    /** porps list of tags */
-    tags: ITag[];
-    /** Add list of tags */
-    addTags: ITag[];
-    /** load list of tags */
-    list: any[];
-    /** name of tag */
-    name: string;
-    /** color of tag */
-    color: string;
-    /** loaded of tag list */
-    saveLoading: boolean;
-    /** data loading */
-    loading: boolean;
-    /**  visible of AddTagDialog */
-    visible: boolean;
-    /** 当前可更改Tag */
-    info: ITag;
-    /**  */
-    timer: any;
-    constructor(id: string, documentStore: DocumentStore);
-    get show(): boolean;
-    /** Name of 当前可更改Tag */
-    get editTagName(): string;
-    onRemove(e: MouseEvent, tagName: string): void;
-    onClose(removedTag: string): Promise<void>;
-    onkeydown: (e: any) => void;
-    onChange: (name: string) => void;
-    deduplicate(): void;
-    onSearch: (value: string) => void;
-    loadData(): Promise<void>;
-    onVisibleChange: (visible: boolean) => void;
-    onOk: () => Promise<void>;
-    selectColor(value: string): void;
-    init(): void;
-    reset(): void;
-}
+import { DocumentStore, ITag } from "@voplus/morpho-document-core";
+export declare type TagViewProps = {
+    id: string;
+    tags?: ITag[];
+    /** editable of new tag */
+    editable?: boolean;
+    className?: string;
+};
+/** colors of preset */
+export declare const colorList: ({
+    value: string;
+    color: string;
+    borderColor?: undefined;
+} | {
+    value: string;
+    color: string;
+    borderColor: string;
+})[];
+export declare class State {
+    private id;
+    private documentStore;
+    /** porps list of tags */
+    tags: ITag[];
+    /** Add list of tags */
+    addTags: ITag[];
+    /** load list of tags */
+    list: any[];
+    /** name of tag */
+    name: string;
+    /** color of tag */
+    color: string;
+    /** loaded of tag list */
+    saveLoading: boolean;
+    /** data loading */
+    loading: boolean;
+    /**  visible of AddTagDialog */
+    visible: boolean;
+    /** 当前可更改Tag */
+    info: ITag;
+    /**  */
+    timer: any;
+    constructor(id: string, documentStore: DocumentStore);
+    get show(): boolean;
+    /** Name of 当前可更改Tag */
+    get editTagName(): string;
+    onRemove(e: MouseEvent, tagName: string): void;
+    onClose(removedTag: string): Promise<void>;
+    onkeydown: (e: any) => void;
+    onChange: (name: string) => void;
+    deduplicate(): void;
+    onSearch: (value: string) => void;
+    loadData(): Promise<void>;
+    onVisibleChange: (visible: boolean) => void;
+    onOk: () => Promise<void>;
+    selectColor(value: string): void;
+    init(): void;
+    reset(): void;
+}