@type-dom/ui 0.0.1 → 0.0.3

package/src/components/feedback/td-popper/content/content.interface.d.ts

@@ -0,0 +1,37 @@
+import { IUI, IUIConfig } from '../../../../ui/ui.interface';
+export interface ITdPopperContent extends IUI {
+    className: 'TdPopperContent';
+}
+export interface IPopperCoreConfigProps extends IUIConfig {
+    boundariesPadding?: number;
+    gpuAcceleration?: boolean;
+    /**
+     * @description offset of the Tooltip
+     */
+    offset?: number;
+    /**
+     * @description position of Tooltip
+     *     values: placements,
+     *     default: 'bottom',
+     */
+    placement?: string;
+    /**
+     * @description [popper.js](https://popper.js.org/docs/v2/) parameters
+     */
+    strategy?: string;
+}
+export interface ITdPopperContentConfig extends IPopperCoreConfigProps {
+    id?: string;
+    effect?: string;
+    visible?: boolean;
+    enterable?: boolean;
+    pure?: boolean;
+    focusOnShow?: boolean;
+    trapping?: boolean;
+    referenceEl?: HTMLElement;
+    triggerTargetEl?: HTMLElement;
+    stopPopperMouseEvent?: boolean;
+    ariaLabel?: string;
+    virtualTriggering?: boolean;
+    zIndex?: number;
+}

package/src/components/feedback/td-popper/content/content.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/feedback/td-popper/td-popper.class.d.ts

@@ -0,0 +1,6 @@
+import { UI } from '../../../ui/ui.abstract';
+import { ITdPopper, ITdPopperConfig } from './td-popper.interface';
+export declare class TdPopper extends UI implements ITdPopper {
+    className: 'TdPopper';
+    constructor(config?: ITdPopperConfig);
+}

package/src/components/feedback/td-popper/td-popper.class.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdPopper = void 0;
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+class TdPopper extends ui_abstract_1.UI {
+    constructor(config) {
+        super();
+        this.className = 'TdPopper';
+        this.setConfig(config);
+    }
+}
+exports.TdPopper = TdPopper;

package/src/components/feedback/td-popper/td-popper.interface.d.ts

@@ -0,0 +1,12 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+export interface ITdPopper extends IUI {
+    className: 'TdPopper';
+}
+export interface ITdPopperConfig extends IUIConfig {
+    /**
+     *
+     *     default: 'tooltip',
+     */
+    role?: 'dialog' | 'grid' | 'group' | 'listbox' | 'menu' | 'navigation' | 'tooltip' | 'tree';
+}
+export declare const roleTypes: readonly ["dialog", "grid", "group", "listbox", "menu", "navigation", "tooltip", "tree"];

package/src/components/feedback/td-popper/td-popper.interface.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.roleTypes = void 0;
+exports.roleTypes = [
+    'dialog',
+    'grid',
+    'group',
+    'listbox',
+    'menu',
+    'navigation',
+    'tooltip',
+    'tree',
+];

package/src/components/feedback/td-popper/trigger/trigger.class.d.ts

@@ -0,0 +1,6 @@
+import { UI } from '../../../../ui/ui.abstract';
+import { ITdPopperTrigger, ITdPopperTriggerConfig } from './trigger.interface';
+export declare class TdPopperTrigger extends UI implements ITdPopperTrigger {
+    className: 'TdPopperTrigger';
+    constructor(config?: ITdPopperTriggerConfig);
+}

package/src/components/feedback/td-popper/trigger/trigger.class.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdPopperTrigger = void 0;
+const ui_abstract_1 = require("../../../../ui/ui.abstract");
+class TdPopperTrigger extends ui_abstract_1.UI {
+    constructor(config) {
+        super();
+        this.className = 'TdPopperTrigger';
+    }
+}
+exports.TdPopperTrigger = TdPopperTrigger;

package/src/components/feedback/td-popper/trigger/trigger.interface.d.ts

@@ -0,0 +1,8 @@
+import { IUI, IUIConfig } from '../../../../ui/ui.interface';
+export interface ITdPopperTrigger extends IUI {
+    className: 'TdPopperTrigger';
+}
+export interface ITdPopperTriggerConfig extends IUIConfig {
+    id?: string;
+    open?: boolean;
+}

