2022-07-14 21:31:51 +08:00

1 line
8.0 KiB
Plaintext

{"version":3,"mappings":"yEAAA,KAAM,GAAY,gBAAsB,EAAO,CAAE,EAAO,EAAO,YAAyB,EAAgB,SAAiB,EAAY,EAAM,CAEvI,MAAI,CAAwB,GAAQ,EAAK,SAAW,EACzC,EAAU,EAEd,QAAQ,IAAI,EAAK,IAAI,CAAC,EAAQ,CAIjC,GAFA,EAAM,GAAG,IAAO,IAEZ,IAAO,GACP,OAEJ,EAAK,GAAO,GACZ,KAAM,GAAQ,EAAI,SAAS,MAAM,EAC3B,EAAc,EAAQ,qBAAuB,GAEnD,GAAI,SAAS,cAAc,cAAc,MAAQ,GAAa,EAC1D,OAGJ,KAAM,GAAO,SAAS,cAAc,MAAM,EAU1C,GARA,EAAK,IAAM,EAAQ,aAAe,EAC7B,GACD,GAAK,GAAK,SACV,EAAK,YAAc,IAEvB,EAAK,KAAO,EAEZ,SAAS,KAAK,YAAY,CAAI,EAC1B,EACA,MAAO,IAAI,SAAQ,CAAC,EAAK,IAAQ,CAC7B,EAAK,iBAAiB,OAAQ,CAAG,EACjC,EAAK,iBAAiB,QAAS,IAAM,EAAI,GAAI,OAAM,6BAA6B,GAAK,CAAC,CAAC,CACvG,CAAa,CAER,EAAC,EAAE,KAAK,IAAM,EAAY,EAC/B,ECnBA,QAAkB,IAAa,yBAE3B,QAAa,IAAU,MACvB,EAAkB,IAAQ,MAC1B,EAAmB,IAAQ,MAE3B,EAAmB,IACjB,0KAGF,SAAqB,eACN,iBACH,GAGZ,4BAEA,sBACE,KAAM,KAAS,WACf,iDACA,iCAAwC,GAG1C,yBACE,0CAA6B,SAEzB,QAAO,EACT,oBAGE,+BACA,UACA,+BAAsC,EACxC,gBAGE,gCACA,UACA,qBAAe,EACjB,kBAGE,qEAAiF,EACnF,UAGE,+BACA,UACA,wCACA,UAEO,wDAAqE,EAC9E,sBAIE,GADA,4BACA,SAAiB,yBACjB,YAAuB,yBACvB,6BACA,UACA,6BACA,MAAa,wDACb,4BAAyB,EAC3B,yBAIE,GADA,+BACA,SAAiB,yBACjB,0BACA,UACA,UACA,MAAW,8DACX,MAAa,wDACb,6DACA,mBAA8B,gBAAgB,EAChD,qBAGE,YAAiB,yBACjB,uBACA,UACA,MAAW,8DACX,gBACA,MAAa,wDACb,6DACA,mBAA4B,CAC9B,EACD,GAGH,CAAO,YACL,CACF,CAEJ,yEA/GuB,qCAArB,IAAsE,wCAA5B,6JCqB5C,mIACE,wCACA,EAAiB,iBAEjB,6BACE,qBAA4C,GAG9C,6BACE,QAAmB,GAGrB,eACF","names":[],"sources":["../../vite/preload-helper","../../src/playground/App.vue","../../src/playground/main.ts"],"sourcesContent":["const scriptRel = 'modulepreload';const seen = {};const base = '/runtime/';export const __vitePreload = function preload(baseModule, deps) {\n // @ts-ignore\n if (!__VITE_IS_MODERN__ || !deps || deps.length === 0) {\n return baseModule();\n }\n return Promise.all(deps.map((dep) => {\n // @ts-ignore\n dep = `${base}${dep}`;\n // @ts-ignore\n if (dep in seen)\n return;\n // @ts-ignore\n seen[dep] = true;\n const isCss = dep.endsWith('.css');\n const cssSelector = isCss ? '[rel=\"stylesheet\"]' : '';\n // @ts-ignore check if the file is already preloaded by SSR markup\n if (document.querySelector(`link[href=\"${dep}\"]${cssSelector}`)) {\n return;\n }\n // @ts-ignore\n const link = document.createElement('link');\n // @ts-ignore\n link.rel = isCss ? 'stylesheet' : scriptRel;\n if (!isCss) {\n link.as = 'script';\n link.crossOrigin = '';\n }\n link.href = dep;\n // @ts-ignore\n document.head.appendChild(link);\n if (isCss) {\n return new Promise((res, rej) => {\n link.addEventListener('load', res);\n link.addEventListener('error', () => rej(new Error(`Unable to preload CSS for ${dep}`)));\n });\n }\n })).then(() => baseModule());\n}","<template>\n <magic-ui-page v-if=\"pageConfig\" :config=\"pageConfig\"></magic-ui-page>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, nextTick, onMounted, provide, reactive, ref, watch } from 'vue';\n\nimport Core from '@tmagic/core';\nimport type { Id, MApp, MNode } from '@tmagic/schema';\nimport { Magic, RemoveData, UpdateData } from '@tmagic/stage';\nimport { getNodePath } from '@tmagic/utils';\n\ndeclare global {\n interface Window {\n magic: Magic;\n }\n}\n\nexport default defineComponent({\n setup() {\n const root = ref<MApp>();\n const curPageId = ref<Id>();\n const selectedId = ref<Id>();\n\n const pageConfig = computed(\n () => root.value?.items?.find((item: MNode) => item.id === curPageId.value) || root.value?.items?.[0],\n );\n\n const app = new Core({\n config: root.value,\n platform: 'editor',\n });\n\n provide('app', app);\n\n watch(pageConfig, async () => {\n await nextTick();\n const page = document.querySelector<HTMLElement>('.magic-ui-page');\n page && window.magic.onPageElUpdate(page);\n });\n\n onMounted(() => {\n window.magic?.onRuntimeReady({\n getApp() {\n return app;\n },\n\n updateRootConfig(config: MApp) {\n console.log('update config', config);\n root.value = config;\n app?.setConfig(config, curPageId.value);\n },\n\n updatePageId(id: Id) {\n console.log('update page id', id);\n curPageId.value = id;\n app?.setPage(id);\n },\n\n getSnapElements() {\n return Array.from(document.querySelectorAll<HTMLElement>('[class*=magic-ui][id]'));\n },\n\n select(id: Id) {\n console.log('select config', id);\n selectedId.value = id;\n const el = document.getElementById(`${id}`);\n if (el) return el;\n // 未在当前文档下找到目标元素,可能是还未渲染,等待渲染完成后再尝试获取\n return nextTick().then(() => document.getElementById(`${id}`) as HTMLElement);\n },\n\n add({ config }: UpdateData) {\n console.log('add config', config);\n if (!root.value) throw new Error('error');\n if (!selectedId.value) throw new Error('error');\n const path = getNodePath(selectedId.value, [root.value]);\n const node = path.pop();\n const parent = node?.items ? node : path.pop();\n if (!parent) throw new Error('未找到父节点');\n parent.items?.push(config);\n },\n\n update({ config }: UpdateData) {\n console.log('update config', config);\n if (!root.value) throw new Error('error');\n const path = getNodePath(config.id, [root.value]);\n const node = path.pop();\n const parent = path.pop();\n if (!node) throw new Error('未找到目标节点');\n if (!parent) throw new Error('未找到父节点');\n const index = parent.items?.findIndex((child: MNode) => child.id === node.id);\n parent.items.splice(index, 1, reactive(config));\n },\n\n remove({ id }: RemoveData) {\n if (!root.value) throw new Error('error');\n const path = getNodePath(id, [root.value]);\n const node = path.pop();\n if (!node) throw new Error('未找到目标元素');\n const parent = path.pop();\n if (!parent) throw new Error('未找到父元素');\n const index = parent.items?.findIndex((child: MNode) => child.id === node.id);\n parent.items.splice(index, 1);\n },\n });\n });\n\n return {\n pageConfig,\n };\n },\n});\n</script>\n\n<style lang=\"scss\">\nhtml,\nbody,\n#app {\n width: 100%;\n height: 100%;\n}\n\n#app {\n position: relative;\n overflow: auto;\n\n &::-webkit-scrollbar {\n width: 0;\n }\n}\n\n.magic-ui-container {\n background-color: rgba(136, 136, 136, 0.5);\n}\n\n.action-area {\n background-color: rgba(51, 153, 255, 0.5) !important;\n}\n</style>\n","/*\n * Tencent is pleased to support the open source community by making TMagicEditor available.\n *\n * Copyright (C) 2021 THL A29 Limited, a Tencent company. All rights reserved.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { createApp } from 'vue';\n\nimport App from './App.vue';\n\nimport('../comp-entry').then((entry) => {\n const { components, plugins } = entry.default;\n const magicApp = createApp(App);\n\n Object.values(components).forEach((component: any) => {\n magicApp.component(component.name, component);\n });\n\n Object.values(plugins).forEach((plugin: any) => {\n magicApp.use(plugin);\n });\n\n magicApp.mount('#app');\n});\n"],"file":"assets/playground.js"}