@cloudbase/weda-ui 3.2.0 → 3.3.0

package/dist/src/web/components/index.d.ts

@@ -0,0 +1,50 @@
+export { default as Button } from "./button";
+export const Text: any;
+export { default as Container } from "./container";
+export const Image: any;
+export { default as Slot } from "./slot";
+export { default as ScrollView } from "./scrollView";
+export { default as Swiper } from "./swiper";
+export { default as Carousel } from "./carousel";
+export { default as Modal } from "./modal";
+export const RichText: any;
+export { default as RichTextView } from "./richTextView";
+export { default as Link } from "./link";
+export { default as Drawer } from "./drawer";
+export { default as UploaderView } from "./uploaderView";
+export { default as UploaderFileView } from "./uploaderFileView";
+export const WedaVideo: any;
+export { default as Picker } from "./picker/picker";
+export { default as DatePicker } from "./picker/datePicker";
+export { default as TimePicker } from "./picker/timePicker";
+export { default as Form } from "./form/form";
+export { default as Input } from "./form/input";
+export { default as Textarea } from "./form/textarea";
+export { default as Checkbox } from "./form/checkbox";
+export { default as Radio } from "./form/radio";
+export { default as Switch } from "./form/switch";
+export { default as Select } from "./form/select";
+export { default as Uploader } from "./form/uploader";
+export { default as UploaderFile } from "./form/uploaderFile";
+export { default as Tips } from "./form/tips";
+export { default as Tabs } from "./tabs";
+export { default as Location } from "./form/location";
+export const EnumSelect: any;
+export const Calendar: any;
+export { default as NavLayout } from "./navLayout";
+export { default as ListView } from "./listView";
+export { default as NavigationBar } from "./navigationBar";
+export const Line: any;
+export const Bar: any;
+export const Pie: any;
+export { default as DataView } from "./dataView";
+export { default as StatisticsCard } from "./chart/statisticsCard";
+export { default as GraphicCard } from "./graphicCard";
+export { default as UserInfo } from "./userInfo";
+export { default as Phone } from "./phone";
+export { default as PhoneCode } from "./phoneCode";
+export { default as Share } from "./share";
+export { default as Lottery } from "./lottery";
+export { default as UserTreeSelect } from "./form/userOrgSelect/index";
+export { default as DepartTreeSelect } from "./form/userOrgSelect/departTreeSelect/index";
+export { default as FormDetail } from "./formdetail";

package/dist/src/web/components/index.js

