import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
import * as __WEBPACK_EXTERNAL_MODULE__tachybase_schema__ from "@tachybase/schema";
import * as __WEBPACK_EXTERNAL_MODULE__ant_design_icons__ from "@ant-design/icons";
import * as __WEBPACK_EXTERNAL_MODULE__ctrl_tinycolor__ from "@ctrl/tinycolor";
import * as __WEBPACK_EXTERNAL_MODULE_antd__ from "antd";
import * as __WEBPACK_EXTERNAL_MODULE_antd_style__ from "antd-style";
import * as __WEBPACK_EXTERNAL_MODULE_classnames__ from "classnames";
import * as __WEBPACK_EXTERNAL_MODULE_react_drag_listview__ from "react-drag-listview";
import * as __WEBPACK_EXTERNAL_MODULE__builtins_index_mjs__ from "../__builtins__/index.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__index_mjs__ from "../../index.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__index_mjs__ from "../../../index.mjs";
function _tagged_template_literal(strings, raw) {
    if (!raw) raw = strings.slice(0);
    return Object.freeze(Object.defineProperties(strings, {
        raw: {
            value: Object.freeze(raw)
        }
    }));
}
function _templateObject() {
    const data = _tagged_template_literal([
        "\n      position: relative;\n      display: flex;\n      align-items: center;\n      justify-content: space-evenly;\n    "
    ]);
    _templateObject = function() {
        return data;
    };
    return data;
}
function _templateObject1() {
    const data = _tagged_template_literal([
        "\n      position: absolute;\n      right: 50%;\n      transform: translateX(50%);\n      &:not(.checked) {\n        display: none;\n      }\n    "
    ]);
    _templateObject1 = function() {
        return data;
    };
    return data;
}
function _templateObject2() {
    const data = _tagged_template_literal([
        "\n      &:hover .general-schema-designer {\n        display: block;\n      }\n    "
    ]);
    _templateObject2 = function() {
        return data;
    };
    return data;
}
function _templateObject3() {
    const data = _tagged_template_literal([
        "\n      max-width: 300px;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    "
    ]);
    _templateObject3 = function() {
        return data;
    };
    return data;
}
function _templateObject4() {
    const data = _tagged_template_literal([
        "\n      position: relative;\n      display: flex;\n      align-items: center;\n      justify-content: space-evenly;\n      padding-right: 8px;\n      .tb-table-index {\n        opacity: 0;\n      }\n      &:not(.checked) {\n        .tb-table-index {\n          opacity: 1;\n        }\n      }\n      &:hover {\n        .tb-table-index {\n          opacity: 0;\n        }\n        .tb-origin-node {\n          display: block;\n        }\n      }\n    "
    ]);
    _templateObject4 = function() {
        return data;
    };
    return data;
}
function _templateObject5() {
    const data = _tagged_template_literal([
        "\n      .ant-table {\n        overflow-x: auto;\n        overflow-y: hidden;\n      }\n    "
    ]);
    _templateObject5 = function() {
        return data;
    };
    return data;
}
function _templateObject6() {
    const data = _tagged_template_literal([
        "\n      border-bottom: 2px solid ",
        " !important;\n    "
    ]);
    _templateObject6 = function() {
        return data;
    };
    return data;
}
const useStyles = (0, __WEBPACK_EXTERNAL_MODULE_antd_style__.createStyles)((param)=>{
    let { css, token } = param;
    return {
        drag: css(_templateObject()),
        node: css(_templateObject1()),
        headerCell: css(_templateObject2()),
        bodyCell: css(_templateObject3()),
        cell: css(_templateObject4()),
        table: css(_templateObject5()),
        line: css(_templateObject6(), new __WEBPACK_EXTERNAL_MODULE__ctrl_tinycolor__.TinyColor(token.colorSettings).setAlpha(0.6).toHex8String())
    };
});
const isColumnComponent = (schema)=>{
    var _schema_xcomponent;
    return (null === (_schema_xcomponent = schema['x-component']) || void 0 === _schema_xcomponent ? void 0 : _schema_xcomponent.endsWith('.Column')) > -1;
};
const useTableColumns = ()=>{
    const field = (0, __WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useField)();
    const schema = (0, __WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useFieldSchema)();
    const { exists, render } = (0, __WEBPACK_EXTERNAL_MODULE__index_mjs__.useSchemaInitializerRender)(schema['x-initializer'], schema['x-initializer-props']);
    const scope = (0, __WEBPACK_EXTERNAL_MODULE_react__.useContext)(__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.SchemaExpressionScopeContext);
    const parentRecordData = (0, __WEBPACK_EXTERNAL_MODULE__index_mjs__.useCollectionParentRecordData)();
    const recordData = (0, __WEBPACK_EXTERNAL_MODULE__index_mjs__.useCollectionRecordData)();
    const { styles } = useStyles();
    const columns = schema.reduceProperties((buf, s)=>{
        if (isColumnComponent(s) && false !== scope[s['x-visible']]) return buf.concat([
            s
        ]);
        return buf;
    }, []).map((s)=>({
            title: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.RecursionField, {
                name: s.name,
                schema: s,
                onlyRenderSelf: true
            }),
            dataIndex: s.name,
            key: s.name,
            render: (v, record)=>{
                var _field_value;
                const index = null === (_field_value = field.value) || void 0 === _field_value ? void 0 : _field_value.indexOf(record);
                return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__index_mjs__.RecordIndexProvider, {
                    index: index,
                    children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__index_mjs__.RecordProvider, {
                        record: record,
                        parent: parentRecordData || recordData,
                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__tachybase_schema__.RecursionField, {
                            schema: s,
                            name: record.__index || index,
                            onlyRenderProperties: true
                        })
                    })
                });
            }
        }));
    if (!exists) return columns;
    return columns.concat({
        title: render(),
        dataIndex: 'TABLE_COLUMN_INITIALIZER',
        key: 'TABLE_COLUMN_INITIALIZER'
    });
};
const useDef = ()=>{
    const [selectedRowKeys, setSelectedRowKeys] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)([]);
    return [
        selectedRowKeys,
        setSelectedRowKeys
    ];
};
const useDefDataSource = (options, props)=>{
    const field = (0, __WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useField)();
    return (0, __WEBPACK_EXTERNAL_MODULE__index_mjs__.useRequest)(()=>Promise.resolve({
            data: field.value
        }), options);
};
const SortHandle = (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__ant_design_icons__.MenuOutlined, {
        className: 'drag-handle',
        style: {
            cursor: 'grab'
        },
        ...props
    });
