Match-id-31bf755b6dc5deec85ed39d316ac7eba2b574cb9

This commit is contained in:
* 2022-07-18 15:31:27 +08:00 committed by *
commit c568b732fe
19 changed files with 0 additions and 488 deletions

View File

@ -1,27 +0,0 @@
{
"presets": [
"@babel/react",
"@babel/typescript",
[
"@babel/env",
{
"modules": false
}
]
],
"plugins": [
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
],
[
"@babel/plugin-transform-react-jsx",
{
"pragma": "Horizon.createElement",
"pragmaFrag": "Horizon.Fragment"
}
]
]
}

View File

@ -1,3 +0,0 @@
Horizon X antd demo:
1. run `npm run build:watch` in root's `package.json`
2. run `npm start` to run Horizon X antd

View File

@ -1,38 +0,0 @@
import Horizon from 'horizon';
import { AppstoreOutlined } from '@ant-design/icons';
import { Menu } from 'antd';
function getItem(label, key, icon, children, type) {
return {
key,
icon,
children,
label,
type,
};
}
const items = [
getItem('sub2', 'sub2', <AppstoreOutlined />, [getItem('sub3', 'sub3', null, [getItem('sub4', 'sub4')])]),
];
const App = () => {
const onClick = e => {
console.log('click ', e);
};
return (
<Menu
onClick={onClick}
style={{
width: 256,
}}
defaultSelectedKeys={['sub2']}
defaultOpenKeys={['sub2', 'sub3']}
mode="inline"
items={items}
/>
);
};
export default App;

View File

