amis-rev-ui 6.13.0

package/esm/components/GridNav.d.ts

@@ -0,0 +1,53 @@
+/**
+ * @file GridNav
+ * @description 金刚位宫格导航 参考react-vant
+ */
+import React from 'react';
+import { ClassName, ClassNamesFn } from 'amis-rev-core';
+import { BadgeProps } from './Badge';
+export type GridNavDirection = 'horizontal' | 'vertical';
+export interface GridNavProps {
+    /** 是否将格子固定为正方形	 */
+    square?: boolean;
+    /** 是否将格子内容居中显示	 */
+    center?: boolean;
+    /** 是否显示边框	 */
+    border?: boolean;
+    /** 格子之间的间距，默认单位为`px` */
+    gutter?: number;
+    /** 是否调换图标和文本的位置	 */
+    reverse?: boolean;
+    /** 图标占比，默认单位为`%` */
+    iconRatio?: number;
+    /** 格子内容排列的方向，可选值为 `horizontal`	 */
+    direction?: GridNavDirection;
+    /** 列数	 */
+    columnNum?: number;
+    className?: string;
+    itemClassName?: ClassName;
+    classnames: ClassNamesFn;
+    style?: React.CSSProperties;
+    children?: React.ReactNode | Array<React.ReactNode>;
+}
+export interface GridNavItemProps {
+    /**  图标右上角徽标	 */
+    badge?: BadgeProps;
+    /** 文字 */
+    text?: string | React.ReactNode;
+    /** 图标名称或图片链接	 */
+    icon?: string | React.ReactNode;
+    className?: ClassName;
+    style?: React.CSSProperties;
+    contentClassName?: ClassName;
+    contentStyle?: React.CSSProperties;
+    children?: React.ReactNode;
+    classnames: ClassNamesFn;
+    onClick?: (event: React.MouseEvent) => void;
+}
+type InternalProps = {
+    parent?: GridNavProps;
+    index?: number;
+};
+export declare const GridNavItem: React.FC<GridNavItemProps & InternalProps>;
+declare const GridNav: React.FC<GridNavProps>;
+export default GridNav;

package/esm/components/GridNav.js

