@vyr/element-plus-browser 0.0.1 → 0.0.3

package/package.json

@@ -1,26 +1 @@
-{
-  "name": "@vyr/element-plus-browser",
-  "version": "0.0.1",
-  "description": "",
-  "main": "./src/index.ts",
-  "author": "",
-  "license": "MIT",
-  "dependencies": {
-    "@vyr/locale": "0.0.1",
-    "@vyr/runtime": "0.0.1",
-    "@vyr/engine": "0.0.1",
-    "@vyr/design": "0.0.1",
-    "@vyr/builtin": "0.0.1",
-    "@vyr/vue": "0.0.1",
-    "@vyr/element-plus": "0.0.1",
-    "vue": "3.5.22"
-  },
-  "files": [
-    "package.json",
-    "src/"
-  ],
-  "vyr": {
-    "type": "browser",
-    "order": 1001
-  }
-}
+{"name":"@vyr/element-plus-browser","version":"0.0.3","description":"","main":"./src/index.ts","author":"","license":"MIT","dependencies":{"@vyr/locale":"0.0.3","@vyr/runtime":"0.0.3","@vyr/engine":"0.0.3","@vyr/design":"0.0.3","@vyr/builtin":"0.0.3","@vyr/vue":"0.0.3","@vyr/element-plus":"0.0.3","vue":"3.5.22"},"files":["package.json","src/"],"vyr":{"type":"browser","order":1001}}

package/src/locale/LanguageProvider.ts