@@ -0,0 +1,99 @@
+import '@tcwd/style-wedatheme/index.css';
+import loadable from '@loadable/component';
+import { fallback } from '../utils/loading-fallback';
+// export const Button = loadable(() => import('./button'), {fallback});
+// export const Container = loadable(() => import('./container'), {fallback});
+// export const Slot = loadable(() => import('./slot'), {fallback});
+// export const ScrollView = loadable(() => import('./scrollView'), {fallback});
+// export const Swiper = loadable(() => import('./swiper'), {fallback});
+// export const Modal = loadable(() => import('./modal'), {fallback});
+// export const RichText = loadable(() => import('./richText'), {fallback});
+// export const RichTextView = loadable(() => import('./richTextView'), {fallback});
+// export const Link = loadable(() => import('./link'), {fallback});
+// export const Drawer = loadable(() => import('./drawer'), {fallback});
+// export const UploaderView = loadable(() => import('./uploaderView'), {fallback});
+// // picker
+// export const Picker = loadable(() => import('./picker/picker'), {fallback});
+// export const DatePicker = loadable(() => import('./picker/datePicker'), {fallback});
+// export const TimePicker = loadable(() => import('./picker/timePicker'), {fallback});
+// // form
+// export const Form = loadable(() => import('./form/form'), {fallback});
+// export const Input = loadable(() => import('./form/input'), {fallback});
+// export const Textarea = loadable(() => import('./form/textarea'), {fallback});
+// export const Checkbox = loadable(() => import('./form/checkbox'), {fallback});
+// export const Radio = loadable(() => import('./form/radio'), {fallback});
+// export const Switch = loadable(() => import('./form/switch'), {fallback});
+// export const Uploader = loadable(() => import('./form/uploader'), {fallback});
+// export const Tips = loadable(() => import('./form/tips'), {fallback});
+// export const EnumSelect = loadable(() => import('./form/enumSelect'), {fallback});
+// export const Tabs = loadable(() => import('./tabs'), {fallback});
+export { default as Button } from './button';
+// export { default as Text } from './text';
+export const Text = loadable(() => import('./text'), { fallback });
+export { default as Container } from './container';
+// export { default as Image } from './image';
+export const Image = loadable(() => import('./image'), { fallback });
+export { default as Slot } from './slot';
+export { default as ScrollView } from './scrollView';
+export { default as Swiper } from './swiper';
+export { default as Carousel } from './carousel';
+export { default as Modal } from './modal';
+// export { default as RichText } from './richText';
+export const RichText = loadable(() => import('./richText'), { fallback });
+export { default as RichTextView } from './richTextView';
+export { default as Link } from './link';
+export { default as Drawer } from './drawer';
+export { default as UploaderView } from './uploaderView';
+export { default as UploaderFileView } from './uploaderFileView';
+// export { default as WedaVideo } from './wedaVideo/index';
+export const WedaVideo = loadable(() => import('./wedaVideo/index'), {
+    fallback,
+});
+export { default as Picker } from './picker/picker';
+export { default as DatePicker } from './picker/datePicker';
+export { default as TimePicker } from './picker/timePicker';
+// form
+export { default as Form } from './form/form';
+export { default as Input } from './form/input';
+export { default as Textarea } from './form/textarea';
+export { default as Checkbox } from './form/checkbox';
+export { default as Radio } from './form/radio';
+export { default as Switch } from './form/switch';
+export { default as Select } from './form/select';
+// export const Select = loadable(() => import('./form/select'), { fallback });
+export { default as Uploader } from './form/uploader';
+export { default as UploaderFile } from './form/uploaderFile';
+export { default as Tips } from './form/tips';
+export { default as Tabs } from './tabs';
+export { default as Location } from './form/location';
+// export { default as EnumSelect } from './form/enumSelect';
+export const EnumSelect = loadable(() => import('./form/enumSelect'), {
+    fallback,
+});
+// export { default as Calendar } from './calendar';
+export const Calendar = loadable(() => import('./calendar'), { fallback });
+export { default as NavLayout } from './navLayout';
+// Data Contaier
+export { default as ListView } from './listView';
+export { default as NavigationBar } from './navigationBar';
+// export { default as Line } from './chart/line';
+// export { default as Bar } from './chart/bar';
+// export { default as Pie } from './chart/pie';
+export const Line = loadable(() => import('./chart/line'), { fallback });
+export const Bar = loadable(() => import('./chart/bar/index'), {
+    fallback,
+});
+export const Pie = loadable(() => import('./chart/pie'), { fallback });
+export { default as DataView } from './dataView';
+export { default as StatisticsCard } from './chart/statisticsCard';
+export { default as GraphicCard } from './graphicCard';
+export { default as UserInfo } from './userInfo';
+export { default as Phone } from './phone';
+export { default as PhoneCode } from './phoneCode';
+export { default as Share } from './share';
+export { default as Lottery } from './lottery';
+export { default as UserTreeSelect } from './form/userOrgSelect/index';
+export { default as DepartTreeSelect } from './form/userOrgSelect/departTreeSelect/index';
+export { default as FormDetail } from './formdetail';
+import 'weui/dist/style/weui.css';
+import '../weda-ui.css';

package/dist/src/web/components/link/index.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { CommonPropsType } from '../../types';
+import './index.css';
+export interface PropsType extends CommonPropsType {
+    /**
+     * 内容
+     */
+    content?: string;
+    /**
+     * 链接地址
+     */
+    url?: string;
+    /**
+     * 参数
+     */
+    params?: Readonly<{
+        key: string;
+        value: string;
+    }[]>;
+    contentSlot?: React.ReactNode;
+    isOpenInNewWindow?: boolean;
+}
+export default function Link({ content, url, events, style, className, contentSlot, params, // TODO 格式定义,
+isOpenInNewWindow, }: PropsType): JSX.Element;

