vue-editify 0.2.14 → 0.2.16

package/src/editify/menu/index.ts

@@ -0,0 +1,5 @@
+import Menu from './menu.vue'
+
+export type * from './props'
+
+export { Menu }

package/src/editify/menu/menu.vue

@@ -0,0 +1,215 @@
+<template>
+	<div ref="menuRef" class="editify-menu" :class="{ 'editify-border': menuShowBorder, 'editify-source': isSourceView && menuMode == 'inner', 'editify-fullscreen': isFullScreen }" :data-editify-mode="menuMode" :style="{ zIndex: zIndex, ...(config.style || {}) }">
+		<template v-for="item in menuNames">
+			<!-- 内置菜单按钮 -->
+			<component v-if="!!currentDefaultMenu(item)" :is="currentDefaultMenu(item)" :color="color" :z-index="zIndex + 1" :config="(config as any)[item]" :disabled="isDisabled || !rangeKey" :tooltip="config.tooltip!"></component>
+			<!-- 拓展菜单按钮 -->
+			<ExtendMenuButton v-else :name="item" />
+		</template>
+	</div>
+</template>
+<script setup lang="ts">
+import { ref, computed, inject, Ref, ComputedRef, onMounted, getCurrentInstance, onBeforeUnmount, shallowRef, defineComponent, h } from 'vue'
+import { event as DapEvent } from 'dap-util'
+import { MenuModeType } from '@/core/tool'
+import { Button } from '@/components/button'
+import { MenuProps } from './props'
+import { UndoMenuButton } from '@/feature/undo'
+import { RedoMenuButton } from '@/feature/redo'
+import { HeadingMenuButton } from '@/feature/heading'
+import { IndentMenuButton } from '@/feature/indent'
+import { QuoteMenuButton } from '@/feature/quote'
+import { SeparatorMenuButton } from '@/feature/separator'
+import { AlignMenuButton } from '@/feature/align'
+import { OrderListMenuButton } from '@/feature/orderList'
+import { UnorderListMenuButton } from '@/feature/unorderList'
+import { TaskMenuButton } from '@/feature/task'
+import { BoldMenuButton } from '@/feature/bold'
+import { UnderlineMenuButton } from '@/feature/underline'
+import { ItalicMenuButton } from '@/feature/italic'
+import { StrikethroughMenuButton } from '@/feature/strikethrough'
+import { CodeMenuButton } from '@/feature/code'
+import { SuperMenuButton } from '@/feature/super'
+import { SubMenuButton } from '@/feature/sub'
+import { FormatClearMenuButton } from '@/feature/formatClear'
+import { FontSizeMenuButton } from '@/feature/fontSize'
+import { FontFamilyMenuButton } from '@/feature/fontFamily'
+import { LineHeightMenuButton } from '@/feature/lineHeight'
+import { ForeColorMenuButton } from '@/feature/foreColor'
+import { BackColorMenuButton } from '@/feature/backColor'
+import { LinkMenuButton } from '@/feature/link'
+import { ImageMenuButton } from '@/feature/image'
+import { VideoMenuButton } from '@/feature/video'
+import { TableMenuButton } from '@/feature/table'
+import { CodeBlockMenuButton } from '@/feature/codeBlock'
+import { SourceViewMenuButton } from '@/feature/sourceView'
+import { FullScreenMenuButton } from '@/feature/fullScreen'
+import { AttachmentMenuButton } from '@/feature/attachment'
+import { MathformulaMenuButton } from '@/feature/mathformula'
+import { PanelMenuButton } from '@/feature/panel'
+import { InfoBlockMenuButton } from '@/feature/infoBlock'
+
+defineOptions({
+	name: 'Menu'
+})
+//内部实例
+const instance = getCurrentInstance()!
+//属性
+const props = defineProps(MenuProps)
+//是否源码视图
+const isSourceView = inject<Ref<boolean>>('isSourceView')!
+//是否全屏
+const isFullScreen = inject<Ref<boolean>>('isFullScreen')!
+//光标更新标记
+const rangeKey = inject<Ref<number | null>>('rangeKey')!
+//编辑器是否显示边框
+const showBorder = inject<ComputedRef<boolean>>('showBorder')!
+//编辑器是否外部禁用
+const isDisabled = inject<ComputedRef<boolean>>('isDisabled')!
+//编辑器是否自适应高度
+const isAutoHeight = inject<ComputedRef<boolean>>('isAutoHeight')!
+
+//菜单dom
+const menuRef = ref<HTMLElement | null>(null)
+//菜单高度
+const height = ref<number>(0)
+
+//菜单名称数组（包括内置的和拓展的）
+const menuNames = computed<string[]>(() => {
+	return Object.keys(props.config.sequence!).sort((a, b) => {
+		if (props.config.sequence![a]! > props.config.sequence![b]!) {
+			return 1
+		}
+		return -1
+	})
+})
+//内置菜单组件的数组
+const defaultMenus = shallowRef([UndoMenuButton, RedoMenuButton, HeadingMenuButton, IndentMenuButton, QuoteMenuButton, SeparatorMenuButton, AlignMenuButton, OrderListMenuButton, UnorderListMenuButton, TaskMenuButton, BoldMenuButton, UnderlineMenuButton, ItalicMenuButton, StrikethroughMenuButton, CodeMenuButton, SuperMenuButton, SubMenuButton, FormatClearMenuButton, FontSizeMenuButton, FontFamilyMenuButton, LineHeightMenuButton, ForeColorMenuButton, BackColorMenuButton, LinkMenuButton, ImageMenuButton, VideoMenuButton, TableMenuButton, CodeBlockMenuButton, SourceViewMenuButton, FullScreenMenuButton, AttachmentMenuButton, MathformulaMenuButton, PanelMenuButton, InfoBlockMenuButton])
+//根据菜单名称获取对应的内置菜单组件
+const currentDefaultMenu = computed(() => {
+	return (name: string) => defaultMenus.value.find(item => item.name == `_${name}`)
+})
+//菜单显示模式
+const menuMode = computed<MenuModeType>(() => {
+	//如果是全屏状态下或者高度自适应状态下
+	if (isFullScreen.value || isAutoHeight.value) {
+		//fixed模式改为默认模式
+		if (props.config.mode == 'fixed') {
+			return 'default'
+		}
+	}
+	return props.config.mode!
+})
+//菜单栏是否显示边框
+const menuShowBorder = computed<boolean>(() => {
+	//fixed模式下不显示边框
+	if (menuMode.value == 'fixed') {
+		return false
+	}
+	//由编辑器的border属性来决定
+	return showBorder.value
+})
+
+//拓展菜单组件
+const ExtendMenuButton = defineComponent(
+	extendProps => {
+		//按钮实例
+		const btnRef = ref<InstanceType<typeof Button> | null>(null)
+		//拓展菜单配置
+		const configuration = props.config.extends![extendProps.name]
+		return () => {
+			return configuration
+				? h(
+						Button,
+						{
+							name: extendProps.name,
+							tooltip: props.config.tooltip,
+							color: props.color,
+							zIndex: props.zIndex + 1,
+							ref: btnRef,
+							type: configuration.type || 'default',
+							title: configuration.title || '',
+							leftBorder: configuration.leftBorder || false,
+							rightBorder: configuration.rightBorder || false,
+							hideScroll: configuration.hideScroll || false,
+							disabled: isDisabled.value || !rangeKey.value || configuration.disabled,
+							active: configuration.active || false,
+							selectConfig: {
+								width: configuration.width,
+								maxHeight: configuration.maxHeight,
+								options: configuration.options
+							},
+							displayConfig: {
+								width: configuration.width,
+								maxHeight: configuration.maxHeight,
+								value: configuration.value,
+								options: configuration.options
+							},
+							onLayerShow: () => {
+								if (typeof configuration.onLayerShow == 'function') {
+									configuration.onLayerShow(extendProps.name, btnRef.value!)
+								}
+							},
+							onLayerShown: () => {
+								if (typeof configuration.onLayerShown == 'function') {
+									configuration.onLayerShown(extendProps.name, btnRef.value!)
+								}
+							},
+							onLayerHidden: () => {
+								if (typeof configuration.onLayerHidden == 'function') {
+									configuration.onLayerHidden(extendProps.name, btnRef.value!)
+								}
+							},
+							onOperate: (name, val) => {
+								if (typeof configuration.onOperate == 'function') {
+									configuration.onOperate(name, val, btnRef.value!)
+								}
+							}
+						},
+						{
+							default: () => {
+								if (configuration.default) {
+									return configuration.default(extendProps.name, btnRef.value!)
+								}
+								return null
+							},
+							layer: () => {
+								if (configuration.layer) {
+									return configuration.layer(extendProps.name, btnRef.value!)
+								}
+								return null
+							},
+							option: () => {
+								if (configuration.option) {
+									return configuration.option(extendProps.name, btnRef.value!)
+								}
+								return null
+							}
+						}
+				  )
+				: null
+		}
+	},
+	{
+		props: {
+			name: String
+		}
+	}
+)
+
+onMounted(() => {
+	height.value = menuRef.value!.offsetHeight
+	DapEvent.on(window, `resize.editify_menu_${instance.uid}`, () => {
+		height.value = menuRef.value!.offsetHeight
+	})
+})
+
+onBeforeUnmount(() => {
+	DapEvent.off(window, `resize.editify_menu_${instance.uid}`)
+})
+
+defineExpose({
+	height
+})
+</script>
+<style scoped src="./menu.less"></style>

