@ibiz-template/vue3-components 0.7.37-alpha.5 → 0.7.38-alpha.21

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.controller.cjs

@@ -0,0 +1,309 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+var ramda = require('ramda');
+var vue3Util = require('@ibiz-template/vue3-util');
+var qxUtil = require('qx-util');
+var navBreadcrumb_state = require('./nav-breadcrumb.state.cjs');
+var navBreadcrumb_service = require('./nav-breadcrumb.service.cjs');
+var navBreadcrumb_util = require('./nav-breadcrumb.util.cjs');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class NavBreadcrumbController extends runtime.PanelItemController {
+  constructor() {
+    super(...arguments);
+    /**
+     * @description 面包屑分割符
+     * @type {string}
+     * @memberof NavBreadcrumbController
+     */
+    __publicField(this, "separator", "/");
+    /**
+     * @description 导航模式（路由、菜单、缓存）
+     * @type {('router' | 'menu' | 'store')}
+     * @memberof NavBreadcrumbController
+     */
+    __publicField(this, "navMode", "router");
+    /**
+     * @description 是否显示应用标题
+     * @type {boolean}
+     * @memberof NavBreadcrumbController
+     */
+    __publicField(this, "showHome", true);
+    /**
+     * @description 面包屑服务
+     * @type {NavBreadcrumbService}
+     * @memberof NavBreadcrumbController
+     */
+    __publicField(this, "service");
+    /**
+     * @description 自定义补充参数
+     * @type {IData}
+     * @memberof NavBreadcrumbController
+     */
+    __publicField(this, "rawItemParams", {});
+  }
+  createState() {
+    var _a;
+    return new navBreadcrumb_state.NavBreadcrumbState((_a = this.parent) == null ? void 0 : _a.state);
+  }
+  /**
+   * @description 应用菜单控制器
+   * @readonly
+   * @type {(IAppMenuController | undefined)}
+   * @memberof NavBreadcrumbController
+   */
+  get appmenu() {
+    return this.panel.view.getController("appmenu");
+  }
+  /**
+   * @description 首页导航栏
+   * @readonly
+   * @type {(NavPosIndexController | undefined)}
+   * @memberof NavBreadcrumbController
+   */
+  get navPos() {
+    return this.panel.panelItems.nav_pos_index;
+  }
+  async onInit() {
+    await super.onInit();
+    this.handleRawItemParams();
+    this.navMode = this.rawItemParams.navmode || "router";
+    this.separator = this.rawItemParams.separator || "/";
+    this.showHome = this.rawItemParams.showhome === "true";
+    this.service = new navBreadcrumb_service.NavBreadcrumbService(this.navMode, this.panel.context);
+  }
+  /**
+   * @description 初始化
+   * @param {Router} router
+   * @memberof NavBreadcrumbController
+   */
+  onCreated(router) {
+    if (this.navMode === "menu") {
+      this.setBreadcrumbByMenu(router);
+    }
+    if (this.navMode === "store") {
+      this.setBreadcrumbByStore(router);
+    }
+  }
+  /**
+   * @description 路由改变
+   * @param {Router} router
+   * @memberof NavBreadcrumbController
+   */
+  onRouteChange(router) {
+    if (this.navMode === "router") {
+      this.setBreadcrumbByRouter(router);
+      return;
+    }
+    if (this.navMode === "store") {
+      const { currentRoute } = router;
+      const fullPath = currentRoute.value.fullPath;
+      const viewName = navBreadcrumb_util.getCurViewName(router);
+      const chacheItem = this.service.getItem({ fullPath, viewName });
+      if (chacheItem) {
+        if (chacheItem.viewName === ibiz.hub.defaultAppIndexViewName) {
+          this.service.setChache([
+            { ...navBreadcrumb_util.getIndexBreadcrumb(this.panel.context), fullPath }
+          ]);
+          this.resetBreadcrumbs();
+          return;
+        }
+        this.service.removeAfter(fullPath);
+        this.resetBreadcrumbs();
+      }
+    }
+  }
+  /**
+   * @description 重置面包屑数据
+   * @memberof NavBreadcrumbController
+   */
+  resetBreadcrumbs() {
+    this.state.breadcrumbItems = this.service.getChache();
+  }
+  /**
+   * 更新视图信息
+   * @author lxm
+   * @date 2023-05-09 01:40:34
+   * @param {string} key
+   * @param {{ caption?: string; dataInfo?: string }} info
+   */
+  updateViewInfo(fullPath, info) {
+    if (this.navMode === "menu") {
+      return;
+    }
+    this.service.updateOrAdd({ fullPath, ...info });
+    this.resetBreadcrumbs();
+  }
+  /**
+   * @description 删除缓存数据
+   * @param {string} fullPath
+   * @memberof NavBreadcrumbController
+   */
+  removeCache(fullPath) {
+    this.service.remove(fullPath);
+  }
+  /**
+   * @description 根据路由计算面包屑数据
+   * @param {Router} router
+   * @memberof NavBreadcrumbController
+   */
+  setBreadcrumbByRouter(router) {
+    const { currentRoute } = router;
+    const routePath = vue3Util.route2routePath(currentRoute.value);
+    const items = routePath.pathNodes.map(
+      (node, index) => {
+        const { appContext, pathNodes } = routePath;
+        const fullPath = vue3Util.routePath2string({
+          appContext,
+          pathNodes: pathNodes.slice(0, index + 1)
+        });
+        const result = {
+          viewName: node.viewName,
+          fullPath
+        };
+        const chacheItem = this.service.getItem({ viewName: node.viewName });
+        if (chacheItem) {
+          if (!chacheItem.fullPath) {
+            chacheItem.fullPath = fullPath;
+          }
+          Object.assign(result, chacheItem);
+        }
+        const viewInfo = navBreadcrumb_util.getViewInfoByViewStack(node.viewName);
+        if (viewInfo) {
+          Object.assign(result, ramda.reject(ramda.isNil, viewInfo));
+        }
+        return result;
+      }
+    );
+    this.service.setChache(items);
+    this.resetBreadcrumbs();
+  }
+  /**
+   * @description 根据路由设置菜单面包屑导航数据
+   * @param {Router} router
+   * @memberof NavBreadcrumbController
+   */
+  setBreadcrumbByMenu(router) {
+    const { currentRoute } = router;
+    const routePath = vue3Util.route2routePath(currentRoute.value);
+    let appFunc;
+    routePath.pathNodes.some((item, index) => {
+      if (index === 0) {
+        return false;
+      }
+      const { viewName } = item;
+      const func = navBreadcrumb_util.getAppFuncByViewName(viewName, this.panel.context.srfappid);
+      if (func) {
+        appFunc = func;
+      }
+      return appFunc;
+    });
+    if (this.appmenu) {
+      if (appFunc) {
+        const menuItems = navBreadcrumb_util.getMenuItemsByAppFunc(
+          appFunc,
+          this.appmenu.model.appMenuItems || []
+        );
+        const items = menuItems.map((item) => {
+          return {
+            caption: item.caption,
+            fullPath: "",
+            viewName: item.id
+          };
+        });
+        items.unshift(navBreadcrumb_util.getIndexBreadcrumb(this.panel.context));
+        this.service.setChache(items);
+        this.resetBreadcrumbs();
+      } else {
+        this.service.setChache([navBreadcrumb_util.getIndexBreadcrumb(this.panel.context)]);
+        this.resetBreadcrumbs();
+      }
+      this.appmenu.evt.on("onClick", (data) => {
+        const { event } = data;
+        const items = event.map((key) => {
+          const item = this.appmenu.allAppMenuItems.find((x) => x.id === key);
+          if (item) {
+            return {
+              caption: item.caption,
+              fullPath: "",
+              viewName: item.id
+            };
+          }
+        });
+        items.unshift(navBreadcrumb_util.getIndexBreadcrumb(this.panel.context));
+        this.service.setChache(items);
+        this.resetBreadcrumbs();
+      });
+    }
+  }
+  /**
+   * @description 设置缓存模式面包屑数据
+   * @param {Router} router
+   * @memberof NavBreadcrumbController
+   */
+  setBreadcrumbByStore(router) {
+    const chache = this.service.getChache();
+    if (chache.length === 0) {
+      this.setBreadcrumbByRouter(router);
+    } else {
+      this.resetBreadcrumbs();
+    }
+    if (this.appmenu) {
+      this.appmenu.evt.on("onClick", async (data) => {
+        var _a;
+        const { eventArg } = data;
+        const menuItem = this.appmenu.allAppMenuItems.find(
+          (x) => x.id === eventArg
+        );
+        if (menuItem) {
+          const app = ibiz.hub.getApp(this.panel.context.srfappid);
+          const appFunc = app.getAppFunc(menuItem.appFuncId);
+          const viewName = ((_a = appFunc.appViewId) == null ? void 0 : _a.split(".").pop()) || "";
+          const viewConfig = await ibiz.hub.config.view.get(viewName);
+          if (appFunc.openMode !== "INDEXVIEWTAB" || viewConfig && viewConfig.openMode && viewConfig.openMode !== "INDEXVIEWTAB") {
+            return;
+          }
+          const chacheItem = this.service.getItem({ viewName });
+          const items = [];
+          if (chacheItem) {
+            items.push(chacheItem);
+          } else {
+            items.push({
+              viewName,
+              fullPath: ""
+            });
+          }
+          items.unshift(navBreadcrumb_util.getIndexBreadcrumb(this.panel.context));
+          this.service.setChache(items);
+          this.resetBreadcrumbs();
+        }
+      });
+    }
+  }
+  /**
+   * @description 处理自定义补充参数
+   * @protected
+   * @memberof NavBreadcrumbController
+   */
+  handleRawItemParams() {
+    var _a;
+    let params = {};
+    const rawItemParams = (_a = this.model.rawItem) == null ? void 0 : _a.rawItemParams;
+    if (qxUtil.notNilEmpty(rawItemParams)) {
+      params = rawItemParams.reduce((param, item) => {
+        param[item.key.toLowerCase()] = item.value;
+        return param;
+      }, {});
+    }
+    Object.assign(this.rawItemParams, params);
+  }
+}
+
+exports.NavBreadcrumbController = NavBreadcrumbController;

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.css