const TableIndex = (props)=>{
    const { index, ...otherProps } = props;
    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("div", {
        className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])('tb-table-index'),
        style: {
            padding: '0 8px 0 16px'
        },
        ...otherProps,
        children: index + 1
    });
};
const useDefAction = ()=>({
        async move () {}
    });
const TableArray = (0, __WEBPACK_EXTERNAL_MODULE__tachybase_schema__.observer)((props)=>{
    var _field_value_slice, _field_value;
    const { token } = (0, __WEBPACK_EXTERNAL_MODULE__builtins_index_mjs__.useToken)();
    const field = (0, __WEBPACK_EXTERNAL_MODULE__tachybase_schema__.useField)();
    const columns = useTableColumns();
    const { dragSort = false, showIndex = true, useSelectedRowKeys = useDef, useDataSource = useDefDataSource, useAction = useDefAction, onChange, ...others } = props;
    const [selectedRowKeys, setSelectedRowKeys] = useSelectedRowKeys();
    const { styles } = useStyles();
    const components = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
            header: {
                wrapper: (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__index_mjs__.DndContext, {
                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("thead", {
                            ...props
                        })
                    }),
                cell: (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("th", {
                        ...props,
                        className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])(props.className, styles.headerCell)
                    })
            },
            body: {
                wrapper: (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__index_mjs__.DndContext, {
                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("tbody", {
                            ...props
                        })
                    }),
                row: (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("tr", {
                        ...props
                    }),
                cell: (props)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("td", {
                        ...props,
                        className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])(props.className, styles.bodyCell)
                    })
            }
        }), [
        styles
    ]);
    useDataSource({
        onSuccess (data) {
            field.value = (null == data ? void 0 : data.data) || [];
        }
    });
    const { move } = useAction();
    const restProps = {
        rowSelection: props.rowSelection ? {
            type: 'checkbox',
            selectedRowKeys,
            onChange (selectedRowKeys) {
                setSelectedRowKeys(selectedRowKeys);
            },
            getCheckboxProps: (record)=>({
                    'aria-label': "checkbox-".concat(record.name)
                }),
            renderCell: (checked, record, index, originNode)=>{
                var _props_pagination, _props_pagination1;
                const current = null == props ? void 0 : null === (_props_pagination = props.pagination) || void 0 === _props_pagination ? void 0 : _props_pagination.current;
                const pageSize = (null == props ? void 0 : null === (_props_pagination1 = props.pagination) || void 0 === _props_pagination1 ? void 0 : _props_pagination1.pageSize) || 20;
                if (current) index += (current - 1) * pageSize;
                return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)("div", {
                    className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])(checked ? 'checked' : null, styles.cell),
                    children: [
                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)("div", {
                            className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])(checked ? 'checked' : null, styles.drag),
                            children: [
                                dragSort && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(SortHandle, {
                                    role: "button",
                                    "aria-label": "sort-handle-".concat((null == record ? void 0 : record.name) || index)
                                }),
                                showIndex && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(TableIndex, {
                                    role: "button",
                                    "aria-label": "table-index-".concat((null == record ? void 0 : record.name) || index),
                                    index: index
                                })
                            ]
                        }),
                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("div", {
                            className: (0, __WEBPACK_EXTERNAL_MODULE_classnames__["default"])('tb-origin-node', checked ? 'checked' : null, styles.node),
                            children: originNode
                        })
                    ]
                });
            },
            ...props.rowSelection
        } : void 0
    };
    const defaultRowKey = (record)=>{
        var _field_value_indexOf, _field_value;
        return null === (_field_value = field.value) || void 0 === _field_value ? void 0 : null === (_field_value_indexOf = _field_value.indexOf) || void 0 === _field_value_indexOf ? void 0 : _field_value_indexOf.call(_field_value, record);
    };
    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("div", {
        className: styles.table,
        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_drag_listview__["default"], {
            handleSelector: '.drag-handle',
            onDragEnd: async (fromIndex, toIndex)=>{
                const from = field.value[fromIndex];
                const to = field.value[toIndex];
                field.move(fromIndex, toIndex);
                await move(from, to);
            },
            lineClassName: styles.line,
            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE_antd__.Table, {
                rowKey: defaultRowKey,
                ...others,
                ...restProps,
                components: components,
                columns: columns,
                dataSource: null == field ? void 0 : null === (_field_value = field.value) || void 0 === _field_value ? void 0 : null === (_field_value_slice = _field_value.slice) || void 0 === _field_value_slice ? void 0 : _field_value_slice.call(_field_value)
            })
        })
    });
}, {
    displayName: 'TableArray'
});
export { TableArray };