package/src/{components → editify}/menu/props.ts

@@ -9,7 +9,7 @@ export const MenuProps = {
 	},
 	//主题色
 	color: {
-		type: String as PropType<string | null>,
+		type: String,
 		default: ''
 	},
 	//层级

package/src/editify/props.ts

@@ -1,7 +1,7 @@
-import { common as DapCommon } from 'dap-util'
 import { ExtractPublicPropTypes, PropType } from 'vue'
+import { common as DapCommon } from 'dap-util'
 import { AlexElement } from 'alex-editor'
-import { PluginType, MenuConfigType, ObjectType, ToolbarConfigType } from '@/core/tool'
+import { MenuConfigType, ObjectType, ToolbarConfigType } from '@/core/tool'
 import { LocaleType } from '@/locale'
 
 export type EditifyResizeParamsType = {
@@ -68,9 +68,12 @@ export const EditifyProps = {
 	},
 	//主题色
 	color: {
-		type: String as PropType<string | null>,
+		type: String,
 		default: '#03a8f3',
-		validator(value: any) {
+		validator(value: string) {
+			if (!value) {
+				return true
+			}
 			return DapCommon.matchingText(value, 'hex')
 		}
 	},
@@ -158,13 +161,6 @@ export const EditifyProps = {
 		type: Boolean,
 		default: true
 	},
-	//插件数组
-	plugins: {
-		type: Array as PropType<PluginType[]>,
-		default: function () {
-			return []
-		}
-	},
 	//是否使用深色模式
 	dark: {
 		type: Boolean,

package/src/editify/toolbar/index.ts

@@ -0,0 +1,5 @@
+import Toolbar from './toolbar.vue'
+
+export type * from './props'
+
+export { Toolbar }

package/src/{components → editify}/toolbar/props.ts

@@ -32,7 +32,7 @@ export const ToolbarProps = {
 	},
 	//主题色
 	color: {
-		type: String as PropType<string | null>,
+		type: String,
 		default: ''
 	},
 	//层级

package/src/editify/toolbar/toolbar.less

@@ -0,0 +1,10 @@
+.editify-toolbar {
+	display: flex;
+	justify-content: flex-start;
+	align-items: center;
+	padding: 4px;
+}
+
+:deep(.editify-icon-rotate) {
+	transform: rotate(180deg);
+}

package/src/editify/toolbar/toolbar.vue

@@ -0,0 +1,103 @@
+<template>
+	<Layer v-model="show" ref="layerRef" :node="node" :scroll-node="scrollNode" border placement="bottom-start" :useRange="type == 'text'" :z-index="zIndex" :inside-elements="insideElements">
+		<div class="editify-toolbar" :style="config.style">
+			<!-- 链接工具条 -->
+			<linkToolbar v-if="type == 'link'" :color="color" />
+			<!-- 图片工具条 -->
+			<ImageToolbar v-else-if="type == 'image'" @reset-toolbar="layerRef!.setPosition()" :tooltip="config.tooltip!" :color="color" :z-index="zIndex + 1" />
+			<!-- 视频工具条 -->
+			<VideoToolbar v-else-if="type == 'video'" @reset-toolbar="layerRef!.setPosition()" :tooltip="config.tooltip!" :color="color" :z-index="zIndex + 1" />
+			<!-- 表格工具条 -->
+			<TableToolbar v-else-if="type == 'table'" @reset-toolbar="layerRef!.setPosition()" :tooltip="config.tooltip!" :color="color" :z-index="zIndex + 1" />
+			<!-- 代码块工具条 -->
+			<CodeBlockToolbar v-else-if="type == 'codeBlock'" ref="codeBlockToolbarRef" :language="config.codeBlock!.languages!" :tooltip="config.tooltip!" :color="color" :z-index="zIndex + 1" />
+			<!-- 文本工具条 -->
+			<template v-else-if="type == 'text'">
+				<component v-for="(btn, index) in textToolbarBtns" :ref="el => (textToolbarBtnRefs[index] = (el as BtnComponentPublicInstance))" :is="btn" :color="color" :z-index="zIndex + 1" :config="textButtonConfig(btn.name)" :tooltip="config.tooltip!" />
+			</template>
+		</div>
+	</Layer>
+</template>
+<script setup lang="ts">
+import { ComponentPublicInstance, computed, ref, shallowRef } from 'vue'
+import { Layer } from '@/components/layer'
+import { Button } from '@/components/button'
+import { ToolbarProps } from './props'
+import { linkToolbar } from '@/feature/link'
+import { ImageToolbar } from '@/feature/image'
+import { VideoToolbar } from '@/feature/video'
+import { TableToolbar } from '@/feature/table'
+import { CodeBlockToolbar } from '@/feature/codeBlock'
+import { HeadingToolbarButton } from '@/feature/heading'
+import { AlignToolbarButton } from '@/feature/align'
+import { OrderListToolbarButton } from '@/feature/orderList'
+import { UnorderListToolbarButton } from '@/feature/unorderList'
+import { TaskToolbarButton } from '@/feature/task'
+import { BoldToolbarButton } from '@/feature/bold'
+import { ItalicToolbarButton } from '@/feature/italic'
+import { StrikethroughToolbarButton } from '@/feature/strikethrough'
+import { UnderlineToolbarButton } from '@/feature/underline'
+import { CodeToolbarButton } from '@/feature/code'
+import { SuperToolbarButton } from '@/feature/super'
+import { SubToolbarButton } from '@/feature/sub'
+import { FontSizeToolbarButton } from '@/feature/fontSize'
+import { FontFamilyToolbarButton } from '@/feature/fontFamily'
+import { LineHeightToolbarButton } from '@/feature/lineHeight'
+import { ForeColorToolbarButton } from '@/feature/foreColor'
+import { BackColorToolbarButton } from '@/feature/backColor'
+import { FormatClearToolbarButton } from '@/feature/formatClear'
+
+defineOptions({
+	name: 'Toolbar'
+})
+//属性
+const props = defineProps(ToolbarProps)
+//事件
+const emits = defineEmits(['update:modelValue'])
+
+//工具条浮层组件实例
+const layerRef = ref<InstanceType<typeof Layer> | null>(null)
+//文本按钮实例类型
+type BtnComponentPublicInstance = ComponentPublicInstance & { btnRef: InstanceType<typeof Button> }
+//代码块语言选择按钮实例
+const codeBlockToolbarRef = ref<BtnComponentPublicInstance | null>(null)
+//文本工具条按钮数组
+const textToolbarBtns = shallowRef([HeadingToolbarButton, AlignToolbarButton, OrderListToolbarButton, UnorderListToolbarButton, TaskToolbarButton, BoldToolbarButton, ItalicToolbarButton, StrikethroughToolbarButton, UnderlineToolbarButton, CodeToolbarButton, SuperToolbarButton, SubToolbarButton, FontSizeToolbarButton, FontFamilyToolbarButton, LineHeightToolbarButton, ForeColorToolbarButton, BackColorToolbarButton, FormatClearToolbarButton])
+//文本工具条按钮实例
+const textToolbarBtnRefs = ref<BtnComponentPublicInstance[]>([])
+
+//是否显示工具条
+const show = computed<boolean>({
+	get() {
+		return props.modelValue
+	},
+	set(val) {
+		emits('update:modelValue', val)
+	}
+})
+//点击不关闭工具条浮层的元素（算在工具条浮层元素范围内）
+const insideElements = computed<HTMLElement[]>(() => {
+	let elements: HTMLElement[] = []
+	//语言选择浮层元素
+	if (codeBlockToolbarRef.value && codeBlockToolbarRef.value.btnRef && codeBlockToolbarRef.value.btnRef.layerRef && codeBlockToolbarRef.value.btnRef.layerRef.elRef) {
+		elements.push(codeBlockToolbarRef.value.btnRef.layerRef.elRef)
+	}
+	textToolbarBtnRefs.value.forEach(el => {
+		if (el && el.btnRef && el.btnRef.layerRef && el.btnRef.layerRef.elRef) {
+			elements.push(el.btnRef.layerRef.elRef)
+		}
+	})
+	return elements
+})
+//文本按钮配置
+const textButtonConfig = computed<any>(() => {
+	return (name: string) => {
+		return (props.config.text as any)[name.replace('_', '')]
+	}
+})
+
+defineExpose({
+	layerRef
+})
+</script>
+<style scoped src="./toolbar.less"></style>

package/src/feature/align.ts

@@ -0,0 +1,126 @@
+import { defineComponent, h, inject, PropType, Ref, ref } from 'vue'
+import { AlexElementsRangeType, AlexEditor } from 'alex-editor'
+import { MenuSelectButtonType } from '@/core/tool'
+import { hasPreInRange, setAlign } from '@/core/function'
+import { Button } from '@/components/button'
+import { Icon } from '@/components/icon'
+
+/**
+ * feature名称
+ */
+const FEATURE_NAME = 'align'
+
+/**
+ * 工具栏 - 对齐方式
+ */
+export const AlignToolbarButton = defineComponent(
+	(props, { expose }) => {
+		const editor = inject<Ref<AlexEditor>>('editor')!
+		const dataRangeCaches = inject<Ref<AlexElementsRangeType>>('dataRangeCaches')!
+		const $editTrans = inject<(key: string) => any>('$editTrans')!
+
+		const btnRef = ref<InstanceType<typeof Button> | null>(null)
+
+		expose({
+			btnRef
+		})
+
+		return () => {
+			return props.config.show
+				? h(
+						Button,
+						{
+							ref: btnRef,
+							name: FEATURE_NAME,
+							type: 'select',
+							title: $editTrans('align'),
+							tooltip: props.tooltip,
+							color: props.color,
+							zIndex: props.zIndex,
+							leftBorder: props.config.leftBorder,
+							rightBorder: props.config.rightBorder,
+							active: false,
+							disabled: props.config.disabled,
+							selectConfig: {
+								options: props.config.options,
+								width: props.config.width,
+								maxHeight: props.config.maxHeight
+							},
+							onOperate: (_name: string, val: 'left' | 'right' | 'center' | 'justify') => {
+								setAlign(editor.value, dataRangeCaches.value, val)
+								editor.value.domRender()
+								editor.value.rangeRender()
+							}
+						},
+						{
+							default: () => h(Icon, { value: 'align-left' })
+						}
+				  )
+				: null
+		}
+	},
+	{
+		name: `_${FEATURE_NAME}`,
+		props: {
+			color: String,
+			zIndex: Number,
+			config: Object as PropType<MenuSelectButtonType>,
+			tooltip: Boolean
+		}
+	}
+)
+
+/**
+ * 菜单栏 - 对齐方式
+ */
+export const AlignMenuButton = defineComponent(
+	props => {
+		const editor = inject<Ref<AlexEditor>>('editor')!
+		const dataRangeCaches = inject<Ref<AlexElementsRangeType>>('dataRangeCaches')!
+		const $editTrans = inject<(key: string) => any>('$editTrans')!
+		const isSourceView = inject<Ref<boolean>>('isSourceView')!
+
+		return () => {
+			return props.config.show
+				? h(
+						Button,
+						{
+							name: FEATURE_NAME,
+							tooltip: props.tooltip,
+							color: props.color,
+							zIndex: props.zIndex,
+							type: 'select',
+							title: $editTrans('align'),
+							selectConfig: {
+								options: props.config.options,
+								width: props.config.width,
+								maxHeight: props.config.maxHeight
+							},
+							leftBorder: props.config.leftBorder,
+							rightBorder: props.config.rightBorder,
+							active: false,
+							disabled: props.disabled || isSourceView.value || hasPreInRange(editor.value, dataRangeCaches.value) || props.config.disabled,
+							onOperate: (_name, val: 'left' | 'right' | 'center' | 'justify') => {
+								setAlign(editor.value, dataRangeCaches.value, val)
+								editor.value.domRender()
+								editor.value.rangeRender()
+							}
+						},
+						{
+							default: () => h(Icon, { value: 'align-left' })
+						}
+				  )
+				: null
+		}
+	},
+	{
+		name: `_${FEATURE_NAME}`,
+		props: {
+			color: String,
+			zIndex: Number,
+			config: Object as PropType<MenuSelectButtonType>,
+			tooltip: Boolean,
+			disabled: Boolean
+		}
+	}
+)

package/src/feature/attachment.ts

@@ -0,0 +1,108 @@
+import { defineComponent, h, inject, PropType, ref, Ref } from 'vue'
+import { AlexEditor, AlexElement, AlexElementsRangeType } from 'alex-editor'
+import { MenuAttachmentButtonType, ObjectType } from '@/core/tool'
+import { Button } from '@/components/button'
+import { hasMathformulaInRange, hasPreInRange } from '@/core/function'
+import { Icon } from '@/components/icon'
+import { InsertAttachment } from '@/components/insertAttachment'
+
+/**
+ * feature名称
+ */
+const FEATURE_NAME = 'attachment'
+
+/**
+ * 菜单栏 - 插入附件
+ */
+export const AttachmentMenuButton = defineComponent(
+	props => {
+		const editor = inject<Ref<AlexEditor>>('editor')!
+		const dataRangeCaches = inject<Ref<AlexElementsRangeType>>('dataRangeCaches')!
+		const $editTrans = inject<(key: string) => any>('$editTrans')!
+		const isSourceView = inject<Ref<boolean>>('isSourceView')!
+
+		const btnRef = ref<InstanceType<typeof Button> | null>(null)
+
+		return () => {
+			return props.config.show
+				? h(
+						Button,
+						{
+							ref: btnRef,
+							name: FEATURE_NAME,
+							tooltip: props.tooltip,
+							color: props.color,
+							zIndex: props.zIndex,
+							type: 'select',
+							hideScroll: true,
+							title: $editTrans('insertAttachment'),
+							leftBorder: props.config.leftBorder,
+							rightBorder: props.config.rightBorder,
+							active: false,
+							disabled: props.disabled || isSourceView.value || hasPreInRange(editor.value, dataRangeCaches.value) || hasMathformulaInRange(editor.value, dataRangeCaches.value) || props.config.disabled
+						},
+						{
+							default: () =>
+								h(Icon, {
+									value: 'attachment'
+								}),
+							layer: () =>
+								h(InsertAttachment, {
+									color: props.color,
+									accept: props.config.accept,
+									allowedFileType: props.config.allowedFileType,
+									multiple: props.config.multiple,
+									maxSize: props.config.maxSize,
+									minSize: props.config.minSize,
+									customUpload: props.config.customUpload,
+									handleError: props.config.handleError,
+									onChange: () => btnRef.value!.layerRef!.setPosition(),
+									onInsert: (name: string, urls: string[]) => {
+										//过滤掉空的地址
+										urls = urls.filter(url => {
+											return !!url
+										})
+										//如果有地址存在
+										if (urls.length) {
+											//遍历地址数组
+											urls.forEach(url => {
+												const marks: ObjectType = {
+													'data-editify-attachment': url,
+													'data-editify-attachment-name': name || $editTrans('attachmentDefaultName')
+												}
+												//创建元素
+												const attachmentElement = AlexElement.create({
+													type: 'closed',
+													parsedom: 'span',
+													marks
+												})
+												//插入编辑器
+												editor.value.insertElement(attachmentElement)
+												//移动光标到新插入的元素
+												editor.value.range!.anchor.moveToEnd(attachmentElement)
+												editor.value.range!.focus.moveToEnd(attachmentElement)
+											})
+											//渲染
+											editor.value.domRender()
+											editor.value.rangeRender()
+										}
+										//关闭浮层
+										btnRef.value!.show = false
+									}
+								})
+						}
+				  )
+				: null
+		}
+	},
+	{
+		name: `_${FEATURE_NAME}`,
+		props: {
+			color: String,
+			zIndex: Number,
+			config: Object as PropType<MenuAttachmentButtonType>,
+			tooltip: Boolean,
+			disabled: Boolean
+		}
+	}
+)