@@ -0,0 +1 @@
+.ibiz-nav-breadcrumb{--ibiz-nav-breadcrumb-padding:var(--ibiz-spacing-base-loose);--ibiz-nav-breadcrumb-link-color:var(--ibiz-color-link);--ibiz-nav-breadcrumb-disabled-color:var(--ibiz-color-text-0);padding:var(--ibiz-nav-breadcrumb-padding);--el-text-color-primary:var(--ibiz-nav-breadcrumb-link-color)}.ibiz-nav-breadcrumb--menu{color:var(--ibiz-nav-breadcrumb-disabled-color);--el-text-color-primary:var(--ibiz-nav-breadcrumb-disabled-color)}.ibiz-nav-breadcrumb--menu .el-breadcrumb__item{cursor:text}.ibiz-nav-breadcrumb--menu .el-breadcrumb__item:last-child .el-breadcrumb__inner{color:var(--ibiz-color-primary)}.ibiz-nav-breadcrumb--menu .el-breadcrumb__inner.is-link{font-weight:400;pointer-events:none}

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.provider.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+var navBreadcrumb_controller = require('./nav-breadcrumb.controller.cjs');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class NavBreadcrumbProvider {
+  constructor() {
+    __publicField(this, "component", "IBizNavBreadcrumb");
+  }
+  async createController(panelItem, panel, parent) {
+    const c = new navBreadcrumb_controller.NavBreadcrumbController(panelItem, panel, parent);
+    await c.init();
+    return c;
+  }
+}
+
+exports.NavBreadcrumbProvider = NavBreadcrumbProvider;

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.service.cjs

