@cuvp1225/antd 0.1.2 → 0.1.4

package/lib/cjs/components/index.d.ts

@@ -1,3 +1,2 @@
-export { Timeline, TimelineItem } from './timeline';
-export { Row, Col } from 'antd';
-export { Table } from './table';
+export { Row, Col, Timeline, Table, Typography, Breadcrumb, Menu, Form, Collapse, Descriptions, List, Popover, Statistic, Tabs, Tag, Tooltip, Popconfirm, Anchor } from 'antd';
+export * from './placeholder';

package/lib/cjs/components/index.js

@@ -1,11 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Table = exports.Col = exports.Row = exports.TimelineItem = exports.Timeline = void 0;
-var timeline_1 = require("./timeline");
-Object.defineProperty(exports, "Timeline", { enumerable: true, get: function () { return timeline_1.Timeline; } });
-Object.defineProperty(exports, "TimelineItem", { enumerable: true, get: function () { return timeline_1.TimelineItem; } });
+exports.Anchor = exports.Popconfirm = exports.Tooltip = exports.Tag = exports.Tabs = exports.Statistic = exports.Popover = exports.List = exports.Descriptions = exports.Collapse = exports.Form = exports.Menu = exports.Breadcrumb = exports.Typography = exports.Table = exports.Timeline = exports.Col = exports.Row = void 0;
+const tslib_1 = require("tslib");
 var antd_1 = require("antd");
 Object.defineProperty(exports, "Row", { enumerable: true, get: function () { return antd_1.Row; } });
 Object.defineProperty(exports, "Col", { enumerable: true, get: function () { return antd_1.Col; } });
-var table_1 = require("./table");
-Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return table_1.Table; } });
+Object.defineProperty(exports, "Timeline", { enumerable: true, get: function () { return antd_1.Timeline; } });
+Object.defineProperty(exports, "Table", { enumerable: true, get: function () { return antd_1.Table; } });
+Object.defineProperty(exports, "Typography", { enumerable: true, get: function () { return antd_1.Typography; } });
+Object.defineProperty(exports, "Breadcrumb", { enumerable: true, get: function () { return antd_1.Breadcrumb; } });
+Object.defineProperty(exports, "Menu", { enumerable: true, get: function () { return antd_1.Menu; } });
+Object.defineProperty(exports, "Form", { enumerable: true, get: function () { return antd_1.Form; } });
+Object.defineProperty(exports, "Collapse", { enumerable: true, get: function () { return antd_1.Collapse; } });
+Object.defineProperty(exports, "Descriptions", { enumerable: true, get: function () { return antd_1.Descriptions; } });
+Object.defineProperty(exports, "List", { enumerable: true, get: function () { return antd_1.List; } });
+Object.defineProperty(exports, "Popover", { enumerable: true, get: function () { return antd_1.Popover; } });
+Object.defineProperty(exports, "Statistic", { enumerable: true, get: function () { return antd_1.Statistic; } });
+Object.defineProperty(exports, "Tabs", { enumerable: true, get: function () { return antd_1.Tabs; } });
+Object.defineProperty(exports, "Tag", { enumerable: true, get: function () { return antd_1.Tag; } });
+Object.defineProperty(exports, "Tooltip", { enumerable: true, get: function () { return antd_1.Tooltip; } });
+Object.defineProperty(exports, "Popconfirm", { enumerable: true, get: function () { return antd_1.Popconfirm; } });
+Object.defineProperty(exports, "Anchor", { enumerable: true, get: function () { return antd_1.Anchor; } });
+tslib_1.__exportStar(require("./placeholder"), exports);

package/lib/cjs/components/placeholder.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { BoxProps } from '@music163/foundation';
+export interface PlaceholderProps extends BoxProps {
+    /**
+     * 尺寸
+     * small - 适合文本，按钮等小型控件
+     * medium - 中型控件
+     * large - 大型控件
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+    /**
+     * 按钮文本
+     */
+    buttonText?: string;
+    /**
+     * 要实例化的组件名称
+     */
+    targetComponentName?: string;
+}
+export declare const Placeholder: React.ForwardRefExoticComponent<PlaceholderProps & import("@music163/tango-boot").TangoComponentProps & React.RefAttributes<unknown>>;

