amis 2.0.0-rc.10 → 2.0.0-rc.16

package/esm/renderers/Card2.d.ts

@@ -0,0 +1,77 @@
+import React from 'react';
+import { RendererProps } from 'amis-core';
+import { BaseSchema, SchemaClassName, SchemaCollection } from '../Schema';
+/**
+ * Card2 新卡片渲染器。
+ * 文档：https://baidu.gitee.io/amis/docs/components/card2
+ */
+export interface Card2Schema extends BaseSchema {
+    /**
+     * 指定为 card2 类型
+     */
+    type: 'card2';
+    /**
+     * 内容
+     */
+    body: SchemaCollection;
+    /**
+     * body 类名
+     */
+    bodyClassName?: SchemaClassName;
+    /**
+     * 自定义样式
+     */
+    style?: {
+        [propName: string]: any;
+    };
+    /**
+     * 隐藏选框
+     */
+    hideCheckToggler?: boolean;
+    /**
+     * 不配置href且cards容器下生效，点击整个卡片触发选中
+     */
+    checkOnItemClick: boolean;
+    /**
+     * 渲染标签
+     */
+    wrapperComponent?: string;
+}
+export interface Card2Props extends RendererProps, Omit<Card2Schema, 'type' | 'className'> {
+    /**
+     * 选择事件
+     */
+    onCheck: () => void;
+    /**
+     * 数据
+     */
+    item: any;
+    /**
+     * 是否可选，当disabled时，将禁用
+     */
+    selectable?: boolean;
+    /**
+     * 是否可多选
+     */
+    multiple?: boolean;
+    /**
+     * 是否默认选中
+     */
+    selected?: boolean;
+}
+export default class Card2<T> extends React.Component<Card2Props & T, object> {
+    static propsList: Array<string>;
+    static defaultProps: {
+        className: string;
+    };
+    handleClick(e: React.MouseEvent<HTMLDivElement>): void;
+    handleCheck(): void;
+    renderCheckbox(): JSX.Element | null;
+    /**
+     * 渲染内容区
+     */
+    renderBody(): JSX.Element | null;
+    render(): JSX.Element;
+}
+export declare class Card2Renderer extends Card2<{}> {
+}

package/esm/renderers/Card2.js

@@ -0,0 +1,83 @@
+/**
+ * amis v2.0.0-rc.16
+ * Copyright 2018-2022 baidu
+ */
+
+import { __extends, __rest, __decorate, __metadata } from 'tslib';
+import React from 'react';
+import { Checkbox } from 'amis-ui';
+import { buildStyle, autobind, Renderer } from 'amis-core';
+
+var Card2 = /** @class */ (function (_super) {
+    __extends(Card2, _super);
+    function Card2() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Card2.prototype.handleClick = function (e) {
+        var _a = this.props, checkOnItemClick = _a.checkOnItemClick, selectable = _a.selectable;
+        // 控制选中
+        if (checkOnItemClick && selectable) {
+            this.handleCheck();
+        }
+        // TODO 触发事件动作
+    };
+    Card2.prototype.handleCheck = function () {
+        var _a, _b;
+        (_b = (_a = this.props).onCheck) === null || _b === void 0 ? void 0 : _b.call(_a);
+    };
+    Card2.prototype.renderCheckbox = function () {
+        var _a = this.props, selectable = _a.selectable, cx = _a.classnames, multiple = _a.multiple, disabled = _a.disabled, selected = _a.selected, hideCheckToggler = _a.hideCheckToggler, checkOnItemClick = _a.checkOnItemClick, checkboxClassname = _a.checkboxClassname;
+        if (!selectable || (checkOnItemClick && hideCheckToggler)) {
+            return null;
+        }
+        return (React.createElement(Checkbox, { className: cx('Card2-checkbox', checkboxClassname), type: multiple ? 'checkbox' : 'radio', disabled: disabled, checked: selected, onChange: this.handleCheck }));
+    };
+    /**
+     * 渲染内容区
+     */
+    Card2.prototype.renderBody = function () {
+        var _a = this.props, body = _a.body, render = _a.render, cx = _a.classnames, bodyClassName = _a.bodyClassName, rest = __rest(_a, ["body", "render", "classnames", "bodyClassName"]);
+        return (React.createElement("div", { className: cx('Card2-body', bodyClassName), onClick: this.handleClick }, body ? render('body', body, rest) : null));
+    };
+    Card2.prototype.render = function () {
+        var _a = this.props, className = _a.className, wrapperComponent = _a.wrapperComponent, cx = _a.classnames, style = _a.style, item = _a.item, selected = _a.selected, checkOnItemClick = _a.checkOnItemClick;
+        var Component = wrapperComponent || 'div';
+        return (React.createElement(Component, { className: cx('Card2', className, {
+                'checkOnItem': checkOnItemClick,
+                'is-checked': selected
+            }), style: buildStyle(style, item) },
+            this.renderBody(),
+            this.renderCheckbox()));
+    };
+    Card2.propsList = ['body', 'className'];
+    Card2.defaultProps = {
+        className: ''
+    };
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", void 0)
+    ], Card2.prototype, "handleClick", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", void 0)
+    ], Card2.prototype, "handleCheck", null);
+    return Card2;
+}(React.Component));
+/** @class */ ((function (_super) {
+    __extends(Card2Renderer, _super);
+    function Card2Renderer() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    Card2Renderer = __decorate([
+        Renderer({
+            type: 'card2'
+        })
+    ], Card2Renderer);
+    return Card2Renderer;
+})(Card2));
+
+export { Card2 as default };