package/dist/src/web/components/link/index.js

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import classNames from '../../utils/classnames';
+import { emptyArray, emptyObject } from '../../utils/constant';
+import './index.css';
+// 所有绝对地址直接交由浏览器，新开窗口交由浏览器
+// 当前窗口相对地址交给平台
+export default function Link({ content, url = '', events = emptyObject, style, className, contentSlot, params = emptyArray, // TODO 格式定义,
+isOpenInNewWindow, }) {
+    url = url.trim();
+    const cls = classNames({
+        'weda-link': true,
+        'weda-ui': true,
+        [className]: className,
+    });
+    // URL 构造函数不支持 '//xxx.com' 的格式
+    if (url.indexOf('//') === 0) {
+        url = location.protocol + url;
+    }
+    // "proto:" 或 "//" 起头的是绝对路径
+    let isAbosolutePath = /^(?:[a-z]+:)/i.test(url);
+    let base, path, href, paramObj = {}, urlObj;
+    if (!isAbosolutePath) {
+        // 相对地址使用站位域名，不实际使用
+        base =
+            location.origin && location.origin !== 'null'
+                ? location.origin
+                : 'https://we.da';
+    }
+    try {
+        urlObj = new URL(url, base);
+        params.forEach((x) => {
+            urlObj.searchParams.append(x.key, x.value);
+        });
+        href = urlObj.href;
+        path = urlObj.pathname;
+        for (const [key, value] of urlObj.searchParams) {
+            paramObj[key] = value;
+        }
+        // 相对地址去掉站位域名
+        if (!isAbosolutePath) {
+            href = urlObj.pathname + urlObj.search + urlObj.hash;
+            href = href.replace(/^\//, '');
+        }
+    }
+    catch (e) {
+        // 非法 url
+        isAbosolutePath = true;
+        href = url;
+        path = '';
+        paramObj = params.reduce((p, x) => {
+            p[x.key] = x.value;
+            return p;
+        }, {});
+    }
+    return (React.createElement("a", { style: { ...style }, className: cls, target: isOpenInNewWindow ? '_blank' : '_self', href: href, onClick: (e) => {
+            events.tap && events.tap({}, { originEvent: e });
+            if (!e.defaultPrevented) {
+                if (!isAbosolutePath) {
+                    e.preventDefault();
+                    app.navigateTo({
+                        pageId: path,
+                        packageName: '',
+                        mode: 'weDa',
+                        params: paramObj,
+                    });
+                }
+            }
+        }, rel: "noopener noreferrer" },
+        contentSlot && React.createElement("div", { className: "weda-link-slot" }, contentSlot),
+        content));
+}

package/dist/src/web/components/listView/index.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { IListView } from './interface';
+import './index.css';
+/**
+ * 数据容器-列表视图
+ */
+export default function ListView(props: IListView): JSX.Element;

package/dist/src/web/components/listView/index.js

@@ -0,0 +1,297 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import React, { useState, useEffect, useRef, useCallback } from 'react';
+import { callDataSource } from '../../utils/tcb';
+import { isInIde, getWhereList } from '../../utils/platform';
+import classNames from '../../utils/classnames';
+import isequal from 'lodash.isequal';
+import './index.css';
+import { isNil } from '../../utils/lodash';
+const ORDERTYPE = ['asc', 'desc'];
+const BLOCK_NAME = 'weda-list-view';
+const getIdeMockData = (length = 3) => Array.from({ length }).map(() => Object.create(null));
+/**
+ * 数据容器-列表视图
+ */
+export default function ListView(props) {
+    var _a, _b, _c;
+    const { dataSourceType, bindConnectMetadata, connectorMethod, connectorParams, datasource, orderBy, orderType, where, template, pageSize = 5, pagination, events, className, children, isRecords = true, //是否展示回调recoreds字段
+    isSetStatus = false, //是否开启加载状态
+    appCloud = { callDataSource, isInIde }, beforeDataChange = (v) => v, ...rest } = props;
+    const isModel = dataSourceType !== 'custom-connector';
+    const methodName = isModel
+        ? ((_a = datasource === null || datasource === void 0 ? void 0 : datasource.extra) === null || _a === void 0 ? void 0 : _a.methodName) || 'wedaGetRecords'
+        : connectorMethod === null || connectorMethod === void 0 ? void 0 : connectorMethod.name; // 默认方法名
+    const dataSourceName = isModel
+        ? datasource === null || datasource === void 0 ? void 0 : datasource.name
+        : (_b = bindConnectMetadata === null || bindConnectMetadata === void 0 ? void 0 : bindConnectMetadata.datasource) === null || _b === void 0 ? void 0 : _b.name;
+    const [pageNo, setPageNo] = useState(1); // 分页状态
+    const [entry, setEntry] = useState(null); // 触底的observer对象
+    const [status, setStatus] = useState(''); // 查询状态
+    const paramRef = useRef({
+        dataSourceName,
+        methodName,
+        params: { orderBy, orderType, where, pageNo: 1, pageSize, connectorParams },
+        pagination,
+    }); // 最新请求参数
+    const dataRef = useRef({ total: 0, records: [] }); // 最新数据列表
+    const observeRef = useRef(null); // 当前监听对象
+    const isIdeMockData = !(dataSourceName && methodName) && ((_c = appCloud === null || appCloud === void 0 ? void 0 : appCloud.isInIde) === null || _c === void 0 ? void 0 : _c.call(appCloud)); // 在ide环境且未绑定数据源时，存在mock数据逻辑
+    const shouldBottomLoad = pagination === 'bottomLoad' &&
+        (entry === null || entry === void 0 ? void 0 : entry.isIntersecting) &&
+        ['', 'success'].includes(status); // 能否触底加载
+    // 组件卸载时触发
+    useEffect(() => {
+        return () => {
+            var _a, _b;
+            (_a = observeRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            (_b = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _b === void 0 ? void 0 : _b.call(events, { data: beforeDataChange([]) });
+        };
+    }, []);
+    // props 基本类型监听，需重新分页；处于 ide 且未绑定数据源时返回mock数据
+    useEffect(() => {
+        var _a, _b;
+        dataRef.current = { total: 0, records: [] };
+        if (!isIdeMockData) {
+            fetchData({
+                dataSourceName,
+                methodName,
+                params: {
+                    ...(_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params,
+                    orderBy,
+                    orderType,
+                    pageNo: 1,
+                    pageSize,
+                },
+                pagination,
+            });
+        }
+        else {
+            (_b = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _b === void 0 ? void 0 : _b.call(events, {
+                data: beforeDataChange(getIdeMockData(pageSize)),
+            });
+        }
+    }, [
+        methodName,
+        dataSourceName,
+        pageSize,
+        pagination,
+        orderBy,
+        orderType,
+        isModel,
+    ]);
+    // props 对象类型监听，需重新分页
+    useEffect(() => {
+        var _a, _b, _c, _d;
+        if (isModel) {
+            if (!isequal((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.where, where)) {
+                dataRef.current = { total: 0, records: [] };
+                fetchData({
+                    params: { pageNo: 1, where },
+                });
+            }
+        }
+        else {
+            if (!isequal((_d = (_c = paramRef.current) === null || _c === void 0 ? void 0 : _c.params) === null || _d === void 0 ? void 0 : _d.connectorParams, connectorParams)) {
+                dataRef.current = { total: 0, records: [] };
+                fetchData({
+                    params: { pageNo: 1, connectorParams },
+                });
+            }
+        }
+    });
+    // 监听触底加载事件
+    useEffect(() => {
+        var _a, _b;
+        if (shouldBottomLoad && hasNextPage()) {
+            fetchData({
+                params: { pageNo: (((_b = (_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) === null || _b === void 0 ? void 0 : _b.pageNo) || 1) + 1 },
+            });
+        }
+    }, [shouldBottomLoad]);
+    // 触底监控对象
+    const nodeRefCallback = useCallback((node) => {
+        var _a;
+        if (node) {
+            (_a = observeRef.current) === null || _a === void 0 ? void 0 : _a.disconnect();
+            observeRef.current = new IntersectionObserver((entries) => {
+                setEntry(entries === null || entries === void 0 ? void 0 : entries[0]);
+            });
+            observeRef.current.observe(node);
+        }
+    }, []);
+    // 能否点击下一页
+    const hasNextPage = () => {
+        var _a;
+        const { pageNo = 1, pageSize = 5 } = ((_a = paramRef.current) === null || _a === void 0 ? void 0 : _a.params) || {};
+        const { total = 0 } = dataRef.current || {};
+        return pageNo * pageSize < total;
+    };
+    /**
+     * 列表视图拉取数据
+     * 方法仅依赖入参和paramRef的参数
+     */
+    const fetchData = async (param) => {
+        var _a;
+        // 合并参数
+        const fetchParam = {
+            ...paramRef.current,
+            ...param,
+            params: { ...paramRef.current.params, ...param === null || param === void 0 ? void 0 : param.params },
+        };
+        const { dataSourceName, methodName, params } = fetchParam;
+        const { orderBy, orderType, pageNo, pageSize, where, connectorParams } = params || {};
+        if (status === 'loading' || !(dataSourceName && methodName))
+            return;
+        setStatus('loading');
+        let tcbParams = {};
+        // tcb分页参数
+        if (!isNil(pageNo) && !isNil(pageSize)) {
+            tcbParams['pageNo'] = pageNo;
+            tcbParams['pageSize'] = pageSize;
+        }
+        if (isModel) {
+            // tcb排序参数
+            if (orderBy && ORDERTYPE.includes(orderType)) {
+                tcbParams['orderBy'] = orderBy;
+                tcbParams['orderType'] = orderType;
+            }
+            // tcb过滤参数
+            const whereEffected = [].concat(getWhereList(where));
+            whereEffected.length > 0 && (tcbParams['where'] = whereEffected);
+        }
+        else {
+            tcbParams = Object.assign({}, tcbParams, connectorParams);
+        }
+        // tcb结果和事件
+        let data = [];
+        const eventDatasource = isModel
+            ? datasource
+            : { ...bindConnectMetadata, ...connectorMethod };
+        try {
+            data = await (appCloud === null || appCloud === void 0 ? void 0 : appCloud.callDataSource({
+                dataSourceName,
+                methodName,
+                params: tcbParams,
+            }, true));
+            paramRef.current = fetchParam;
+            onEnvets(data, eventDatasource);
+        }
+        catch (e) {
+            setStatus(isModel ? 'fail' : '');
+            (_a = events === null || events === void 0 ? void 0 : events.queryFail) === null || _a === void 0 ? void 0 : _a.call(events, { datasource: eventDatasource, data: null });
+        }
+    };
+    /**
+     * 根据fetchData方法返回值，回调给外部事件
+     */
+    const onEnvets = (data, datasource) => {
+        var _a, _b, _c, _d, _e;
+        const bottomLoadTimer = 150;
+        const fetchRecords = [].concat(!isRecords && !isModel ? data : (data === null || data === void 0 ? void 0 : data.records) || []);
+        const total = (_a = data === null || data === void 0 ? void 0 : data.total) !== null && _a !== void 0 ? _a : fetchRecords.length;
+        if (['loadMoreButton', 'bottomLoad'].includes(paramRef.current.pagination)) {
+            dataRef.current = {
+                total,
+                records: [...dataRef.current.records, ...fetchRecords],
+            };
+        }
+        else {
+            dataRef.current = { total, records: fetchRecords };
+        }
+        (_b = events === null || events === void 0 ? void 0 : events.onDataChange) === null || _b === void 0 ? void 0 : _b.call(events, {
+            data: beforeDataChange(dataRef.current.records || []),
+        });
+        if (total === 0) {
+            setStatus(isModel ? 'empty' : '');
+            (_c = events === null || events === void 0 ? void 0 : events.queryEmpty) === null || _c === void 0 ? void 0 : _c.call(events, {
+                datasource,
+                data: beforeDataChange([]),
+            });
+        }
+        else {
+            const statusCb = () => setStatus('success');
+            pagination === 'bottomLoad'
+                ? window.setTimeout(statusCb, bottomLoadTimer)
+                : statusCb();
+        }
+        const successCb = () => {
+            var _a;
+            (_a = events === null || events === void 0 ? void 0 : events.querySuccess) === null || _a === void 0 ? void 0 : _a.call(events, {
+                datasource,
+                data: beforeDataChange(dataRef.current.records),
+            });
+        };
+        pagination === 'bottomLoad'
+            ? window.setTimeout(successCb, bottomLoadTimer + 50)
+            : successCb();
+        setPageNo(((_e = (_d = paramRef.current) === null || _d === void 0 ? void 0 : _d.params) === null || _e === void 0 ? void 0 : _e.pageNo) || 1);
+    };
+    /**
+     * 分页，加载更多
+     */
+    const renderLoadMore = () => {
+        let disabled = !hasNextPage();
+        if (isIdeMockData) {
+            disabled = false;
+        }
+        if (status === 'loading')
+            return LoadingSymbol;
+        return (!disabled && (React.createElement("div", { className: `${BLOCK_NAME}__more-text`, onClick: () => fetchData({ params: { pageNo: pageNo + 1 } }) }, "\u52A0\u8F7D\u66F4\u591A")));
+    };
+    /**
+     * 分页，底部刷新
+     */
+    const renderBottomLoad = () => {
+        return (React.createElement("div", { ref: nodeRefCallback, className: `${BLOCK_NAME}__bottom-load` }, status === 'loading' ? LoadingSymbol : !hasNextPage() && LoadEnd));
+    };
+    /**
+     * 分页，分页器，含ideMockData的判断
+     */
+    const renderPagination = () => {
+        var _a, _b;
+        const preDisabeld = pageNo <= 1;
+        const nextDisabeld = !hasNextPage();
+        const total = (_b = (_a = dataRef.current) === null || _a === void 0 ? void 0 : _a.total) !== null && _b !== void 0 ? _b : 0;
+        return (React.createElement("div", { className: `${BLOCK_NAME}__more-pagination` },
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-pre`, preDisabeld ? '' : 'active'), onClick: () => !preDisabeld && fetchData({ params: { pageNo: pageNo - 1 } }) }, "\u4E0A\u4E00\u9875"),
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-text`) },
+                React.createElement("span", { className: "active" }, isIdeMockData ? 1 : total ? pageNo : 0),
+                "/",
+                isIdeMockData ? 1 : Math.ceil(total / pageSize)),
+            React.createElement("div", { className: classNames(`${BLOCK_NAME}__pagination-next`, nextDisabeld ? '' : 'active'), onClick: () => !nextDisabeld && fetchData({ params: { pageNo: pageNo + 1 } }) }, "\u4E0B\u4E00\u9875")));
+    };
+    /**
+     * 查询状态展示
+     */
+    const renderStatus = () => {
+        switch (status) {
+            case 'empty':
+                return React.createElement("div", { className: `${BLOCK_NAME}__empty` }, "\u6682\u65E0\u6570\u636E");
+            case 'fail':
+                return React.createElement("div", { className: `${BLOCK_NAME}__fail` }, "\u52A0\u8F7D\u5931\u8D25");
+            case 'loading':
+                return (pagination === 'pagination' && (React.createElement("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__content-loading`) }, LoadingSymbol)));
+        }
+    };
+    /**
+     * 加载中状态组件
+     */
+    const LoadingSymbol = (React.createElement("div", { className: `${BLOCK_NAME}__more-symbol` },
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` }),
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` }),
+        React.createElement("div", { className: `${BLOCK_NAME}__symbol-item` })));
+    /**
+     * 加载到底状态组件
+     */
+    const LoadEnd = React.createElement("div", null);
+    return (React.createElement("div", { ...rest, className: classNames('weda-ui', `${BLOCK_NAME}__containor`, className) },
+        children && (React.createElement("div", { className: classNames(template === 'cardList' ? `${BLOCK_NAME}-card` : '', `${BLOCK_NAME}__content`, ['empty', 'fail'].includes(status) && isSetStatus
+                ? `${BLOCK_NAME}__content-blank`
+                : '') },
+            children,
+            isSetStatus && renderStatus())),
+        React.createElement("div", { className: classNames(`${BLOCK_NAME}__more`, `${BLOCK_NAME}__more-${pagination}`) },
+            pagination === 'bottomLoad' && renderBottomLoad(),
+            pagination === 'loadMoreButton' && renderLoadMore(),
+            pagination === 'pagination' && renderPagination())));
+}