@cuvp1225/antd 0.1.3 → 0.1.4

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

@@ -1 +1,2 @@
-export { Row, Col, Timeline, Table } from 'antd';
+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,8 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Table = exports.Timeline = exports.Col = exports.Row = void 0;
+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; } });
 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 +1,2 @@
-export { Row, Col, Timeline, Table } from 'antd';
+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 +1,2 @@
-export { Row, Col, Timeline, Table } from 'antd';
+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.3",
+  "version": "0.1.4",
   "description": "antd components for tango app",
   "author": "wwsun <ww.sww@outlook.com>",
   "homepage": "https://github.com/netease/tango-components#readme",