package/src/components/feedback/td-popper/trigger/trigger.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/feedback/td-tooltip/content/content.class.d.ts

@@ -0,0 +1,6 @@
+import { UI } from '../../../../ui/ui.abstract';
+import { ITdTooltipContentConfig } from './content.interface';
+export declare class TdTooltipContent extends UI {
+    className: 'TdTooltipContent';
+    constructor(config?: ITdTooltipContentConfig);
+}

package/src/components/feedback/td-tooltip/content/content.class.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdTooltipContent = void 0;
+const ui_abstract_1 = require("../../../../ui/ui.abstract");
+class TdTooltipContent extends ui_abstract_1.UI {
+    constructor(config) {
+        super();
+        this.className = 'TdTooltipContent';
+        this.setConfig(config);
+    }
+}
+exports.TdTooltipContent = TdTooltipContent;

package/src/components/feedback/td-tooltip/content/content.interface.d.ts

@@ -0,0 +1,42 @@
+import { IUI } from '../../../../ui/ui.interface';
+import { ITdPopperContentConfig } from '../../td-popper/content/content.interface';
+export interface ITdTooltipContent extends IUI {
+    className: 'TdTooltipContent';
+}
+export interface ITdTooltipContentConfig extends ITdPopperContentConfig {
+    /**
+     * @description which element the tooltip CONTENT appends to
+     */
+    appendTo?: string | HTMLElement;
+    /**
+     * @description display content, can be overridden by `slot#content`
+     */
+    content?: string;
+    /**
+     * @description whether `content` is treated as HTML string
+     */
+    rawContent?: boolean;
+    /**
+     * @description when tooltip inactive and `persistent` is `false` , popconfirm will be destroyed
+     */
+    persistent?: boolean;
+    /**
+     * @description same as `aria-label`
+     */
+    ariaLabel?: string;
+    /**
+     * @description visibility of Tooltip
+     */
+    /**
+     * @description animation name
+     */
+    transition?: string;
+    /**
+     * @description whether tooltip content is teleported, if `true` it will be teleported to where `append-to` sets
+     */
+    teleported?: boolean;
+    /**
+     * @description whether Tooltip is disabled
+     */
+    disabled?: boolean;
+}

package/src/components/feedback/td-tooltip/content/content.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/feedback/td-tooltip/td-tooltip.class.d.ts

@@ -0,0 +1,8 @@
+import { UI } from '../../../ui/ui.abstract';
+import { ITdTooltip, ITdTooltipConfig } from './td-tooltip.interface';
+export declare class TdTooltip extends UI implements ITdTooltip {
+    className: 'TdTooltip';
+    private trigger;
+    private content;
+    constructor(config?: ITdTooltipConfig);
+}

package/src/components/feedback/td-tooltip/td-tooltip.class.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdTooltip = void 0;
+const ui_abstract_1 = require("../../../ui/ui.abstract");
+const td_popper_class_1 = require("../td-popper/td-popper.class");
+const trigger_class_1 = require("./trigger/trigger.class");
+const content_class_1 = require("./content/content.class");
+const framework_1 = require("@type-dom/framework");
+const arrow_class_1 = require("../td-popper/arrow/arrow.class");
+class TdTooltip extends ui_abstract_1.UI {
+    constructor(config) {
+        super();
+        this.className = 'TdTooltip';
+        this.trigger = new trigger_class_1.TdTooltipTrigger();
+        this.content = new content_class_1.TdTooltipContent({
+            childNodes: [
+                new framework_1.Span(),
+                new arrow_class_1.TdPopperArrow()
+            ]
+        });
+        this.addChild(new td_popper_class_1.TdPopper({
+            childNodes: [
+                this.trigger,
+                this.content
+            ]
+        }));
+        this.setConfig(config);
+    }
+}
+exports.TdTooltip = TdTooltip;

package/src/components/feedback/td-tooltip/td-tooltip.interface.d.ts

@@ -0,0 +1,10 @@
+import { IUI, IUIConfig } from '../../../ui/ui.interface';
+export interface ITdTooltip extends IUI {
+    className: 'TdTooltip';
+}
+export interface ITdTooltipConfig extends IUIConfig {
+    /**
+     * @description whether the tooltip content has an arrow
+     */
+    showArrow?: boolean;
+}

package/src/components/feedback/td-tooltip/td-tooltip.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/feedback/td-tooltip/trigger/trigger.class.d.ts

