ngx-rs-ant 1.3.3 → 1.3.6

package/fesm2020/ngx-rs-ant.mjs

@@ -9,7 +9,7 @@ import * as i2$1 from 'devextreme-angular/ui/draggable';
 import { DevExtremeModule, DxLoadPanelModule, DxDataGridComponent, DxValidationGroupComponent } from 'devextreme-angular';
 import BpmnModeler from 'camunda-bpmn-js/lib/camunda-platform/Modeler';
 import { is } from 'bpmn-js/lib/util/ModelUtil';
-import { TextFieldEntry, isTextFieldEntryEdited } from '@bpmn-io/properties-panel';
+import { TextAreaEntry, isTextAreaEntryEdited, SelectEntry, isSelectEntryEdited } from '@bpmn-io/properties-panel';
 import * as i6 from 'devextreme-angular/ui/load-panel';
 import * as i6$1 from 'devextreme-angular/ui/nested';
 import { DxoPositionModule } from 'devextreme-angular/ui/nested';
@@ -24,8 +24,8 @@ import * as i2$2 from '@angular/platform-browser';
 import * as i3$1 from 'devextreme-angular/ui/accordion';
 import notify from 'devextreme/ui/notify';
 import * as i7 from 'devextreme-angular/ui/validation-group';
-import * as i3$2 from 'devextreme-angular/ui/text-box';
-import * as i4$1 from 'devextreme-angular/ui/popover';
+import * as i4$1 from 'devextreme-angular/ui/text-box';
+import * as i4$2 from 'devextreme-angular/ui/popover';
 
 class DividerLineComponent {
     get _style() {
@@ -589,7 +589,10 @@ class BoxItemComponent {
     calcStyle(item) {
         const width = item.style?.width ? item.style.width : 'auto';
         const height = item.style?.height ? item.style.height : 'auto';
-        return this._calcStyle(this.config.direction, width, height);
+        return {
+            ...this._calcStyle(this.config.direction, width, height),
+            position: 'relative'
+        };
     }
     _calcStyle(direction, width, height) {
         if (direction === 'row') {
@@ -846,16 +849,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
         }] });
 
 const translations = {
+    // 调色板
     'Activate the hand tool': '激活拖拽工具',
     'Activate the lasso tool': '激活框选工具',
     'Activate the create/remove space tool': '激活空间移动工具',
     'Activate the global connect tool': '激活全局连接工具',
     'Create StartEvent': '创建开始节点',
     'Create EndEvent': '创建结束节点',
-    'Create Gateway': '创建网关节点',
     'Create UserTask': '创建用户任务',
+    'Create ServiceTask': '创建服务任务',
+    'Create Gateway': '创建网关节点',
+    // 面板
+    'Append EndEvent': '追加结束节点',
+    'Append UserTask': '追加用户任务',
+    'Append ServiceTask': '追加服务任务',
+    'Append Gateway': '追加网关节点',
+    'Connect using Sequence/MessageFlow or Association': '使用序列/消息流或关联连接',
+    'Remove': '删除',
+    'Set Color': '设置颜色',
+    'Change type': '改变节点类型',
+    'Exclusive Gateway': '互斥网关',
+    'Parallel Gateway': '并行网关',
+    'Default Flow': '默认流向',
+    'Sequence Flow': '顺序流向',
     'Open minimap': '打开缩略图',
     'Close minimap': '关闭缩略图',
+    // 配置
+    'General': '参数配置',
+    'Name': '名称',
+    'Task description': '任务描述',
+    'Set assignment rule': '设置用户规则',
+    'dynamic user': '动态用户',
+    'static user': '静态用户',
+    'dynamic role': '动态角色',
+    'static role': '静态角色',
     /*
       'Create {type}': '创建{type}',
       'Create Intermediate/Boundary Event': '创建中间/边界事件',
@@ -1226,6 +1253,85 @@ var customUserTaskModule = {
     userTaskContextPadProvider: ['type', UserTaskContextPadProvider],
 };
 
+class ServiceTaskPaletteProvider {
+    constructor(palette, translate, elementFactory, create) {
+        this.translate = translate;
+        this.elementFactory = elementFactory;
+        this.create = create;
+        palette.registerProvider(this);
+        this.createServiceTask = this.createServiceTask.bind(this);
+    }
+    getPaletteEntries() {
+        return {
+            'create.service-task': {
+                group: 'activity',
+                className: 'bpmn-icon-service-task',
+                title: this.translate('Create ServiceTask'),
+                action: {
+                    dragstart: this.createServiceTask,
+                    click: this.createServiceTask
+                }
+            }
+        };
+    }
+    createServiceTask(event) {
+        const shape = this.elementFactory.createShape({ type: 'bpmn:ServiceTask' });
+        this.create.start(event, shape);
+    }
+}
+
+class ServiceTaskContextPadProvider {
+    constructor(contextPad, translate, appendPreview, elementFactory, autoPlace, create) {
+        this.translate = translate;
+        this.appendPreview = appendPreview;
+        this.elementFactory = elementFactory;
+        this.autoPlace = autoPlace;
+        this.create = create;
+        contextPad.registerProvider(this);
+        this.appendServiceTaskPreview = this.appendServiceTaskPreview.bind(this);
+        this.appendServiceTask = this.appendServiceTask.bind(this);
+        this.appendServiceTaskStart = this.appendServiceTaskStart.bind(this);
+    }
+    getContextPadEntries() {
+        return {
+            'append.service-task': {
+                group: 'model',
+                className: 'bpmn-icon-service-task',
+                title: this.translate('Append ServiceTask'),
+                action: {
+                    hover: this.appendServiceTaskPreview,
+                    click: this.appendServiceTask,
+                    dragstart: this.appendServiceTaskStart
+                }
+            }
+        };
+    }
+    appendServiceTaskPreview(event, source) {
+        this.appendPreview.create(source, 'bpmn:ServiceTask');
+        return () => {
+            this.appendPreview.cleanUp();
+        };
+    }
+    appendServiceTask(event, source) {
+        const shape = this.elementFactory.createShape({ type: 'bpmn:ServiceTask' });
+        this.autoPlace.append(source, shape);
+        this.appendPreview.cleanUp();
+    }
+    appendServiceTaskStart(event, source) {
+        const shape = this.elementFactory.createShape({ type: 'bpmn:ServiceTask' });
+        this.create.start(event, shape, {
+            source: source
+        });
+        this.appendPreview.cleanUp();
+    }
+}
+
+var customServiceTaskModule = {
+    __init__: ['serviceTaskPaletteProvider', 'serviceTaskContextPadProvider'],
+    serviceTaskPaletteProvider: ['type', ServiceTaskPaletteProvider],
+    serviceTaskContextPadProvider: ['type', ServiceTaskContextPadProvider],
+};
+
 class HideOtherPaletteProvider {
     constructor(palette) {
         this.visibleEntryKeys = [
@@ -1237,6 +1343,7 @@ class HideOtherPaletteProvider {
             'create.start-event',
             'create.end-event',
             'create.user-task',
+            'create.service-task',
             'create.exclusive-gateway',
             'xml'
         ];
@@ -1286,6 +1393,7 @@ class HideOtherContextPadProvider {
             else if (is(element, 'bpmn:Gateway')) {
                 return {
                     'append.user-task': entries['append.user-task'],
+                    'append.service-task': entries['append.service-task'],
                     'append.gateway': entries['append.gateway'],
                     'append.end-event': entries['append.end-event'],
                     'connect': entries['connect'],
@@ -1296,6 +1404,7 @@ class HideOtherContextPadProvider {
             }
             return {
                 'append.user-task': entries['append.user-task'],
+                'append.service-task': entries['append.service-task'],
                 'append.gateway': entries['append.gateway'],
                 'append.end-event': entries['append.end-event'],
                 'connect': entries['connect'],
@@ -1363,12 +1472,13 @@ var customHideOtherModule = {
     gatewayReplaceMenuProvider: ['type', GatewayReplaceMenuProvider]
 };
 
-function addExtensionProperty(element, key, value, bpmnFactory, modeling) {
+const util = {};
+function addExtensionProperty(element, key, value) {
     let extensionElements = element.businessObject.get('extensionElements');
     if (!extensionElements) {
-        extensionElements = bpmnFactory.create('bpmn:ExtensionElements', { values: [] });
+        extensionElements = util.bpmnFactory.create('bpmn:ExtensionElements', { values: [] });
         extensionElements.$parent = element.businessObject;
-        modeling.updateModdleProperties(element, element.businessObject, { extensionElements });
+        util.modeling.updateModdleProperties(element, element.businessObject, { extensionElements });
     }
     let properties = null;
     const extensionElementValues = extensionElements.get('values');
@@ -1377,73 +1487,125 @@ function addExtensionProperty(element, key, value, bpmnFactory, modeling) {
         properties = existPropertiesElements[0];
     }
     if (!properties) {
-        properties = bpmnFactory.create('camunda:Properties', { values: [] });
+        properties = util.bpmnFactory.create('camunda:Properties', { values: [] });
         properties.$parent = extensionElements;
-        modeling.updateModdleProperties(element, extensionElements, { values: [...extensionElements.get('values'), properties] });
+        util.modeling.updateModdleProperties(element, extensionElements, { values: [...extensionElements.get('values'), properties] });
     }
     const propertyValues = properties.get('values');
     const existPropertyIndex = propertyValues.findIndex((value) => value.name === key);
     if (existPropertyIndex > -1) {
-        modeling.updateModdleProperties(element, propertyValues[existPropertyIndex], { name: key, value });
+        util.modeling.updateModdleProperties(element, propertyValues[existPropertyIndex], { name: key, value });
     }
     else {
-        const property = bpmnFactory.create('camunda:Property', { name: key, value });
+        const property = util.bpmnFactory.create('camunda:Property', { name: key, value });
         property.$parent = properties;
-        modeling.updateModdleProperties(element, properties, { values: [...properties.get('values'), property] });
+        util.modeling.updateModdleProperties(element, properties, { values: [...properties.get('values'), property] });
+    }
+}
+function getExtensionPropertyValue(element, key) {
+    let extensionElements = element.businessObject.get('extensionElements');
+    if (!extensionElements) {
+        return '';
+    }
+    let properties = null;
+    const extensionElementValues = extensionElements.get('values');
+    const existPropertiesElements = extensionElementValues.filter((value) => is(value, 'camunda:Properties'));
+    if (existPropertiesElements.length > 0) {
+        properties = existPropertiesElements[0];
+    }
+    if (!properties) {
+        return '';
+    }
+    const propertyValues = properties.get('values');
+    const existPropertyIndex = propertyValues.findIndex((value) => value.name === key);
+    if (existPropertyIndex > -1) {
+        return propertyValues[existPropertyIndex].value;
     }
 }
 
 // @ts-ignore
-class DescriptionProps {
+class TaskDescriptionProps {
     constructor(props) {
         this.id = 'Coast_taskDescription';
-        const { element, translate, bpmnFactory, modeling, debounce } = props;
+        const { element } = props;
         this.component = () => {
-            return TextFieldEntry({
+            return TextAreaEntry({
+                element: element,
                 id: this.id,
+                label: util.translate('Task description'),
+                getValue: () => {
+                    return getExtensionPropertyValue(element, this.id);
+                },
+                setValue: (value) => {
+                    addExtensionProperty(element, this.id, value);
+                },
+                debounce: util.debounce,
+                autoResize: true
+            });
+        };
+        this.isEdited = isTextAreaEntryEdited;
+    }
+}
+
+// @ts-ignore
+class UserAssignmentStaticOrDynamicProps {
+    constructor(props) {
+        this.id = 'Coast_userAssignment_staticOrDynamic';
+        const { element } = props;
+        this.component = () => {
+            return SelectEntry({
                 element: element,
-                label: translate('Task Description'),
+                id: this.id,
+                label: util.translate('Set assignment rule'),
                 getValue: () => {
-                    return element.businessObject.get('taskDescription') || '';
+                    return getExtensionPropertyValue(element, this.id);
                 },
                 setValue: (value) => {
-                    modeling.updateModdleProperties(element, element.businessObject, {
-                        'taskDescription': value
-                    });
-                    addExtensionProperty(element, 'taskDescription', value, bpmnFactory, modeling);
+                    addExtensionProperty(element, this.id, value);
                 },
-                debounce
+                getOptions: () => {
+                    return [
+                        { value: '', label: util.translate('dynamic user') },
+                        { value: 'static_user', label: util.translate('static user') },
+                        { value: 'dynamic_role', label: util.translate('dynamic role') },
+                        { value: 'static_role', label: util.translate('static role') }
+                    ];
+                }
             });
         };
-        this.isEdited = isTextFieldEntryEdited;
+        this.isEdited = isSelectEntryEdited;
     }
 }
 
+function getUserAssignmentProps(element) {
+    return [new UserAssignmentStaticOrDynamicProps(element)];
+}
+
 class CustomPropertiesProvider {
     constructor(propertiesPanel, translate, bpmnFactory, modeling, debounceInput) {
         this.translate = translate;
-        this.bpmnFactory = bpmnFactory;
-        this.modeling = modeling;
-        this.debounceInput = debounceInput;
+        util.translate = translate;
+        util.bpmnFactory = bpmnFactory;
+        util.modeling = modeling;
+        util.debounce = debounceInput;
         propertiesPanel.registerProvider(0, this);
     }
     getGroups(element) {
         return ((groups) => {
-            if (is(element, 'bpmn:UserTask')) {
-                console.log(groups);
-                return [groups.find((group) => group.id === 'general'), {
-                        id: 'Coast_Implementation',
-                        label: this.translate('More config'),
-                        entries: [new DescriptionProps({
-                                element,
-                                translate: this.translate,
-                                bpmnFactory: this.bpmnFactory,
-                                modeling: this.modeling,
-                                debounce: this.debounceInput
-                            })]
-                    }];
-            }
-            return groups;
+            const generalGroup = groups.find((group) => group.id === 'general');
+            generalGroup.shouldOpen = true;
+            console.log(generalGroup);
+            if (is(element, 'bpmn:Process')) {
+                generalGroup.entries.splice(1, 3);
+            }
+            else if (is(element, 'bpmn:UserTask')) {
+                generalGroup.entries.splice(1, 1);
+                generalGroup.entries.push(...[
+                    new TaskDescriptionProps({ element }),
+                    ...getUserAssignmentProps({ element })
+                ]);
+            }
+            return [generalGroup];
         });
     }
 }
@@ -1453,38 +1615,6 @@ var customPropertiesPanelModule = {
     customPropertiesProvider: ['type', CustomPropertiesProvider]
 };
 
-var name = "Coast Custom";
-var prefix = "coast";
-var uri = "https://c-standard.cn";
-var xml = {
-	tagAlias: "lowerCase"
-};
-var associations = [
-];
-var types = [
-	{
-		name: "CoastUserTask",
-		"extends": [
-			"bpmn:UserTask"
-		],
-		properties: [
-			{
-				name: "taskDescription",
-				isAttr: true,
-				type: "String"
-			}
-		]
-	}
-];
-var coastModdleDescriptor = {
-	name: name,
-	prefix: prefix,
-	uri: uri,
-	xml: xml,
-	associations: associations,
-	types: types
-};
-
 class CodeEditorComponent {
     set code(code) {
         this._code = code || '';
@@ -1560,6 +1690,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
 class CamundaBpmnEditorComponent {
     constructor() {
         this.isShowXml = false;
+        this.initialDiagram = '<?xml version="1.0" encoding="UTF-8"?>' +
+            '<bpmn:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
+            'xmlns:bpmn="http://www.omg.org/spec/BPMN/20100524/MODEL" ' +
+            'xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" ' +
+            'xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" ' +
+            'targetNamespace="http://bpmn.io/schema/bpmn" ' +
+            'id="Definitions_1">' +
+            '<bpmn:process id="Process_1" isExecutable="true">' +
+            '<bpmn:startEvent id="StartEvent_1"/>' +
+            '</bpmn:process>' +
+            '<bpmndi:BPMNDiagram id="BPMNDiagram_1">' +
+            '<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">' +
+            '<bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">' +
+            '<dc:Bounds height="36.0" width="36.0" x="173.0" y="102.0"/>' +
+            '</bpmndi:BPMNShape>' +
+            '</bpmndi:BPMNPlane>' +
+            '</bpmndi:BPMNDiagram>' +
+            '</bpmn:definitions>';
     }
     ngAfterViewInit() {
         this.modeler = new BpmnModeler({
@@ -1573,19 +1721,17 @@ class CamundaBpmnEditorComponent {
             additionalModules: [
                 customTranslateModule,
                 customUserTaskModule,
+                customServiceTaskModule,
                 customHideOtherModule,
                 customPropertiesPanelModule
-            ],
-            moddleExtensions: {
-                coast: coastModdleDescriptor
-            }
+            ]
         });
         const logo = this.modeler._container.querySelector('.bjs-powered-by');
         if (logo) {
             this.modeler._container.removeChild(logo);
         }
         this.canvas = this.modeler.get('canvas');
-        this.modeler.createDiagram().then(() => {
+        this.modeler.importXML(this.initialDiagram).then(() => {
             this.canvas.zoom('fit-viewport');
         });
     }
@@ -2448,6 +2594,7 @@ class DataGridComponent {
     constructor(factory, service) {
         this.factory = factory;
         this.service = service;
+        this.tenant = 'T';
         this.enableMasterDetail = false;
         this.selectionMode = 'none';
         this.onDxDataGridCellPrepared = new EventEmitter();
@@ -2781,6 +2928,7 @@ class FormComponent {
     constructor(viewContainerRef, service) {
         this.viewContainerRef = viewContainerRef;
         this.service = service;
+        this.tenant = 'T';
         this.onlyFrontEnd = false; // 仅前端，不通过oid获取实例model
         this.readonly = false;
         this.submitCallback = new EventEmitter();
@@ -2833,6 +2981,11 @@ class FormComponent {
     submitForm() {
         this.validate().then(isValid => {
             if (isValid) {
+                if (this.extraAttrMap) {
+                    for (const entry of this.extraAttrMap) {
+                        this.model[entry.name] = entry.value;
+                    }
+                }
                 this.service.createOrUpdate(this.tenant, this.className, {
                     oid: this.oid,
                     ...this.model
@@ -2853,7 +3006,7 @@ class FormComponent {
     }
 }
 FormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, deps: [{ token: i0.ViewContainerRef }, { token: FormService }], target: i0.ɵɵFactoryTarget.Component });
-FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", oid: "oid", copyOid: "copyOid", template: "template", params: "params", tabViewContainerRef: "tabViewContainerRef", onlyFrontEnd: "onlyFrontEnd", model: "model", readonly: "readonly" }, outputs: { submitCallback: "submitCallback" }, providers: [FormService], viewQueries: [{ propertyName: "validator", first: true, predicate: DxValidationGroupComponent, descendants: true }, { propertyName: "formSubmitter", first: true, predicate: ["formSubmitter"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\r\n               [visible]=\"loading\">\r\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\r\n</dx-load-panel>\r\n<dx-validation-group *ngIf=\"!loading\">\r\n  <rs-box-container [config]=\"config\"\r\n                    [model]=\"model\"\r\n                    [params]=\"params\"\r\n                    [tabViewContainerRef]=\"tabViewContainerRef\"\r\n                    [readonly]=\"readonly\"></rs-box-container>\r\n  <dx-button #formSubmitter [visible]=\"false\" (onClick)=\"submitForm()\"></dx-button>\r\n</dx-validation-group>\r\n", styles: [":host{padding:12px 24px 20px}:host dx-validation-group{display:flex;flex-flow:row nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BoxContainerComponent, selector: "rs-box-container", inputs: ["config", "model", "params", "readonly", "tabViewContainerRef"] }, { kind: "component", type: i6$1.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i6.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i7.DxValidationGroupComponent, selector: "dx-validation-group", inputs: ["elementAttr", "height", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "elementAttrChange", "heightChange", "widthChange"] }] });
+FormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: FormComponent, selector: "rs-form", inputs: { tenant: "tenant", className: "className", oid: "oid", copyOid: "copyOid", template: "template", extraAttrMap: "extraAttrMap", params: "params", tabViewContainerRef: "tabViewContainerRef", onlyFrontEnd: "onlyFrontEnd", model: "model", readonly: "readonly" }, outputs: { submitCallback: "submitCallback" }, providers: [FormService], viewQueries: [{ propertyName: "validator", first: true, predicate: DxValidationGroupComponent, descendants: true }, { propertyName: "formSubmitter", first: true, predicate: ["formSubmitter"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\r\n               [visible]=\"loading\">\r\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\r\n</dx-load-panel>\r\n<dx-validation-group *ngIf=\"!loading\">\r\n  <rs-box-container [config]=\"config\"\r\n                    [model]=\"model\"\r\n                    [params]=\"params\"\r\n                    [tabViewContainerRef]=\"tabViewContainerRef\"\r\n                    [readonly]=\"readonly\"></rs-box-container>\r\n  <dx-button #formSubmitter [visible]=\"false\" (onClick)=\"submitForm()\"></dx-button>\r\n</dx-validation-group>\r\n", styles: [":host{padding:12px 24px 20px}:host dx-validation-group{display:flex;flex-flow:row nowrap}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BoxContainerComponent, selector: "rs-box-container", inputs: ["config", "model", "params", "readonly", "tabViewContainerRef"] }, { kind: "component", type: i6$1.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i6.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: i7.DxValidationGroupComponent, selector: "dx-validation-group", inputs: ["elementAttr", "height", "width"], outputs: ["onDisposing", "onInitialized", "onOptionChanged", "elementAttrChange", "heightChange", "widthChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: FormComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rs-form', providers: [FormService], template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\r\n               [visible]=\"loading\">\r\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\r\n</dx-load-panel>\r\n<dx-validation-group *ngIf=\"!loading\">\r\n  <rs-box-container [config]=\"config\"\r\n                    [model]=\"model\"\r\n                    [params]=\"params\"\r\n                    [tabViewContainerRef]=\"tabViewContainerRef\"\r\n                    [readonly]=\"readonly\"></rs-box-container>\r\n  <dx-button #formSubmitter [visible]=\"false\" (onClick)=\"submitForm()\"></dx-button>\r\n</dx-validation-group>\r\n", styles: [":host{padding:12px 24px 20px}:host dx-validation-group{display:flex;flex-flow:row nowrap}\n"] }]
@@ -2867,6 +3020,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
                 type: Input
             }], template: [{
                 type: Input
+            }], extraAttrMap: [{
+                type: Input
             }], params: [{
                 type: Input
             }], tabViewContainerRef: [{
@@ -2903,19 +3058,11 @@ class DataDetailComponent {
     }
 }
 DataDetailComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DataDetailComponent, deps: [{ token: i0.ViewContainerRef }, { token: DataDetailService }], target: i0.ɵɵFactoryTarget.Component });
-DataDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DataDetailComponent, selector: "coast-data-detail", inputs: { tenant: "tenant", className: "className", oid: "oid", params: "params" }, providers: [DataDetailService], ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\n               [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<div *ngIf=\"!loading && sections.length === 0\" class=\"empty\">\n  <span>\u60A8\u65E0\u6743\u67E5\u770B\u8BE5\u6570\u636E\u5B9E\u4F8B\u4EFB\u4F55\u4FE1\u606F</span>\n</div>\n<ng-container *ngIf=\"sections.length > 0\">\n  <dx-accordion [collapsible]=\"true\" [multiple]=\"true\" [deferRendering]=\"false\" [dataSource]=\"sections\"\n                [selectedItems]=\"sections\">\n    <div *dxTemplate=\"let section of 'title'\" class=\"section-title\">\n      <div class=\"section-title-name\">{{section.name}}</div>\n    </div>\n    <div *dxTemplate=\"let section of 'item'\">\n      <rs-form [tenant]=\"tenant\" [className]=\"className\" [oid]=\"oid\" [template]=\"section.formTemplate\"\n               [readonly]=\"true\"></rs-form>\n    </div>\n  </dx-accordion>\n</ng-container>\n", styles: [":host{flex:1;padding:24px;display:flex;flex-flow:column nowrap}:host div.empty{flex:1;padding:16px;display:flex;flex-flow:row nowrap;justify-content:center;align-items:center}:host div.empty span{text-align:center;-webkit-user-select:none;user-select:none}:host .section-title{border-bottom:1px solid var(--coast-border-color, #dddddd)}:host .section-title .section-title-name{height:24px;font-size:14px;font-weight:700;padding:4px 8px;display:flex;flex-flow:column nowrap;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.DxAccordionComponent, selector: "dx-accordion", inputs: ["accessKey", "activeStateEnabled", "animationDuration", "collapsible", "dataSource", "deferRendering", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "itemHoldTimeout", "items", "itemTemplate", "itemTitleTemplate", "keyExpr", "multiple", "noDataText", "repaintChangesOnly", "rtlEnabled", "selectedIndex", "selectedItem", "selectedItemKeys", "selectedItems", "tabIndex", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onItemClick", "onItemContextMenu", "onItemHold", "onItemRendered", "onItemTitleClick", "onOptionChanged", "onSelectionChanged", "accessKeyChange", "activeStateEnabledChange", "animationDurationChange", "collapsibleChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "itemHoldTimeoutChange", "itemsChange", "itemTemplateChange", "itemTitleTemplateChange", "keyExprChange", "multipleChange", "noDataTextChange", "repaintChangesOnlyChange", "rtlEnabledChange", "selectedIndexChange", "selectedItemChange", "selectedItemKeysChange", "selectedItemsChange", "tabIndexChange", "visibleChange", "widthChange"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6$1.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i6.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: FormComponent, selector: "rs-form", inputs: ["tenant", "className", "oid", "copyOid", "template", "params", "tabViewContainerRef", "onlyFrontEnd", "model", "readonly"], outputs: ["submitCallback"] }] });
+DataDetailComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DataDetailComponent, selector: "coast-data-detail", providers: [DataDetailService], ngImport: i0, template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\n               [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<div *ngIf=\"!loading && sections.length === 0\" class=\"empty\">\n  <span>\u60A8\u65E0\u6743\u67E5\u770B\u8BE5\u6570\u636E\u5B9E\u4F8B\u4EFB\u4F55\u4FE1\u606F</span>\n</div>\n<ng-container *ngIf=\"sections.length > 0\">\n  <dx-accordion [collapsible]=\"true\" [multiple]=\"true\" [deferRendering]=\"false\" [dataSource]=\"sections\"\n                [selectedItems]=\"sections\">\n    <div *dxTemplate=\"let section of 'title'\" class=\"section-title\">\n      <div class=\"section-title-name\">{{ section.name }}</div>\n    </div>\n    <div *dxTemplate=\"let section of 'item'\">\n      <rs-form [tenant]=\"tenant\" [className]=\"className\" [oid]=\"oid\" [template]=\"section.formTemplate\" [params]=\"params\"\n               [tabViewContainerRef]=\"tabViewContainerRef\" [readonly]=\"true\"></rs-form>\n    </div>\n  </dx-accordion>\n</ng-container>\n", styles: [":host{flex:1;padding:24px;display:flex;flex-flow:column nowrap}:host div.empty{flex:1;padding:16px;display:flex;flex-flow:row nowrap;justify-content:center;align-items:center}:host div.empty span{text-align:center;-webkit-user-select:none;user-select:none}:host .section-title{border-bottom:1px solid var(--coast-border-color, #dddddd)}:host .section-title .section-title-name{height:24px;font-size:14px;font-weight:700;padding:4px 8px;display:flex;flex-flow:column nowrap;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.DxAccordionComponent, selector: "dx-accordion", inputs: ["accessKey", "activeStateEnabled", "animationDuration", "collapsible", "dataSource", "deferRendering", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "itemHoldTimeout", "items", "itemTemplate", "itemTitleTemplate", "keyExpr", "multiple", "noDataText", "repaintChangesOnly", "rtlEnabled", "selectedIndex", "selectedItem", "selectedItemKeys", "selectedItems", "tabIndex", "visible", "width"], outputs: ["onContentReady", "onDisposing", "onInitialized", "onItemClick", "onItemContextMenu", "onItemHold", "onItemRendered", "onItemTitleClick", "onOptionChanged", "onSelectionChanged", "accessKeyChange", "activeStateEnabledChange", "animationDurationChange", "collapsibleChange", "dataSourceChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "itemHoldTimeoutChange", "itemsChange", "itemTemplateChange", "itemTitleTemplateChange", "keyExprChange", "multipleChange", "noDataTextChange", "repaintChangesOnlyChange", "rtlEnabledChange", "selectedIndexChange", "selectedItemChange", "selectedItemKeysChange", "selectedItemsChange", "tabIndexChange", "visibleChange", "widthChange"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i6$1.DxoPositionComponent, selector: "dxo-position", inputs: ["at", "boundary", "boundaryOffset", "collision", "my", "of", "offset"] }, { kind: "component", type: i6.DxLoadPanelComponent, selector: "dx-load-panel", inputs: ["animation", "closeOnOutsideClick", "container", "copyRootClassesToWrapper", "deferRendering", "delay", "elementAttr", "focusStateEnabled", "height", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "indicatorSrc", "maxHeight", "maxWidth", "message", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showIndicator", "showPane", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "delayChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "indicatorSrcChange", "maxHeightChange", "maxWidthChange", "messageChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showIndicatorChange", "showPaneChange", "visibleChange", "widthChange", "wrapperAttrChange"] }, { kind: "component", type: FormComponent, selector: "rs-form", inputs: ["tenant", "className", "oid", "copyOid", "template", "extraAttrMap", "params", "tabViewContainerRef", "onlyFrontEnd", "model", "readonly"], outputs: ["submitCallback"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DataDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'coast-data-detail', providers: [DataDetailService], template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\n               [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<div *ngIf=\"!loading && sections.length === 0\" class=\"empty\">\n  <span>\u60A8\u65E0\u6743\u67E5\u770B\u8BE5\u6570\u636E\u5B9E\u4F8B\u4EFB\u4F55\u4FE1\u606F</span>\n</div>\n<ng-container *ngIf=\"sections.length > 0\">\n  <dx-accordion [collapsible]=\"true\" [multiple]=\"true\" [deferRendering]=\"false\" [dataSource]=\"sections\"\n                [selectedItems]=\"sections\">\n    <div *dxTemplate=\"let section of 'title'\" class=\"section-title\">\n      <div class=\"section-title-name\">{{section.name}}</div>\n    </div>\n    <div *dxTemplate=\"let section of 'item'\">\n      <rs-form [tenant]=\"tenant\" [className]=\"className\" [oid]=\"oid\" [template]=\"section.formTemplate\"\n               [readonly]=\"true\"></rs-form>\n    </div>\n  </dx-accordion>\n</ng-container>\n", styles: [":host{flex:1;padding:24px;display:flex;flex-flow:column nowrap}:host div.empty{flex:1;padding:16px;display:flex;flex-flow:row nowrap;justify-content:center;align-items:center}:host div.empty span{text-align:center;-webkit-user-select:none;user-select:none}:host .section-title{border-bottom:1px solid var(--coast-border-color, #dddddd)}:host .section-title .section-title-name{height:24px;font-size:14px;font-weight:700;padding:4px 8px;display:flex;flex-flow:column nowrap;justify-content:center}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: DataDetailService }]; }, propDecorators: { tenant: [{
-                type: Input
-            }], className: [{
-                type: Input
-            }], oid: [{
-                type: Input
-            }], params: [{
-                type: Input
-            }] } });
+            args: [{ selector: 'coast-data-detail', providers: [DataDetailService], template: "<dx-load-panel [container]=\"viewContainerRef.element.nativeElement\" [showPane]=\"false\"\n               [visible]=\"loading\">\n  <dxo-position [of]=\"viewContainerRef.element.nativeElement\"></dxo-position>\n</dx-load-panel>\n<div *ngIf=\"!loading && sections.length === 0\" class=\"empty\">\n  <span>\u60A8\u65E0\u6743\u67E5\u770B\u8BE5\u6570\u636E\u5B9E\u4F8B\u4EFB\u4F55\u4FE1\u606F</span>\n</div>\n<ng-container *ngIf=\"sections.length > 0\">\n  <dx-accordion [collapsible]=\"true\" [multiple]=\"true\" [deferRendering]=\"false\" [dataSource]=\"sections\"\n                [selectedItems]=\"sections\">\n    <div *dxTemplate=\"let section of 'title'\" class=\"section-title\">\n      <div class=\"section-title-name\">{{ section.name }}</div>\n    </div>\n    <div *dxTemplate=\"let section of 'item'\">\n      <rs-form [tenant]=\"tenant\" [className]=\"className\" [oid]=\"oid\" [template]=\"section.formTemplate\" [params]=\"params\"\n               [tabViewContainerRef]=\"tabViewContainerRef\" [readonly]=\"true\"></rs-form>\n    </div>\n  </dx-accordion>\n</ng-container>\n", styles: [":host{flex:1;padding:24px;display:flex;flex-flow:column nowrap}:host div.empty{flex:1;padding:16px;display:flex;flex-flow:row nowrap;justify-content:center;align-items:center}:host div.empty span{text-align:center;-webkit-user-select:none;user-select:none}:host .section-title{border-bottom:1px solid var(--coast-border-color, #dddddd)}:host .section-title .section-title-name{height:24px;font-size:14px;font-weight:700;padding:4px 8px;display:flex;flex-flow:column nowrap;justify-content:center}\n"] }]
+        }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }, { type: DataDetailService }]; } });
 
 class FormModule {
 }
@@ -3061,8 +3208,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
                 }]
         }], ctorParameters: function () { return []; } });
 
+class TooltipContentTemplateDirective {
+    constructor(templateRef) {
+        this.templateRef = templateRef;
+    }
+}
+TooltipContentTemplateDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: TooltipContentTemplateDirective, deps: [{ token: i0.TemplateRef }], target: i0.ɵɵFactoryTarget.Directive });
+TooltipContentTemplateDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.7", type: TooltipContentTemplateDirective, selector: "[rsTooltipContentTemplate]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: TooltipContentTemplateDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[rsTooltipContentTemplate]'
+                }]
+        }], ctorParameters: function () { return [{ type: i0.TemplateRef }]; } });
+
 class DynamicParamsComponent {
     constructor() {
+        this.label = '动态参数';
+        this.showHelp = false;
+        this.keyPlaceholder = '参数名';
+        this.valuePlaceholder = '参数值';
+        this.required = false;
         this.readonly = false;
     }
     add() {
@@ -3073,37 +3239,52 @@ class DynamicParamsComponent {
     }
 }
 DynamicParamsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-DynamicParamsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DynamicParamsComponent, selector: "rs-dynamic-params", inputs: { label: "label", params: "params", readonly: "readonly" }, ngImport: i0, template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>{{label || '\u52A8\u6001\u53C2\u6570'}}</span>\n    <dx-button type=\"default\" stylingMode=\"text\" icon=\"coast-icon coast-icon-add\" (onClick)=\"add()\"\n               [disabled]=\"readonly\"></dx-button>\n  </div>\n  <div class=\"dx-field-value\">\n    <div *ngFor=\"let param of params; let index = index\">\n      <dx-text-box placeholder=\"\u53C2\u6570\u540D\" [(value)]=\"param.name\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-text-box placeholder=\"\u53C2\u6570\u503C\" [(value)]=\"param.value\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-button type=\"danger\" stylingMode=\"text\" icon=\"coast-icon coast-icon-close\"\n                 (onClick)=\"delete(index)\" [disabled]=\"readonly\"></dx-button>\n    </div>\n  </div>\n</div>\n", styles: [":host .dx-field .dx-field-label{display:flex;align-items:center}:host .dx-field .dx-field-value div{display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-value div dx-text-box{flex:1}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i3$2.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }] });
+DynamicParamsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: DynamicParamsComponent, selector: "rs-dynamic-params", inputs: { label: "label", showHelp: "showHelp", keyPlaceholder: "keyPlaceholder", valuePlaceholder: "valuePlaceholder", params: "params", required: "required", readonly: "readonly" }, queries: [{ propertyName: "tooltipContentTemplate", first: true, predicate: TooltipContentTemplateDirective, descendants: true }], ngImport: i0, template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>{{ label }}</span>\n    <span *ngIf=\"required\" class=\"required-mark\">&nbsp;*</span>\n    <i *ngIf=\"showHelp\" #dynamicParamsSpan class=\"coast-icon-help cursor-pointer\">\n      <dx-tooltip [target]=\"dynamicParamsSpan\"\n                  [position]=\"'top'\"\n                  [showEvent]=\"'mouseover'\"\n                  [hideEvent]=\"'mouseout'\">\n        <div *dxTemplate=\"let data of 'content'\"\n             style=\"display: flex; flex-flow: column nowrap;align-items: flex-start;\">\n          <ng-container [ngTemplateOutlet]=\"tooltipContentTemplate.templateRef\"></ng-container>\n        </div>\n      </dx-tooltip>\n    </i>\n    <dx-button type=\"default\" stylingMode=\"text\" icon=\"coast-icon coast-icon-add\" (onClick)=\"add()\"\n               [disabled]=\"readonly\"></dx-button>\n  </div>\n  <div class=\"dx-field-value\">\n    <div *ngFor=\"let param of params; let index = index\">\n      <dx-text-box [placeholder]=\"keyPlaceholder\" [(value)]=\"param.name\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-text-box [placeholder]=\"valuePlaceholder\" [(value)]=\"param.value\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-button type=\"danger\" stylingMode=\"text\" icon=\"coast-icon coast-icon-close\"\n                 (onClick)=\"delete(index)\" [disabled]=\"readonly\"></dx-button>\n    </div>\n  </div>\n</div>\n", styles: [":host .dx-field .dx-field-label{display:flex;align-items:center}:host .dx-field .dx-field-value div{display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-value div dx-text-box{flex:1}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i4$1.DxTextBoxComponent, selector: "dx-text-box", inputs: ["accessKey", "activeStateEnabled", "buttons", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "inputAttr", "isValid", "label", "labelMode", "mask", "maskChar", "maskInvalidMessage", "maskRules", "maxLength", "mode", "name", "placeholder", "readOnly", "rtlEnabled", "showClearButton", "showMaskMode", "spellcheck", "stylingMode", "tabIndex", "text", "useMaskedValue", "validationError", "validationErrors", "validationMessageMode", "validationMessagePosition", "validationStatus", "value", "valueChangeEvent", "visible", "width"], outputs: ["onChange", "onContentReady", "onCopy", "onCut", "onDisposing", "onEnterKey", "onFocusIn", "onFocusOut", "onInitialized", "onInput", "onKeyDown", "onKeyUp", "onOptionChanged", "onPaste", "onValueChanged", "accessKeyChange", "activeStateEnabledChange", "buttonsChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "inputAttrChange", "isValidChange", "labelChange", "labelModeChange", "maskChange", "maskCharChange", "maskInvalidMessageChange", "maskRulesChange", "maxLengthChange", "modeChange", "nameChange", "placeholderChange", "readOnlyChange", "rtlEnabledChange", "showClearButtonChange", "showMaskModeChange", "spellcheckChange", "stylingModeChange", "tabIndexChange", "textChange", "useMaskedValueChange", "validationErrorChange", "validationErrorsChange", "validationMessageModeChange", "validationMessagePositionChange", "validationStatusChange", "valueChange", "valueChangeEventChange", "visibleChange", "widthChange", "onBlur"] }, { kind: "component", type: i5.DxTooltipComponent, selector: "dx-tooltip", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showEvent", "target", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showEventChange", "targetChange", "visibleChange", "widthChange", "wrapperAttrChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'rs-dynamic-params', template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>{{label || '\u52A8\u6001\u53C2\u6570'}}</span>\n    <dx-button type=\"default\" stylingMode=\"text\" icon=\"coast-icon coast-icon-add\" (onClick)=\"add()\"\n               [disabled]=\"readonly\"></dx-button>\n  </div>\n  <div class=\"dx-field-value\">\n    <div *ngFor=\"let param of params; let index = index\">\n      <dx-text-box placeholder=\"\u53C2\u6570\u540D\" [(value)]=\"param.name\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-text-box placeholder=\"\u53C2\u6570\u503C\" [(value)]=\"param.value\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-button type=\"danger\" stylingMode=\"text\" icon=\"coast-icon coast-icon-close\"\n                 (onClick)=\"delete(index)\" [disabled]=\"readonly\"></dx-button>\n    </div>\n  </div>\n</div>\n", styles: [":host .dx-field .dx-field-label{display:flex;align-items:center}:host .dx-field .dx-field-value div{display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-value div dx-text-box{flex:1}\n"] }]
+            args: [{ selector: 'rs-dynamic-params', template: "<div class=\"dx-field\">\n  <div class=\"dx-field-label\">\n    <span>{{ label }}</span>\n    <span *ngIf=\"required\" class=\"required-mark\">&nbsp;*</span>\n    <i *ngIf=\"showHelp\" #dynamicParamsSpan class=\"coast-icon-help cursor-pointer\">\n      <dx-tooltip [target]=\"dynamicParamsSpan\"\n                  [position]=\"'top'\"\n                  [showEvent]=\"'mouseover'\"\n                  [hideEvent]=\"'mouseout'\">\n        <div *dxTemplate=\"let data of 'content'\"\n             style=\"display: flex; flex-flow: column nowrap;align-items: flex-start;\">\n          <ng-container [ngTemplateOutlet]=\"tooltipContentTemplate.templateRef\"></ng-container>\n        </div>\n      </dx-tooltip>\n    </i>\n    <dx-button type=\"default\" stylingMode=\"text\" icon=\"coast-icon coast-icon-add\" (onClick)=\"add()\"\n               [disabled]=\"readonly\"></dx-button>\n  </div>\n  <div class=\"dx-field-value\">\n    <div *ngFor=\"let param of params; let index = index\">\n      <dx-text-box [placeholder]=\"keyPlaceholder\" [(value)]=\"param.name\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-text-box [placeholder]=\"valuePlaceholder\" [(value)]=\"param.value\" [disabled]=\"readonly\"></dx-text-box>\n      <dx-button type=\"danger\" stylingMode=\"text\" icon=\"coast-icon coast-icon-close\"\n                 (onClick)=\"delete(index)\" [disabled]=\"readonly\"></dx-button>\n    </div>\n  </div>\n</div>\n", styles: [":host .dx-field .dx-field-label{display:flex;align-items:center}:host .dx-field .dx-field-value div{display:flex;flex-flow:row nowrap}:host .dx-field .dx-field-value div dx-text-box{flex:1}\n"] }]
         }], propDecorators: { label: [{
                 type: Input
+            }], showHelp: [{
+                type: Input
+            }], keyPlaceholder: [{
+                type: Input
+            }], valuePlaceholder: [{
+                type: Input
             }], params: [{
                 type: Input
+            }], required: [{
+                type: Input
             }], readonly: [{
                 type: Input
+            }], tooltipContentTemplate: [{
+                type: ContentChild,
+                args: [TooltipContentTemplateDirective]
             }] } });
 
 class DynamicParamsModule {
 }
 DynamicParamsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-DynamicParamsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsModule, declarations: [DynamicParamsComponent], imports: [CommonModule,
-        DevExtremeModule], exports: [DynamicParamsComponent] });
+DynamicParamsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsModule, declarations: [DynamicParamsComponent,
+        TooltipContentTemplateDirective], imports: [CommonModule,
+        DevExtremeModule], exports: [DynamicParamsComponent,
+        TooltipContentTemplateDirective] });
 DynamicParamsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsModule, imports: [CommonModule,
         DevExtremeModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: DynamicParamsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
-                        DynamicParamsComponent
+                        DynamicParamsComponent,
+                        TooltipContentTemplateDirective
                     ],
                     imports: [
                         CommonModule,
                         DevExtremeModule
                     ],
                     exports: [
-                        DynamicParamsComponent
+                        DynamicParamsComponent,
+                        TooltipContentTemplateDirective
                     ]
                 }]
         }] });
@@ -3133,7 +3314,7 @@ class IconSelectorComponent {
     }
 }
 IconSelectorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: IconSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-IconSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: IconSelectorComponent, selector: "rs-icon-selector", inputs: { target: "target" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["iconSelector"], descendants: true, static: true }, { propertyName: "iconZoomOut", first: true, predicate: ["iconZoomOut"], descendants: true, static: true }], ngImport: i0, template: "<dx-popover #iconSelector\n            maxWidth=\"280\"\n            maxHeight=\"280\"\n            [target]=\"target\"\n            [showEvent]=\"{name: 'click'}\">\n  <div *dxTemplate=\"let data of 'content'\">\n    <ng-container *ngFor=\"let icon of iconList; let index=index\">\n      <dx-button [icon]=\"'coast-icon ' + icon\" (onClick)=\"selectIcon(icon)\"\n                 (mouseenter)=\"zoomOut($event, icon)\" (mouseleave)=\"iconZoomOut.instance.hide()\"></dx-button>\n    </ng-container>\n  </div>\n</dx-popover>\n<dx-popover #iconZoomOut height=\"72px\" [enableBodyScroll]=\"false\">\n  <div *dxTemplate=\"let data of 'content'\"\n       style=\"display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;\">\n    <i [class]=\"hoverIcon\" style=\"font-size: 36px;\"></i>\n    <span>{{hoverIcon?.substring(11)}}</span>\n  </div>\n</dx-popover>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i4$1.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "enableBodyScroll", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showEvent", "showTitle", "target", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "onTitleRendered", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "enableBodyScrollChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }] });
+IconSelectorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: IconSelectorComponent, selector: "rs-icon-selector", inputs: { target: "target" }, outputs: { select: "select" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["iconSelector"], descendants: true, static: true }, { propertyName: "iconZoomOut", first: true, predicate: ["iconZoomOut"], descendants: true, static: true }], ngImport: i0, template: "<dx-popover #iconSelector\n            maxWidth=\"280\"\n            maxHeight=\"280\"\n            [target]=\"target\"\n            [showEvent]=\"{name: 'click'}\">\n  <div *dxTemplate=\"let data of 'content'\">\n    <ng-container *ngFor=\"let icon of iconList; let index=index\">\n      <dx-button [icon]=\"'coast-icon ' + icon\" (onClick)=\"selectIcon(icon)\"\n                 (mouseenter)=\"zoomOut($event, icon)\" (mouseleave)=\"iconZoomOut.instance.hide()\"></dx-button>\n    </ng-container>\n  </div>\n</dx-popover>\n<dx-popover #iconZoomOut height=\"72px\" [enableBodyScroll]=\"false\">\n  <div *dxTemplate=\"let data of 'content'\"\n       style=\"display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;\">\n    <i [class]=\"hoverIcon\" style=\"font-size: 36px;\"></i>\n    <span>{{hoverIcon?.substring(11)}}</span>\n  </div>\n</dx-popover>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.DxTemplateDirective, selector: "[dxTemplate]", inputs: ["dxTemplateOf"] }, { kind: "component", type: i4.DxButtonComponent, selector: "dx-button", inputs: ["accessKey", "activeStateEnabled", "disabled", "elementAttr", "focusStateEnabled", "height", "hint", "hoverStateEnabled", "icon", "rtlEnabled", "stylingMode", "tabIndex", "template", "text", "type", "useSubmitBehavior", "validationGroup", "visible", "width"], outputs: ["onClick", "onContentReady", "onDisposing", "onInitialized", "onOptionChanged", "accessKeyChange", "activeStateEnabledChange", "disabledChange", "elementAttrChange", "focusStateEnabledChange", "heightChange", "hintChange", "hoverStateEnabledChange", "iconChange", "rtlEnabledChange", "stylingModeChange", "tabIndexChange", "templateChange", "textChange", "typeChange", "useSubmitBehaviorChange", "validationGroupChange", "visibleChange", "widthChange"] }, { kind: "component", type: i4$2.DxPopoverComponent, selector: "dx-popover", inputs: ["animation", "closeOnOutsideClick", "container", "contentTemplate", "copyRootClassesToWrapper", "deferRendering", "disabled", "elementAttr", "enableBodyScroll", "height", "hideEvent", "hideOnOutsideClick", "hideOnParentScroll", "hint", "hoverStateEnabled", "maxHeight", "maxWidth", "minHeight", "minWidth", "position", "rtlEnabled", "shading", "shadingColor", "showCloseButton", "showEvent", "showTitle", "target", "title", "titleTemplate", "toolbarItems", "visible", "width", "wrapperAttr"], outputs: ["onContentReady", "onDisposing", "onHidden", "onHiding", "onInitialized", "onOptionChanged", "onShowing", "onShown", "onTitleRendered", "animationChange", "closeOnOutsideClickChange", "containerChange", "contentTemplateChange", "copyRootClassesToWrapperChange", "deferRenderingChange", "disabledChange", "elementAttrChange", "enableBodyScrollChange", "heightChange", "hideEventChange", "hideOnOutsideClickChange", "hideOnParentScrollChange", "hintChange", "hoverStateEnabledChange", "maxHeightChange", "maxWidthChange", "minHeightChange", "minWidthChange", "positionChange", "rtlEnabledChange", "shadingChange", "shadingColorChange", "showCloseButtonChange", "showEventChange", "showTitleChange", "targetChange", "titleChange", "titleTemplateChange", "toolbarItemsChange", "visibleChange", "widthChange", "wrapperAttrChange"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: IconSelectorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'rs-icon-selector', template: "<dx-popover #iconSelector\n            maxWidth=\"280\"\n            maxHeight=\"280\"\n            [target]=\"target\"\n            [showEvent]=\"{name: 'click'}\">\n  <div *dxTemplate=\"let data of 'content'\">\n    <ng-container *ngFor=\"let icon of iconList; let index=index\">\n      <dx-button [icon]=\"'coast-icon ' + icon\" (onClick)=\"selectIcon(icon)\"\n                 (mouseenter)=\"zoomOut($event, icon)\" (mouseleave)=\"iconZoomOut.instance.hide()\"></dx-button>\n    </ng-container>\n  </div>\n</dx-popover>\n<dx-popover #iconZoomOut height=\"72px\" [enableBodyScroll]=\"false\">\n  <div *dxTemplate=\"let data of 'content'\"\n       style=\"display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;\">\n    <i [class]=\"hoverIcon\" style=\"font-size: 36px;\"></i>\n    <span>{{hoverIcon?.substring(11)}}</span>\n  </div>\n</dx-popover>\n" }]
@@ -3522,5 +3703,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { BoxContainerComponent, BoxContainerModule, CamundaBpmnEditorComponent, CamundaBpmnEditorModule, ChangeFilter, CodeEditorComponent, CodeEditorModule, DataDetailComponent, DataDetailModule, DataGridComponent, DataGridFactory, DataGridModule, DataGridService, DrawerComponent, DrawerModule, DrawerService, DynamicParamsComponent, DynamicParamsModule, FormComponent, FormModule, FormService, IconSelectorComponent, IconSelectorModule, InstanceLinkTemplateDirective, ItemConfigComponent, ItemStyleComponent, MasterDetailTemplateDirective, ModalComponent, ModalModule, ModalService, PluginManager, RowButtonsTemplateDirective, WebsocketModule, WebsocketService, notify_error, notify_success, notify_warning, validate, validate_group };
+export { BoxContainerComponent, BoxContainerModule, CamundaBpmnEditorComponent, CamundaBpmnEditorModule, ChangeFilter, CodeEditorComponent, CodeEditorModule, DataDetailComponent, DataDetailModule, DataGridComponent, DataGridFactory, DataGridModule, DataGridService, DrawerComponent, DrawerModule, DrawerService, DynamicParamsComponent, DynamicParamsModule, FormComponent, FormModule, FormService, IconSelectorComponent, IconSelectorModule, InstanceLinkTemplateDirective, ItemConfigComponent, ItemStyleComponent, MasterDetailTemplateDirective, ModalComponent, ModalModule, ModalService, PluginManager, RowButtonsTemplateDirective, TooltipContentTemplateDirective, WebsocketModule, WebsocketService, notify_error, notify_success, notify_warning, validate, validate_group };
 //# sourceMappingURL=ngx-rs-ant.mjs.map