forked from alibaba/lowcode-materials
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathadaptor.ts
More file actions
122 lines (113 loc) · 3.82 KB
/
adaptor.ts
File metadata and controls
122 lines (113 loc) · 3.82 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import parseData from '../utils/parse-data';
export const createDataSource = (data: any, props) => {
const list = parseData(data, { parseContent: true });
const dataSource = [];
list.forEach((item, index) => {
const { value = '' } = item.value.find(({ type }) => type === 'icon') || {};
dataSource.push({
icon: value,
key: `tab_item_${index}`,
title: {
type: 'JSSlot',
value: item.value.map(({ type, value }) => {
if (type === 'icon')
return {
componentName: 'Icon',
props: {
disabled: true,
type: value,
size: 'small',
style: { marginRight: '4px' },
},
};
return {
componentName: 'Typography.Text',
props: {
children: value,
style: {
color: 'inherit',
},
},
};
}),
},
disabled: item.state === 'disabled',
});
if (item.state === 'active') {
props.current = `tab_item_${index}`;
}
});
return dataSource;
};
function createContents(dataSource) {
//dataSouce.map(item => <Step.Item key={item.key} title={item.title} content={item.content} icon={item.icon} percent={item.percent} disabled={item.disabled}/>)
return dataSource.map((item) => {
return {
componentName: 'Tab.Item',
props: item,
};
});
}
export function getDataFromPlainText(value) {
const props = { current: `tab_item_0` };
const dataSource = createDataSource(value, props);
const children = createContents(dataSource);
return { children, ...props };
}
// export default {
// name: 'Tab',
// shape: ['pure', 'wrapped', 'text', 'capsule'],
// editor: (shape = 'pure') => {
// const props = [{
// name: 'size',
// type: Types.enum,
// options: ['medium', 'small'],
// default: 'medium'
// }, {
// name: 'closable',
// type: Types.bool,
// default: false
// }];
// if (['pure', 'wrapped', 'text'].indexOf(shape) !== -1) {
// props.push({
// name: 'overflow',
// label: 'Overflow Indicator',
// type: Types.enum,
// options: ['slide', 'dropdown'],
// default: 'slide'
// });
// props.push({
// name: 'width',
// type: Types.number,
// default: 480
// });
// }
// if (shape === 'wrapped') {
// props.splice(props.length - 2, 0, {
// name: 'position',
// type: Types.enum,
// options: ['top', 'left', 'right'],
// default: 'top'
// });
// }
// return {
// props,
// data: {
// active: true,
// disable: true,
// default: 'Tab 1\n*Tab 2\nTab 3'
// }
// };
// },
// adaptor: ({ shape, size, closable, overflow, width, position, style = {}, data, ...others }) => {
// const list = parseData(data, { parseContent: true });
// const activeKey = list.findIndex((item) => item.state === 'active');
// return (
// <Tab {...others} style={{ minWidth: style.width ? 0 : width, ...style }} activeKey={activeKey} shape={shape} size={size} excessMode={overflow} tabPosition={position}>
// {
// list.map((item, index) => <Tab.Item key={index} title={item.value.map(({ type, value }, i) => type === 'icon' ? <Icon key={`icon_${i}`} type={value} /> : value)} closeable={closable} disabled={item.state === 'disabled'} />)
// }
// </Tab>
// );
// }
// };