package/lib/cjs/components/placeholder.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Placeholder = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const coral_system_1 = require("coral-system");
+const foundation_1 = require("@music163/foundation");
+const tango_boot_1 = require("@music163/tango-boot");
+const placeholderStyle = (0, coral_system_1.css) `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background-color: #efefef;
+  color: #333;
+  border: 1px solid #666;
+  padding-left: 12px;
+  padding-right: 12px;
+  user-select: none;
+  overflow: hidden;
+  white-space: nowrap;
+
+  & ~ .tango-placeholder {
+    margin-top: 12px;
+  }
+`;
+const sizeMap = {
+    small: '32px',
+    medium: '64px',
+    large: '80px',
+};
+function PlaceholderView(_a) {
+    var { size = 'medium', 
+    //placeholder = '点击或拖拽组件/区块到这里',
+    placeholder = '点击或拖拽组件/区块到这里' } = _a, rest = tslib_1.__rest(_a, ["size", "placeholder"]);
+    const height = sizeMap[size];
+    //console.log('zcq-PlaceholderView01', rest);
+    //去除rest里的dnd-id属性，解决row等容器组件能否直接选中问题(方案废弃，会导致占位符无法被替换)
+    // const newRest = Object.keys(rest)
+    // .filter(key => key !== "data-dnd")
+    // .reduce((acc, key) => {
+    //     acc[key as keyof typeof rest] = rest[key as keyof typeof rest];
+    //     return acc;
+    // }, {} as { [key: string]: any });
+    // console.log('zcq-PlaceholderView02', newRest);
+    return (react_1.default.createElement(foundation_1.Box, Object.assign({ className: "tango-placeholder", height: height, css: placeholderStyle }, rest), placeholder));
+}
+exports.Placeholder = (0, tango_boot_1.defineComponent)(PlaceholderView);

package/lib/esm/components/index.d.ts

@@ -1,3 +1,2 @@
-export { Timeline, TimelineItem } from './timeline';
-export { Row, Col } from 'antd';
-export { Table } from './table';
+export { Row, Col, Timeline, Table, Typography, Breadcrumb, Menu, Form, Collapse, Descriptions, List, Popover, Statistic, Tabs, Tag, Tooltip, Popconfirm, Anchor } from 'antd';
+export * from './placeholder';

package/lib/esm/components/index.js

@@ -1,3 +1,2 @@
-export { Timeline, TimelineItem } from './timeline';
-export { Row, Col } from 'antd';
-export { Table } from './table';
+export { Row, Col, Timeline, Table, Typography, Breadcrumb, Menu, Form, Collapse, Descriptions, List, Popover, Statistic, Tabs, Tag, Tooltip, Popconfirm, Anchor } from 'antd';
+export * from './placeholder';

package/lib/esm/components/placeholder.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { BoxProps } from '@music163/foundation';
+export interface PlaceholderProps extends BoxProps {
+    /**
+     * 尺寸
+     * small - 适合文本，按钮等小型控件
+     * medium - 中型控件
+     * large - 大型控件
+     */
+    size?: 'small' | 'medium' | 'large';
+    /**
+     * 占位文本
+     */
+    placeholder?: string;
+    /**
+     * 按钮文本
+     */
+    buttonText?: string;
+    /**
+     * 要实例化的组件名称
+     */
+    targetComponentName?: string;
+}
+export declare const Placeholder: React.ForwardRefExoticComponent<PlaceholderProps & import("@music163/tango-boot").TangoComponentProps & React.RefAttributes<unknown>>;

package/lib/esm/components/placeholder.js

@@ -0,0 +1,45 @@
+import { __rest } from "tslib";
+import React from 'react';
+import { css } from 'coral-system';
+import { Box } from '@music163/foundation';
+import { defineComponent } from '@music163/tango-boot';
+const placeholderStyle = css `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background-color: #efefef;
+  color: #333;
+  border: 1px solid #666;
+  padding-left: 12px;
+  padding-right: 12px;
+  user-select: none;
+  overflow: hidden;
+  white-space: nowrap;
+
+  & ~ .tango-placeholder {
+    margin-top: 12px;
+  }
+`;
+const sizeMap = {
+    small: '32px',
+    medium: '64px',
+    large: '80px',
+};
+function PlaceholderView(_a) {
+    var { size = 'medium', 
+    //placeholder = '点击或拖拽组件/区块到这里',
+    placeholder = '点击或拖拽组件/区块到这里' } = _a, rest = __rest(_a, ["size", "placeholder"]);
+    const height = sizeMap[size];
+    //console.log('zcq-PlaceholderView01', rest);
+    //去除rest里的dnd-id属性，解决row等容器组件能否直接选中问题(方案废弃，会导致占位符无法被替换)
+    // const newRest = Object.keys(rest)
+    // .filter(key => key !== "data-dnd")
+    // .reduce((acc, key) => {
+    //     acc[key as keyof typeof rest] = rest[key as keyof typeof rest];
+    //     return acc;
+    // }, {} as { [key: string]: any });
+    // console.log('zcq-PlaceholderView02', newRest);
+    return (React.createElement(Box, Object.assign({ className: "tango-placeholder", height: height, css: placeholderStyle }, rest), placeholder));
+}
+export const Placeholder = defineComponent(PlaceholderView);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cuvp1225/antd",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "antd components for tango app",
   "author": "wwsun <ww.sww@outlook.com>",
   "homepage": "https://github.com/netease/tango-components#readme",