@@ -0,0 +1,145 @@
+'use strict';
+
+var ramda = require('ramda');
+var navBreadcrumb_util = require('./nav-breadcrumb.util.cjs');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class NavBreadcrumbService {
+  constructor(navMode, context) {
+    this.navMode = navMode;
+    this.context = context;
+    /**
+     * @description 面包屑堆栈
+     * @private
+     * @type {BreadcrumbMsg[]}
+     * @memberof NavBreadcrumbService
+     */
+    __publicField(this, "chache", []);
+  }
+  /**
+   * @description 添加缓存项
+   * @param {BreadcrumbMsg} item
+   * @memberof NavBreadcrumbService
+   */
+  add(item) {
+    this.chache.push(item);
+    this.chache = this.chache.filter((x) => !x.isEmbed && !x.isModal);
+    if (this.navMode === "store") {
+      localStorage.setItem("breadcrumb", JSON.stringify(this.chache));
+    }
+  }
+  /**
+   * @description 删除缓存项
+   * @param {string} fullPath
+   * @return {*}  {BreadcrumbMsg[]}
+   * @memberof NavBreadcrumbService
+   */
+  remove(fullPath) {
+    const index = this.chache.findIndex((x) => x.fullPath === fullPath);
+    if (index !== -1) {
+      this.chache.splice(index, 1);
+    }
+    return ramda.clone(this.chache);
+  }
+  /**
+   * @description 删除当前项之后缓存数据
+   * @param {string} fullPath
+   * @return {*}  {BreadcrumbMsg[]}
+   * @memberof NavBreadcrumbService
+   */
+  removeAfter(fullPath) {
+    if (this.chache.length === 0) {
+      return [];
+    }
+    const index = this.chache.findIndex((x) => x.fullPath === fullPath);
+    if (index !== -1) {
+      const result = this.chache.splice(index + 1, this.chache.length);
+      if (this.navMode === "store") {
+        localStorage.setItem("breadcrumb", JSON.stringify(this.chache));
+      }
+      return result;
+    }
+    return [];
+  }
+  /**
+   * @description 更新缓存数据
+   * @param {BreadcrumbMsg} item
+   * @memberof NavBreadcrumbService
+   */
+  updateOrAdd(item) {
+    if (!this.chache.length && this.navMode === "store") {
+      const result = localStorage.getItem("breadcrumb");
+      if (result) {
+        this.chache = JSON.parse(result);
+      }
+    }
+    const index = this.chache.findIndex(
+      (x) => x.fullPath && x.fullPath === item.fullPath || x.viewName.toLowerCase() === item.viewName.toLowerCase()
+    );
+    if (index === -1) {
+      this.add(item);
+    } else {
+      Object.assign(this.chache[index], ramda.reject(ramda.isNil, item));
+      this.chache = this.chache.filter((x) => !x.isEmbed && !x.isModal);
+      if (this.navMode === "store") {
+        localStorage.setItem("breadcrumb", JSON.stringify(this.chache));
+      }
+    }
+  }
+  /**
+   * @description 获取缓存数据项
+   * @param {IData} data
+   * @return {*}  {(BreadcrumbMsg | undefined)}
+   * @memberof NavBreadcrumbService
+   */
+  getItem(data) {
+    const { viewName = "", fullPath = "" } = data;
+    if (viewName === "index") {
+      return navBreadcrumb_util.getIndexBreadcrumb(this.context);
+    }
+    const item = this.chache.find(
+      (x) => fullPath && x.fullPath === fullPath || viewName && x.viewName.toLowerCase() === viewName.toLowerCase()
+    );
+    if (item) {
+      return ramda.clone(item);
+    }
+  }
+  /**
+   * @description 获取缓存数据
+   * @return {*}  {BreadcrumbMsg[]}
+   * @memberof NavBreadcrumbService
+   */
+  getChache() {
+    if (this.navMode === "store") {
+      const result = localStorage.getItem("breadcrumb");
+      if (result) {
+        return JSON.parse(result);
+      }
+      return [];
+    }
+    if (this.navMode === "router") {
+      return ramda.clone(this.chache.filter((x) => !x.isEmbed));
+    }
+    return ramda.clone(this.chache);
+  }
+  /**
+   * @description 设置缓存数据
+   * @param {BreadcrumbMsg[]} items
+   * @memberof NavBreadcrumbService
+   */
+  setChache(items) {
+    this.chache = ramda.clone(items);
+    this.chache = this.chache.filter((x) => !x.isEmbed && !x.isModal);
+    if (this.navMode === "store") {
+      localStorage.setItem("breadcrumb", JSON.stringify(this.chache));
+    }
+  }
+}
+
+exports.NavBreadcrumbService = NavBreadcrumbService;

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.state.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class NavBreadcrumbState extends runtime.PanelItemState {
+  constructor() {
+    super(...arguments);
+    /**
+     * @description 面包屑导航项
+     * @type {BreadcrumbMsg[]}
+     * @memberof NavBreadcrumbState
+     */
+    __publicField(this, "breadcrumbItems", []);
+  }
+}
+
+exports.NavBreadcrumbState = NavBreadcrumbState;