@@ -0,0 +1,125 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+import { __rest, __assign } from 'tslib';
+import React__default, { useMemo } from 'react';
+import { Badge } from './Badge.js';
+
+/**
+ * @file GridNav
+ * @description 金刚位宫格导航 参考react-vant
+ */
+function addUnit(value) {
+    if (value === undefined || value === null) {
+        return undefined;
+    }
+    value = String(value);
+    return /^\d+(\.\d+)?$/.test(value) ? "".concat(value, "px") : value;
+}
+var GridNavItem = function (_a) {
+    var _b;
+    var children = _a.children, cx = _a.classnames, className = _a.className, style = _a.style, props = __rest(_a, ["children", "classnames", "className", "style"]);
+    var _c = props.index, index = _c === void 0 ? 0 : _c, parent = props.parent;
+    if (!parent) {
+        if (process.env.NODE_ENV !== 'production') {
+            // eslint-disable-next-line no-console
+            console.error('[React Vant] <GridNavItem> must be a child component of <GridNav>.');
+        }
+        return null;
+    }
+    var rootStyle = useMemo(function () {
+        var square = parent.square, gutter = parent.gutter, _a = parent.columnNum, columnNum = _a === void 0 ? 4 : _a;
+        var percent = "".concat(100 / +columnNum, "%");
+        var internalStyle = __assign(__assign({}, style), { flexBasis: percent });
+        if (square) {
+            internalStyle.paddingTop = percent;
+        }
+        else if (gutter) {
+            var gutterValue = addUnit(gutter);
+            internalStyle.paddingRight = gutterValue;
+            if (index >= columnNum) {
+                internalStyle.marginTop = gutterValue;
+            }
+        }
+        return internalStyle;
+    }, [parent.style, parent.gutter, parent.columnNum]);
+    var contentStyle = useMemo(function () {
+        var square = parent.square, gutter = parent.gutter;
+        if (square && gutter) {
+            var gutterValue = addUnit(gutter);
+            return __assign(__assign({}, props.contentStyle), { right: gutterValue, bottom: gutterValue, height: 'auto' });
+        }
+        return props.contentStyle;
+    }, [parent.gutter, parent.columnNum, props.contentStyle]);
+    var renderIcon = function () {
+        var ratio = parent.iconRatio || 60;
+        if (typeof props.icon === 'string') {
+            if (props.badge) {
+                return (React__default.createElement(Badge, __assign({}, props.badge),
+                    React__default.createElement("div", { className: cx('GridNavItem-image') },
+                        React__default.createElement("img", { src: props.icon, style: { width: ratio + '%' } }))));
+            }
+            return (React__default.createElement("div", { className: cx('GridNavItem-image') },
+                React__default.createElement("img", { src: props.icon, style: { width: ratio + '%' } })));
+        }
+        if (React__default.isValidElement(props.icon)) {
+            return React__default.createElement(Badge, __assign({}, props.badge), props.icon);
+        }
+        return null;
+    };
+    var renderText = function () {
+        if (React__default.isValidElement(props.text)) {
+            return props.text;
+        }
+        if (props.text) {
+            return React__default.createElement("span", { className: cx('GridNavItem-text') }, props.text);
+        }
+        return null;
+    };
+    var renderContent = function () {
+        if (children) {
+            return children;
+        }
+        return (React__default.createElement(React__default.Fragment, null,
+            renderIcon(),
+            renderText()));
+    };
+    var center = parent.center, border = parent.border, square = parent.square, gutter = parent.gutter, reverse = parent.reverse, direction = parent.direction;
+    var prefix = 'GridNavItem-content';
+    var classes = cx("".concat(prefix, " ").concat(props.contentClassName || ''), (_b = {},
+        _b["".concat(prefix, "--").concat(direction)] = !!direction,
+        _b["".concat(prefix, "--center")] = center,
+        _b["".concat(prefix, "--square")] = square,
+        _b["".concat(prefix, "--reverse")] = reverse,
+        _b["".concat(prefix, "--clickable")] = !!props.onClick,
+        _b["".concat(prefix, "--surround")] = border && gutter,
+        _b["".concat(prefix, "--border u-hairline")] = border,
+        _b));
+    return (React__default.createElement("div", { className: cx(className, { 'GridNavItem--square': square }), style: rootStyle },
+        React__default.createElement("div", { role: props.onClick ? 'button' : undefined, className: classes, style: contentStyle, onClick: props.onClick }, renderContent())));
+};
+var GridNav = function (_a) {
+    var children = _a.children, className = _a.className, cx = _a.classnames, itemClassName = _a.itemClassName, style = _a.style, props = __rest(_a, ["children", "className", "classnames", "itemClassName", "style"]);
+    return (React__default.createElement("div", { style: __assign({ paddingLeft: addUnit(props.gutter) }, style), className: cx("GridNav ".concat(className || ''), {
+            'GridNav-top u-hairline': props.border && !props.gutter
+        }) }, React__default.Children.toArray(children)
+        .filter(Boolean)
+        .map(function (child, index) {
+        return React__default.cloneElement(child, {
+            index: index,
+            parent: props,
+            className: itemClassName,
+            classnames: cx
+        });
+    })));
+};
+GridNav.defaultProps = {
+    direction: 'vertical',
+    center: true,
+    border: true,
+    columnNum: 4
+};
+
+export { GridNavItem, GridNav as default };

package/esm/components/GridNavItem.d.ts

@@ -0,0 +1,2 @@
+import { GridNavItem } from './GridNav';
+export default GridNavItem;

package/esm/components/GridNavItem.js

@@ -0,0 +1,7 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+import { GridNavItem } from './GridNav.js';
+export { GridNavItem as default } from './GridNav.js';

package/esm/components/GroupedSelection.js

