{
- return (
- obj &&
- obj.prototype &&
- (obj.prototype.isReactComponent || obj.prototype instanceof Component)
- );
-}
-
-interface IExtraProps {
- stageName?: string;
- isGroup?: boolean;
- isExpand?: boolean;
- propName?: string;
- toggleExpand?: () => any;
- onExpandChange?: () => any;
-}
-
-const FIELD_TYPE_MAP: any = {
- accordion: AccordionField,
- block: BlockField,
- entry: EntryField,
- inline: InlineField,
- plain: PlainField,
- popup: PopupField,
- tab: AccordionField,
-};
-
-export class SettingField extends Component {
- public readonly props: {
- prop: any;
- selected?: boolean;
- forceDisplay?: string;
- className?: string;
- children?: JSX.Element | string;
- compact?: boolean;
- key?: string;
- addonProps?: object;
- };
-
- /**
- * VariableSetter placeholder
- */
- public variableSetter: any;
-
- constructor(props: any) {
- super(props);
-
- this.variableSetter = getSetter('VariableSetter')?.component || VariableSetter;
- }
-
- public render() {
- const { prop, selected, addonProps } = this.props;
- const display = this.props.forceDisplay || prop.getDisplay();
-
- if (display === 'none') {
- return null;
- }
-
- // 标准的属性，即每一个 Field 在 VE 下都拥有的属性
- const standardProps = {
- className: this.props.className,
- compact: this.props.compact,
-
- isSupportMultiSetter: this.supportMultiSetter(),
- isSupportVariable: prop.isSupportVariable(),
- isUseVariable: prop.isUseVariable(),
- prop,
- setUseVariable: () => prop.setUseVariable(!prop.isUseVariable()),
- tip: prop.getTip(),
- title: prop.getTitle(),
- };
-
- // 部分 Field 所需要的额外 fieldProps
- const extraProps = {};
- const ctx = context;
- const plugin = ctx.getPlugin(VE_HOOKS.VE_SETTING_FIELD_PROVIDER);
- let Field;
- if (typeof plugin === 'function') {
- Field = plugin(display, FIELD_TYPE_MAP, prop);
- }
- if (!Field) {
- Field = FIELD_TYPE_MAP[display] || PlainField;
- }
- this._prepareProps(display, extraProps);
-
- if (display === 'entry') {
- return ;
- }
-
- let setter;
- const props: any = {
- prop,
- selected,
- };
- const fieldProps = { ...standardProps, ...extraProps };
-
- if (prop.isUseVariable() && !this.variableSetter.isPopup) {
- props.placeholder = '请输入表达式: ${var}';
- props.key = `${prop.getId()}-variable`;
- setter = createElement(this.variableSetter, props);
- return {setter};
- }
-
- // for composited prop
- if (prop.getVisibleItems) {
- setter = prop
- .getVisibleItems()
- .map((item: any) => (
-
- ));
- return {setter};
- }
-
- setter = prop.getSetter();
- if (
- typeof setter === 'object' &&
- 'componentName' in setter &&
- !(isValidElement(setter) || isReactClass(setter))
- ) {
- const { componentName: setterType, props: setterProps } = setter as any;
- setter = createSetterContent(setterType, {
- ...addonProps,
- ...setterProps,
- ...props,
- });
- } else {
- setter = createSetterContent(setter, {
- ...addonProps,
- ...props,
- });
- }
-
- return {setter};
- }
-
- private supportMultiSetter() {
- const { prop } = this.props;
- const setter = prop && prop.getConfig && prop.getConfig('setter');
- return prop.isSupportVariable() || Array.isArray(setter);
- }
-
- private _prepareProps(displayType: string, extraProps: IExtraProps): void {
- const { prop } = this.props;
- extraProps.propName = prop.isGroup()
- ? '组合属性，无属性名称'
- : prop.getName();
- switch (displayType) {
- case 'title':
- break;
- case 'block':
- Object.assign(extraProps, { isGroup: prop.isGroup() });
- break;
- case 'accordion':
- Object.assign(extraProps, {
- headDIY: true,
- isExpand: prop.isExpand(),
- isGroup: prop.isGroup(),
- onExpandChange: () => prop.onExpandChange(() => this.forceUpdate()),
- toggleExpand: () => {
- prop.toggleExpand();
- },
- });
- break;
- case 'entry':
- Object.assign(extraProps, { stageName: prop.getName() });
- break;
- default:
- break;
- }
- }
-}
diff --git a/packages/vision-polyfill/src/fields/variable-setter.less b/packages/vision-polyfill/src/fields/variable-setter.less
deleted file mode 100644
index 6ea5653d3..000000000
--- a/packages/vision-polyfill/src/fields/variable-setter.less
+++ /dev/null
@@ -1,43 +0,0 @@
-@import '~@ali/ve-less-variables/index.less';
-
-.engine-input-control {
- box-sizing: border-box;
- font-size: 12px;
- font-family: Consolas, "Courier New", Courier, FreeMono, monospace;
- color: var(--color-text, @dark-alpha-3);
- background: var(--color-field-background, @white-alpha-1);
- border: 1px solid var(--color-field-border, @normal-alpha-5);
- flex: 1;
- border-radius: @global-border-radius;
- max-height: 200px;
-
- &:hover {
- border-color: var(--color-field-border-hover, @normal-alpha-4);
- }
-
- &.engine-focused {
- border-color: var(--color-field-border-active, @normal-alpha-3);
- }
-
- textarea {
- resize: none;
- }
-
- >.engine-input {
- box-sizing: border-box;
- padding: 6px;
- display: block;
- font-size: 12px;
- line-height: 16px;
- color: var(--color-text, @dark-alpha-3);
- width: 100%;
- border: 0;
- margin: 0;
- background: transparent;
- outline: none;
-
- &::-webkit-input-placeholder {
- color: var(--color-field-placeholder, @normal-alpha-5);
- }
- }
-}
diff --git a/packages/vision-polyfill/src/fields/variable-setter.tsx b/packages/vision-polyfill/src/fields/variable-setter.tsx
deleted file mode 100644
index f520c128f..000000000
--- a/packages/vision-polyfill/src/fields/variable-setter.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import './variable-setter.less';
-import { Component } from 'react';
-
-class Input extends Component {
- public props: {
- value: string;
- placeholder: string;
- onChange: (val: any) => any;
- };
-
- public state: { focused: boolean };
-
- constructor(props: object) {
- super(props);
- this.state = {
- focused: false,
- };
- }
-
- public componentDidMount() {
- this.adjustTextAreaHeight();
- }
-
- private domRef: HTMLTextAreaElement | null = null;
-
- public adjustTextAreaHeight() {
- if (!this.domRef) {
- return;
- }
- this.domRef.style.height = '1px';
- const calculatedHeight = this.domRef.scrollHeight;
- this.domRef.style.height = calculatedHeight >= 200 ? '200px' : `${calculatedHeight }px`;
- }
-
- public render() {
- const { value, placeholder, onChange } = this.props;
- return (
-
-