@ -1,73 +0,0 @@
import Horizon, { useState } from 'horizon';
import {
AppstoreOutlined,
ContainerOutlined,
MenuFoldOutlined,
PieChartOutlined,
DesktopOutlined,
MailOutlined,
MenuUnfoldOutlined,
} from '@ant-design/icons';
import { Button, Menu } from 'antd';
function getItem(label, key, icon, children, type) {
return {
key,
icon,
children,
label,
type,
};
}
const items = [
getItem('选项1', '1', <PieChartOutlined />),
getItem('选项2', '2', <DesktopOutlined />),
getItem('选项3', '3', <ContainerOutlined />),
getItem('分组1', 'sub1', <MailOutlined />, [
getItem('选项5', '5'),
getItem('选项6', '6'),
getItem('选项7', '7'),
getItem('选项8', '8'),
]),
getItem('分组2', 'sub2', <AppstoreOutlined />, [
getItem('选项9', '9'),
getItem('选项10', '10'),
getItem('分组2-1', 'sub3', null, [getItem('选项11', '11'), getItem('选项12', '12')]),
]),
];
const App = () => {
const [collapsed, setCollapsed] = useState(false);
return (
<div
style={{
width: 256,
marginLeft: 32,
}}
>
<Button
type="primary"
onClick={() => {
setCollapsed(!collapsed);
}}
style={{
marginBottom: 16,
}}
>
{collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
</Button>
<Menu
mode="inline"
theme="dark"
defaultSelectedKeys={['2']}
defaultOpenKeys={['sub2']}
inlineCollapsed={collapsed}
items={items}
/>
</div>
);
};
export default App;

View File

@ -1,97 +0,0 @@
import Horizon from 'horizon';
import { Table } from 'antd';
const columns = [
{
title: 'Full Name',
width: 100,
dataIndex: 'name',
key: 'name',
fixed: 'left',
},
{
title: 'Lang',
width: 100,
dataIndex: 'lang',
key: 'age',
fixed: 'left',
},
{
title: 'COL1',
dataIndex: 'description',
key: '1',
width: 220,
},
{
title: 'COL2',
dataIndex: 'description',
key: '2',
width: 220,
},
{
title: 'COL3',
dataIndex: 'description',
key: '3',
width: 220,
},
{
title: 'COL4',
dataIndex: 'description',
key: '4',
width: 220,
},
{
title: 'COL5',
dataIndex: 'description',
key: '5',
width: 220,
},
{
title: 'COL6',
dataIndex: 'description',
key: '6',
width: 220,
},
{
title: 'COL7',
dataIndex: 'description',
key: '7',
width: 220,
},
{
title: 'COL8',
dataIndex: 'description',
key: '8',
},
{
title: 'Action',
key: 'operation',
fixed: 'right',
width: 100,
render: () => <a>action</a>,
},
];
const data = [];
for (let i = 0; i < 100; i++) {
data.push({
key: i,
name: `Horizon ${i}`,
lang: 'js',
description: `Javascript Framework no. ${i}`,
});
}
const App = () => (
<div style={{ width: '1200px' }}>
<Table
columns={columns}
dataSource={data}
scroll={{
x: 2200,
y: 300,
}}
/>
</div>
);
export default App;

View File

@ -1,29 +0,0 @@
import Horizon from 'horizon';
import 'antd/dist/antd.css';
import Table from './components/Table';
import Menu from './components/Menu';
import Menu2 from './components/Menu2';
import { Tabs } from 'antd';
const { TabPane } = Tabs;
const onChange = key => {
console.log(key);
};
const App = () => (
<div style={{ padding: '12px' }}>
<h1>Horizon antd</h1>
<Tabs defaultActiveKey="Menu" onChange={onChange}>
<TabPane tab="Table" key="Table">
<Table />
</TabPane>
<TabPane tab="Menu" key="Menu">
<div style={{ display: 'flex' }}>
<Menu />
<Menu2 />
</div>
</TabPane>
</Tabs>
</div>
);
Horizon.render(<App key={1} />, document.getElementById('app'));

View File

@ -1,34 +0,0 @@
{
"name": "horizon-antd",
"version": "1.0.0",
"description": "",
"scripts": {
"start": "webpack-dev-server --config webpack.dev.js --hot --mode development --open"
},
"license": "MIT",
"dependencies": {
"@ant-design/icons": "^4.7.0",
"@babel/polyfill": "^7.10.4",
"antd": "^4.21.3",
"css-loader": "^5.2.2",
"style-loader": "^2.0.0"
},
"devDependencies": {
"@babel/core": "^7.11.1",
"@babel/plugin-proposal-class-properties": "^7.10.4",
"@babel/plugin-proposal-object-rest-spread": "^7.11.0",
"@babel/plugin-syntax-jsx": "^7.10.4",
"@babel/preset-env": "^7.11.0",
"@babel/preset-react": "^7.10.4",
"@babel/preset-typescript": "^7.10.4",
"@hot-loader/react-dom": "16.9.0",
"babel-loader": "^8.1.0",
"html-webpack-plugin": "^3.2.0",
"html-webpack-template": "^6.2.0",
"react-hot-loader": "^4.12.20",
"webpack": "4.42.0",
"webpack-cli": "3.3.11",
"webpack-dev-server": "^3.10.3",
"webpack-watch-files-plugin": "^1.2.1"
}
}

View File

@ -1,54 +0,0 @@
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const horizon = path.resolve(__dirname, '../../build/horizon');
const config = () => {
return {
entry: ['./index.jsx'],
output: {
path: path.resolve(__dirname, 'temp'),
filename: '[name].[hash].js',
},
devtool: 'source-map',
module: {
rules: [
{
test: /\.ts(x)?|js|jsx$/,
exclude: /node_modules/,
loader: 'babel-loader',
},
{
test: /\.css$/,
use: [
'style-loader',
{
loader: 'css-loader',
options: {
importLoaders: 1,
},
},
],
exclude: /\.module\.css$/,
},
],
},
resolve: {
extensions: ['.tsx', '.ts', '.js', '.jsx', 'json'],
alias: {
horizon: horizon,
react: horizon,
'react-dom': horizon,
},
},
plugins: [
new HtmlWebpackPlugin({
template: require('html-webpack-template'),
title: 'Horizon Antd',
inject: false,
appMountId: 'app',
filename: 'index.html',
}),
],
};
};
module.exports = config;

View File

@ -1 +0,0 @@
# horizon jsx babel plugin

View File

@ -1,7 +0,0 @@
/* istanbul ignore next */
module.exports = {
presets: [
'@babel/preset-env',
'@babel/preset-typescript'
]
};

View File

@ -1,5 +0,0 @@
module.exports = {
transform: {
'\\.(js|jsx|ts|tsx)$': 'babel-jest',
}
};

View File

@ -1,37 +0,0 @@
{
"name": "@cloudsop/horizon-jsx-transform-babel-plugin",
"version": "0.2.0",
"description": "transform jsx for horizon",
"main": "./dist/index.js",
"scripts": {
"build": "rimraf dist && tsc",
"test": "rimraf dist && tsc && jest",
"jest": "jest",
"prepublish": "npm run build"
},
"files": [
"../dist"
],
"dependencies": {
"@babel/generator": "^7.2.2",
"@babel/parser": "^7.2.3"
},
"devDependencies": {
"@babel/core": "^7.2.2",
"@babel/plugin-proposal-class-properties": "^7.2.1",
"@babel/plugin-proposal-decorators": "^7.2.0",
"@babel/plugin-proposal-export-namespace-from": "^7.2.0",
"@babel/plugin-proposal-function-sent": "^7.2.0",
"@babel/plugin-proposal-json-strings": "^7.2.0",
"@babel/plugin-proposal-numeric-separator": "^7.2.0",
"@babel/plugin-proposal-throw-expressions": "^7.2.0",
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
"@babel/plugin-syntax-import-meta": "^7.2.0",
"@babel/plugin-syntax-jsx": "^7.2.0",
"@babel/plugin-transform-modules-commonjs": "^7.2.0",
"@babel/traverse": "^7.11.0",
"@babel/preset-env": "^7.16.11",
"@babel/types": "^7.0.0",
"babel-plugin-tester": "^10.1.0"
}
}

View File

@ -1,57 +0,0 @@
import SyntaxJSX from '@babel/plugin-syntax-jsx';
import * as BabelCore from '@babel/core';
import * as t from '@babel/types';
import { NodePath } from '@babel/traverse';
import { JSXIdentifier, JSXMemberExpression, JSXNamespacedName } from '@babel/types';
function isHTMLTag(tagName: string) {
return tagName && /^[a-z]/.test(tagName);
}
const horizonJsx = t.memberExpression(t.identifier('Horizon'), t.identifier('jsx'));
function getTagNodeName(tagNode: JSXIdentifier | JSXMemberExpression | JSXNamespacedName) {
let tagName;
if (t.isJSXNamespacedName(tagNode)) {
throw 'horizon jsx doesn\'t support JSX namespace: ' + tagNode;
} else if (t.isJSXIdentifier(tagNode)) {
/*
this -> thisExpression
HTML -> stringLiteral
Others -> Identifier
*/
tagName = tagNode.name === 'this' ?
t.thisExpression() : isHTMLTag(tagNode.name) ?
t.stringLiteral(tagNode.name) :
t.identifier(tagNode.name);
} else if (t.isJSXMemberExpression(tagNode)) {
tagName = t.memberExpression(
getTagNodeName(tagNode.object),
getTagNodeName(tagNode.property),
);
}
return tagName;
}
export default ({ types }: typeof BabelCore) => {
return {
name: 'horizon-jsx-babel-plugin',
inherits: SyntaxJSX,
visitor: {
Program(path: NodePath<t.Program>) {
// program = path
},
JSXElement: {
exit(path: NodePath<t.JSXElement>) {
const openingElement = path.get('openingElement');
const tagName = getTagNodeName(openingElement.node.name);
path.replaceWith(t.callExpression(horizonJsx, [tagName]));
},
},
},
};
};

View File

@ -1,3 +0,0 @@
var x = <div></div>;
var y = <Eview.Table></Eview.Table>;
var z = <this></this>;

View File

@ -1,3 +0,0 @@
var x = Horizon.jsx('div');
var y = Horizon.jsx(Eview.Table);
var z = Horizon.jsx(this);

View File

@ -1 +0,0 @@
<div className="123"></div>

View File

@ -1,10 +0,0 @@
const path = require('path');
const pluginTester = require('babel-plugin-tester').default;
import plugin from '../src';
pluginTester({
plugin,
title: 'horizon jsx plugin',
fixtures: path.join(__dirname, '__fixtures__'),
snapshot: true
});

View File

@ -1,9 +0,0 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"outDir": "./dist"
},
"include": [
"src"
]
}