@@ -64,6 +64,8 @@ interface ZhCNLanguageProvider extends LanguageProvider {
     'option.ElForm.position.left': string
     'option.ElForm.position.right': string
     'option.ElForm.position.top': string
+    'option.ElForm.validate.0': string
+    'option.ElForm.validate.1': string
 
     'option.ElInput.switch.open': string
     'option.ElInput.switch.close': string
@@ -276,6 +278,8 @@ const zhCnLanguageProvider: ZhCNLanguageProvider = {
     'option.ElForm.position.left': '左侧',
     'option.ElForm.position.right': '右侧',
     'option.ElForm.position.top': '顶部',
+    'option.ElForm.validate.0': '禁用表单验证',
+    'option.ElForm.validate.1': '启用表单验证',
 
     'option.ElInput.switch.open': '开启',
     'option.ElInput.switch.close': '关闭',

package/src/option/Form.ts

@@ -10,7 +10,13 @@ const positionOptions = [
     { label: language.get('option.ElForm.position.top'), value: 'top' },
 ]
 
+const validateOptions = [
+    { label: language.get('option.ElForm.validate.0'), value: '0' },
+    { label: language.get('option.ElForm.validate.1'), value: '1' },
+]
+
 export {
     inlineOptions,
     positionOptions,
+    validateOptions,
 }

package/src/option/Preset.ts

@@ -0,0 +1,40 @@
+import { ArrayUtils, executePreset as _executePreset } from '@vyr/engine'
+import { DataService, runtime } from '@vyr/runtime'
+import { Option } from '@vyr/design'
+import { ElDialogDescriptor, ElFormDescriptor, ElPaginationDescriptor } from '@vyr/element-plus'
+
+const getSelectOptions = () => {
+    const dataService = runtime.get<DataService>('data')
+    const navigator = dataService.sidebar.get(dataService.sidebar.active)
+    const forms: Option[] = []
+    const dialogs: Option[] = []
+    const paginations: Option[] = []
+
+    if (navigator) {
+        const interactionIds: string[] = []
+        navigator.root.traverse(child => {
+            if (child.interactions.length > 0) {
+                for (const interaction of child.interactions) {
+                    ArrayUtils.insert(interactionIds, interaction.type)
+                }
+            }
+            if (child instanceof ElFormDescriptor) {
+                forms.push({ label: child.name, value: child.uuid })
+            } else if (child instanceof ElDialogDescriptor) {
+                dialogs.push({ label: child.name, value: child.uuid })
+            } else if (child instanceof ElPaginationDescriptor) {
+                paginations.push({ label: child.name, value: child.uuid })
+            }
+        })
+    }
+
+    return {
+        forms,
+        dialogs,
+        paginations,
+    }
+}
+
+export {
+    getSelectOptions
+}

package/src/option/index.ts

@@ -1,3 +1,4 @@
+export * as Preset from './Preset'
 export * as Button from './Button'
 export * as Row from './Row'
 export * as Input from './Input'

package/src/preset/ElTable.ts

@@ -1,48 +1,17 @@
-import { ArrayUtils, Descriptor, Generate, executePreset as _executePreset } from '@vyr/engine'
-import { ElDialogDescriptor, ElFormDescriptor, ElPaginationDescriptor, executePreset, routinePreset } from '@vyr/element-plus'
-import { DataService, Preset, runtime } from '@vyr/runtime'
-import { dialog, DialogOptions, Option } from '@vyr/design'
+import { Descriptor, Generate, HttpType, executePreset as _executePreset } from '@vyr/engine'
+import { executePreset, interactionPreset } from '@vyr/element-plus'
+import { Preset } from '@vyr/runtime'
+import { dialog, DialogOptions } from '@vyr/design'
 import { language as builtinLanguage, option } from '@vyr/builtin'
 import { language } from '../locale'
-
-const getSelectOptions = () => {
-    const dataService = runtime.get<DataService>('data')
-    const navigator = dataService.sidebar.get(dataService.sidebar.active)
-    const forms: Option[] = []
-    const dialogs: Option[] = []
-    const paginations: Option[] = []
-
-    if (navigator) {
-        const interactionIds: string[] = []
-        navigator.root.traverse(child => {
-            if (child.interactions.length > 0) {
-                for (const interaction of child.interactions) {
-                    ArrayUtils.insert(interactionIds, interaction.type)
-                }
-            }
-            if (child instanceof ElFormDescriptor) {
-                forms.push({ label: child.name, value: child.uuid })
-            } else if (child instanceof ElDialogDescriptor) {
-                dialogs.push({ label: child.name, value: child.uuid })
-            } else if (child instanceof ElPaginationDescriptor) {
-                paginations.push({ label: child.name, value: child.uuid })
-            }
-        })
-    }
-
-    return {
-        forms,
-        dialogs,
-        paginations,
-    }
-}
+import { Preset as _Preset } from "../option";
 
 const listPreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.list'),
-    value: 'preset.ElTable.list',
+    value: interactionPreset.ElTable.list.url,
     executor: async (descriptor: Descriptor) => {
-        const { forms, paginations } = getSelectOptions()
+        const { forms, paginations } = _Preset.getSelectOptions()
         const { datasets } = option.Preset.getSelectOptions()
 
         const options: DialogOptions = [
@@ -80,16 +49,16 @@ const listPreset: Preset = {
 
         const requestArgs = {
             url: result.value.url,
-            type: _executePreset.net.request.RequestType.GET,
-            data: `${routinePreset.ElTable.list.nodes.form},${routinePreset.ElTable.list.nodes.pagination}`
+            type: HttpType.GET,
+            data: `${interactionPreset.ElTable.list.nodes.form},${interactionPreset.ElTable.list.nodes.pagination}`
         }
         const inputs = {
-            [routinePreset.ElTable.list.nodes.form]: executePreset.ElForm.getData.createExecuteInput({ form: result.value.form }),
-            [routinePreset.ElTable.list.nodes.pagination]: executePreset.ElPagination.getData.createExecuteInput({ pagination: result.value.pagination }),
-            [routinePreset.ElTable.list.nodes.request]: _executePreset.net.request.createExecuteInput(requestArgs),
-            [routinePreset.ElTable.list.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ url: result.value.dataset }),
+            [interactionPreset.ElTable.list.nodes.form]: executePreset.ElForm.getData.createExecuteInput({ form: result.value.form }),
+            [interactionPreset.ElTable.list.nodes.pagination]: executePreset.ElPagination.getData.createExecuteInput({ pagination: result.value.pagination }),
+            [interactionPreset.ElTable.list.nodes.request]: _executePreset.net.http.createExecuteInput(requestArgs),
+            [interactionPreset.ElTable.list.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ dataset: result.value.dataset }),
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.list.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.list.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -97,9 +66,9 @@ const listPreset: Preset = {
 const resetPreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.reset'),
-    value: 'preset.ElTable.reset',
+    value: interactionPreset.ElTable.reset.url,
     executor: async (descriptor: Descriptor) => {
-        const { forms, paginations } = getSelectOptions()
+        const { forms, paginations } = _Preset.getSelectOptions()
         const { interactionTargets } = option.Preset.getSelectOptions()
 
         const options: DialogOptions = [
@@ -141,14 +110,14 @@ const resetPreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElTable.reset.nodes.form]: executePreset.ElForm.reset.createExecuteInput({ form: result.value.form }),
-            [routinePreset.ElTable.reset.nodes.pagination]: executePreset.ElPagination.reset.createExecuteInput({ pagination: result.value.pagination }),
-            [routinePreset.ElTable.reset.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
+            [interactionPreset.ElTable.reset.nodes.form]: executePreset.ElForm.reset.createExecuteInput({ form: result.value.form }),
+            [interactionPreset.ElTable.reset.nodes.pagination]: executePreset.ElPagination.reset.createExecuteInput({ pagination: result.value.pagination }),
+            [interactionPreset.ElTable.reset.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
                 target: result.value.target,
                 interaction: result.value.interaction,
             })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.reset.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.reset.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -156,9 +125,9 @@ const resetPreset: Preset = {
 const createPreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.create'),
-    value: 'preset.ElTable.create',
+    value: interactionPreset.ElTable.create.url,
     executor: async (descriptor: Descriptor) => {
-        const { dialogs } = getSelectOptions()
+        const { dialogs } = _Preset.getSelectOptions()
         const { datasets } = option.Preset.getSelectOptions()
         const options: DialogOptions = [
             {
@@ -187,14 +156,14 @@ const createPreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElTable.create.nodes.create]: executePreset.ElTable.create.createExecuteInput({}),
-            [routinePreset.ElTable.create.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ url: result.value.dataset }),
-            [routinePreset.ElTable.create.nodes.dialog]: executePreset.ElDialog.open.createExecuteInput({
+            [interactionPreset.ElTable.create.nodes.create]: executePreset.ElTable.create.createExecuteInput({}),
+            [interactionPreset.ElTable.create.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ dataset: result.value.dataset }),
+            [interactionPreset.ElTable.create.nodes.dialog]: executePreset.ElDialog.open.createExecuteInput({
                 dialog: result.value.dialog,
                 title: result.value.title
             })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.create.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.create.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -202,9 +171,9 @@ const createPreset: Preset = {
 const editPreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.edit'),
-    value: 'preset.ElTable.edit',
+    value: interactionPreset.ElTable.edit.url,
     executor: async (descriptor: Descriptor) => {
-        const { dialogs } = getSelectOptions()
+        const { dialogs } = _Preset.getSelectOptions()
         const { datasets } = option.Preset.getSelectOptions()
         const options: DialogOptions = [
             {
@@ -239,18 +208,18 @@ const editPreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElTable.edit.nodes.edit]: executePreset.ElTable.edit.createExecuteInput({}),
-            [routinePreset.ElTable.edit.nodes.request]: _executePreset.net.request.createExecuteInput({
+            [interactionPreset.ElTable.edit.nodes.edit]: executePreset.ElTable.edit.createExecuteInput({}),
+            [interactionPreset.ElTable.edit.nodes.request]: _executePreset.net.http.createExecuteInput({
                 url: result.value.url,
-                type: _executePreset.net.request.RequestType.GET
+                type: HttpType.GET
             }),
-            [routinePreset.ElTable.edit.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ url: result.value.dataset }),
-            [routinePreset.ElTable.edit.nodes.dialog]: executePreset.ElDialog.open.createExecuteInput({
+            [interactionPreset.ElTable.edit.nodes.dataset]: _executePreset.dataset.update.createExecuteInput({ dataset: result.value.dataset }),
+            [interactionPreset.ElTable.edit.nodes.dialog]: executePreset.ElDialog.open.createExecuteInput({
                 dialog: result.value.dialog,
                 title: result.value.title
             })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.edit.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.edit.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -258,7 +227,7 @@ const editPreset: Preset = {
 const deletePreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.delete'),
-    value: 'preset.ElTable.delete',
+    value: interactionPreset.ElTable.delete.url,
     executor: async (descriptor: Descriptor) => {
         const { interactionTargets } = option.Preset.getSelectOptions()
         const options: DialogOptions = [
@@ -292,17 +261,17 @@ const deletePreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElTable.delete.nodes.delete]: executePreset.ElTable.delete.createExecuteInput({}),
-            [routinePreset.ElTable.delete.nodes.request]: _executePreset.net.request.createExecuteInput({
+            [interactionPreset.ElTable.delete.nodes.delete]: executePreset.ElTable.delete.createExecuteInput({}),
+            [interactionPreset.ElTable.delete.nodes.request]: _executePreset.net.http.createExecuteInput({
                 url: result.value.url,
-                type: _executePreset.net.request.RequestType.DELETE,
+                type: HttpType.DELETE,
             }),
-            [routinePreset.ElTable.delete.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
+            [interactionPreset.ElTable.delete.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
                 target: result.value.target,
                 interaction: result.value.interaction,
             })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.delete.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.delete.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -310,9 +279,9 @@ const deletePreset: Preset = {
 const submitPreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.submit'),
-    value: 'preset.ElTable.submit',
+    value: interactionPreset.ElTable.submit.url,
     executor: async (descriptor: Descriptor) => {
-        const { forms, dialogs } = getSelectOptions()
+        const { forms, dialogs } = _Preset.getSelectOptions()
         const { interactionTargets } = option.Preset.getSelectOptions()
 
         const options: DialogOptions = [
@@ -360,27 +329,27 @@ const submitPreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElTable.submit.nodes.form]: executePreset.ElForm.getData.createExecuteInput({ form: result.value.form, validate: '1' }),
-            [routinePreset.ElTable.submit.nodes.branch]: executePreset.ElForm.branch.createExecuteInput({ primaryKey: 'id', }),
-            [routinePreset.ElTable.submit.nodes.create]: executePreset.ElForm.create.createExecuteInput({}),
-            [routinePreset.ElTable.submit.nodes.edit]: executePreset.ElForm.edit.createExecuteInput({}),
-            [routinePreset.ElTable.submit.nodes.createRequest]: _executePreset.net.request.createExecuteInput({
+            [interactionPreset.ElTable.submit.nodes.form]: executePreset.ElForm.getData.createExecuteInput({ form: result.value.form, validate: '1' }),
+            [interactionPreset.ElTable.submit.nodes.branch]: executePreset.ElForm.branch.createExecuteInput({ primaryKey: 'id', }),
+            [interactionPreset.ElTable.submit.nodes.create]: executePreset.ElForm.create.createExecuteInput({}),
+            [interactionPreset.ElTable.submit.nodes.edit]: executePreset.ElForm.edit.createExecuteInput({}),
+            [interactionPreset.ElTable.submit.nodes.createRequest]: _executePreset.net.http.createExecuteInput({
                 url: result.value.url,
-                type: _executePreset.net.request.RequestType.POST,
-                data: routinePreset.ElTable.submit.nodes.form,
+                type: HttpType.POST,
+                data: interactionPreset.ElTable.submit.nodes.form,
             }),
-            [routinePreset.ElTable.submit.nodes.editRequest]: _executePreset.net.request.createExecuteInput({
+            [interactionPreset.ElTable.submit.nodes.editRequest]: _executePreset.net.http.createExecuteInput({
                 url: result.value.url,
-                type: _executePreset.net.request.RequestType.PUT,
-                data: routinePreset.ElTable.submit.nodes.form,
+                type: HttpType.PUT,
+                data: interactionPreset.ElTable.submit.nodes.form,
             }),
-            [routinePreset.ElTable.submit.nodes.dialog]: executePreset.ElDialog.close.createExecuteInput({ dialog: result.value.dialog }),
-            [routinePreset.ElTable.submit.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
+            [interactionPreset.ElTable.submit.nodes.dialog]: executePreset.ElDialog.close.createExecuteInput({ dialog: result.value.dialog }),
+            [interactionPreset.ElTable.submit.nodes.refresh]: _executePreset.graphics.invoke.createExecuteInput({
                 target: result.value.target,
                 interaction: result.value.interaction,
             })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElTable.submit.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElTable.submit.url, inputs }
         descriptor.interactions.push(config)
     }
 }
@@ -388,9 +357,9 @@ const submitPreset: Preset = {
 const closePreset: Preset = {
     type: 'interaction',
     label: language.get('preset.ElTable.close'),
-    value: 'preset.ElTable.close',
+    value: interactionPreset.ElDialog.close.url,
     executor: async (descriptor: Descriptor) => {
-        const { dialogs } = getSelectOptions()
+        const { dialogs } = _Preset.getSelectOptions()
 
         const options: DialogOptions = [
             {
@@ -407,9 +376,9 @@ const closePreset: Preset = {
         if (result.success === false) return
 
         const inputs = {
-            [routinePreset.ElDialog.close.nodes.dialog]: executePreset.ElDialog.close.createExecuteInput({ dialog: result.value.dialog })
+            [interactionPreset.ElDialog.close.nodes.dialog]: executePreset.ElDialog.close.createExecuteInput({ dialog: result.value.dialog })
         }
-        const config = { uuid: Generate.uuid(), type: 'click', url: routinePreset.ElDialog.close.url, inputs }
+        const config = { uuid: Generate.uuid(), type: 'click', url: interactionPreset.ElDialog.close.url, inputs }
         descriptor.interactions.push(config)
     }
 }

package/src/service/global/scripts/index.ts

@@ -1,57 +1,165 @@
+import { option } from "@vyr/builtin";
 import { executePreset, language } from '@vyr/element-plus'
+import { Form, Preset } from "../../../option";
 
 const scripts = [
     {
         label: language.get(executePreset.ElForm.branch.scriptable as any),
         value: executePreset.ElForm.branch.scriptable,
+        getDefaultInput: executePreset.ElForm.branch.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                primaryKey: () => {
+                    return []
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElForm.create.scriptable as any),
         value: executePreset.ElForm.create.scriptable,
+        getDefaultInput: executePreset.ElForm.create.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                condition: () => {
+                    return []
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElForm.edit.scriptable as any),
         value: executePreset.ElForm.edit.scriptable,
+        getDefaultInput: executePreset.ElForm.edit.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                condition: () => {
+                    return []
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElForm.getData.scriptable as any),
         value: executePreset.ElForm.getData.scriptable,
+        getDefaultInput: executePreset.ElForm.getData.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                form: () => {
+                    const { forms } = Preset.getSelectOptions()
+                    return forms
+                },
+                validate: () => Form.validateOptions
+            }
+        }
     },
     {
         label: language.get(executePreset.ElForm.reset.scriptable as any),
         value: executePreset.ElForm.reset.scriptable,
+        getDefaultInput: executePreset.ElForm.reset.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                form: () => {
+                    const { forms } = Preset.getSelectOptions()
+                    return forms
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElPagination.getData.scriptable as any),
         value: executePreset.ElPagination.getData.scriptable,
+        getDefaultInput: executePreset.ElPagination.getData.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                pagination: () => {
+                    const { paginations } = Preset.getSelectOptions()
+                    return paginations
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElPagination.reset.scriptable as any),
         value: executePreset.ElPagination.reset.scriptable,
+        getDefaultInput: executePreset.ElPagination.reset.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                pagination: () => {
+                    const { paginations } = Preset.getSelectOptions()
+                    return paginations
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElTable.create.scriptable as any),
         value: executePreset.ElTable.create.scriptable,
+        getDefaultInput: executePreset.ElTable.create.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+
+            }
+        }
     },
     {
         label: language.get(executePreset.ElTable.delete.scriptable as any),
         value: executePreset.ElTable.delete.scriptable,
+        getDefaultInput: executePreset.ElTable.delete.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+
+            }
+        }
     },
     {
         label: language.get(executePreset.ElTable.edit.scriptable as any),
         value: executePreset.ElTable.edit.scriptable,
+        getDefaultInput: executePreset.ElTable.edit.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+
+            }
+        }
     },
     {
         label: language.get(executePreset.ElTableColumn.formatter.scriptable as any),
         value: executePreset.ElTableColumn.formatter.scriptable,
+        getDefaultInput: executePreset.ElTableColumn.formatter.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                dataset: () => {
+                    const { datasets } = option.Preset.getSelectOptions()
+                    return datasets
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElDialog.open.scriptable as any),
         value: executePreset.ElDialog.open.scriptable,
+        getDefaultInput: executePreset.ElDialog.open.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                dialog: () => {
+                    const { dialogs } = Preset.getSelectOptions()
+                    return dialogs
+                }
+            }
+        }
     },
     {
         label: language.get(executePreset.ElDialog.close.scriptable as any),
         value: executePreset.ElDialog.close.scriptable,
+        getDefaultInput: executePreset.ElDialog.close.createExecuteInput,
+        getPropertyOptions: () => {
+            return {
+                dialog: () => {
+                    const { dialogs } = Preset.getSelectOptions()
+                    return dialogs
+                }
+            }
+        }
     },
 ]
 

package/src/service/inspector/ElButton.vue

@@ -55,6 +55,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Button } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElButtonDescriptor>()
 const draggableService = runtime.get<DraggableService>('draggable')
 const draggable = draggableService.get(draggableService.key.inspector)

package/src/service/inspector/ElCascader.vue

@@ -89,6 +89,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElCascaderDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElCheckbox.vue

@@ -82,6 +82,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElCheckboxDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElCol.vue

@@ -23,6 +23,8 @@ import { ElColDescriptor } from '@vyr/element-plus';
 import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElColDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElDatePicker.vue

@@ -86,6 +86,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElDatePickerDescriptor>()
 </script>
 

package/src/service/inspector/ElDialog.vue

@@ -24,6 +24,8 @@ import { language } from '../../locale'
 import { Dialog } from '../../option'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElDialogDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElForm.vue

@@ -38,6 +38,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Form } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElFormDescriptor>()
 </script>
 

package/src/service/inspector/ElInput.vue

@@ -128,6 +128,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElInputDescriptor>()
 </script>
 

package/src/service/inspector/ElInputNumber.vue

@@ -72,6 +72,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElInputNumberDescriptor>()
 </script>
 

package/src/service/inspector/ElMenuItem.vue

@@ -32,6 +32,8 @@ import { ElMenuItemDescriptor } from '@vyr/element-plus';
 import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElMenuItemDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElPagination.vue

@@ -94,6 +94,8 @@ import { ElPaginationDescriptor } from '@vyr/element-plus';
 import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElPaginationDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElRadio.vue

@@ -82,6 +82,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElRadioDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElRow.vue

@@ -30,6 +30,8 @@ import { language } from '../../locale'
 import { Row } from '../../option';
 import { useDescriptor } from '../../common';
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElRowDescriptor>()
 </script>
 

package/src/service/inspector/ElSelect.vue

@@ -89,6 +89,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElSelectDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElSubMenu.vue

@@ -23,6 +23,8 @@ import { ElSubMenuDescriptor } from '@vyr/element-plus';
 import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElSubMenuDescriptor>()
 
 const draggableService = runtime.get<DraggableService>('draggable')

package/src/service/inspector/ElSwitch.vue

@@ -52,6 +52,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Input } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElSwitchDescriptor>()
 </script>
 

package/src/service/inspector/ElTable.vue

@@ -38,6 +38,8 @@ import { option } from '@vyr/builtin';
 import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElTableDescriptor>()
 const draggableService = runtime.get<DraggableService>('draggable')
 const draggable = draggableService.get(draggableService.key.inspector)

package/src/service/inspector/ElTableColumn.vue

@@ -97,6 +97,8 @@ import { language } from '../../locale'
 import { useDescriptor } from '../../common'
 import { Column } from '../../option'
 
+defineProps<{ raw: string }>()
+
 const descriptor = useDescriptor<ElTableColumnDescriptor>()
 
 const dataService = runtime.get<DataService>('data')

package/src/service/inspector/VueViewer.vue

@@ -2,7 +2,7 @@
     <vyr-card v-if="descriptor" :title="language.get(`descriptor.type.${descriptor.type}` as any)" :scroll="true">
         <BaseFragment :raw="raw" />
         <HTMLFragment v-if="ignore.includes(descriptor.type) === false" :raw="raw" />
-        <component :is="PropsViewer" :raw="raw"></component>
+        <component :is="PropsViewer"></component>
     </vyr-card>
 </template>