@@ -0,0 +1,138 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+import { __extends, __assign } from 'tslib';
+import React__default from 'react';
+import { flattenTree, themeable, localeable, uncontrollable } from 'amis-rev-core';
+import { BaseSelection } from './Selection.js';
+import Checkbox from './Checkbox.js';
+import VirtualList from './virtual-list/index.js';
+import AutoSizer from './virtual-list/AutoSizer.js';
+
+var GroupedSelection = /** @class */ (function (_super) {
+    __extends(GroupedSelection, _super);
+    function GroupedSelection() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    GroupedSelection.prototype.renderOption = function (option, index, key, styles, testIdBuilder) {
+        var _this = this;
+        if (key === void 0) { key = "".concat(index); }
+        if (styles === void 0) { styles = {}; }
+        var _a = this.props, disabled = _a.disabled, cx = _a.classnames, itemRender = _a.itemRender, multiple = _a.multiple, _b = _a.labelField, labelField = _b === void 0 ? 'label' : _b;
+        var tBuilder = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild(index);
+        if (Array.isArray(option.children)) {
+            if (!option[labelField]) {
+                return (React__default.createElement(React__default.Fragment, null, option.children.map(function (child, index) {
+                    return _this.renderOption(child, index, "".concat(index), {}, tBuilder);
+                })));
+            }
+            return (React__default.createElement("div", { key: index, className: cx('GroupedSelection-group', option.className) },
+                React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
+                    index: index,
+                    multiple: multiple,
+                    checked: false,
+                    onChange: function () { return undefined; },
+                    disabled: disabled || option.disabled,
+                    labelField: labelField,
+                    classnames: cx,
+                    testIdBuilder: tBuilder === null || tBuilder === void 0 ? void 0 : tBuilder.getChild('label')
+                })),
+                React__default.createElement("div", { className: cx('GroupedSelection-items', option.className) }, option.children.map(function (child, index) {
+                    return _this.renderOption(child, index, "".concat(index), {}, tBuilder);
+                }))));
+        }
+        return this.renderPureOption(option, index, key, styles, tBuilder);
+    };
+    GroupedSelection.prototype.renderOptionOrLabel = function (option, index, hasParent, styles) {
+        if (hasParent === void 0) { hasParent = false; }
+        if (styles === void 0) { styles = {}; }
+        var _a = this.props, disabled = _a.disabled, cx = _a.classnames, itemRender = _a.itemRender, multiple = _a.multiple, labelField = _a.labelField;
+        if (option.children) {
+            return (React__default.createElement("div", { key: index, style: styles, className: cx('GroupedSelection-group', option.className) },
+                React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
+                    index: index,
+                    multiple: multiple,
+                    checked: false,
+                    onChange: function () { return undefined; },
+                    disabled: disabled || option.disabled,
+                    labelField: labelField,
+                    classnames: cx
+                }))));
+        }
+        return hasParent ? (React__default.createElement("div", { key: 'group' + index, style: styles, className: cx('GroupedSelection-group', option.className) },
+            React__default.createElement("div", { className: cx('GroupedSelection-items', option.className) }, this.renderPureOption(option, index)))) : (this.renderPureOption(option, index, undefined, styles));
+    };
+    GroupedSelection.prototype.renderPureOption = function (option, index, key, styles, testIdBuilder) {
+        var _this = this;
+        if (styles === void 0) { styles = {}; }
+        var _a = this.props, labelClassName = _a.labelClassName, disabled = _a.disabled, cx = _a.classnames, itemClassName = _a.itemClassName, itemRender = _a.itemRender, multiple = _a.multiple, labelField = _a.labelField;
+        var valueArray = this.valueArray;
+        var itemTIB = testIdBuilder === null || testIdBuilder === void 0 ? void 0 : testIdBuilder.getChild("item-".concat(index));
+        return (React__default.createElement("div", __assign({ key: index, style: styles, className: cx('GroupedSelection-item', itemClassName, option.className, disabled || option.disabled ? 'is-disabled' : '', !!~valueArray.indexOf(option) ? 'is-active' : ''), onClick: function () { return _this.toggleOption(option); } }, itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getTestId()),
+            multiple ? (React__default.createElement(Checkbox, { size: "sm", checked: !!~valueArray.indexOf(option), disabled: disabled || option.disabled, labelClassName: labelClassName, description: option.description, testIdBuilder: itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getChild('checkbox') })) : null,
+            React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, itemRender(option, {
+                index: index,
+                multiple: multiple,
+                checked: !!~valueArray.indexOf(option),
+                onChange: function () { return _this.toggleOption(option); },
+                disabled: disabled || option.disabled,
+                labelField: labelField,
+                classnames: cx,
+                testIdBuilder: itemTIB === null || itemTIB === void 0 ? void 0 : itemTIB.getChild('label')
+            }))));
+    };
+    GroupedSelection.prototype.renderCheckAll = function () {
+        var _a = this.props, multiple = _a.multiple, checkAll = _a.checkAll, checkAllLabel = _a.checkAllLabel, cx = _a.classnames, __ = _a.translate, labelClassName = _a.labelClassName, itemClassName = _a.itemClassName;
+        if (!multiple || !checkAll) {
+            return null;
+        }
+        var availableOptions = this.getAvailableOptions();
+        var valueArray = this.valueArray;
+        var checkedAll = availableOptions.every(function (option) { return valueArray.indexOf(option) > -1; });
+        var checkedPartial = availableOptions.some(function (option) { return valueArray.indexOf(option) > -1; });
+        return (React__default.createElement("div", { className: cx('GroupedSelection-item', itemClassName), onClick: this.toggleAll },
+            React__default.createElement(Checkbox, { checked: checkedPartial, partial: checkedPartial && !checkedAll, size: "sm", labelClassName: labelClassName }),
+            React__default.createElement("div", { className: cx('GroupedSelection-itemLabel') }, __(checkAllLabel))));
+    };
+    GroupedSelection.prototype.render = function () {
+        var _this = this;
+        var _a;
+        var _b = this.props, value = _b.value, options = _b.options, className = _b.className, placeholder = _b.placeholder, cx = _b.classnames, option2value = _b.option2value, onClick = _b.onClick, placeholderRender = _b.placeholderRender, _c = _b.virtualThreshold, virtualThreshold = _c === void 0 ? 1000 : _c, _d = _b.itemHeight, itemHeight = _d === void 0 ? 32 : _d, virtualListHeight = _b.virtualListHeight, testIdBuilder = _b.testIdBuilder;
+        var __ = this.props.translate;
+        this.valueArray = BaseSelection.value2array(value, options, option2value);
+        var body = null;
+        if (Array.isArray(options) && options.length) {
+            var flattendOptions_1 = flattenTree(options, function (item, index, level) {
+                return {
+                    option: item,
+                    hasParent: level > 1
+                };
+            });
+            body =
+                flattendOptions_1.length > virtualThreshold ? (React__default.createElement(AutoSizer, { minHeight: virtualListHeight }, function (_a) {
+                    var height = _a.height;
+                    return (React__default.createElement(VirtualList, { height: height, itemCount: flattendOptions_1.length, itemSize: itemHeight, prefix: _this.renderCheckAll(), renderItem: function (_a) {
+                            var index = _a.index, style = _a.style;
+                            var _b = flattendOptions_1[index] || {}, option = _b.option, hasParent = _b.hasParent;
+                            if (!option) {
+                                return null;
+                            }
+                            return _this.renderOptionOrLabel(option, index, hasParent, __assign(__assign({}, style), { width: '100%' }));
+                        } }));
+                })) : (React__default.createElement(React__default.Fragment, null,
+                    this.renderCheckAll(),
+                    options.map(function (option, key) {
+                        return _this.renderOption(option, key, "".concat(key), {}, testIdBuilder);
+                    })));
+        }
+        return (React__default.createElement("div", { className: cx('GroupedSelection', className), onClick: onClick }, body ? (body) : (React__default.createElement("div", { className: cx('GroupedSelection-placeholder') }, (_a = placeholderRender === null || placeholderRender === void 0 ? void 0 : placeholderRender(this.props)) !== null && _a !== void 0 ? _a : __(placeholder)))));
+    };
+    return GroupedSelection;
+}(BaseSelection));
+var GroupedSelection$1 = themeable(localeable(uncontrollable(GroupedSelection, {
+    value: 'onChange'
+})));
+
+export { GroupedSelection, GroupedSelection$1 as default };

