@lcap/nasl-concepts 3.9.0-beta.1

package/out/concepts/Frontend__.js

@@ -0,0 +1,870 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+var Frontend_1;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Frontend = void 0;
+const nasl_translator_1 = require("@lcap/nasl-translator");
+const utils_1 = require("../utils");
+const decorators_1 = require("../decorators");
+const utils_2 = require("../utils");
+const utils = __importStar(require("../utils"));
+const asserts = __importStar(require("./utils/asserts"));
+const BaseNode_1 = __importDefault(require("../common/BaseNode"));
+/**
+ * 前端
+ */
+let Frontend = class Frontend extends BaseNode_1.default {
+    static { Frontend_1 = this; }
+    /** 类名 */
+    static { this.ConceptName = 'Frontend'; }
+    /**
+     * 是否为抽象类
+     * 抽象类不能产生 concept: string
+     */
+    static { this.isAbstract = false; }
+    /** 继承链 */
+    static { this.inheritanceChain = ['BaseNode']; }
+    /**
+     * @param source 需要合并的部分参数
+     */
+    constructor(source) {
+        source = Object.assign({}, Frontend_1.getDefaultOptions(), source);
+        super(source);
+        /**
+         * 前端标识
+         */
+        this.name = '';
+        /**
+         * 元素绑定事件列表
+         */
+        this.bindEvents = [];
+        /**
+         * 页面列表
+         */
+        this.views = [];
+        /**
+         * 前端全局变量列表
+         */
+        this.variables = [];
+        /**
+         * 全局缩放开关
+         */
+        this.globalScaleEnabled = false;
+        /**
+         * 画布宽度
+         */
+        this.canvasWidth = 0;
+        super.subConstructor(source);
+    }
+    static from(source, parentNode, parentKey) {
+        return super.from(source, parentNode, parentKey);
+    }
+    /**
+     * 设置前端标识
+     */
+    setName(name) {
+        const object = {
+            name,
+        };
+        this.update({
+            ...object,
+            field: 'name',
+        });
+    }
+    /**
+     * 设置pc端
+     */
+    setTitle(title) {
+        const object = {
+            title,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    /**
+     * 设置基础路径
+     */
+    setPath(path) {
+        const object = {
+            path,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    /**
+     * 设置制品应用标题
+     */
+    setDocumentTitle(documentTitle) {
+        const object = {
+            documentTitle,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    /**
+     * 设置制品应用图标
+     */
+    setDocumentIcon(documentIcon) {
+        const object = {
+            documentIcon,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    /**
+     * 设置全局缩放开关
+     */
+    setGlobalScaleEnabled(globalScaleEnabled) {
+        const object = {
+            globalScaleEnabled,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    /**
+     * 设置画布宽度
+     */
+    setCanvasWidth(canvasWidth) {
+        const object = {
+            canvasWidth,
+        };
+        this.update({
+            ...object,
+        });
+    }
+    getBindEventExistingNames(excludedList = []) {
+        const excludedSet = new Set(excludedList);
+        return (this.bindEvents || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
+    }
+    getBindEventUniqueName(name = 'bindEvent1') {
+        return utils.unique(name, this.getBindEventExistingNames(), undefined, false);
+    }
+    _insertBindEventAt(options, index) {
+        const bindEventOptions = {};
+        const relationOptions = { parentNode: this, parentKey: 'bindEvents' };
+        const BindEvent = (0, decorators_1.getConceptConstructor)('BindEvent');
+        let bindEvent;
+        if (!options) {
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
+                name: this.getBindEventUniqueName(),
+            }, this, 'bindEvents');
+        }
+        else if (typeof options === 'string') {
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
+                name: options,
+            }, this, 'bindEvents');
+        }
+        else if (asserts.isBindEvent(options)) {
+            options.ensureDelete(); // 同一实例不支持多处存在
+            bindEvent = options;
+            Object.assign(bindEvent, relationOptions);
+        }
+        else {
+            bindEvent = BindEvent.from({
+                ...bindEventOptions,
+                ...options,
+            }, this, 'bindEvents');
+        }
+        this.bindEvents.splice(index, 0, bindEvent);
+        return bindEvent;
+    }
+    insertBindEventAt(options, index) {
+        const node = this._insertBindEventAt(options, index);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'bindEvents',
+        });
+        return node;
+    }
+    _addBindEvent(options) {
+        const index = this.bindEvents.length;
+        return this._insertBindEventAt(options, index);
+    }
+    addBindEvent(options) {
+        const node = this._addBindEvent(options);
+        const index = this.bindEvents.indexOf(node);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'bindEvents',
+        });
+        return node;
+    }
+    getViewExistingNames(excludedList = []) {
+        const excludedSet = new Set(excludedList);
+        return (this.views || []).filter((item) => !excludedSet.has(item)).map((item) => item.name);
+    }
+    getViewUniqueName(name = 'view1') {
+        return utils.unique(name, this.getViewExistingNames(), undefined, true);
+    }
+    _insertViewAt(options, index) {
+        const viewOptions = {};
+        const relationOptions = { parentNode: this, parentKey: 'views' };
+        const View = (0, decorators_1.getConceptConstructor)('View');
+        let view;
+        if (!options) {
+            view = View.from({
+                ...viewOptions,
+                name: this.getViewUniqueName(),
+            }, this, 'views');
+        }
+        else if (typeof options === 'string') {
+            view = View.from({
+                ...viewOptions,
+                name: options,
+            }, this, 'views');
+        }
+        else if (asserts.isView(options)) {
+            options.ensureDelete(); // 同一实例不支持多处存在
+            view = options;
+            Object.assign(view, relationOptions);
+        }
+        else {
+            view = View.from({
+                ...viewOptions,
+                ...options,
+            }, this, 'views');
+        }
+        this.views.splice(index, 0, view);
+        return view;
+    }
+    insertViewAt(options, index) {
+        const node = this._insertViewAt(options, index);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'views',
+        });
+        return node;
+    }
+    _addView(options) {
+        const index = this.views.length;
+        return this._insertViewAt(options, index);
+    }
+    addView(options) {
+        const node = this._addView(options);
+        const index = this.views.indexOf(node);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'views',
+        });
+        return node;
+    }
+    getVarExistingNames(excludedList = []) {
+        const excludedSet = new Set(excludedList);
+        return (this.variables || [])
+            .filter((item) => !excludedSet.has(item))
+            .map((item) => item.name);
+    }
+    getFrontendVariableUniqueName(name = 'frontendVariable1') {
+        return utils.unique(name, this.getVarExistingNames(), undefined, true);
+    }
+    _insertFrontendVariableAt(options, index) {
+        const frontendVariableOptions = {};
+        const relationOptions = { parentNode: this, parentKey: 'variables' };
+        const FrontendVariable = (0, decorators_1.getConceptConstructor)('FrontendVariable');
+        let frontendVariable;
+        if (!options) {
+            frontendVariable = FrontendVariable.from({
+                ...frontendVariableOptions,
+                name: this.getFrontendVariableUniqueName(),
+            }, this, 'variables');
+        }
+        else if (typeof options === 'string') {
+            frontendVariable = FrontendVariable.from({
+                ...frontendVariableOptions,
+                name: options,
+            }, this, 'variables');
+        }
+        else if (asserts.isFrontendVariable(options)) {
+            options.ensureDelete(); // 同一实例不支持多处存在
+            frontendVariable = options;
+            Object.assign(frontendVariable, relationOptions);
+        }
+        else {
+            frontendVariable = FrontendVariable.from({
+                ...frontendVariableOptions,
+                ...options,
+            }, this, 'variables');
+        }
+        this.variables.splice(index, 0, frontendVariable);
+        return frontendVariable;
+    }
+    insertFrontendVariableAt(options, index) {
+        const node = this._insertFrontendVariableAt(options, index);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'variables',
+        });
+        return node;
+    }
+    _addFrontendVariable(options) {
+        const index = this.variables.length;
+        return this._insertFrontendVariableAt(options, index);
+    }
+    addFrontendVariable(options) {
+        const node = this._addFrontendVariable(options);
+        const index = this.variables.indexOf(node);
+        node.create({
+            index,
+            parentNode: this,
+            parentKey: 'variables',
+        });
+        return node;
+    }
+    removeBindEvent(options) {
+        let bindEvent;
+        if (typeof options === 'string') {
+            bindEvent = this.bindEvents.find((item) => item.name === options);
+            if (!bindEvent) {
+                throw new Error('找不到元素绑定事件 ' + options);
+            }
+        }
+        else {
+            bindEvent = options;
+        }
+        return bindEvent.delete();
+    }
+    removeView(options) {
+        let view;
+        if (typeof options === 'string') {
+            view = this.views.find((item) => item.name === options);
+            if (!view) {
+                throw new Error('找不到页面 ' + options);
+            }
+        }
+        else {
+            view = options;
+        }
+        return view.delete();
+    }
+    removeFrontendVariable(options) {
+        let frontendVariable;
+        if (typeof options === 'string') {
+            frontendVariable = this.variables.find((item) => item.name === options);
+            if (!frontendVariable) {
+                throw new Error('找不到前端全局变量 ' + options);
+            }
+        }
+        else {
+            frontendVariable = options;
+        }
+        return frontendVariable.delete();
+    }
+    //================================================================================
+    // ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
+    // 自动生成的代码已结束。下面可以手动编写。
+    //================================================================================
+    /**
+     * @param path 路径
+     * path 为要查找路径：如 /dashboard/student/list、/dashboard/student/list
+     */
+    findViewByPath(path) {
+        const arr = path.split('/');
+        if (arr[0] === '')
+            arr.shift();
+        if (!arr.length)
+            throw Error(`Cannot find View ${path}`);
+        const childName = arr.shift();
+        const subView = this.views.find((child) => child.name === childName);
+        return arr.length ? subView.findViewByPath(arr.join('/')) : subView;
+    }
+    findViewByName(name) {
+        return utils.traverse((current) => {
+            if (current.node.name === name)
+                return current.node;
+        }, { node: { name: '', children: this.views } });
+    }
+    genThemeCSS() {
+        if (!this.theme) {
+            return;
+        }
+        const { variableMap, scopeVariableMap } = this.theme;
+        const scopeKeys = Object.keys(scopeVariableMap || {});
+        const keys = Object.keys(variableMap || {});
+        if (!keys.length && !scopeKeys.length) {
+            return;
+        }
+        if (scopeKeys.length > 0) {
+            return scopeKeys
+                .map((selector) => {
+                const varMap = scopeVariableMap[selector];
+                return `${selector} {${Object.keys(varMap)
+                    .map((varName) => `${varName}:${varMap[varName]};`)
+                    .join('')}}`;
+            })
+                .join('\n');
+        }
+        return `:root {
+            ${keys.map((key) => `    ${key}: ${this.theme?.variableMap[key]};`).join('\n')}
+        }`;
+    }
+    getTsNamespace() {
+        if (this.parentNode && this.parentNode.getNamespace) {
+            const parentNamespace = this.parentNode.getNamespace();
+            const parentName = this.parentNode.name;
+            const arr = [parentNamespace];
+            if (this.parentNode.concept !== 'App' && parentName) {
+                arr.push(parentName);
+            }
+            return `${arr.join('.')}.frontends`;
+        }
+        throw new Error('无法获取命名空间，请设置 parentNode！');
+    }
+    getNamespace() {
+        if (this.parentNode && this.parentNode.getNamespace) {
+            const parentNamespace = this.parentNode.getNamespace();
+            const parentName = this.parentNode.name;
+            const arr = [parentNamespace];
+            if (this.parentNode.concept !== 'App' && parentName) {
+                arr.push(parentName);
+            }
+            return `${arr.join('.')}.frontends`;
+        }
+        throw new Error('无法获取命名空间，请设置 parentNode！');
+    }
+    /**
+     * 生成宿主语言的文件路径
+     * @param name 一般不用传，用于 rename
+     */
+    getEmbeddedFilePath(name = this.name) {
+        return `/embedded/${this.getAncestor('App')?.name}/frontendTypes/${this.getAncestor('FrontendType')?.name}/frontends/${name}.ts`;
+    }
+    *toEmbeddedTS(state = (0, nasl_translator_1.createCompilerState)()) {
+        const self = this;
+        let code = `export namespace ${self.name} {\n`;
+        code += 'const name = ';
+        code += `"${self.name}";\n`;
+        code += '}\n';
+        return code;
+    }
+    *toEmbeddedTSFile() {
+        let code = `namespace ${this.getNamespace()} {\n`;
+        const state = (0, nasl_translator_1.createCompilerState)(code, { tabSize: 1 });
+        try {
+            code += yield* this.toEmbeddedTS(state);
+        }
+        catch (err) {
+            code += '';
+            console.log(err);
+        }
+        code += '}\n';
+        return {
+            code,
+            filePath: this.getEmbeddedFilePath(),
+            sourceMap: state.sourceMap,
+        };
+    }
+    get frameworkKind() {
+        const node = this.getAncestor('FrontendType');
+        if (asserts.isFrontendType(node)) {
+            return node.frameworkKind ?? 'vue2';
+        }
+        return 'vue2';
+    }
+    getPath() {
+        const { path } = this;
+        const finalPath = path && path !== '/' ? path : '';
+        return finalPath;
+    }
+    // 前缀
+    get prefixPath() {
+        const prefixArr = [];
+        [this.app.sysPrefixPath, this.basePath].forEach((prefix) => {
+            if (prefix) {
+                prefixArr.push(prefix);
+            }
+        });
+        return prefixArr.join('');
+    }
+    /**
+     * 为/的转成''，便于url拼接
+     */
+    get basePath() {
+        const { path } = this;
+        const basePath = path && path !== '/' ? path : '';
+        return basePath;
+    }
+    getExtensionsCallbackLogics() {
+        let resultLogics = [];
+        this.views.forEach((item) => {
+            resultLogics = [...resultLogics, ...item.getViewCallLogics()];
+        });
+        return Array.from(new Set(resultLogics));
+    }
+    get defaultCanvasWidth() {
+        return this.type === 'pc' ? 1440 : 375;
+    }
+    /**
+     * 获取当前页面下所有elements上bindEvents下的logic
+     */
+    // elementLogicRoot: any[] = [];
+    // getElementLogicRoot() {
+    //     const logics: Array<Logic> = [];
+    //     // 页面上的绑定的事件
+    //     this.bindEvents.forEach((bindEvent) => {
+    //         bindEvent.logics.forEach((logic) => {
+    //             // 声明周期没有event
+    //             logics.push(logic);
+    //         });
+    //     });
+    //     if (logics.length) {
+    //         const expanded = (this.elementLogicRoot.length && this.elementLogicRoot[0].expanded) || false;
+    //         this.elementLogicRoot = [{
+    //             concept: 'elementLogicRoot',
+    //             expanded,
+    //             children: logics,
+    //         }];
+    //     } else {
+    //         this.elementLogicRoot = [];
+    //     }
+    // }
+    setI18nKeys() {
+        this.app?.emit('collect:start', { actionMsg: '增加I18nKey' });
+        const resolveValueComponents = ['van-copy', 'u-copy', 'u-badge'];
+        const rejectNameComponents = [
+            'van-collapse-item',
+            'van-iconv',
+            'van-radio',
+            'van-tabbar-item',
+            'van-tab',
+            'van-uploader',
+            'u-uploader',
+            'u-validator',
+            'i-ico',
+        ];
+        // 判断绑定属性 是不是需要国际化
+        function getBindAttrI18nFlag(node) {
+            let flag = false;
+            // 名称在这个数组里面的
+            if (['text', 'placeholder', 'content'].includes(node.name)) {
+                flag = true;
+            }
+            else if (node.name?.includes('title')) {
+                // 名称含有title的
+                flag = true;
+            }
+            else if (['value'].includes(node.name)) {
+                // 有些组件的value是不需要国际化的，所以这里声明谁可以配置国际化
+                let tag = node?.parentNode?.tag;
+                if (resolveValueComponents.includes(tag)) {
+                    flag = true;
+                }
+            }
+            else if (['name'].includes(node.name)) {
+                // 有些组件的value是不需要国际化的，所以这里声明谁不可以配置国际化
+                let tag = node?.parentNode?.tag;
+                if (!rejectNameComponents.includes(tag)) {
+                    flag = true;
+                }
+            }
+            return flag;
+        }
+        // 设置节点下 所有需要国际化的节点的 国际化key
+        function setChildrenI18nKeys(node) {
+            node.traverseStrictChildren((node) => {
+                if (!node.i18nKey && node.value) {
+                    // 只有指定名称才有国际化key
+                    if (node.concept === 'BindAttribute' && node.type === 'string') {
+                        if (getBindAttrI18nFlag(node)) {
+                            node.update({
+                                i18nKey: (0, utils_2.createUUID)(),
+                            });
+                        }
+                    }
+                    else if (node.concept === 'BindDirective' && node.type === 'string' && node.name === 'tooltip') {
+                        node.update({
+                            i18nKey: (0, utils_2.createUUID)(),
+                        });
+                    }
+                    else if (node.concept === 'StaticString') {
+                        node.update({
+                            i18nKey: (0, utils_2.createUUID)(),
+                        });
+                    }
+                    else if (node.concept === 'StringLiteral' && !node.getAncestor('StringInterpolation')) {
+                        node.update({
+                            i18nKey: (0, utils_2.createUUID)(),
+                        });
+                    }
+                }
+                else if (node.i18nKey) {
+                    // 国际化所有绑定的节点都应该有value
+                    if (!node.value) {
+                        node.update({
+                            i18nKey: null,
+                        });
+                        return;
+                    }
+                    if (node.concept === 'BindAttribute' && (node.type !== 'string' || !getBindAttrI18nFlag(node))) {
+                        node.update({
+                            i18nKey: null,
+                        });
+                    }
+                    else if (node.concept === 'BindDirective' && (node.type !== 'string' || node.name !== 'tooltip')) {
+                        node.update({
+                            i18nKey: null,
+                        });
+                    }
+                    else if (node.concept === 'StringLiteral' && node.getAncestor('StringInterpolation')) {
+                        node.update({
+                            i18nKey: null,
+                        });
+                    }
+                }
+            });
+        }
+        const FrontendType = this.getAncestor('FrontendType');
+        const businessComponents = FrontendType?.businessComponents;
+        setChildrenI18nKeys(this);
+        // 业务组件塞入国际化key
+        businessComponents.forEach((component) => {
+            setChildrenI18nKeys(component);
+        });
+        const allEnums = [...this.app.enums];
+        this.app?.dependencies.forEach((item) => {
+            allEnums.push(...item.enums);
+        });
+        // 所有的枚举塞入国际化key
+        allEnums.forEach((item) => {
+            item.enumItems.forEach((item) => {
+                if (!item.label?.i18nKey) {
+                    item.label.update({
+                        i18nKey: (0, utils_2.createUUID)(),
+                    });
+                }
+            });
+        });
+        this.app?.emit('collect:end');
+    }
+    getI18nKeyNodes(map) {
+        const nodes = [];
+        const FrontendType = this.getAncestor('FrontendType');
+        const businessComponents = FrontendType?.businessComponents;
+        function getChildrenI18nKeys(node) {
+            node.traverseStrictChildren((node) => {
+                if (node && node.i18nKey && node.value) {
+                    if (node.concept === 'BindAttribute') {
+                        if (node.type === 'string') {
+                            nodes.push(node);
+                        }
+                    }
+                    else {
+                        nodes.push(node);
+                    }
+                }
+            });
+        }
+        getChildrenI18nKeys(this);
+        businessComponents.forEach((component) => {
+            getChildrenI18nKeys(component);
+        });
+        const allEnums = [...this.app.enums];
+        this.app?.dependencies.forEach((item) => {
+            allEnums.push(...item.enums);
+        });
+        allEnums.forEach((item) => {
+            item.enumItems.forEach((item) => {
+                if (item?.label?.i18nKey) {
+                    nodes.push(item.label);
+                }
+            });
+        });
+        if (map) {
+            map.businessComponents = businessComponents;
+            map.allEnums = allEnums;
+            map.nodes = nodes;
+        }
+        return nodes;
+    }
+    getI18nKeyNodeTypeMap() {
+        let map = {};
+        this.getI18nKeyNodes(map);
+        return map;
+    }
+    get allLanguageList() {
+        return utils_1.languageList;
+    }
+    getCurrentLanguageList() {
+        const list = [];
+        for (let key in this.i18nInfo?.messageMap || {}) {
+            const lang = utils_1.languageList.find((item) => item.id === key);
+            if (lang) {
+                list.push(lang);
+            }
+        }
+        return list;
+    }
+    toNaturalTS(state = (0, nasl_translator_1.createCompilerState)()) {
+        let code = `export namespace frontends.${this.name} {\n`;
+        this.variables.forEach((variable) => {
+            code += variable.toNaturalTS((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            code += '\n';
+        });
+        this.bindEvents?.forEach((event) => {
+            code += event.toNaturalTS((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            code += '\n';
+        });
+        this.views.forEach((view, index) => {
+            code += view.toNaturalTS((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            if (index !== this.views.length - 1)
+                code += '\n';
+        });
+        code += `${(0, nasl_translator_1.indent)(state.tabSize)}}`;
+        return code;
+    }
+    toTextualNASL(state = (0, nasl_translator_1.createCompilerState)()) {
+        let code = '';
+        code += (0, nasl_translator_1.createDecoratorCode)(state, this, [
+            'title',
+            'path',
+            'documentTitle',
+            'documentIcon',
+            'globalScaleEnabled',
+            'canvasWidth',
+        ]);
+        code += `frontend ${this.type} ${this.name} {\n`;
+        this.variables.forEach((variable) => {
+            code += variable.toTextualNASL((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            code += '\n';
+        });
+        if (this.variables.length)
+            code += '\n';
+        this.bindEvents?.forEach((event) => {
+            code += event.toTextualNASL((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            code += '\n';
+        });
+        if (this.bindEvents?.length)
+            code += '\n';
+        this.views.forEach((view, index) => {
+            code += view.toTextualNASL((0, nasl_translator_1.shiftState)(state, code, { tabSize: state.tabSize + 1 }));
+            if (index !== this.views.length - 1)
+                code += '\n';
+        });
+        code += `${(0, nasl_translator_1.indent)(state.tabSize)}}`;
+        return code;
+    }
+    toEmbeddedDeclarationTSFile() {
+        const { sourceMap, ...rest } = utils.runGeneratorSync(this.toEmbeddedTSFile());
+        return rest;
+    }
+};
+exports.Frontend = Frontend;
+__decorate([
+    (0, decorators_1.property)()
+    // @ts-ignore
+], Frontend.prototype, "concept", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "name", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "title", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "type", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "path", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "documentTitle", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "documentIcon", void 0);
+__decorate([
+    (0, decorators_1.property)({
+        objectRef: 'BindEvent',
+        isArray: true,
+        defaultValue: [],
+    })
+], Frontend.prototype, "bindEvents", void 0);
+__decorate([
+    (0, decorators_1.property)({
+        objectRef: 'View',
+        isArray: true,
+        defaultValue: [],
+    })
+], Frontend.prototype, "views", void 0);
+__decorate([
+    (0, decorators_1.property)({
+        objectRef: 'FrontendVariable',
+        isArray: true,
+        defaultValue: [],
+    })
+], Frontend.prototype, "variables", void 0);
+__decorate([
+    (0, decorators_1.property)({
+        objectRef: 'Theme',
+    })
+], Frontend.prototype, "theme", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "globalScaleEnabled", void 0);
+__decorate([
+    (0, decorators_1.property)()
+], Frontend.prototype, "canvasWidth", void 0);
+__decorate([
+    (0, decorators_1.property)({
+        objectRef: 'I18nInfo',
+    })
+], Frontend.prototype, "i18nInfo", void 0);
+__decorate([
+    nasl_translator_1.withSourceMapGenerator
+], Frontend.prototype, "toEmbeddedTS", null);
+__decorate([
+    (0, nasl_translator_1.withSourceMap)()
+], Frontend.prototype, "toNaturalTS", null);
+__decorate([
+    (0, nasl_translator_1.withSourceMap)()
+], Frontend.prototype, "toTextualNASL", null);
+exports.Frontend = Frontend = Frontend_1 = __decorate([
+    (0, decorators_1.concept)('前端')
+], Frontend);
+exports.default = Frontend;
+//================================================================================
+// ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑   ↑
+// 自动生成的代码已结束。下面可以手动编写。
+//================================================================================
+//# sourceMappingURL=Frontend__.js.map