@atomm-developer/generator-workbench 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +9 -2
- package/dist/index.d.ts +31 -6
- package/dist/index.es.js +805 -290
- package/dist/index.umd.js +1 -1
- package/package.json +3 -2
package/dist/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).GeneratorWorkbench={})}(this,function(t){"use strict";var e=Object.defineProperty,n=(t,n,a)=>((t,n,a)=>n in t?e(t,n,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[n]=a)(t,"symbol"!=typeof n?n+"":n,a);function a(t,e){var n;if(null==(n=t.generatorId)?void 0:n.trim())return t.generatorId.trim();const a=e.meta;if(a&&"object"==typeof a&&"generatorId"in a&&"string"==typeof a.generatorId&&a.generatorId.trim())return a.generatorId.trim();throw new Error("[generator-workbench] generatorId is required in panelSchema.generatorId or state.meta.generatorId")}function r(t){const{sdk:e,runtime:n,config:r}=t;return{async importTemplate(t){const a=await t.text(),r=e.template.parse(a);let o;return await e.template.applyToRuntime(n,r,{onPanelFilter(t){o=t}}),{template:r,panelFilter:o}},async exportTemplate(){var t,o;const i=n.getState(),s=n.getPanelSchema(),l=(null==(t=r.getTemplateFieldPaths)?void 0:t.call(r,s))??function(t){return t.groups.flatMap(t=>t.fields.map(t=>{var e,n;return null==(n=null==(e=t.bind)?void 0:e.path)?void 0:n.trim()}).filter(t=>Boolean(t)))}(s);!function(t,e){if(!t)throw new Error(e)}(l.length>0,"[generator-workbench] exportTemplate requires at least one panel field path");const u=e.template.build({generatorId:a(s,i),state:i,panelSchema:s,selectedFieldPaths:l,templateMeta:null==(o=r.getTemplateMeta)?void 0:o.call(r)});return e.template.download(u),{template:u}}}}function o(t,e,n){return t.dispatchEvent(new CustomEvent(e,{detail:n,bubbles:!0,composed:!0}))}function i(t,e){const n=t.querySelector(e);if(!n)throw new Error(`[generator-workbench] required DOM node not found: ${e}`);return n}function s(t,e){return t.innerHTML='\n <style>\n :host {\n display: block;\n min-height: 100%;\n color: #111827;\n font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;\n }\n\n * {\n box-sizing: border-box;\n }\n\n .shell {\n min-height: 100%;\n display: flex;\n flex-direction: column;\n background: #f5f7fb;\n }\n\n .topbar {\n height: 56px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n padding: 0 16px;\n background: #fff;\n border-bottom: 1px solid #e5e7eb;\n }\n\n .logo-area {\n font-weight: 600;\n }\n\n .topbar-actions {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n\n .workspace {\n flex: 1;\n min-height: 0;\n display: grid;\n grid-template-columns: minmax(0, 1fr) 320px;\n }\n\n .workspace.panel-left {\n grid-template-columns: 320px minmax(0, 1fr);\n }\n\n .workspace.panel-right .canvas-host {\n grid-column: 1;\n }\n\n .workspace.panel-right .panel-sidebar {\n grid-column: 2;\n }\n\n .workspace.panel-left .panel-sidebar {\n grid-column: 1;\n }\n\n .workspace.panel-left .canvas-host {\n grid-column: 2;\n }\n\n .panel-sidebar {\n min-height: 0;\n display: flex;\n flex-direction: column;\n background: #fff;\n }\n\n .panel-host {\n flex: 1;\n min-height: 0;\n overflow: auto;\n }\n\n .canvas-host {\n position: relative;\n min-height: 480px;\n padding: 24px;\n display: grid;\n place-items: center;\n }\n\n button {\n border: 0;\n border-radius: 10px;\n padding: 10px 14px;\n cursor: pointer;\n background: #111827;\n color: #fff;\n font: inherit;\n }\n\n button.secondary {\n background: #e5e7eb;\n color: #111827;\n }\n\n button:focus-visible {\n outline: 2px solid #4338ca;\n outline-offset: 2px;\n }\n\n .auth-area {\n position: relative;\n display: flex;\n align-items: center;\n }\n\n .avatar-button {\n display: none;\n align-items: center;\n gap: 8px;\n background: transparent;\n color: #111827;\n padding: 0;\n }\n\n .avatar-image {\n width: 32px;\n height: 32px;\n border-radius: 999px;\n object-fit: cover;\n background: #e5e7eb;\n }\n\n .avatar-menu {\n position: absolute;\n right: 0;\n top: calc(100% + 8px);\n min-width: 140px;\n padding: 8px;\n display: none;\n background: #fff;\n border: 1px solid #e5e7eb;\n border-radius: 12px;\n box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);\n }\n\n .avatar-menu.is-open,\n .fab-menu.is-open {\n display: block;\n }\n\n .avatar-menu button,\n .fab-menu button {\n width: 100%;\n }\n\n .panel-actions {\n padding: 12px;\n border-top: 1px solid #e5e7eb;\n }\n\n .workspace.panel-right .panel-sidebar {\n border-left: 1px solid #e5e7eb;\n }\n\n .workspace.panel-left .panel-sidebar {\n border-right: 1px solid #e5e7eb;\n }\n\n .fab {\n display: flex;\n flex-direction: column;\n align-items: stretch;\n gap: 8px;\n width: 100%;\n }\n\n .fab-menu {\n width: 100%;\n display: none;\n padding: 8px;\n background: #fff;\n border: 1px solid #e5e7eb;\n border-radius: 12px;\n box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);\n }\n\n .fab-menu button + button {\n margin-top: 8px;\n }\n </style>\n <div class="shell">\n <header class="topbar">\n <div class="logo-area" data-role="logo-area"></div>\n <div class="topbar-actions">\n <button class="secondary" data-role="import-template">导入模板</button>\n <button class="secondary" data-role="export-template">生成模板</button>\n <div class="auth-area" data-role="auth-area">\n <button data-role="login">登录</button>\n <button class="avatar-button" data-role="avatar-button" aria-expanded="false">\n <img class="avatar-image" data-role="avatar-image" alt="User avatar" />\n </button>\n <div class="avatar-menu" data-role="avatar-menu">\n <button class="secondary" data-role="logout">退出登录</button>\n </div>\n </div>\n </div>\n </header>\n <div class="workspace" data-role="workspace">\n <main class="canvas-host" data-role="canvas-host"></main>\n <aside class="panel-sidebar" data-role="panel-sidebar">\n <div class="panel-host" data-role="panel-host"></div>\n <div class="panel-actions" data-role="panel-actions">\n <div class="fab">\n <div class="fab-menu" data-role="fab-menu">\n <button class="secondary" data-role="open-in-studio">导入 Studio</button>\n <button class="secondary" data-role="export-svg">导出 SVG</button>\n </div>\n <button data-role="fab-trigger" aria-expanded="false">导出</button>\n </div>\n </div>\n </aside>\n </div>\n <input data-role="template-file-input" type="file" accept="application/json" hidden />\n </div>\n',function(t){return{root:t,topbar:i(t,".topbar"),workspace:i(t,'[data-role="workspace"]'),logoArea:i(t,'[data-role="logo-area"]'),importTemplateBtn:i(t,'[data-role="import-template"]'),exportTemplateBtn:i(t,'[data-role="export-template"]'),loginBtn:i(t,'[data-role="login"]'),avatarButton:i(t,'[data-role="avatar-button"]'),avatarImage:i(t,'[data-role="avatar-image"]'),avatarMenu:i(t,'[data-role="avatar-menu"]'),logoutBtn:i(t,'[data-role="logout"]'),panelSidebar:i(t,'[data-role="panel-sidebar"]'),panelHost:i(t,'[data-role="panel-host"]'),panelActions:i(t,'[data-role="panel-actions"]'),canvasHost:i(t,'[data-role="canvas-host"]'),fabTrigger:i(t,'[data-role="fab-trigger"]'),fabMenu:i(t,'[data-role="fab-menu"]'),exportSvgBtn:i(t,'[data-role="export-svg"]'),openInStudioBtn:i(t,'[data-role="open-in-studio"]'),templateFileInput:i(t,'[data-role="template-file-input"]')}}(t)}const l={title:"",templateEnabled:!0,exportEnabled:!0,studioEnabled:!0,autoMount:!0,panelTarget:"right",avatarMenuTrigger:"hover"};class u extends HTMLElement{constructor(){super(),n(this,"_sdk",null),n(this,"_runtime",null),n(this,"_config",{...l}),n(this,"_refs",null),n(this,"_mounted",!1),n(this,"_state",{authStatus:{isLogin:!1,userInfo:null},busy:{login:!1,importTemplate:!1,exportTemplate:!1,exportSvg:!1,openInStudio:!1},menu:{avatarOpen:!1,fabOpen:!1}}),n(this,"_cleanupAuth"),n(this,"_authController"),n(this,"_templateController"),n(this,"_exportController"),n(this,"_runtimeController"),this.attachShadow({mode:"open"})}get sdk(){return this._sdk}set sdk(t){this._sdk=t}get runtime(){return this._runtime}set runtime(t){this._runtime=t}get config(){return this._config}set config(t){var e;this._config=(e=t,{...l,...e}),this._mounted&&this.render()}connectedCallback(){!1!==this._config.autoMount&&!this._mounted&&this._sdk&&this._runtime&&this.mount()}disconnectedCallback(){this.unmount()}async mount(){var t,e;if(!this._mounted){if(!this.shadowRoot)throw new Error("[generator-workbench] shadowRoot is required");if(!this._sdk)throw new Error("[generator-workbench] sdk is required before mount()");if(!this._runtime)throw new Error("[generator-workbench] runtime is required before mount()");this.render(),this.bindControllers(),this.bindShellEvents(),this.bindAuthState(),await(null==(t=this._runtimeController)?void 0:t.mountCanvas(this.requireRefs().canvasHost)),await(null==(e=this._runtimeController)?void 0:e.mountPanel(this.requireRefs().panelHost,this._state.activePanelFilter)),this._mounted=!0,o(this,"workbench-ready",{sdk:this._sdk,runtime:this._runtime})}}async unmount(){var t,e;null==(t=this._cleanupAuth)||t.call(this),this._cleanupAuth=void 0,await(null==(e=this._runtimeController)?void 0:e.unmountAll()),this._mounted=!1}refreshLayout(){}async importTemplate(t){try{const e=await this.requireTemplateController().importTemplate(t);this._state.activePanelFilter=e.panelFilter,this._runtimeController&&this._refs&&await this._runtimeController.remountPanel(this._refs.panelHost,e.panelFilter),o(this,"template-imported",e)}catch(e){this.handleError("template",e)}}async exportTemplate(){try{o(this,"template-exported",await this.requireTemplateController().exportTemplate())}catch(t){this.handleError("template",t)}}async exportSvg(){try{o(this,"svg-export",await this.requireExportController().exportSvg())}catch(t){this.handleError("export",t)}}async openInStudio(){try{o(this,"studio-open",await this.requireExportController().openInStudio())}catch(t){this.handleError("export",t)}}render(){var t,e;this.shadowRoot&&(this._refs=s(this.shadowRoot,this._config),t=this._refs,e=this._config,t.logoArea.textContent=e.logoText||e.title,t.workspace.classList.toggle("panel-left","left"===e.panelTarget),t.workspace.classList.toggle("panel-right","left"!==e.panelTarget),t.importTemplateBtn.hidden=!1===e.templateEnabled,t.exportTemplateBtn.hidden=!1===e.templateEnabled,t.exportSvgBtn.hidden=!1===e.exportEnabled,t.openInStudioBtn.hidden=!1===e.studioEnabled,this.syncAuthUI())}bindControllers(){this._sdk&&this._runtime&&(this._authController=function(t){const{sdk:e}=t;return{getStatus:()=>e.auth.getStatus(),subscribe:t=>(t(e.auth.getStatus()),e.auth.onChange(t)),async login(){await e.auth.login()},async logout(){await e.auth.logout()}}}({sdk:this._sdk}),this._templateController=r({sdk:this._sdk,runtime:this._runtime,config:this._config}),this._exportController=function(t){const{sdk:e,runtime:n,config:a,element:r}=t;return{async exportSvg(){var t;return await(null==(t=a.beforeExportSvg)?void 0:t.call(a,{sdk:e,runtime:n,element:r})),e.export.download({format:"svg"})},async openInStudio(){var t;return await(null==(t=a.beforeOpenInStudio)?void 0:t.call(a,{sdk:e,runtime:n,element:r})),e.export.openInStudio({format:"svg"})}}}({sdk:this._sdk,runtime:this._runtime,config:this._config,element:this}),this._runtimeController=function(t){const{runtime:e}=t;let n=null,a=null;async function r(t,n){null==a||a.unmount(),a=await Promise.resolve(e.mount({mode:"embed",target:"panel",container:t,panelFilter:n}))}return{mountCanvas:async function(t){null==n||n.unmount(),n=await Promise.resolve(e.mount({mode:"embed",target:"canvas",container:t}))},mountPanel:r,async remountPanel(t,e){await r(t,e)},async unmountAll(){null==n||n.unmount(),null==a||a.unmount(),n=null,a=null}}}({runtime:this._runtime}))}bindShellEvents(){const t=this.requireRefs();t.loginBtn.addEventListener("click",()=>{this.handleLogin()}),t.logoutBtn.addEventListener("click",()=>{this.handleLogout()}),t.importTemplateBtn.addEventListener("click",()=>{t.templateFileInput.click()}),t.exportTemplateBtn.addEventListener("click",()=>{this.exportTemplate()}),t.templateFileInput.addEventListener("change",()=>{var e;const n=null==(e=t.templateFileInput.files)?void 0:e[0];n&&(this.importTemplate(n),t.templateFileInput.value="")}),t.fabTrigger.addEventListener("click",()=>{this.toggleFabMenu()}),t.exportSvgBtn.addEventListener("click",()=>{this.exportSvg()}),t.openInStudioBtn.addEventListener("click",()=>{this.openInStudio()}),t.avatarButton.addEventListener("click",()=>{this.toggleAvatarMenu()}),"hover"===this._config.avatarMenuTrigger&&(t.avatarButton.addEventListener("mouseenter",()=>{this.setAvatarMenuOpen(!0)}),t.avatarMenu.addEventListener("mouseleave",()=>{this.setAvatarMenuOpen(!1)}))}bindAuthState(){var t;const e=this.requireAuthController();null==(t=this._cleanupAuth)||t.call(this),this._cleanupAuth=e.subscribe(t=>{this._state.authStatus=t,this.syncAuthUI(),o(this,"auth-change",t)})}syncAuthUI(){if(!this._refs)return;const{loginBtn:t,avatarButton:e,avatarImage:n}=this._refs,{isLogin:a,userInfo:r}=this._state.authStatus;t.style.display=a?"none":"",e.style.display=a?"inline-flex":"none",n.src=a&&(null==r?void 0:r.headpic)||"",a||this.setAvatarMenuOpen(!1)}toggleFabMenu(){this._state.menu.fabOpen=!this._state.menu.fabOpen,this.syncMenuUI()}toggleAvatarMenu(){this.setAvatarMenuOpen(!this._state.menu.avatarOpen)}setAvatarMenuOpen(t){this._state.menu.avatarOpen=t,this.syncMenuUI()}syncMenuUI(){this._refs&&(this._refs.avatarMenu.classList.toggle("is-open",this._state.menu.avatarOpen),this._refs.fabMenu.classList.toggle("is-open",this._state.menu.fabOpen),this._refs.avatarButton.setAttribute("aria-expanded",String(this._state.menu.avatarOpen)),this._refs.fabTrigger.setAttribute("aria-expanded",String(this._state.menu.fabOpen)))}async handleLogin(){try{this._state.busy.login=!0,await this.requireAuthController().login()}catch(t){this.handleError("auth",t)}finally{this._state.busy.login=!1}}async handleLogout(){try{await this.requireAuthController().logout()}catch(t){this.handleError("auth",t)}}handleError(t,e){var n,a;const r=e instanceof Error?e:new Error(String(e));null==(a=(n=this._config).onError)||a.call(n,r,t),o(this,"workbench-error",{source:t,error:r})}requireRefs(){if(!this._refs)throw new Error("[generator-workbench] refs are not ready");return this._refs}requireAuthController(){if(!this._authController)throw new Error("[generator-workbench] auth controller is not ready");return this._authController}requireTemplateController(){if(!this._templateController)throw new Error("[generator-workbench] template controller is not ready");return this._templateController}requireExportController(){if(!this._exportController)throw new Error("[generator-workbench] export controller is not ready");return this._exportController}}const d="generator-workbench";t.GENERATOR_WORKBENCH_TAG_NAME=d,t.GeneratorWorkbenchElement=u,t.defineGeneratorWorkbench=function(t=d){const e=customElements.get(t);return e||(customElements.define(t,u),u)},Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n((t="undefined"!=typeof globalThis?globalThis:t||self).GeneratorWorkbench={})}(this,function(t){"use strict";var n=Object.defineProperty,e=(t,e,a)=>((t,e,a)=>e in t?n(t,e,{enumerable:!0,configurable:!0,writable:!0,value:a}):t[e]=a)(t,"symbol"!=typeof e?e+"":e,a);function a(t,n){var e;if(null==(e=t.generatorId)?void 0:e.trim())return t.generatorId.trim();const a=n.meta;if(a&&"object"==typeof a&&"generatorId"in a&&"string"==typeof a.generatorId&&a.generatorId.trim())return a.generatorId.trim();throw new Error("[generator-workbench] generatorId is required in panelSchema.generatorId or state.meta.generatorId")}function r(t){const{sdk:n,runtime:e,config:r}=t;return{async importTemplate(t){const a=await t.text(),r=n.template.parse(a);let i;return await n.template.applyToRuntime(e,r,{onPanelFilter(t){i=t}}),{template:r,panelFilter:i}},async exportTemplate(){var t,i;const o=e.getState(),l=e.getPanelSchema(),s=(null==(t=r.getTemplateFieldPaths)?void 0:t.call(r,l))??function(t){return t.groups.flatMap(t=>t.fields.map(t=>{var n,e;return null==(e=null==(n=t.bind)?void 0:n.path)?void 0:e.trim()}).filter(t=>Boolean(t)))}(l);!function(t,n){if(!t)throw new Error(n)}(s.length>0,"[generator-workbench] exportTemplate requires at least one panel field path");const p=n.template.build({generatorId:a(l,o),state:o,panelSchema:l,selectedFieldPaths:s,templateMeta:null==(i=r.getTemplateMeta)?void 0:i.call(r)});return n.template.download(p),{template:p}}}}function i(t,n,e){return t.dispatchEvent(new CustomEvent(n,{detail:e,bubbles:!0,composed:!0}))}function o(t,n){const e=t.querySelector(n);if(!e)throw new Error(`[generator-workbench] required DOM node not found: ${n}`);return e}const l="data:image/svg+xml,%3csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3ccircle%20cx='12'%20cy='12'%20r='9'%20fill='url(%23paint0_linear_503_69253)'/%3e%3cg%20filter='url(%23filter0_d_503_69253)'%3e%3crect%20x='7.75781'%20y='12'%20width='6'%20height='6'%20rx='1'%20transform='rotate(-45%207.75781%2012)'%20fill='url(%23paint1_linear_503_69253)'/%3e%3c/g%3e%3cdefs%3e%3cfilter%20id='filter0_d_503_69253'%20x='2.17188'%20y='4.17188'%20width='19.6572'%20height='19.6562'%20filterUnits='userSpaceOnUse'%20color-interpolation-filters='sRGB'%3e%3cfeFlood%20flood-opacity='0'%20result='BackgroundImageFix'/%3e%3cfeColorMatrix%20in='SourceAlpha'%20type='matrix'%20values='0%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%200%20127%200'%20result='hardAlpha'/%3e%3cfeOffset%20dy='2'/%3e%3cfeGaussianBlur%20stdDeviation='3'/%3e%3cfeComposite%20in2='hardAlpha'%20operator='out'/%3e%3cfeColorMatrix%20type='matrix'%20values='0%200%200%200%201%200%200%200%200%200.206957%200%200%200%200%200.0670085%200%200%200%201%200'/%3e%3cfeBlend%20mode='normal'%20in2='BackgroundImageFix'%20result='effect1_dropShadow_503_69253'/%3e%3cfeBlend%20mode='normal'%20in='SourceGraphic'%20in2='effect1_dropShadow_503_69253'%20result='shape'/%3e%3c/filter%3e%3clinearGradient%20id='paint0_linear_503_69253'%20x1='12'%20y1='3'%20x2='12'%20y2='21'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23FFA346'/%3e%3cstop%20offset='1'%20stop-color='%23FF7C23'/%3e%3c/linearGradient%3e%3clinearGradient%20id='paint1_linear_503_69253'%20x1='13.2327'%20y1='12.5252'%20x2='8.63652'%20y2='18.5356'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='white'/%3e%3cstop%20offset='1'%20stop-color='%23FFD3B5'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e",s=`\n <div class="shell">\n <header class="topbar app-topbar">\n <div class="logo-area app-topbar-main" data-role="logo-area">\n <img\n :src="state.logoSrc"\n :alt="state.logoText || 'Atomm'"\n class="brand-logo"\n data-role="brand-logo"\n draggable="false"\n />\n <div class="app-topbar-nav">\n <xt-button\n v-show="state.templateEnabled"\n type="secondary"\n size="small"\n data-role="import-template"\n @click="callbacks.onImportTemplate()"\n >导入模板</xt-button>\n <xt-button\n v-show="state.templateEnabled"\n type="secondary"\n size="small"\n data-role="export-template"\n @click="callbacks.onExportTemplate()"\n >生成模板</xt-button>\n </div>\n </div>\n <div class="app-topbar-auth">\n <div\n v-if="state.isLogin"\n class="topbar-credits-badge"\n data-role="topbar-credits"\n title="Remaining credits"\n >\n <img src="${l}" alt="" class="credits-token-icon" draggable="false" />\n <span class="topbar-credits-value" data-role="topbar-credits-value">{{ state.creditsBalance }}</span>\n </div>\n\n <div\n v-if="state.isLogin && state.avatarMenuTrigger === 'hover'"\n class="auth-hover-card"\n >\n <div class="auth-avatar-trigger" data-role="avatar-button" tabindex="0">\n <div class="auth-avatar">\n <img\n v-if="state.avatarSrc"\n :src="state.avatarSrc"\n alt="Avatar"\n data-role="avatar-image"\n />\n <span v-else data-role="avatar-image">{{ state.avatarText }}</span>\n </div>\n </div>\n <div class="auth-hover-panel">\n <div class="auth-popover-body" data-role="avatar-menu">\n <div class="auth-popover-header">\n <div class="auth-avatar auth-avatar--lg">\n <img v-if="state.avatarSrc" :src="state.avatarSrc" alt="Avatar" />\n <span v-else>{{ state.avatarText }}</span>\n </div>\n <div class="auth-popover-user-text">\n <span class="auth-popover-name">{{ state.authDisplayName }}</span>\n <span class="auth-popover-sub">{{ state.authSubline }}</span>\n </div>\n </div>\n <div class="auth-popover-divider"></div>\n <div class="auth-popover-action" data-role="logout" @click="callbacks.onLogout()">\n Logout\n </div>\n </div>\n </div>\n </div>\n\n <xt-dropdown-menu\n v-else-if="state.isLogin"\n trigger="click"\n :portal-disabled="true"\n placement="bottomRight"\n >\n <template #trigger>\n <div class="auth-avatar-trigger" data-role="avatar-button">\n <div class="auth-avatar">\n <img\n v-if="state.avatarSrc"\n :src="state.avatarSrc"\n alt="Avatar"\n data-role="avatar-image"\n />\n <span v-else data-role="avatar-image">{{ state.avatarText }}</span>\n </div>\n </div>\n </template>\n <template #overlay>\n <div class="auth-popover-body" data-role="avatar-menu">\n <div class="auth-popover-header">\n <div class="auth-avatar auth-avatar--lg">\n <img v-if="state.avatarSrc" :src="state.avatarSrc" alt="Avatar" />\n <span v-else>{{ state.avatarText }}</span>\n </div>\n <div class="auth-popover-user-text">\n <span class="auth-popover-name">{{ state.authDisplayName }}</span>\n <span class="auth-popover-sub">{{ state.authSubline }}</span>\n </div>\n </div>\n <div class="auth-popover-divider"></div>\n <div class="auth-popover-action" data-role="logout" @click="callbacks.onLogout()">\n Logout\n </div>\n </div>\n </template>\n </xt-dropdown-menu>\n\n <xt-button\n size="small"\n type="secondary"\n data-role="login"\n :loading="state.loginLoading"\n v-if="!state.isLogin"\n @click="callbacks.onLogin()"\n >Login</xt-button>\n </div>\n </header>\n\n <div\n class="workspace"\n :class="state.panelTarget === 'left' ? 'panel-left' : 'panel-right'"\n data-role="workspace"\n >\n <main class="canvas-host" data-role="canvas-host"></main>\n <aside class="panel-sidebar" data-role="panel-sidebar">\n <div class="panel-host" data-role="panel-host"></div>\n <div id="sidebar-footer" class="sidebar-footer-export panel-actions" data-role="panel-actions">\n <xt-dropdown-menu\n trigger="click"\n :portal-disabled="true"\n placement="topLeft"\n domTriggerClass="sidebar-export-trigger-btn-wrap"\n :show-trigger-icon="false"\n domContentClass="sidebar-export-dropdown-menu"\n >\n <template #trigger>\n <xt-button class="sidebar-export-trigger-btn" block data-role="fab-trigger">\n <template #icon>\n <img\n src="data:image/svg+xml,%3Csvg%20viewBox%3D'0%200%201088%201024'%20xmlns%3D'http%3A//www.w3.org/2000/svg'%3E%3Cpath%20d%3D'M416%20128v85.312h-128A42.688%2042.688%200%200%200%20245.312%20256v512c0%2023.552%2019.136%2042.688%2042.688%2042.688h512a42.688%2042.688%200%200%200%2042.688-42.688V597.312H928V768a128%20128%200%200%201-128%20128h-512a128%20128%200%200%201-128-128V256a128%20128%200%200%201%20128-128h128z'%20fill%3D'%23ffffff'/%3E%3Cpath%20d%3D'M723.52%20520.832L924.352%20320l-200.832-200.832-60.352%2060.352%2097.856%2097.792h-67.712A298.688%20298.688%200%200%200%20394.688%20576v85.312H480V576a213.312%20213.312%200%200%201%20213.312-213.312h67.712l-97.856%2097.792%2060.352%2060.352z'%20fill%3D'%23ffffff'/%3E%3C/svg%3E"\n alt=""\n width="16"\n height="16"\n draggable="false"\n />\n </template>\n Export SVG\n <template #append-icon>\n <div v-if="state.isLogin" class="export-credits-hint">\n <img src="${l}" alt="" class="credits-token-icon credits-token-icon--sm" draggable="false" />\n <span class="export-credits-hint-value" data-role="export-credits-value">{{ state.exportCreditsCost }}</span>\n </div>\n </template>\n </xt-button>\n </template>\n <template #overlay>\n <div class="export-overlay-menu fab-menu-content" data-role="fab-menu">\n <div\n v-show="state.exportEnabled"\n class="export-overlay-item"\n data-role="export-svg"\n @click="callbacks.onExportSvg()"\n >\n <span class="export-overlay-item-icon export-overlay-item-icon--svg"></span>\n Export SVG\n </div>\n <div\n v-show="state.studioEnabled"\n class="export-overlay-item"\n data-role="open-in-studio"\n @click="callbacks.onOpenInStudio()"\n >\n <span class="export-overlay-item-icon export-overlay-item-icon--studio"></span>\n Open in Studio\n </div>\n </div>\n </template>\n </xt-dropdown-menu>\n </div>\n </aside>\n </div>\n\n <input\n data-role="template-file-input"\n type="file"\n accept="application/json"\n style="display:none"\n @change="callbacks.onFileChange($event)"\n />\n </div>\n`;function p(t,n){const e=function(){const t=globalThis.Vue;if(!t||"function"!=typeof t.createApp)throw new Error('[generator-workbench] Vue 3 is required. Load it via CDN: <script src="https://unpkg.com/vue@3/dist/vue.global.js"><\/script>');return t}();!function(t,n){const e=document.createElement("link");e.rel="stylesheet",e.href=n||"https://minio-download.makeblock.com/resource/atomm-ui-umd/dist-browser/atomm-ui.min.css",t.appendChild(e);const a=document.createElement("style");a.textContent='\n :host {\n display: block;\n height: 100%;\n color: #111827;\n font-family: Inter, "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;\n --bg-soft: #f3f4f6;\n --border-default: #e5e7eb;\n --text-primary: #111827;\n --text-secondary: #4b5563;\n --text-muted: #9ca3af;\n }\n\n * {\n box-sizing: border-box;\n }\n\n [data-workbench-vue-root] {\n height: 100%;\n }\n\n .shell {\n height: 100%;\n display: flex;\n flex-direction: column;\n background:\n radial-gradient(rgba(17, 24, 39, 0.06) 1px, transparent 1px),\n linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(249, 250, 251, 0.96));\n background-size: 20px 20px, auto;\n }\n\n .topbar,\n .app-topbar {\n height: 64px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n padding: 0 24px;\n background: rgba(255, 255, 255, 0.92);\n border-bottom: 1px solid var(--border-default);\n backdrop-filter: blur(12px);\n position: relative;\n z-index: 20;\n }\n\n .logo-area,\n .app-topbar-main {\n display: flex;\n align-items: center;\n gap: 18px;\n min-width: 0;\n flex: 1;\n }\n\n .app-topbar-nav {\n display: flex;\n align-items: center;\n gap: 10px;\n flex-wrap: wrap;\n }\n\n .workspace {\n flex: 1;\n min-height: 0;\n display: grid;\n grid-template-columns: minmax(0, 1fr) 320px;\n }\n\n .workspace.panel-left {\n grid-template-columns: 320px minmax(0, 1fr);\n }\n\n .workspace.panel-right .canvas-host {\n grid-column: 1;\n }\n\n .workspace.panel-right .panel-sidebar {\n grid-column: 2;\n }\n\n .workspace.panel-left .panel-sidebar {\n grid-column: 1;\n }\n\n .workspace.panel-left .canvas-host {\n grid-column: 2;\n }\n\n .panel-sidebar {\n min-height: 0;\n display: flex;\n flex-direction: column;\n background: #ffffff;\n }\n\n .panel-host {\n flex: 1;\n min-height: 0;\n overflow: auto;\n }\n\n .canvas-host {\n position: relative;\n min-height: 480px;\n display: grid;\n place-items: center;\n }\n\n .brand-logo {\n height: 32px;\n width: 92px;\n display: block;\n cursor: pointer;\n flex: 0 0 auto;\n }\n\n .app-topbar-auth {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 12px;\n flex: 0 0 auto;\n }\n\n .topbar-credits-badge {\n display: inline-flex;\n align-items: center;\n gap: 4px;\n padding: 0;\n color: #2d3541;\n font-size: 14px;\n font-weight: 500;\n line-height: 1;\n white-space: nowrap;\n cursor: default;\n }\n\n .topbar-credits-value {\n font-variant-numeric: tabular-nums;\n }\n\n .credits-token-icon {\n width: 20px;\n height: 20px;\n flex: 0 0 16px;\n user-select: none;\n -webkit-user-drag: none;\n }\n\n .credits-token-icon--sm {\n width: 16px;\n height: 16px;\n flex-basis: 16px;\n }\n\n .auth-avatar-trigger {\n display: inline-flex;\n align-items: center;\n gap: 6px;\n padding: 4px 8px 4px 4px;\n border-radius: 999px;\n cursor: pointer;\n transition: background 150ms ease;\n }\n\n .auth-avatar-trigger:hover {\n background: var(--bg-soft);\n }\n\n .auth-avatar {\n width: 40px;\n height: 40px;\n border-radius: 50%;\n display: grid;\n place-items: center;\n overflow: hidden;\n flex: 0 0 auto;\n background: #f3f4f6;\n color: var(--text-secondary);\n font-size: 14px;\n font-weight: 600;\n }\n\n .auth-avatar--lg {\n width: 40px;\n height: 40px;\n font-size: 14px;\n }\n\n .auth-avatar img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n display: block;\n }\n\n .auth-popover-body {\n min-width: 200px;\n padding: 4px 0;\n }\n\n .auth-popover-header {\n display: flex;\n align-items: center;\n gap: 12px;\n padding: 12px 16px;\n }\n\n .auth-popover-user-text {\n min-width: 0;\n flex: 1;\n }\n\n .auth-popover-name {\n display: block;\n font-size: 14px;\n font-weight: 600;\n color: var(--text-primary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .auth-popover-sub {\n display: block;\n margin-top: 2px;\n font-size: 12px;\n color: var(--text-secondary);\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .auth-popover-divider {\n height: 1px;\n background: var(--border-default);\n margin: 4px 0;\n }\n\n .auth-popover-action {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 16px;\n font-size: 13px;\n color: var(--text-secondary);\n cursor: pointer;\n transition: all 150ms ease;\n }\n\n .auth-popover-action:hover {\n background: var(--bg-soft);\n color: var(--text-primary);\n }\n\n .auth-hover-card {\n position: relative;\n display: inline-flex;\n align-items: center;\n }\n\n .auth-hover-panel {\n position: absolute;\n top: calc(100% + 8px);\n right: 0;\n z-index: 40;\n min-width: 200px;\n background: #fff;\n border: 1px solid var(--border-default);\n border-radius: 12px;\n box-shadow: 0 8px 28px rgba(17, 24, 39, 0.12);\n opacity: 0;\n transform: translateY(4px);\n pointer-events: none;\n transition: opacity 150ms ease, transform 150ms ease;\n }\n\n .auth-hover-card:hover .auth-hover-panel,\n .auth-hover-card:focus-within .auth-hover-panel {\n opacity: 1;\n transform: translateY(0);\n pointer-events: auto;\n }\n\n .panel-actions,\n #sidebar-footer {\n flex-shrink: 0;\n padding: 14px 24px;\n border-top: 1px solid var(--border-default);\n background: #ffffff;\n display: flex;\n align-items: center;\n }\n\n .sidebar-footer-export {\n width: 100%;\n }\n\n .sidebar-footer-export .sidebar-export-trigger-btn,\n .sidebar-footer-export .sidebar-export-trigger-btn-wrap,\n .sidebar-export-trigger-btn-wrap {\n width: 100%;\n }\n\n .sidebar-export-dropdown-menu {\n width: 268px;\n }\n\n .sidebar-export-trigger-btn img {\n margin-right: 4px;\n }\n\n .export-credits-hint {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: 2px;\n padding: 0;\n font-size: 12px;\n font-weight: 600;\n line-height: 1;\n color: #ff7c23;\n margin-left: 10px;\n white-space: nowrap;\n }\n\n .export-credits-hint-value {\n color: white;\n font-size: 13px;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n }\n\n .export-overlay-menu,\n .fab-menu-content {\n padding: 4px;\n }\n\n .export-overlay-item {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px 12px;\n border-radius: 6px;\n font-size: 14px;\n color: var(--text-primary);\n cursor: pointer;\n transition: background 120ms ease;\n user-select: none;\n }\n\n .export-overlay-item:hover {\n background: var(--bg-soft);\n }\n\n .export-overlay-item-icon {\n width: 16px;\n height: 16px;\n border-radius: 4px;\n background: #cbd5e1;\n display: inline-block;\n flex: 0 0 auto;\n }\n\n .export-overlay-item-icon--svg {\n background: linear-gradient(180deg, #94a3b8, #64748b);\n }\n\n .export-overlay-item-icon--studio {\n background: linear-gradient(180deg, #cbd5e1, #94a3b8);\n }\n\n .workspace.panel-right .panel-sidebar {\n border-left: 1px solid var(--border-default);\n }\n\n .workspace.panel-left .panel-sidebar {\n border-right: 1px solid var(--border-default);\n }\n',t.appendChild(a)}(t,n.atommUiCssUrl);const a=function(t,n){return t.reactive({logoText:n.logoText||n.title,logoSrc:n.logoUrl||"https://storage-us.atomm.com/resource/xart/static/agent/imgs/atomm-logo.svg",panelTarget:n.panelTarget||"right",avatarMenuTrigger:n.avatarMenuTrigger||"hover",templateEnabled:!1!==n.templateEnabled,exportEnabled:!1!==n.exportEnabled,studioEnabled:!1!==n.studioEnabled,isLogin:!1,avatarSrc:"",avatarText:"U",authDisplayName:"",authSubline:"",creditsBalance:0,exportCreditsCost:1,loginLoading:!1})}(e,n),r={onLogin:()=>{},onLogout:()=>{},onImportTemplate:()=>{},onExportTemplate:()=>{},onExportSvg:()=>{},onOpenInStudio:()=>{},onFileChange:()=>{}},i=document.createElement("div");i.setAttribute("data-workbench-vue-root",""),t.appendChild(i);const l=globalThis.AtommUI,p=e.createApp({setup:()=>({state:a,callbacks:r}),template:s});l?p.use(l):function(t){t.component("xt-button",{inheritAttrs:!0,template:'<button v-bind="$attrs"><slot name="icon" /><slot /><slot name="append-icon" /></button>'}),t.component("xt-avatar",{inheritAttrs:!0,template:'<span v-bind="$attrs"><slot /></span>'}),t.component("xt-dropdown-menu",{inheritAttrs:!0,template:'<div v-bind="$attrs"><slot name="trigger" /><slot name="overlay" /><slot /></div>'}),t.component("xt-hover-card",{inheritAttrs:!0,template:'<div v-bind="$attrs"><slot name="trigger" /><slot name="content" /></div>'})}(p),p.mount(i);const d=function(t){return{root:t,workspace:o(t,'[data-role="workspace"]'),logoArea:o(t,'[data-role="logo-area"]'),canvasHost:o(t,'[data-role="canvas-host"]'),panelHost:o(t,'[data-role="panel-host"]'),templateFileInput:o(t,'[data-role="template-file-input"]')}}(t);return{state:a,callbacks:r,app:p,refs:d}}function d(t){t.app.unmount()}const c={title:"",templateEnabled:!0,exportEnabled:!0,studioEnabled:!0,autoMount:!0,panelTarget:"right",avatarMenuTrigger:"hover"};class u extends HTMLElement{constructor(){super(),e(this,"_sdk",null),e(this,"_runtime",null),e(this,"_config",{...c}),e(this,"_mounted",!1),e(this,"_state",{authStatus:{isLogin:!1,userInfo:null},creditsBalance:0,billingUsage:null,busy:{login:!1,importTemplate:!1,exportTemplate:!1,exportSvg:!1,openInStudio:!1},menu:{avatarOpen:!1,fabOpen:!1}}),e(this,"_cleanupAuth"),e(this,"_cleanupCredits"),e(this,"_cleanupBilling"),e(this,"_authController"),e(this,"_templateController"),e(this,"_exportController"),e(this,"_runtimeController"),e(this,"_shellContext"),this.attachShadow({mode:"open"})}get sdk(){return this._sdk}set sdk(t){this._sdk=t}get runtime(){return this._runtime}set runtime(t){this._runtime=t}get config(){return this._config}set config(t){var n;this._config=(n=t,{...c,...n}),this._mounted&&this.render()}connectedCallback(){!1!==this._config.autoMount&&!this._mounted&&this._sdk&&this._runtime&&this.mount()}disconnectedCallback(){this.unmount()}async mount(){var t,n;if(this._mounted)return;if(!this.shadowRoot)throw new Error("[generator-workbench] shadowRoot is required");if(!this._sdk)throw new Error("[generator-workbench] sdk is required before mount()");if(!this._runtime)throw new Error("[generator-workbench] runtime is required before mount()");this.render(),this.bindControllers(),this.bindShellCallbacks(),this.bindAuthState(),await this.syncBillingState();const e=this.requireRefs();await(null==(t=this._runtimeController)?void 0:t.mountCanvas(e.canvasHost)),await(null==(n=this._runtimeController)?void 0:n.mountPanel(e.panelHost,this._state.activePanelFilter)),this._mounted=!0,i(this,"workbench-ready",{sdk:this._sdk,runtime:this._runtime})}async unmount(){var t,n,e,a;null==(t=this._cleanupAuth)||t.call(this),this._cleanupAuth=void 0,null==(n=this._cleanupCredits)||n.call(this),this._cleanupCredits=void 0,null==(e=this._cleanupBilling)||e.call(this),this._cleanupBilling=void 0,await(null==(a=this._runtimeController)?void 0:a.unmountAll()),this._shellContext&&(d(this._shellContext),this._shellContext=void 0),this._mounted=!1}refreshLayout(){}async importTemplate(t){try{const n=await this.requireTemplateController().importTemplate(t);this._state.activePanelFilter=n.panelFilter;const e=this.requireRefs();this._runtimeController&&await this._runtimeController.remountPanel(e.panelHost,n.panelFilter),i(this,"template-imported",n)}catch(n){this.handleError("template",n)}}async exportTemplate(){try{i(this,"template-exported",await this.requireTemplateController().exportTemplate())}catch(t){this.handleError("template",t)}}async exportSvg(){try{i(this,"svg-export",await this.requireExportController().exportSvg())}catch(t){this.handleError("export",t)}}async openInStudio(){try{i(this,"studio-open",await this.requireExportController().openInStudio())}catch(t){this.handleError("export",t)}}render(){this.shadowRoot&&(this._shellContext&&(d(this._shellContext),this.shadowRoot.innerHTML=""),this._shellContext=p(this.shadowRoot,this._config),this.syncAuthUI(),this.syncBillingUI())}bindControllers(){this._sdk&&this._runtime&&(this._authController=function(t){const{sdk:n}=t;return{getStatus:()=>n.auth.getStatus(),subscribe:t=>(t(n.auth.getStatus()),n.auth.onChange(t)),async login(){await n.auth.login()},async logout(){await n.auth.logout()}}}({sdk:this._sdk}),this._templateController=r({sdk:this._sdk,runtime:this._runtime,config:this._config}),this._exportController=function(t){const{sdk:n,runtime:e,config:a,element:r}=t;async function i(){if(!n.auth.getStatus().isLogin&&(await n.auth.login(),!n.auth.getStatus().isLogin))throw new Error("[generator-workbench] login is required before export")}async function o(){var t;(null==(t=n.billing)?void 0:t.consume)&&await n.billing.consume()}return{async exportSvg(){var t;return await(null==(t=a.beforeExportSvg)?void 0:t.call(a,{sdk:n,runtime:e,element:r})),await i(),await o(),n.export.download({format:"svg"})},async openInStudio(){var t;return await(null==(t=a.beforeOpenInStudio)?void 0:t.call(a,{sdk:n,runtime:e,element:r})),await i(),await o(),n.export.openInStudio({format:"svg"})}}}({sdk:this._sdk,runtime:this._runtime,config:this._config,element:this}),this._runtimeController=function(t){const{runtime:n}=t;let e=null,a=null;async function r(t,e){null==a||a.unmount(),a=await Promise.resolve(n.mount({mode:"embed",target:"panel",container:t,panelFilter:e}))}return{mountCanvas:async function(t){null==e||e.unmount(),e=await Promise.resolve(n.mount({mode:"embed",target:"canvas",container:t}))},mountPanel:r,async remountPanel(t,n){await r(t,n)},async unmountAll(){null==e||e.unmount(),null==a||a.unmount(),e=null,a=null}}}({runtime:this._runtime}))}bindShellCallbacks(){if(!this._shellContext)return;const{callbacks:t}=this._shellContext;t.onLogin=()=>{this.handleLogin()},t.onLogout=()=>{this.handleLogout()},t.onImportTemplate=()=>{this.requireRefs().templateFileInput.click()},t.onExportTemplate=()=>{this.exportTemplate()},t.onExportSvg=()=>{this.exportSvg()},t.onOpenInStudio=()=>{this.openInStudio()},t.onFileChange=t=>{var n;const e=t.target,a=null==(n=e.files)?void 0:n[0];a&&(this.importTemplate(a),e.value="")}}bindAuthState(){var t;const n=this.requireAuthController();null==(t=this._cleanupAuth)||t.call(this),this._cleanupAuth=n.subscribe(t=>{this._state.authStatus=t,this.syncAuthUI(),this.syncBillingState(t),i(this,"auth-change",t)}),this.bindBillingSubscriptions()}bindBillingSubscriptions(){var t,n,e,a;null==(t=this._cleanupCredits)||t.call(this),this._cleanupCredits=void 0,null==(n=this._cleanupBilling)||n.call(this),this._cleanupBilling=void 0;const r=null==(e=this._sdk)?void 0:e.credits;"function"==typeof(null==r?void 0:r.onChange)&&(this._cleanupCredits=r.onChange(t=>{this._state.creditsBalance=Number(t)||0,this.syncBillingUI()}));const i=null==(a=this._sdk)?void 0:a.billing;"function"==typeof(null==i?void 0:i.onChange)&&(this._cleanupBilling=i.onChange(t=>{this.applyBillingUsage(t)}))}syncAuthUI(){var t,n,e,a;if(!this._shellContext)return;const{state:r}=this._shellContext,{isLogin:i,userInfo:o}=this._state.authStatus,l=(null==(t=null==o?void 0:o.userName)?void 0:t.trim())||(null==(n=null==o?void 0:o.email)?void 0:n.trim())||(null==(e=null==o?void 0:o.phoneNumber)?void 0:e.trim())||"",s=l?l.charAt(0).toUpperCase():"U",p=(null==(a=null==o?void 0:o.email)?void 0:a.trim())||((null==o?void 0:o.phoneNumber)?`${o.phoneZone||""}${o.phoneNumber}`:"Connected to Generator SDK");r.isLogin=i,r.avatarSrc=i&&(null==o?void 0:o.headpic)||"",r.avatarText=s,r.authDisplayName=l,r.authSubline=i?p:""}syncBillingUI(){if(!this._shellContext)return;const{state:t}=this._shellContext,n=this._state.billingUsage;t.creditsBalance=this._state.creditsBalance,t.exportCreditsCost=(null==n?void 0:n.creditsPerUse)??(n&&"unitPrice"in n&&Number(n.unitPrice)||1)}applyBillingUsage(t){this._state.billingUsage=t||null,t&&"number"==typeof t.creditsBalance&&(this._state.creditsBalance=t.creditsBalance),this.syncBillingUI()}resetBillingState(){this._state.creditsBalance=0,this._state.billingUsage=null,this.syncBillingUI()}async syncBillingState(t=this._state.authStatus){var n,e,a,r,i,o,l,s;if(!t.isLogin||!this._sdk)return void this.resetBillingState();const p=null==(e=null==(n=this._sdk.credits)?void 0:n.getCachedBalance)?void 0:e.call(n);"number"==typeof p&&(this._state.creditsBalance=p);const d=null==(r=null==(a=this._sdk.billing)?void 0:a.getCachedUsage)?void 0:r.call(a);d?this.applyBillingUsage(d):this.syncBillingUI();try{const[t,n]=await Promise.all([null==(o=null==(i=this._sdk.credits)?void 0:i.getBalance)?void 0:o.call(i),null==(s=null==(l=this._sdk.billing)?void 0:l.getUsage)?void 0:s.call(l)]);if("number"==typeof(null==t?void 0:t.quota)&&(this._state.creditsBalance=t.quota),n)return void this.applyBillingUsage(n);this.syncBillingUI()}catch(c){this.handleError("auth",c)}}async handleLogin(){try{this._state.busy.login=!0,this._shellContext&&(this._shellContext.state.loginLoading=!0),await this.requireAuthController().login()}catch(t){this.handleError("auth",t)}finally{this._state.busy.login=!1,this._shellContext&&(this._shellContext.state.loginLoading=!1)}}async handleLogout(){try{await this.requireAuthController().logout()}catch(t){this.handleError("auth",t)}}handleError(t,n){var e,a;const r=n instanceof Error?n:new Error(String(n));null==(a=(e=this._config).onError)||a.call(e,r,t),i(this,"workbench-error",{source:t,error:r})}requireRefs(){if(!this._shellContext)throw new Error("[generator-workbench] shell context is not ready");return this._shellContext.refs}requireAuthController(){if(!this._authController)throw new Error("[generator-workbench] auth controller is not ready");return this._authController}requireTemplateController(){if(!this._templateController)throw new Error("[generator-workbench] template controller is not ready");return this._templateController}requireExportController(){if(!this._exportController)throw new Error("[generator-workbench] export controller is not ready");return this._exportController}}const h="generator-workbench";t.GENERATOR_WORKBENCH_TAG_NAME=h,t.GeneratorWorkbenchElement=u,t.defineGeneratorWorkbench=function(t=h){const n=customElements.get(t);return n||(customElements.define(t,u),u)},Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atomm-developer/generator-workbench",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Unified generator shell based on Web Components",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"atomm",
|
|
@@ -35,7 +35,8 @@
|
|
|
35
35
|
"type-check": "tsc --noEmit"
|
|
36
36
|
},
|
|
37
37
|
"peerDependencies": {
|
|
38
|
-
"@atomm-developer/generator-sdk": "^1.0.5"
|
|
38
|
+
"@atomm-developer/generator-sdk": "^1.0.5",
|
|
39
|
+
"vue": "^3.5.0"
|
|
39
40
|
},
|
|
40
41
|
"devDependencies": {
|
|
41
42
|
"jsdom": "^26.0.0",
|