package/lib/cjs/components/table.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare const Table: ({ [SLOT.id]: dataId, [SLOT.dnd]: dataDnd, ...rest }: {
-    [x: string]: any;
-}) => React.JSX.Element;

package/lib/cjs/components/table.js

@@ -1,16 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Table = void 0;
-const tslib_1 = require("tslib");
-const antd_1 = require("antd");
-const react_1 = tslib_1.__importDefault(require("react"));
-const tango_helpers_1 = require("@music163/tango-helpers");
-const Table = (_a) => {
-    var _b = tango_helpers_1.SLOT.id, dataId = _a[_b], _c = tango_helpers_1.SLOT.dnd, dataDnd = _a[_c], rest = tslib_1.__rest(_a, [typeof _b === "symbol" ? _b : _b + "", typeof _c === "symbol" ? _c : _c + ""]);
-    console.log("新的表格组件", dataId, dataDnd, rest);
-    const newProps = Object.assign(Object.assign({}, rest), { draggable: true });
-    console.log("新的表格组件01", newProps);
-    return (react_1.default.createElement("div", { "data-dnd": dataDnd, "data-id": dataId, draggable: true },
-        react_1.default.createElement(antd_1.Table, Object.assign({}, rest))));
-};
-exports.Table = Table;

package/lib/cjs/components/timeline.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-export declare const Timeline: ({ ...props }: {
-    [x: string]: any;
-}) => React.JSX.Element;
-export declare const TimelineItem: ({ ...props }: {
-    [x: string]: any;
-}) => React.JSX.Element;

package/lib/cjs/components/timeline.js

@@ -1,19 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.TimelineItem = exports.Timeline = void 0;
-const tslib_1 = require("tslib");
-const antd_1 = require("antd");
-const react_1 = tslib_1.__importDefault(require("react"));
-//import { SLOT } from '@music163/tango-helpers';  
-const Timeline = (_a) => {
-    var props = tslib_1.__rest(_a, []);
-    console.log("新的时间轴组件01", props);
-    return react_1.default.createElement(antd_1.Timeline, Object.assign({}, props));
-};
-exports.Timeline = Timeline;
-const TimelineItem = (_a) => {
-    var props = tslib_1.__rest(_a, []);
-    console.log("新的时间轴组件02", props);
-    return react_1.default.createElement(antd_1.Timeline.Item, Object.assign({}, props));
-};
-exports.TimelineItem = TimelineItem;

package/lib/esm/components/table.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-export declare const Table: ({ [SLOT.id]: dataId, [SLOT.dnd]: dataDnd, ...rest }: {
-    [x: string]: any;
-}) => React.JSX.Element;

package/lib/esm/components/table.js

@@ -1,12 +0,0 @@
-import { __rest } from "tslib";
-import { Table as AntTable } from 'antd';
-import React from 'react';
-import { SLOT } from '@music163/tango-helpers';
-export const Table = (_a) => {
-    var _b = SLOT.id, dataId = _a[_b], _c = SLOT.dnd, dataDnd = _a[_c], rest = __rest(_a, [typeof _b === "symbol" ? _b : _b + "", typeof _c === "symbol" ? _c : _c + ""]);
-    console.log("新的表格组件", dataId, dataDnd, rest);
-    const newProps = Object.assign(Object.assign({}, rest), { draggable: true });
-    console.log("新的表格组件01", newProps);
-    return (React.createElement("div", { "data-dnd": dataDnd, "data-id": dataId, draggable: true },
-        React.createElement(AntTable, Object.assign({}, rest))));
-};

package/lib/esm/components/timeline.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-export declare const Timeline: ({ ...props }: {
-    [x: string]: any;
-}) => React.JSX.Element;
-export declare const TimelineItem: ({ ...props }: {
-    [x: string]: any;
-}) => React.JSX.Element;

package/lib/esm/components/timeline.js

@@ -1,14 +0,0 @@
-import { __rest } from "tslib";
-import { Timeline as AntTimeline } from 'antd';
-import React from 'react';
-//import { SLOT } from '@music163/tango-helpers';  
-export const Timeline = (_a) => {
-    var props = __rest(_a, []);
-    console.log("新的时间轴组件01", props);
-    return React.createElement(AntTimeline, Object.assign({}, props));
-};
-export const TimelineItem = (_a) => {
-    var props = __rest(_a, []);
-    console.log("新的时间轴组件02", props);
-    return React.createElement(AntTimeline.Item, Object.assign({}, props));
-};