From 1724bbc945123d1741d8b26af6880bc1a3e32a5d Mon Sep 17 00:00:00 2001 From: Hexqi Date: Thu, 6 Jun 2024 20:34:24 +0800 Subject: [PATCH] feat: add hooks entry (#550) * feat: add hooks api in entry --- designer-demo/package.json | 1 - .../components/container/shortCutPopover.vue | 2 +- packages/common/package.json | 1 - packages/controller/js/canvas.js | 3 +- packages/controller/js/completion.js | 3 +- packages/controller/js/http.js | 5 +- packages/controller/js/preview.js | 2 +- .../src/{ => components}/useModal.jsx | 0 .../src/{ => components}/useNotify.jsx | 0 packages/controller/src/hooks/mountHooks.js | 15 +++++ packages/controller/src/{ => hooks}/useApp.js | 8 +++ .../controller/src/{ => hooks}/useBlock.js | 67 ++++++++++++++++--- .../src/{ => hooks}/useBreadcrumb.js | 8 +++ .../controller/src/{ => hooks}/useCanvas.js | 22 +++++- .../src/{ => hooks}/useDataSource.js | 5 +- .../src/{ => hooks}/useEditorInfo.js | 10 ++- .../controller/src/{ => hooks}/useHelp.js | 7 ++ .../controller/src/{ => hooks}/useHistory.js | 11 ++- .../controller/src/{ => hooks}/useLayout.js | 17 +++++ .../controller/src/{ => hooks}/usePage.js | 15 +++++ .../src/{ => hooks}/useProperties.js | 24 +++++-- .../controller/src/{ => hooks}/useProperty.js | 42 +++++++----- .../controller/src/{ => hooks}/useResource.js | 43 +++++++++--- .../src/{ => hooks}/useSaveLocal.js | 11 ++- .../src/{ => hooks}/useTranslate.js | 26 +++++-- packages/controller/src/index.js | 39 ++++------- packages/entry/src/hooks.js | 61 +++++++++++++++++ packages/entry/src/index.js | 1 + packages/settings/props/src/Main.vue | 2 +- 29 files changed, 357 insertions(+), 94 deletions(-) rename packages/controller/src/{ => components}/useModal.jsx (100%) rename packages/controller/src/{ => components}/useNotify.jsx (100%) create mode 100644 packages/controller/src/hooks/mountHooks.js rename packages/controller/src/{ => hooks}/useApp.js (91%) rename packages/controller/src/{ => hooks}/useBlock.js (94%) rename packages/controller/src/{ => hooks}/useBreadcrumb.js (84%) rename packages/controller/src/{ => hooks}/useCanvas.js (90%) rename packages/controller/src/{ => hooks}/useDataSource.js (95%) rename packages/controller/src/{ => hooks}/useEditorInfo.js (89%) rename packages/controller/src/{ => hooks}/useHelp.js (87%) rename packages/controller/src/{ => hooks}/useHistory.js (93%) rename packages/controller/src/{ => hooks}/useLayout.js (91%) rename packages/controller/src/{ => hooks}/usePage.js (92%) rename packages/controller/src/{ => hooks}/useProperties.js (93%) rename packages/controller/src/{ => hooks}/useProperty.js (93%) rename packages/controller/src/{ => hooks}/useResource.js (95%) rename packages/controller/src/{ => hooks}/useSaveLocal.js (91%) rename packages/controller/src/{ => hooks}/useTranslate.js (92%) create mode 100644 packages/entry/src/hooks.js diff --git a/designer-demo/package.json b/designer-demo/package.json index 53832406f..8eb81f6d2 100644 --- a/designer-demo/package.json +++ b/designer-demo/package.json @@ -17,7 +17,6 @@ "devDependencies": { "@vitejs/plugin-vue": "^5.0.4", "vite": "^5.2.7", - "@opentiny/tiny-engine-cli": "workspace:^", "@opentiny/tiny-engine-vite-plugin-meta-comments": "workspace:^" } } diff --git a/packages/canvas/src/components/container/shortCutPopover.vue b/packages/canvas/src/components/container/shortCutPopover.vue index 592f13b14..185187991 100644 --- a/packages/canvas/src/components/container/shortCutPopover.vue +++ b/packages/canvas/src/components/container/shortCutPopover.vue @@ -41,7 +41,7 @@ export default { setup(props, { emit }) { const { getMaterial } = useResource() const { pageState } = useCanvas() - const { properties } = useProperty({ pageState }) + const { properties } = useProperty().getProperty({ pageState }) const active = ref('props') const propertiesList = computed(() => { diff --git a/packages/common/package.json b/packages/common/package.json index d72fa0adf..884f4a15f 100644 --- a/packages/common/package.json +++ b/packages/common/package.json @@ -27,7 +27,6 @@ "license": "MIT", "homepage": "https://opentiny.design/tiny-engine", "dependencies": { - "@opentiny/tiny-engine-canvas": "workspace:*", "@opentiny/tiny-engine-controller": "workspace:*", "@opentiny/tiny-engine-entry": "workspace:*", "@opentiny/tiny-engine-http": "workspace:*", diff --git a/packages/controller/js/canvas.js b/packages/controller/js/canvas.js index c73f81c94..3e44935ed 100644 --- a/packages/controller/js/canvas.js +++ b/packages/controller/js/canvas.js @@ -11,8 +11,7 @@ */ import { PAGE_STATUS } from './constants' -import useEditorInfo from '../src/useEditorInfo' -import useResource from '../src/useResource' +import { useEditorInfo, useResource } from '@opentiny/tiny-engine-entry' export const getCanvasStatus = (data) => { // 写死ID 待删除 diff --git a/packages/controller/js/completion.js b/packages/controller/js/completion.js index ddd113870..5ae621066 100644 --- a/packages/controller/js/completion.js +++ b/packages/controller/js/completion.js @@ -10,8 +10,7 @@ * */ -import useCanvas from '../src/useCanvas' -import useResource from '../src/useResource' +import { useCanvas, useResource } from '@opentiny/tiny-engine-entry' const keyWords = [ 'state', diff --git a/packages/controller/js/http.js b/packages/controller/js/http.js index c3315a066..16cf2d162 100644 --- a/packages/controller/js/http.js +++ b/packages/controller/js/http.js @@ -11,11 +11,10 @@ */ import { useHttp } from '@opentiny/tiny-engine-http' -import usePage from '../src/usePage' -import useCanvas from '../src/useCanvas' -import useNotify from '../src/useNotify' +import useNotify from '../src/components/useNotify' import { isVsCodeEnv } from './environments' import { generateRouter, generatePage } from './vscodeGenerateFile' +import { usePage, useCanvas } from '@opentiny/tiny-engine-entry' const http = useHttp() diff --git a/packages/controller/js/preview.js b/packages/controller/js/preview.js index 12840569f..e9d803aa7 100644 --- a/packages/controller/js/preview.js +++ b/packages/controller/js/preview.js @@ -12,7 +12,7 @@ import { constants } from '@opentiny/tiny-engine-utils' import { isDevelopEnv } from './environments' -import useResource from '../src/useResource' +import { useResource } from '@opentiny/tiny-engine-entry' // prefer old unicode hacks for backward compatibility const { COMPONENT_NAME } = constants diff --git a/packages/controller/src/useModal.jsx b/packages/controller/src/components/useModal.jsx similarity index 100% rename from packages/controller/src/useModal.jsx rename to packages/controller/src/components/useModal.jsx diff --git a/packages/controller/src/useNotify.jsx b/packages/controller/src/components/useNotify.jsx similarity index 100% rename from packages/controller/src/useNotify.jsx rename to packages/controller/src/components/useNotify.jsx diff --git a/packages/controller/src/hooks/mountHooks.js b/packages/controller/src/hooks/mountHooks.js new file mode 100644 index 000000000..b9e18f24c --- /dev/null +++ b/packages/controller/src/hooks/mountHooks.js @@ -0,0 +1,15 @@ +import './useLayout' +import './useCanvas' +import './useApp' +import './useResource' +import './useHistory' +import './useProperties' +import './useSaveLocal' +import './useEditorInfo' +import './useBlock' +import './useTranslate' +import './usePage' +import './useDataSource' +import './useBreadcrumb' +import './useProperty' +import './useHelp' diff --git a/packages/controller/src/useApp.js b/packages/controller/src/hooks/useApp.js similarity index 91% rename from packages/controller/src/useApp.js rename to packages/controller/src/hooks/useApp.js index 9a3b840bd..ccb4f7988 100644 --- a/packages/controller/src/useApp.js +++ b/packages/controller/src/hooks/useApp.js @@ -12,6 +12,7 @@ import { reactive, watch } from 'vue' import { useHttp } from '@opentiny/tiny-engine-http' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' const http = useHttp() @@ -71,3 +72,10 @@ export default () => { updateApp } } + +initHook(HOOK_NAME.useApp, { + appInfoState, + fetchAppInfo, + fetchAppList, + updateApp +}) diff --git a/packages/controller/src/useBlock.js b/packages/controller/src/hooks/useBlock.js similarity index 94% rename from packages/controller/src/useBlock.js rename to packages/controller/src/hooks/useBlock.js index e871b9c1c..fe3be2caa 100644 --- a/packages/controller/src/useBlock.js +++ b/packages/controller/src/hooks/useBlock.js @@ -16,15 +16,19 @@ import { extend, copyArray } from '@opentiny/vue-renderless/common/object' import { format } from '@opentiny/vue-renderless/common/date' import { remove } from '@opentiny/vue-renderless/common/array' import { constants } from '@opentiny/tiny-engine-utils' -import { getCanvasStatus } from '../js/canvas' -import { ast2String, parseExpression } from '../js/ast' -import { getCssObjectFromStyleStr } from '../js/css' -import useCanvas from './useCanvas' -import useTranslate from './useTranslate' -import useEditorInfo from './useEditorInfo' -import useBreadcrumb from './useBreadcrumb' -import useLayout from './useLayout' -import { getGlobalConfig } from './globalConfig' +import { getCanvasStatus } from '../../js/canvas' +import { ast2String, parseExpression } from '../../js/ast' +import { getCssObjectFromStyleStr } from '../../js/css' +import { getGlobalConfig } from '../globalConfig' +import { + HOOK_NAME, + initHook, + useCanvas, + useTranslate, + useEditorInfo, + useBreadcrumb, + useLayout +} from '@opentiny/tiny-engine-entry' const { SORT_TYPE, SCHEMA_DATA_TYPE, BLOCK_OPENNESS } = constants @@ -764,3 +768,48 @@ export default function () { getDateFromNow } } + +initHook(HOOK_NAME.useBlock, { + NODE_TYPE_PAGE, + DEFAULT_GROUP_ID, + DEFAULT_GROUP_NAME, + selectedGroup, + selectedBlock, + selectedBlockArray, + isRefresh, + addBlock, + delBlock, + createBlock, + getBlockAssetsByVersion, + createEmptyBlock, + groupChange, + addDefaultGroup, + isDefaultGroupId, + isAllGroupId, + splitBackupGroups, + sort, + check, + cancelCheck, + getBlockList, + setBlockList, + getBlockI18n, + getGroupList, + setGroupList, + getCategoryList, + setCategoryList, + addBlockEvent, + getBlockEvents, + appendEventEmit, + getCurrentBlock, + initBlock, + setCurrentBlock, + removeEventLink, + getSelectedGroup, + setSelectedGroup, + addBlockProperty, + editBlockProperty, + removePropertyLink, + getBlockProperties, + getBlockPageSchema, + getDateFromNow +}) diff --git a/packages/controller/src/useBreadcrumb.js b/packages/controller/src/hooks/useBreadcrumb.js similarity index 84% rename from packages/controller/src/useBreadcrumb.js rename to packages/controller/src/hooks/useBreadcrumb.js index 3ac0af784..600114d64 100644 --- a/packages/controller/src/useBreadcrumb.js +++ b/packages/controller/src/hooks/useBreadcrumb.js @@ -11,6 +11,7 @@ */ import { ref } from 'vue' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' let breadcrumbData = ref([]) const CONSTANTS = { @@ -37,3 +38,10 @@ export default () => { getBreadcrumbData } } + +initHook(HOOK_NAME.useBreadcrumb, { + CONSTANTS, + setBreadcrumbPage, + setBreadcrumbBlock, + getBreadcrumbData +}) diff --git a/packages/controller/src/useCanvas.js b/packages/controller/src/hooks/useCanvas.js similarity index 90% rename from packages/controller/src/useCanvas.js rename to packages/controller/src/hooks/useCanvas.js index d7f424a33..ae28728c4 100644 --- a/packages/controller/src/useCanvas.js +++ b/packages/controller/src/hooks/useCanvas.js @@ -13,7 +13,7 @@ /* eslint-disable no-new-func */ import { reactive, ref } from 'vue' import { constants } from '@opentiny/tiny-engine-utils' -import useHistory from './useHistory' +import { HOOK_NAME, initHook, useHistory } from '@opentiny/tiny-engine-entry' const { COMPONENT_NAME } = constants @@ -166,3 +166,23 @@ export default function () { isCanvasApiReady } } + +initHook(HOOK_NAME.useCanvas, { + pageState, + isBlock, + isSaved, + isLoading, + initData, + setSaved, + clearCanvas, + getPageSchema, + resetPageCanvasState, + resetBlockCanvasState, + clearCurrentState, + getCurrentSchema, + setCurrentSchema, + getCurrentPage, + initCanvasApi, + canvasApi, + isCanvasApiReady +}) diff --git a/packages/controller/src/useDataSource.js b/packages/controller/src/hooks/useDataSource.js similarity index 95% rename from packages/controller/src/useDataSource.js rename to packages/controller/src/hooks/useDataSource.js index e1e93affa..ff138c0c0 100644 --- a/packages/controller/src/useDataSource.js +++ b/packages/controller/src/hooks/useDataSource.js @@ -14,7 +14,8 @@ import { reactive } from 'vue' import { utils } from '@opentiny/tiny-engine-utils' import { isEqual } from '@opentiny/vue-renderless/common/object' import { isEmptyObject } from '@opentiny/vue-renderless/common/type' -import useModal from './useModal' +import useModal from '../components/useModal' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' const dataSourceState = reactive({ dataSource: {}, @@ -118,3 +119,5 @@ const saveDataSource = (callback) => { export default () => { return { dataSourceState, compareData, saveDataSource } } + +initHook(HOOK_NAME.useDataSource, { dataSourceState, compareData, saveDataSource }) diff --git a/packages/controller/src/useEditorInfo.js b/packages/controller/src/hooks/useEditorInfo.js similarity index 89% rename from packages/controller/src/useEditorInfo.js rename to packages/controller/src/hooks/useEditorInfo.js index bd4b1e106..751a83584 100644 --- a/packages/controller/src/useEditorInfo.js +++ b/packages/controller/src/hooks/useEditorInfo.js @@ -11,7 +11,8 @@ */ import { useHttp } from '@opentiny/tiny-engine-http' -import useModal from './useModal' +import useModal from '../components/useModal' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' // web版获取配置信息: 从url中获取 const _getWebData = () => { @@ -69,3 +70,10 @@ export default () => { isAdmin } } + +initHook(HOOK_NAME.useEditorInfo, { + useInfo: _getWebData, + getUserInfo, + userInfo, + isAdmin +}) diff --git a/packages/controller/src/useHelp.js b/packages/controller/src/hooks/useHelp.js similarity index 87% rename from packages/controller/src/useHelp.js rename to packages/controller/src/hooks/useHelp.js index 8240c3ccc..ff2376d80 100644 --- a/packages/controller/src/useHelp.js +++ b/packages/controller/src/hooks/useHelp.js @@ -10,6 +10,8 @@ * */ +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' + const getBaseUrl = () => 'https://opentiny.design/tiny-engine#/help-center/course/engine/' const helpState = { @@ -33,3 +35,8 @@ export default () => ({ getBaseUrl, getDocsUrl }) + +initHook(HOOK_NAME.useHelp, { + getBaseUrl, + getDocsUrl +}) diff --git a/packages/controller/src/useHistory.js b/packages/controller/src/hooks/useHistory.js similarity index 93% rename from packages/controller/src/useHistory.js rename to packages/controller/src/hooks/useHistory.js index 82f0a6af0..67aecb5d6 100644 --- a/packages/controller/src/useHistory.js +++ b/packages/controller/src/hooks/useHistory.js @@ -11,7 +11,7 @@ */ import { reactive, isProxy, toRaw, watch } from 'vue' -import useCanvas from './useCanvas' +import { HOOK_NAME, initHook, useCanvas } from '@opentiny/tiny-engine-entry' const schema2String = (schema) => { if (isProxy(schema)) { @@ -121,3 +121,12 @@ export default () => { addHistory } } + + +initHook(HOOK_NAME.useHistory, { + historyState, + back, + forward, + go, + addHistory +}) diff --git a/packages/controller/src/useLayout.js b/packages/controller/src/hooks/useLayout.js similarity index 91% rename from packages/controller/src/useLayout.js rename to packages/controller/src/hooks/useLayout.js index 4623a9d02..f2a5ef8eb 100644 --- a/packages/controller/src/useLayout.js +++ b/packages/controller/src/hooks/useLayout.js @@ -12,6 +12,7 @@ import { reactive, nextTick } from 'vue' import { constants } from '@opentiny/tiny-engine-utils' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' const { PAGE_STATUS } = constants @@ -140,3 +141,19 @@ export default () => { isEmptyPage } } + +initHook(HOOK_NAME.useLayout, { + PLUGIN_NAME, + activeSetting, + activePlugin, + closePlugin, + layoutState, + getScale, + setDimension, + getDimension, + registerPluginApi, + getPluginApi, + getPluginState, + pluginState, + isEmptyPage +}) diff --git a/packages/controller/src/usePage.js b/packages/controller/src/hooks/usePage.js similarity index 92% rename from packages/controller/src/usePage.js rename to packages/controller/src/hooks/usePage.js index 8af5fc0e4..ee95b24c7 100644 --- a/packages/controller/src/usePage.js +++ b/packages/controller/src/hooks/usePage.js @@ -12,6 +12,7 @@ import { reactive } from 'vue' import { extend, isEqual } from '@opentiny/vue-renderless/common/object' +import { HOOK_NAME, initHook } from '@opentiny/tiny-engine-entry' const DEFAULT_PAGE = { app: '', @@ -145,3 +146,17 @@ export default () => { COMMON_PAGE_GROUP_ID } } + +initHook(HOOK_NAME.usePage, { + DEFAULT_PAGE, + pageSettingState, + isTemporaryPage, + isCurrentDataSame, + changeTreeData, + getPageContent, + resetPageData, + initCurrentPageData, + isChangePageData, + STATIC_PAGE_GROUP_ID, + COMMON_PAGE_GROUP_ID +}) diff --git a/packages/controller/src/useProperties.js b/packages/controller/src/hooks/useProperties.js similarity index 93% rename from packages/controller/src/useProperties.js rename to packages/controller/src/hooks/useProperties.js index 8bc1298f3..8482516f3 100644 --- a/packages/controller/src/useProperties.js +++ b/packages/controller/src/hooks/useProperties.js @@ -12,9 +12,7 @@ import { toRaw, nextTick, shallowReactive, ref } from 'vue' import { constants } from '@opentiny/tiny-engine-utils' -import useCanvas from './useCanvas' -import useResource from './useResource' -import useTranslate from './useTranslate' +import { HOOK_NAME, initHook, useCanvas, useResource, useTranslate } from '@opentiny/tiny-engine-entry' const { COMPONENT_NAME } = constants const propsUpdateKey = ref(0) @@ -217,6 +215,22 @@ const setProps = (schema) => { Object.entries(schema.props || {}).map(([key, value]) => setProp(key, value)) } +const getSchema = (parent) => { + return parent ? properties : properties.schema +} + +initHook(HOOK_NAME.useProperties, { + getProps, + getProp, + setProps, + mergeProps, + delProp, + setProp, + translateProp, + getSchema, + propsUpdateKey +}) + export default function () { return { getProps, @@ -226,9 +240,7 @@ export default function () { delProp, setProp, translateProp, - getSchema(parent) { - return parent ? properties : properties.schema - }, + getSchema, propsUpdateKey } } diff --git a/packages/controller/src/useProperty.js b/packages/controller/src/hooks/useProperty.js similarity index 93% rename from packages/controller/src/useProperty.js rename to packages/controller/src/hooks/useProperty.js index f6e8a9323..5c8328720 100644 --- a/packages/controller/src/useProperty.js +++ b/packages/controller/src/hooks/useProperty.js @@ -13,26 +13,10 @@ import { computed } from 'vue' import { extend } from '@opentiny/vue-renderless/common/object' import { constants } from '@opentiny/tiny-engine-utils' -import useBlock from './useBlock' +import { HOOK_NAME, initHook, useBlock } from '@opentiny/tiny-engine-entry' const { SCHEMA_DATA_TYPE } = constants -// 遍历区块属性，查找已关联的组件属性 -const findLinked = ({ componentProperties, componentId, blockProperties }) => { - for (let i = 0; i < blockProperties.length; i++) { - const property = blockProperties[i] - - if (property.linked && componentId === property.linked.id) { - addPropertyLinks({ - componentProperties, - linked: { ...property.linked, blockProperty: property.property }, - defaultValue: property.defaultValue, - propertyName: property.linked.property - }) - } - } -} - // 给组件属性添加关联信息 const addPropertyLinks = ({ linked, propertyName, componentProperties }) => { for (let i = 0; i < componentProperties.length; i++) { @@ -58,6 +42,22 @@ const addPropertyLinks = ({ linked, propertyName, componentProperties }) => { } } +// 遍历区块属性，查找已关联的组件属性 +const findLinked = ({ componentProperties, componentId, blockProperties }) => { + for (let i = 0; i < blockProperties.length; i++) { + const property = blockProperties[i] + + if (property.linked && componentId === property.linked.id) { + addPropertyLinks({ + componentProperties, + linked: { ...property.linked, blockProperty: property.property }, + defaultValue: property.defaultValue, + propertyName: property.linked.property + }) + } + } +} + // 重置组件属性的关联信息 const resetLink = (properties) => { if (properties && Array.isArray(properties)) { @@ -71,7 +71,7 @@ const resetLink = (properties) => { } } -export default ({ pageState }) => { +const getProperty = ({ pageState }) => { const { getCurrentBlock, getBlockProperties } = useBlock() const properties = computed(() => { @@ -93,3 +93,9 @@ export default ({ pageState }) => { properties } } + +export default () => ({ getProperty }) + +initHook(HOOK_NAME.useProperty, { + getProperty +}) diff --git a/packages/controller/src/useResource.js b/packages/controller/src/hooks/useResource.js similarity index 95% rename from packages/controller/src/useResource.js rename to packages/controller/src/hooks/useResource.js index 5df4dfa8d..012b4ac6f 100644 --- a/packages/controller/src/useResource.js +++ b/packages/controller/src/hooks/useResource.js @@ -11,19 +11,23 @@ */ import { reactive } from 'vue' -import { getGlobalConfig } from './globalConfig' +import { getGlobalConfig } from '../globalConfig' import { useHttp } from '@opentiny/tiny-engine-http' import { utils, constants } from '@opentiny/tiny-engine-utils' import { meta as BuiltinComponentMaterials } from '@opentiny/tiny-engine-builtin-component' -import { getCanvasStatus } from '../js/canvas' -import useApp from './useApp' -import useCanvas from './useCanvas' -import useTranslate from './useTranslate' -import useEditorInfo from './useEditorInfo' -import useBreadcrumb from './useBreadcrumb' -import useLayout from './useLayout' -import useBlock from './useBlock' -import useNotify from './useNotify' +import { getCanvasStatus } from '../../js/canvas' +import useNotify from '../components/useNotify' +import { + HOOK_NAME, + initHook, + useApp, + useCanvas, + useTranslate, + useEditorInfo, + useBreadcrumb, + useLayout, + useBlock +} from '@opentiny/tiny-engine-entry' const { camelize, capitalize } = utils const { MATERIAL_TYPE, COMPONENT_NAME, DEFAULT_INTERCEPTOR } = constants @@ -475,3 +479,22 @@ export default function () { updateCanvasDependencies } } + +initHook(HOOK_NAME.useResource, { + resState, + fetchResource, + fetchMaterial, + generateNode, + addMaterials, + clearMaterials, + clearBlockResources, + getMaterial, + setMaterial, + getConfigureMap, + registerComponent, + registerBlock, + getSnippetRelationship, + initPageOrBlock, + handlePopStateEvent, + updateCanvasDependencies +}) diff --git a/packages/controller/src/useSaveLocal.js b/packages/controller/src/hooks/useSaveLocal.js similarity index 91% rename from packages/controller/src/useSaveLocal.js rename to packages/controller/src/hooks/useSaveLocal.js index 7bbc5fbb0..3e47e2105 100644 --- a/packages/controller/src/useSaveLocal.js +++ b/packages/controller/src/hooks/useSaveLocal.js @@ -11,9 +11,9 @@ */ import { Modal } from '@opentiny/vue' -import { VITE_ORIGIN } from '../js/environments' -import useCanvas from './useCanvas' -import { getGlobalConfig } from './globalConfig' +import { VITE_ORIGIN } from '../../js/environments' +import { getGlobalConfig } from '../globalConfig' +import { HOOK_NAME, initHook, useCanvas } from '@opentiny/tiny-engine-entry' // 获取当前页面的全量信息 @@ -83,3 +83,8 @@ export default () => { savePageLocal } } + +initHook(HOOK_NAME.useSaveLocal, { + confirmSaveLocal, + savePageLocal +}) diff --git a/packages/controller/src/useTranslate.js b/packages/controller/src/hooks/useTranslate.js similarity index 92% rename from packages/controller/src/useTranslate.js rename to packages/controller/src/hooks/useTranslate.js index 3de96b042..c9d37dffa 100644 --- a/packages/controller/src/useTranslate.js +++ b/packages/controller/src/hooks/useTranslate.js @@ -13,12 +13,11 @@ import { reactive, ref } from 'vue' import { useHttp } from '@opentiny/tiny-engine-http' import { utils } from '@opentiny/tiny-engine-utils' -import { isVsCodeEnv } from '../js/environments' +import { isVsCodeEnv } from '../../js/environments' import { constants } from '@opentiny/tiny-engine-utils' -import { generateI18n } from '../js/vscodeGenerateFile' -import useResource from './useResource' -import { PROP_DATA_TYPE } from '../utils' -import useCanvas from './useCanvas' +import { generateI18n } from '../../js/vscodeGenerateFile' +import { PROP_DATA_TYPE } from '../../utils' +import { HOOK_NAME, initHook, useResource, useCanvas } from '@opentiny/tiny-engine-entry' const { HOST_TYPE } = constants const state = reactive({ @@ -253,3 +252,20 @@ export default () => { initBlockLocalI18n } } + +initHook(HOOK_NAME.useTranslate, { + i18nResource, + currentLanguage, + getLangs, + setLangs, + getData, + translate, + removeI18n, + ensureI18n, + initI18n, + batchCreateI18n, + initAppI18n, + initBlockI18n, + getI18nData, + initBlockLocalI18n +}) diff --git a/packages/controller/src/index.js b/packages/controller/src/index.js index 01198e56f..f8626e88f 100644 --- a/packages/controller/src/index.js +++ b/packages/controller/src/index.js @@ -10,28 +10,16 @@ * */ -import useLayout from './useLayout' -import useCanvas from './useCanvas' -import useApp from './useApp' -import useResource from './useResource' -import useHistory from './useHistory' -import useProperties from './useProperties' -import useSaveLocal from './useSaveLocal' -import useEditorInfo from './useEditorInfo' -import example from './example' -import useModal from './useModal' -import useBlock from './useBlock' -import useTranslate from './useTranslate' -import usePage from './usePage' -import useDataSource from './useDataSource' -import useBreadcrumb from './useBreadcrumb' -import useProperty from './useProperty' +import './hooks/mountHooks' +import useMessage from './useMessage' import { getGlobalConfig, setGlobalConfig } from './globalConfig' -import useNotify from './useNotify' import useData from './useData' -import useMessage from './useMessage' -import useHelp from './useHelp' export { default as metaData } from '../meta' +import example from './example' + +// 后续移入common包components +import useNotify from './components/useNotify' +import useModal from './components/useModal' export const getExample = example @@ -43,7 +31,6 @@ export { useHistory, useProperties, useSaveLocal, - useModal, useEditorInfo, useBlock, useTranslate, @@ -51,10 +38,8 @@ export { useDataSource, useBreadcrumb, useProperty, - getGlobalConfig, - setGlobalConfig, - useNotify, - useData, - useMessage, - useHelp -} + useHelp, + useCustom +} from '@opentiny/tiny-engine-entry' + +export { getGlobalConfig, setGlobalConfig, useNotify, useData, useMessage, useModal } diff --git a/packages/entry/src/hooks.js b/packages/entry/src/hooks.js new file mode 100644 index 000000000..4075aa34b --- /dev/null +++ b/packages/entry/src/hooks.js @@ -0,0 +1,61 @@ +export const HOOK_NAME = { + useLayout: 'layout', + useApp: 'app', + useCanvas: 'canvas', + useResource: 'resource', + useHistory: 'history', + useProperties: 'properties', + useProperty: 'property', + useSaveLocal: 'saveLocal', + useEditorInfo: 'editorInfo', + useBlock: 'block', + useTranslate: 'translate', + usePage: 'page', + useDataSource: 'dataSource', + useBreadcrumb: 'breadcrumb', + useHelp: 'help', + useCustom: 'custom' +} + +const hooksState = { + [HOOK_NAME.useLayout]: {}, + [HOOK_NAME.useApp]: {}, + [HOOK_NAME.useCanvas]: {}, + [HOOK_NAME.useResource]: {}, + [HOOK_NAME.useHistory]: {}, + [HOOK_NAME.useProperties]: {}, + [HOOK_NAME.useProperty]: {}, + [HOOK_NAME.useSaveLocal]: {}, + [HOOK_NAME.useEditorInfo]: {}, + [HOOK_NAME.useBlock]: {}, + [HOOK_NAME.useTranslate]: {}, + [HOOK_NAME.usePage]: {}, + [HOOK_NAME.useDataSource]: {}, + [HOOK_NAME.useBreadcrumb]: {}, + [HOOK_NAME.useHelp]: {}, + [HOOK_NAME.useCustom]: {} // 自定义 +} + +export const useLayout = () => hooksState[HOOK_NAME.useLayout] +export const useCanvas = () => hooksState[HOOK_NAME.useCanvas] +export const useApp = () => hooksState[HOOK_NAME.useApp] +export const useResource = () => hooksState[HOOK_NAME.useResource] +export const useHistory = () => hooksState[HOOK_NAME.useHistory] +export const useProperties = () => hooksState[HOOK_NAME.useProperties] +export const useSaveLocal = () => hooksState[HOOK_NAME.useSaveLocal] +export const useEditorInfo = () => hooksState[HOOK_NAME.useEditorInfo] +export const useBlock = () => hooksState[HOOK_NAME.useBlock] +export const useTranslate = () => hooksState[HOOK_NAME.useTranslate] +export const usePage = () => hooksState[HOOK_NAME.usePage] +export const useDataSource = () => hooksState[HOOK_NAME.useDataSource] +export const useBreadcrumb = () => hooksState[HOOK_NAME.useBreadcrumb] +export const useProperty = () => hooksState[HOOK_NAME.useProperty] +export const useHelp = () => hooksState[HOOK_NAME.useHelp] +export const useCustom = () => hooksState[HOOK_NAME.useCustom] + +export function initHook(hookName, hookContent) { + if (!Object.keys(hooksState).includes(hookName)) { + throw new Error('Invalid hook name provided: ' + hookName) + } + Object.assign(hooksState[hookName], hookContent) +} diff --git a/packages/entry/src/index.js b/packages/entry/src/index.js index e1ecd6165..182753a29 100644 --- a/packages/entry/src/index.js +++ b/packages/entry/src/index.js @@ -17,3 +17,4 @@ export { getLayoutComponent } from './layoutHash' export { default as useMessage } from './useMessage' export { useShareState } from './useShareState' export { getConfigurator, addConfigurator } from './configurators' +export * from './hooks' diff --git a/packages/settings/props/src/Main.vue b/packages/settings/props/src/Main.vue index e5775ac9d..696989607 100644 --- a/packages/settings/props/src/Main.vue +++ b/packages/settings/props/src/Main.vue @@ -23,7 +23,7 @@ export default { }, setup() { const { pageState } = useCanvas() - const { properties } = useProperty({ pageState }) + const { properties } = useProperty().getProperty({ pageState }) const showEmptyTips = ref(false) const isBlock = computed(() => pageState.isBlock)