publish(@omiu-tree)

This commit is contained in:
dntzhang 2020-05-01 19:59:19 +08:00
parent fbae712899
commit 81377c5025
10 changed files with 100 additions and 36 deletions

View File

@ -39,6 +39,6 @@ Or use script tag to ref it.
### Events
* nodeClick
* nodeArrowClick
* contextMenu
* node-click
* node-arrow-click
* context-menu

View File

@ -23,7 +23,7 @@ import '@omiu/tree'
## 使用
```html
<o-tree> </o-tree>
<o-tree></o-tree>
```
@ -39,6 +39,6 @@ import '@omiu/tree'
### 事件
* nodeClick
* nodeArrowClick
* contextMenu
* node-click
* node-arrow-click
* context-menu

View File

@ -0,0 +1,41 @@
## Tree
Components that show tree nested data structures.
* [→ CodePen](https://codepen.io/omijs/pen/yLYMrdg)
## Import
```js
import '@omiu/tree'
```
Or use script tag to ref it.
```html
<script src="https://unpkg.com/@omiu/tree"></script>
```
## Usage
```html
<o-tree></o-tree>
```
## API
### Props
```tsx
{
data?: object
}
```
### Events
* node-click
* node-arrow-click
* context-menu

View File

@ -1,6 +1,6 @@
{
"name": "@omiu/tree",
"version": "0.0.2",
"version": "0.0.3",
"description": "Components that show tree nested data structures.",
"docsExtend": {
"cnName": "树形控件",

View File

@ -3,17 +3,12 @@ const fs = require('fs')
const content = fs.readFileSync('./src/index.tsx', 'utf-8')
const props = content.match(new RegExp('interface Props \\{[\\s\\S]*?}'))[0].replace('interface Props ', '')
const props = extract('interface Props {', content).replace('interface Props ', '')
const defaultPropsContext = content.match(new RegExp('static defaultProps = \\{[\\s\\S]*?}'))
let defaultProps
if (defaultPropsContext) {
defaultProps = defaultPropsContext[0].replace('static defaultProps = ', '').replace(/ /g, ' ').replace(/ }/g, ')')
}
const defaultProps = extract('static defaultProps = {', content).replace('static defaultProps = ', '').replace(/ }/g, '}').replace(/ /g, ' ')
const eventContexts = content.match(new RegExp('this.fire\\([\\s\\S]*?,', 'g'))
const eventContexts = content.match(new RegExp('this.fire\\([\\s\\S]*?[,|)]', 'g'))
const package = require('../package.json')
const packageName = package.name
const name = packageName.split('/')[1]
@ -28,7 +23,7 @@ let events, eventMap
if (eventContexts) {
events = eventContexts.map(event => {
return event.replace('this.fire(\'', '').replace('\',', '')
return event.replace('this.fire(\'', '').replace('\',', '').replace('\')', '')
})
eventMap = {}
events.forEach(event => {
@ -69,11 +64,11 @@ import '${packageName}'
### 属性
\`\`\`jsx
\`\`\`tsx
${props}
\`\`\`
${defaultProps ? '### 默认属性\n' : ''}${defaultProps ? '\`\`\`jsx\n' : ''}${defaultProps ? defaultProps : ''}
${defaultProps ? '### 默认属性\n' : ''}${defaultProps ? '\`\`\`tsx\n' : ''}${defaultProps ? defaultProps : ''}
${defaultProps ? '\`\`\`\n' : ''}${eventMap ? '### 事件\n' : ''}${eventMap ? Object.keys(eventMap).map(event => {
return `* ${event}\n`
}).join('') : ''}`
@ -114,17 +109,45 @@ Or use script tag to ref it.
### Props
\`\`\`jsx
\`\`\`tsx
${props}
\`\`\`
${defaultProps ? '### 默认属性\n\n' : ''}${defaultProps ? '\`\`\`jsx\n' : ''}${defaultProps ? defaultProps : ''}
${defaultProps ? '### 默认属性\n\n' : ''}${defaultProps ? '\`\`\`tsx\n' : ''}${defaultProps ? defaultProps : ''}
${defaultProps ? '\`\`\`\n' : ''}${eventMap ? '### Events\n\n' : ''}${eventMap ? Object.keys(eventMap).map(event => {
return `* ${event}\n`
}).join('') : ''}`
fs.writeFileSync(`../docs-src/src/docs/en/${name}.md`, enContent)
fs.writeFileSync(`../${name}/README.md`, enContent.replace(/<iframe[\s\S]*?<\/iframe>/, `* [→ CodePen](https://codepen.io/omijs/pen/${package.docsExtend.codepen})`))
// console.log(props)
// console.log(defaultProps)
// console.log(Object.keys(eventMap))
function extract(startWith, str) {
const start = str.indexOf(startWith)
if (start === -1) return ''
let end = start + startWith.length
let stackCount = 1
while (end < str.length) {
if (str[end] === '}') {
if (stackCount === 1) {
break
} else {
stackCount--
}
} else if (str[end] === '{') {
stackCount++
}
end++
}
return str.substring(start, end + 1)
}

View File

@ -1,5 +1,5 @@
/**
* @omiu/tree v0.0.2 http://omijs.org
* @omiu/tree v0.0.3 http://omijs.org
* Front End Cross-Frameworks Framework.
* By dntzhang https://github.com/dntzhang
* Github: https://github.com/Tencent/omi
@ -611,16 +611,16 @@ var Tree = /** @class */ (function (_super) {
_this.prevSelectedNode.selected = false;
node.selected = true;
_this.forceUpdate();
_this.fire('nodeClick', node);
_this.fire('node-click', node);
};
_this.onNodeArrowClick = function (node) {
_this.fire('nodeArrowClick', node);
_this.fire('nodeClick', node);
_this.fire('node-arrow-click', node);
_this.fire('node-click', node);
};
_this.onContextMenu = function (evt, node) {
evt.stopPropagation();
evt.preventDefault();
_this.fire('contextMenu', {
_this.fire('context-menu', {
evt: evt,
node: node
});

File diff suppressed because one or more lines are too long

View File

@ -273,16 +273,16 @@ var Tree = /** @class */ (function (_super) {
_this.prevSelectedNode.selected = false;
node.selected = true;
_this.forceUpdate();
_this.fire('nodeClick', node);
_this.fire('node-click', node);
};
_this.onNodeArrowClick = function (node) {
_this.fire('nodeArrowClick', node);
_this.fire('nodeClick', node);
_this.fire('node-arrow-click', node);
_this.fire('node-click', node);
};
_this.onContextMenu = function (evt, node) {
evt.stopPropagation();
evt.preventDefault();
_this.fire('contextMenu', {
_this.fire('context-menu', {
evt: evt,
node: node
});

File diff suppressed because one or more lines are too long

View File

@ -21,21 +21,21 @@ export default class Tree extends WeElement<Props>{
this.prevSelectedNode.selected = false
node.selected = true
this.forceUpdate()
this.fire('nodeClick', node)
this.fire('node-click', node)
}
_tempTagName: string
prevSelectedNode
onNodeArrowClick = (node) => {
this.fire('nodeArrowClick', node)
this.fire('nodeClick', node)
this.fire('node-arrow-click', node)
this.fire('node-click', node)
}
onContextMenu = (evt, node) => {
evt.stopPropagation()
evt.preventDefault()
this.fire('contextMenu', {
this.fire('context-menu', {
evt,
node
})