package/esm/components/HeadCellDropDown.d.ts

@@ -0,0 +1,2 @@
+import HeadCellDropDown from './table/HeadCellDropDown';
+export default HeadCellDropDown;

package/esm/components/HeadCellDropDown.js

@@ -0,0 +1,7 @@
+/**
+ * amis-rev-ui v6.13.0
+ * Copyright 2018-2026 fex
+ */
+
+import HeadCellDropDown from './table/HeadCellDropDown.js';
+export { default } from './table/HeadCellDropDown.js';

package/esm/components/HorizontalScroll.d.ts

@@ -0,0 +1,74 @@
+import { TestIdBuilder, ThemeProps } from 'amis-rev-core';
+import React, { ReactNode } from 'react';
+type ChildrenType = React.ReactNode | ((showSelect: () => void) => React.ReactNode);
+export interface HorizontalScrollProps extends ThemeProps {
+    /**
+     * 左右按钮图标
+     */
+    icons?: ReactNode | ReactNode[];
+    /**
+     * 外层容器类名
+     */
+    className?: string;
+    /**
+     * 左右图标类名
+     */
+    iconsClassName?: string | string[];
+    /**
+     * 测试ID生成器
+     */
+    testIdBuilder?: TestIdBuilder;
+    children: ChildrenType;
+    /**
+     * 子元素滚动容器，用于计算当前点击。默认为当前滚动容器最内层
+     */
+    getScrollParentElement?: () => HTMLElement;
+    /**
+     * 激活的子元素类名，如果设置，那么每次页面缩放的时候，都会让对应的位置滚动到可视区域。如果命中多个元素，则只会滚动第一个
+     * 支持传入多个类名，按照传入数组中元素的顺序作为优先级顺序。[p0, p1, p2...]，优先级高的类名命中元素则会停止寻找
+     */
+    activeChildClassName?: string | string[];
+}
+interface HorizontalScrollState {
+    isOverflow: boolean;
+    arrowLeftDisabled: boolean;
+    arrowRightDisabled: boolean;
+    scroll: boolean;
+}
+export declare class HorizontalScroll extends React.Component<HorizontalScrollProps, HorizontalScrollState> {
+    innerWrapper: React.RefObject<HTMLDivElement>;
+    resizeDom: React.RefObject<HTMLDivElement>;
+    toDispose: Array<() => void>;
+    constructor(props: HorizontalScrollProps);
+    /**
+     * 处理箭头点击事件
+     * @param type 箭头方向，'left' 表示向左，'right' 表示向右
+     */
+    handleArrow(type: 'left' | 'right'): void;
+    /**
+     * 根据滚动条位置更新左右箭头的禁用状态
+     */
+    checkArrowStatus: any;
+    /**
+     * 保证选中的yua始终显示在可视区域
+     */
+    showSelected(isOverflow?: boolean): void;
+    /**
+     * 处理内容与容器之间的位置关系
+     */
+    checkIsOverflow(): void;
+    /**
+     * 渲染箭头图标
+     * @param type 箭头类型，'left' 表示左箭头，'right' 表示右箭头
+     * @returns 返回渲染的箭头图标组件或 null
+     */
+    renderArrow(type: 'left' | 'right'): React.JSX.Element | null;
+    /**
+     * 监听导航上的滚动事件
+     */
+    handleWheel(e: WheelEvent): void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    render(): ReactNode;
+}
+export {};