@@ -0,0 +1,6 @@
+import { UI } from '../../../../ui/ui.abstract';
+import { ITdTooltipTriggerConfig } from './trigger.interface';
+export declare class TdTooltipTrigger extends UI {
+    className: 'TdTooltipTrigger';
+    constructor(config?: ITdTooltipTriggerConfig);
+}

package/src/components/feedback/td-tooltip/trigger/trigger.class.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TdTooltipTrigger = void 0;
+const ui_abstract_1 = require("../../../../ui/ui.abstract");
+class TdTooltipTrigger extends ui_abstract_1.UI {
+    constructor(config) {
+        super();
+        this.className = 'TdTooltipTrigger';
+        this.setConfig(config);
+    }
+}
+exports.TdTooltipTrigger = TdTooltipTrigger;

package/src/components/feedback/td-tooltip/trigger/trigger.interface.d.ts

@@ -0,0 +1,16 @@
+import { IUI } from '../../../../ui/ui.interface';
+import { ITdPopperTriggerConfig } from '../../td-popper/trigger/trigger.interface';
+export interface ITdTooltipTrigger extends IUI {
+    className: 'TdTooltipTrigger';
+}
+export type TooltipTriggerType = 'hover' | 'focus' | 'click' | 'contextmenu';
+export interface ITdTooltipTriggerConfig extends ITdPopperTriggerConfig {
+    /**
+     * @description whether Tooltip is disabled
+     */
+    disabled?: boolean;
+    /**
+     * @description How should the tooltip be triggered (to show)
+     */
+    trigger?: TooltipTriggerType;
+}

package/src/components/feedback/td-tooltip/trigger/trigger.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/{form → components/form}/checkbox-group/checkbox-group.class.d.ts

@@ -1,13 +1,12 @@
-import { TypeDiv, TypeHtml } from '@type-dom/framework';
+import { IOptionConfig, TypeDiv, TypeHtml } from '@type-dom/framework';
 import { CheckboxOption } from './checkbox-option/checkbox-option.class';
 import { ICheckboxGroup } from './checkbox-group.interface';
-import { IOption } from './checkbox-option/checkbox-option.interface';
 export declare class CheckboxGroup extends TypeDiv implements ICheckboxGroup {
     className: 'CheckboxGroup';
     parent?: TypeHtml;
     childNodes: CheckboxOption[];
     value: (string | number | boolean)[];
     constructor();
-    setOptions(options: IOption[]): void;
+    setOptions(options: IOptionConfig[]): void;
     setValue(value: string | number | boolean): void;
 }

package/src/{form → components/form}/checkbox-group/checkbox-group.class.js

