UNPKG

antd-multi-asl-cascader

Version:

A multiple cascader component for antd

33 lines (32 loc) 2.23 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); const tslib_1 = require("tslib"); const react_1 = tslib_1.__importStar(require("react")); const icons_1 = require("@ant-design/icons"); const classnames_1 = tslib_1.__importDefault(require("classnames")); const container_1 = tslib_1.__importDefault(require("../container")); const constants_1 = require("../constants"); const Checkbox_1 = tslib_1.__importDefault(require("./Checkbox")); const tooltip_1 = tslib_1.__importDefault(require("antd/es/tooltip")); exports.default = react_1.default.memo((props) => { const { node, depth } = props; const { children, value, label, isLeaf } = node; const { handleCascaderChange, menuPath, selectLeafOnly, } = container_1.default.useContainer(); const [loading, setLoading] = react_1.useState(false); const hasChildren = (children && children.length > 0) || isLeaf === false; const checkboxHidden = selectLeafOnly && hasChildren; const handleClick = react_1.useCallback(() => { setLoading(true); handleCascaderChange(node, depth); }, [node, depth]); const active = react_1.useMemo(() => !!menuPath.find((item) => item.value === value), [menuPath, value]); const cls = classnames_1.default(`${constants_1.prefix}-column-item`, { [`${constants_1.prefix}-column-item-active`]: active, }); return (react_1.default.createElement("li", { onClick: handleClick, className: cls }, checkboxHidden ? null : react_1.default.createElement(Checkbox_1.default, { node: node }), react_1.default.createElement("p", { className: `${constants_1.prefix}-column-item-label`, style: { paddingLeft: checkboxHidden ? '0px' : '' } }, react_1.default.createElement(tooltip_1.default, { placement: 'top', title: label }, react_1.default.createElement("span", null, label))), !hasChildren ? null : loading && !(children === null || children === void 0 ? void 0 : children.length) ? (react_1.default.createElement(icons_1.LoadingOutlined, { className: `${constants_1.prefix}-column-item-icon` })) : (react_1.default.createElement(icons_1.RightOutlined, { className: `${constants_1.prefix}-column-item-icon` })))); });