package/lib/panel-component/nav-breadcrumb/nav-breadcrumb.util.cjs

@@ -0,0 +1,79 @@
+'use strict';
+
+var vue3Util = require('@ibiz-template/vue3-util');
+var runtime = require('@ibiz-template/runtime');
+
+"use strict";
+function getIndexBreadcrumb(context) {
+  const app = ibiz.hub.getApp(context.srfappid);
+  const caption = app.model.caption;
+  return {
+    viewName: ibiz.hub.defaultAppIndexViewName,
+    fullPath: "/",
+    caption
+  };
+}
+function getAppFuncByViewName(name, appid) {
+  const app = ibiz.hub.getApp(appid);
+  const appFuncs = app.model.appFuncs || [];
+  const item = appFuncs.find((func) => {
+    const { appViewId = "" } = func;
+    const viewName = appViewId.split(".").pop();
+    return (viewName == null ? void 0 : viewName.toLowerCase()) === name.toLowerCase();
+  });
+  return item;
+}
+function getMenuItemsByAppFunc(func, appMenuItems) {
+  const result = [];
+  const findMenuItem = (menuItems) => {
+    return menuItems.find((item) => {
+      if (item.appFuncId && item.appFuncId === func.id) {
+        result.unshift(item);
+        return true;
+      }
+      if (item.appMenuItems && item.appMenuItems.length > 0) {
+        const menuItem = findMenuItem(item.appMenuItems);
+        if (menuItem) {
+          result.unshift(item);
+          return true;
+        }
+      }
+      return false;
+    });
+  };
+  findMenuItem(appMenuItems);
+  return result;
+}
+function getCurViewName(router) {
+  var _a;
+  const { currentRoute } = router;
+  const routePath = vue3Util.route2routePath(currentRoute.value);
+  return ((_a = routePath.pathNodes.pop()) == null ? void 0 : _a.viewName) || "";
+}
+function getViewInfoByViewStack(viewName) {
+  if (viewName === runtime.RouteConst.ROUTE_MODAL_TAG) {
+    return {
+      viewName,
+      fullPath: "",
+      isModal: true
+    };
+  }
+  const view = ibiz.util.viewStack.getViewByCodeName(viewName);
+  if (view) {
+    let isEmbed = false;
+    if (view.parentView && view.parentView.model.codeName !== ibiz.hub.defaultAppIndexViewName) {
+      isEmbed = true;
+    }
+    return {
+      viewName: view.model.codeName,
+      caption: view.model.caption,
+      isEmbed
+    };
+  }
+}
+
+exports.getAppFuncByViewName = getAppFuncByViewName;
+exports.getCurViewName = getCurViewName;
+exports.getIndexBreadcrumb = getIndexBreadcrumb;
+exports.getMenuItemsByAppFunc = getMenuItemsByAppFunc;
+exports.getViewInfoByViewStack = getViewInfoByViewStack;