package/esm/renderers/Cards.d.ts

@@ -0,0 +1,170 @@
+import React from 'react';
+import { RendererProps } from 'amis-core';
+import { SchemaNode, ActionObject } from 'amis-core';
+import { IListStore } from 'amis-core';
+import { Action } from '../types';
+import Sortable from 'sortablejs';
+import { BaseSchema, SchemaClassName, SchemaCollection, SchemaExpression, SchemaTpl, SchemaTokenizeableString } from '../Schema';
+import { CardSchema } from './Card';
+import { Card2Schema } from './Card2';
+import type { IItem } from 'amis-core/lib/store/list';
+/**
+ * Cards 卡片集合渲染器。
+ * 文档：https://baidu.gitee.io/amis/docs/components/card
+ */
+export interface CardsSchema extends BaseSchema {
+    /**
+     * 指定为 cards 类型
+     */
+    type: 'cards';
+    card?: Partial<CardSchema> | Card2Schema;
+    /**
+     * 头部 CSS 类名
+     */
+    headerClassName?: SchemaClassName;
+    /**
+     * 底部 CSS 类名
+     */
+    footerClassName?: SchemaClassName;
+    /**
+     * 卡片 CSS 类名
+     *
+     * @default Grid-col--sm6 Grid-col--md4 Grid-col--lg3
+     */
+    itemClassName?: SchemaClassName;
+    /**
+     * 无数据提示
+     *
+     * @default 暂无数据
+     */
+    placeholder?: SchemaTpl;
+    /**
+     * 是否显示底部
+     */
+    showFooter?: boolean;
+    /**
+     * 是否显示头部
+     */
+    showHeader?: boolean;
+    /**
+     * 数据源: 绑定当前环境变量
+     *
+     * @default ${items}
+     */
+    source?: SchemaTokenizeableString;
+    /**
+     * 标题
+     */
+    title?: SchemaTpl;
+    /**
+     * 是否隐藏勾选框
+     */
+    hideCheckToggler?: boolean;
+    /**
+     * 是否固顶
+     */
+    affixHeader?: boolean;
+    /**
+     * 顶部区域
+     */
+    header?: SchemaCollection;
+    /**
+     * 底部区域
+     */
+    footer?: SchemaCollection;
+    /**
+     * 配置某项是否可以点选
+     */
+    itemCheckableOn?: SchemaExpression;
+    /**
+     * 配置某项是否可拖拽排序，前提是要开启拖拽功能
+     */
+    itemDraggableOn?: SchemaExpression;
+    /**
+     * 点击卡片的时候是否勾选卡片。
+     */
+    checkOnItemClick?: boolean;
+    /**
+     * 是否为瀑布流布局？
+     */
+    masonryLayout?: boolean;
+    /**
+     * 可以用来作为值的字段
+     */
+    valueField?: string;
+}
+export interface Column {
+    type: string;
+    [propName: string]: any;
+}
+export declare type CardsRendererEvent = 'change';
+export declare type CardsRendererAction = 'check-all';
+export interface GridProps extends RendererProps, Omit<CardsSchema, 'className' | 'itemClassName'> {
+    store: IListStore;
+    selectable?: boolean;
+    selected?: Array<any>;
+    checkAll?: boolean;
+    multiple?: boolean;
+    valueField?: string;
+    draggable?: boolean;
+    onSelect: (selectedItems: Array<object>, unSelectedItems: Array<object>) => void;
+    onSave?: (items: Array<object> | object, diff: Array<object> | object, rowIndexes: Array<number> | number, unModifiedItems?: Array<object>, rowOrigins?: Array<object> | object, resetOnFailed?: boolean) => void;
+    onSaveOrder?: (moved: Array<object>, items: Array<object>) => void;
+    onQuery: (values: object) => void;
+}
+export default class Cards extends React.Component<GridProps, object> {
+    static propsList: Array<string>;
+    static defaultProps: Partial<GridProps>;
+    dragTip?: HTMLElement;
+    sortable?: Sortable;
+    parentNode?: any;
+    body?: any;
+    unSensor: Function;
+    renderedToolbars: Array<string>;
+    constructor(props: GridProps);
+    static syncItems(store: IListStore, props: GridProps, prevProps?: GridProps): boolean;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: GridProps): void;
+    componentWillUnmount(): void;
+    bodyRef(ref: HTMLDivElement): void;
+    itemsRef(ref: HTMLDivElement): void;
+    affixDetect(): void;
+    doAction(action: Action, data: object, throwErrors?: boolean): void;
+    handleAction(e: React.UIEvent<any>, action: ActionObject, ctx: object): void;
+    handleCheck(item: IItem): void;
+    handleCheckAll(): void;
+    handleSelectAll(): void;
+    handleClearAll(): void;
+    syncSelected(): void;
+    handleQuickChange(item: IItem, values: object, saveImmediately?: boolean | any, saveSilent?: boolean, resetOnFailed?: boolean): void;
+    handleSave(): void;
+    handleSaveOrder(): void;
+    reset(): void;
+    bulkUpdate(value: object, items: Array<object>): void;
+    getSelected(): any[];
+    dragTipRef(ref: any): void;
+    initDragging(): void;
+    destroyDragging(): void;
+    renderActions(region: string): JSX.Element | null;
+    renderHeading(): JSX.Element | null;
+    renderHeader(): JSX.Element | JSX.Element[] | null;
+    renderFooter(): JSX.Element | JSX.Element[] | null;
+    renderCheckAll(): JSX.Element | null;
+    renderDragToggler(): JSX.Element | null;
+    renderToolbar(toolbar: SchemaNode, index: number): JSX.Element | null | undefined;
+    renderCard(index: number, card: any, item: IItem, itemClassName: string): JSX.Element;
+    render(): JSX.Element;
+}
+export declare class CardsRenderer extends Cards {
+    dragging: boolean;
+    selectable: boolean;
+    selected: boolean;
+    onSelect: boolean;
+    title?: string;
+    subTitle?: string;
+    desc?: string;
+    avatar?: string;
+    avatarClassName?: string;
+    body?: SchemaNode;
+    actions?: Array<ActionObject>;
+}