@@ -12,8 +12,7 @@ class CheckboxGroup extends framework_1.TypeDiv {
         this.value = [];
     }
     setOptions(options) {
-        this.clearChildNodes();
-        this.clearChildDom();
+        this.clearChildren();
         this.value = [];
         const random = Math.random();
         options.forEach((opt) => {
@@ -27,7 +26,7 @@ class CheckboxGroup extends framework_1.TypeDiv {
             if (opt.checked) {
                 this.value.push(opt.value);
             }
-            optObj.text.setText(opt.label);
+            optObj.textNode.setText(opt.label);
             this.addChild(optObj);
         });
     }
@@ -40,7 +39,7 @@ class CheckboxGroup extends framework_1.TypeDiv {
             this.childNodes.forEach(optObj => {
                 if (this.value.indexOf(String(optObj.input.attrObj.value)) !== -1) {
                     optObj.input.setAttrObj({
-                        checked: true,
+                        checked: true
                     });
                 }
                 else {

package/src/components/form/checkbox-group/checkbox-group.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/{form → components/form}/checkbox-group/checkbox-option/checkbox-option.class.d.ts

@@ -3,10 +3,10 @@ import { CheckboxGroup } from '../checkbox-group.class';
 import { ICheckboxOption } from './checkbox-option.interface';
 export declare class CheckboxOption extends TypeSpan implements ICheckboxOption {
     className: 'CheckboxOption';
+    input: Input;
     parent?: CheckboxGroup;
     childNodes: [Input, TextNode];
-    input: Input;
-    text: TextNode;
+    textNode: TextNode;
     constructor();
     initEvents(): void;
 }

package/src/{form → components/form}/checkbox-group/checkbox-option/checkbox-option.class.js

@@ -7,28 +7,28 @@ class CheckboxOption extends framework_1.TypeSpan {
     constructor() {
         super();
         this.className = 'CheckboxOption';
-        this.input = new framework_1.Input(this);
+        this.input = new framework_1.Input({ parent: this });
         this.input.addAttrObj({
-            type: 'checkbox',
-            // name: optionConfig.name,
+            type: 'checkbox'
+            // name: optionSetting.name,
             // label: opt.label,
             // value: opt.value,
             // checked: opt.checked || false
         });
-        this.text = new framework_1.TextNode();
-        this.childNodes = [this.input, this.text];
+        this.textNode = new framework_1.TextNode();
+        this.childNodes = [this.input, this.textNode];
     }
     initEvents() {
-        this.events.push((0, rxjs_1.fromEvent)(this.input.dom, 'click').subscribe(() => {
+        this.subscriptions.push((0, rxjs_1.fromEvent)(this.input.dom, 'click').subscribe(() => {
             var _a, _b, _c;
             console.log('this.input.dom click . ');
             console.log('this.input.dom.value is ', this.input.dom.value);
-            const flag = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.value.findIndex(item => item === this.input.dom.value);
+            const flag = (_a = this.parent) === null || _a === void 0 ? void 0 : _a.value.findIndex((item) => item === this.input.dom.value);
             if (this.input.dom.checked) {
                 if (flag === -1) {
                     (_b = this.parent) === null || _b === void 0 ? void 0 : _b.value.push(this.input.dom.value);
                     this.input.setAttrObj({
-                        checked: true,
+                        checked: true
                     });
                 }
             }

package/src/{form → components/form}/checkbox-group/checkbox-option/checkbox-option.interface.d.ts

@@ -3,8 +3,3 @@ export interface ICheckboxOption extends ITypeSpan {
     className: 'CheckboxOption';
     childNodes: [IInput, ITextNode];
 }
-export interface IOption {
-    label: string;
-    value: string;
-    checked: boolean;
-}

package/src/components/form/checkbox-group/checkbox-option/checkbox-option.interface.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/src/components/form/field-item/cascade/field-cascade.abstract.d.ts

@@ -0,0 +1,22 @@
+import { Div, Label, Button, IOptionSetting } from '@type-dom/framework';
+import { FieldSelect } from '../../../form/field-select/field-select.class';
+import { FieldItem } from '../field-item.abstract';
+/**
+ * 两级联动，
+ * 目前只有 字段名称属性项用到。 控件属性栏 control-field 字段属性栏 field-name
+ */
+export declare abstract class PropertyCascade extends FieldItem {
+    childNodes: [Label, Div, Button];
+    cascadeDiv: Div;
+    firstStageSelectObj: FieldSelect;
+    secondStageSelectObj: FieldSelect;
+    cascadeConfig?: IOptionSetting;
+    settings?: IOptionSetting;
+    abstract reset(value?: string): void;
+    protected constructor(labelText?: string);
+    get fieldSetting(): IOptionSetting | undefined;
+    set fieldSetting(value: IOptionSetting | undefined);
+    resetCascadeConfigResultValue(value: string | number | boolean): void;
+    resetCascadeConfig(optionSetting: IOptionSetting): void;
+    initEvents(): void;
+}

package/src/{form → components/form}/field-item/cascade/field-cascade.abstract.js

@@ -3,9 +3,9 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.PropertyCascade = void 0;
 const rxjs_1 = require("rxjs");
 const framework_1 = require("@type-dom/framework");
+const field_select_class_1 = require("../../../form/field-select/field-select.class");
 const field_item_abstract_1 = require("../field-item.abstract");
 const field_item_style_1 = require("../field-item.style");
-const td_select_class_1 = require("../../../basic/td-select/td-select.class");
 /**
  * 两级联动，
  * 目前只有 字段名称属性项用到。 控件属性栏 control-field 字段属性栏 field-name
@@ -14,7 +14,7 @@ class PropertyCascade extends field_item_abstract_1.FieldItem {
     constructor(labelText = '二级级联') {
         super(labelText);
         this.addAttrName('cascade-property');
-        this.cascadeDiv = new framework_1.Division();
+        this.cascadeDiv = new framework_1.Div();
         this.cascadeDiv.addAttrName('cascade');
         this.cascadeDiv.addStyleObj({
             height: '100%',
@@ -31,10 +31,10 @@ class PropertyCascade extends field_item_abstract_1.FieldItem {
             outline: '0',
             // -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);
             transition: 'border-color .2s cubic-bezier(.645,.045,.355,1)',
-            width: 'calc(100% - 100px)',
+            width: 'calc(100% - 100px)'
         });
         // 单独的方法实现
-        this.firstStageSelectObj = new td_select_class_1.TdSelect();
+        this.firstStageSelectObj = new field_select_class_1.FieldSelect();
         this.firstStageSelectObj.addAttrName('first-stage-select');
         this.firstStageSelectObj.setStyleObj(Object.assign({}, field_item_style_1.itemContentStyle, {
             width: '100%',
@@ -42,27 +42,26 @@ class PropertyCascade extends field_item_abstract_1.FieldItem {
             // borderRadius: '4px 0 0 4px',
             // borderRight: 'none',
         }));
-        this.secondStageSelectObj = new td_select_class_1.TdSelect();
+        this.secondStageSelectObj = new field_select_class_1.FieldSelect();
         this.secondStageSelectObj.addAttrName('second-stage-select');
         this.secondStageSelectObj.setStyleObj(Object.assign({}, field_item_style_1.itemContentStyle, {
-            width: '100%',
+            width: '100%'
         }));
         this.cascadeDiv.childNodes = [this.firstStageSelectObj, this.secondStageSelectObj];
         this.childNodes = [this.label, this.cascadeDiv, this.button];
     }
-    get fieldConfig() {
+    get fieldSetting() {
         var _a;
-        const fieldConfigStr = (_a = this.configs) === null || _a === void 0 ? void 0 : _a.fieldConfig;
-        if (fieldConfigStr) {
-            const configJson = JSON.parse(fieldConfigStr);
-            const optionConfig = {
-                name: configJson.name,
-                resultValue: configJson.resultValue,
+        const fieldSetting = (_a = this.settings) === null || _a === void 0 ? void 0 : _a.fieldSetting;
+        if (fieldSetting) {
+            const optionSetting = {
+                name: fieldSetting.name,
+                resultValue: fieldSetting.resultValue,
                 options: []
             };
-            if (configJson.options[0].options === undefined) { // 如果只有一级，应该是老数据，要重新组装
+            if (fieldSetting.options[0].options === undefined) { // 如果只有一级，应该是老数据，要重新组装
                 const values = [];
-                configJson.options.forEach(opt => {
+                fieldSetting.options.forEach((opt) => {
                     if (opt.value.indexOf('.') === -1) {
                         // 错误的测试数据，业务数据不会有这个问题。
                         throw Error('字段名称不是二级组装的 。 ');
@@ -71,86 +70,83 @@ class PropertyCascade extends field_item_abstract_1.FieldItem {
                     const tableLabel = opt.label.split('.')[0];
                     values.push(JSON.stringify({
                         label: tableLabel,
-                        value: tableValue,
+                        value: tableValue
                     }));
                 });
                 // todo 如何去重
                 const firstStageValues = Array.from(new Set(values));
                 firstStageValues.forEach((value) => {
-                    optionConfig.options.push(Object.assign({}, JSON.parse(value), { options: [] }));
+                    optionSetting.options.push(Object.assign({}, JSON.parse(value), { options: [] }));
                 });
-                configJson.options.forEach((opt2) => {
-                    optionConfig.options.forEach(opt1 => {
+                fieldSetting.options.forEach((opt2) => {
+                    optionSetting.options.forEach(opt1 => {
                         var _a;
                         if (String(opt1.value) === String(opt2.value.split('.')[0])) {
                             (_a = opt1.options) === null || _a === void 0 ? void 0 : _a.push(opt2);
                         }
                     });
                 });
-                // this.fieldConfig = optionConfig;
-                return optionConfig;
+                // this.fieldSetting = optionSetting;
+                return optionSetting;
             }
             else {
-                return configJson;
+                return fieldSetting;
             }
         }
         return undefined;
     }
-    set fieldConfig(value) {
+    set fieldSetting(value) {
         // TypeFormDesigner.webDocument.setAttribute('field-config', JSON.stringify(value));
-        if (this.configs === undefined) {
+        if (this.settings === undefined) {
             if (value !== undefined) {
-                this.configs = {
-                    fieldConfig: JSON.stringify(value),
-                };
+                this.setSetting('fieldSetting', value);
             }
         }
         else {
             if (value === undefined) {
-                delete this.configs.fieldConfig;
+                delete this.settings.fieldSetting;
             }
             else {
-                this.configs.fieldConfig = JSON.stringify(value);
+                this.setSetting('fieldSetting', value);
             }
         }
     }
     resetCascadeConfigResultValue(value) {
-        // AppRoot.selectedControl?.propObj.attrObj.optionConfig''
         // this.cascadeConfig = Object.assign(this.cascadeConfig, { resultValue: value });
         if (this.cascadeConfig) {
             this.cascadeConfig.resultValue = value;
         }
     }
     // todo vue项目中返回的是选中的项目。只有一层，没有两层。
-    resetCascadeConfig(optionConfig) {
-        console.log('optionConfig is ', optionConfig);
+    resetCascadeConfig(optionSetting) {
+        console.log('optionSetting is ', optionSetting);
         // this.cascadeDiv.clearChildNodes();
         // this.cascadeDiv.clearChildDom();
-        this.cascadeConfig = optionConfig;
-        if (optionConfig.resultValue === 0) { // 如果第1级还没有选择
-            this.firstStageSelectObj.resetOptions(optionConfig.options, optionConfig.resultValue);
+        this.cascadeConfig = optionSetting;
+        if (optionSetting.resultValue === 0) { // 如果第1级还没有选择
+            this.firstStageSelectObj.resetOptions(optionSetting.options, optionSetting.resultValue);
             //  todo 第2级，应该没有可选项。
             this.secondStageSelectObj.resetOptions([], 0);
             return;
         }
         //  todo config.options设置
-        if (String(optionConfig.resultValue).indexOf('.') !== -1) {
-            const firstStageValue = String(optionConfig.resultValue).split('.')[0];
-            this.firstStageSelectObj.resetOptions(optionConfig.options, firstStageValue);
-            // const firstStageValue = optionConfig.resultValue.split('.')[0];
-            const selectedOption = optionConfig.options.find(opt => opt.value === firstStageValue);
+        if (String(optionSetting.resultValue).indexOf('.') !== -1) {
+            const firstStageValue = String(optionSetting.resultValue).split('.')[0];
+            this.firstStageSelectObj.resetOptions(optionSetting.options, firstStageValue);
+            // const firstStageValue = optionSetting.resultValue.split('.')[0];
+            const selectedOption = optionSetting.options.find(opt => opt.value === firstStageValue);
             if (!(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.options)) {
                 // throw Error('选项有问题'); // 会阻塞修改单元格的控件类型
                 this.secondStageSelectObj.resetOptions([], 0);
                 console.error('选项有问题');
                 return;
             }
-            this.secondStageSelectObj.resetOptions(selectedOption.options, optionConfig.resultValue);
+            this.secondStageSelectObj.resetOptions(selectedOption.options, optionSetting.resultValue);
             // this.secondStageSelectObj.setSelectedValue(secondStageValue);
         }
     }
     initEvents() {
-        this.events.push((0, rxjs_1.fromEvent)(this.firstStageSelectObj.dom, 'change').subscribe(() => {
+        this.subscriptions.push((0, rxjs_1.fromEvent)(this.firstStageSelectObj.dom, 'change').subscribe(() => {
             var _a, _b;
             console.log('this.firstStageSelectObj.dom change . ');
             console.log('this.firstStageSelectObj.dom.value is ', this.firstStageSelectObj.dom.value);

package/src/components/form/field-item/field-item.abstract.d.ts

@@ -0,0 +1,10 @@
+import { Div, Input, Label, Span, Textarea, TypeComponent, Button } from '@type-dom/framework';
+import { Select } from '../select/select.class';
+import { IFieldItem } from './field-item.interface';
+export declare abstract class FieldItem extends TypeComponent implements IFieldItem {
+    abstract childNodes: [Label, ...(Span | Input | Textarea | Select | Div)[], Button];
+    label: Label;
+    button: Button;
+    protected constructor(labelText: string);
+    setLabelTitle(text: string): void;
+}