package/lib/panel-component/nav-pos-index/nav-pos-index.controller.cjs

@@ -53,6 +53,12 @@ class NavPosIndexController extends runtime.PanelItemController {
      * @memberof NavPosController
      */
     __publicField(this, "rawItemParams", {});
+    /**
+     * @description 当前导航key
+     * @type {string}
+     * @memberof NavPosIndexController
+     */
+    __publicField(this, "currentKey", "");
   }
   createState() {
     var _a;
@@ -80,6 +86,15 @@ class NavPosIndexController extends runtime.PanelItemController {
   get navTabs() {
     return this.panel.panelItems.nav_tabs;
   }
+  /**
+   * @description 面包屑控制器
+   * @readonly
+   * @type {(NavBreadcrumbController | undefined)}
+   * @memberof NavPosIndexController
+   */
+  get navBreadcrumb() {
+    return this.panel.panelItems.nav_breadcrumb;
+  }
   /**
    * 应用菜单控制器
    * @author lxm
@@ -138,6 +153,7 @@ class NavPosIndexController extends runtime.PanelItemController {
     if (currentKey === "") {
       return;
     }
+    this.currentKey = currentKey;
     const index = this.state.operateSort.indexOf(currentKey);
     if (index !== -1) {
       this.state.operateSort.splice(index, 1);
@@ -174,14 +190,38 @@ class NavPosIndexController extends runtime.PanelItemController {
    * @param {EventBase} event
    */
   onViewCreated(event) {
+    const { view } = event;
+    const key = this.state.currentKey;
     if (this.navTabs) {
-      const { view } = event;
-      const key = this.state.currentKey;
       this.navTabs.updateViewInfo(key, { caption: view.model.caption });
       view.evt.on("onViewInfoChange", ({ caption, dataInfo }) => {
         this.navTabs.updateViewInfo(key, { caption, dataInfo });
       });
     }
+    if (this.navBreadcrumb) {
+      this.navBreadcrumb.updateViewInfo(key, {
+        viewName: view.model.codeName,
+        caption: view.model.caption
+      });
+      view.evt.on("onViewInfoChange", ({ caption, dataInfo }) => {
+        this.navBreadcrumb.updateViewInfo(key, {
+          viewName: view.model.codeName,
+          caption,
+          dataInfo
+        });
+      });
+      view.evt.on("onActivated", () => {
+        const data = view.state.srfactiveviewdata;
+        const info = {
+          viewName: view.model.codeName,
+          caption: view.model.caption
+        };
+        if (data && data.srfkey) {
+          Object.assign(info, { dataInfo: data.srfmajortext || "" });
+        }
+        this.navBreadcrumb.updateViewInfo(key, info);
+      });
+    }
   }
   /**
    * 删除单个缓存
@@ -207,7 +247,7 @@ class NavPosIndexController extends runtime.PanelItemController {
    * @date 2023-05-09 02:19:55
    */
   clearCache() {
-    this.state.cacheKeys = [];
+    this.state.cacheKeys = [this.currentKey];
     this.viewModals = {};
   }
   /**
@@ -242,6 +282,9 @@ class NavPosIndexController extends runtime.PanelItemController {
     if (this.navTabs) {
       this.navTabs.removeCache(key);
     }
+    if (this.navBreadcrumb) {
+      this.navBreadcrumb.removeCache(key);
+    }
     this.removeCache(key);
     if (this.autoGoLast) {
       this.goLast();

package/lib/panel-component/panel-app-title/index.cjs

@@ -15,6 +15,10 @@ const IBizPanelAppTitle = vue3Util.withInstall(panelAppTitle.PanelAppTitle, func
     "RAWITEM_APP_APPTITLE",
     () => new panelAppTitle_provider.PanelAppTitleProvider()
   );
+  runtime.registerPanelItemProvider(
+    "CTRLPOS_APP_APPTITLE",
+    () => new panelAppTitle_provider.PanelAppTitleProvider()
+  );
 });
 
 exports.PanelAppTitleController = panelAppTitle_controller.PanelAppTitleController;