import React from 'react';
export default function PHXActivityHistory({ loading = false, title = 'Lịch sử hoạt động', data = [], generateChildren, bgColor = 'bg-white', emptyText = 'Chưa có lịch sử hoạt động.', enableHTML = false, }) {
    const childrenDefault = (history) => {
        if (enableHTML) {
            return (React.createElement("div", { className: 'flex w-full justify-between text-xs' },
                React.createElement("div", { className: 'pr-2 leading-5', dangerouslySetInnerHTML: { __html: history.description || '' } }),
                React.createElement("span", { className: 'shrink-0 ' }, history.created_at)));
        }
        return (React.createElement(React.Fragment, null,
            React.createElement("span", { className: 'text-xs text-gray-600 font-[450]' }, history.description),
            React.createElement("p", { className: 'text-xs  text-gray-600 font-[450]' }, history.created_at)));
    };
    const renderChildren = (history) => {
        return generateChildren ? generateChildren(history) : childrenDefault(history);
    };
    return (React.createElement("div", { className: ' px-3  relative w-full overflow-hidden' },
        React.createElement("p", { className: 'text-sm font-[650]' }, title),
        loading ? (React.createElement("div", { className: 'space-y-4 mt-4' },
            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
                    React.createElement("div", { className: 'h-2 rounded bg-gray-200' }),
                    React.createElement("div", { className: 'space-y-3' },
                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-gray-200' }),
                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-gray-200' })),
                        React.createElement("div", { className: 'h-2 rounded bg-gray-200' })))),
            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
                    React.createElement("div", { className: 'h-2 rounded bg-gray-200' }),
                    React.createElement("div", { className: 'space-y-3' },
                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-gray-200' }),
                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-gray-200' })),
                        React.createElement("div", { className: 'h-2 rounded bg-gray-200' })))),
            React.createElement("div", { className: 'flex animate-pulse space-x-4' },
                React.createElement("div", { className: 'flex-1 space-y-6 py-1' },
                    React.createElement("div", { className: 'h-2 rounded bg-gray-200' }),
                    React.createElement("div", { className: 'space-y-3' },
                        React.createElement("div", { className: 'grid grid-cols-3 gap-4' },
                            React.createElement("div", { className: 'col-span-2 h-2 rounded bg-gray-200' }),
                            React.createElement("div", { className: 'col-span-1 h-2 rounded bg-gray-200' })),
                        React.createElement("div", { className: 'h-2 rounded bg-gray-200' })))))) : (React.createElement(React.Fragment, null, data.length > 0 ? (React.createElement(React.Fragment, null,
            React.createElement("div", { className: ' absolute bg-[#CCCCCC] top-[1.3rem] left-[1.17rem] h-full w-[0.5px]' }),
            React.createElement("div", { className: ` absolute  h-[80px] w-4 left-[1rem] -bottom-20  ${bgColor}` }),
            data.map((item, index) => {
                return (React.createElement("div", { key: index, className: 'w-full pl-8 pt-4' },
                    React.createElement("p", { className: 'text-[12px] font-normal text-[#616161] pb-3' }, item.date),
                    React.createElement("div", { className: ' space-y-5 relative' }, item.childs.map((history, historyIndex) => {
                        return (React.createElement("div", { key: historyIndex, className: 'w-full  items-start flex justify-between gap-x-6 relative' },
                            React.createElement("div", { className: ' absolute -left-[2.05rem]  ' },
                                React.createElement("img", { className: 'w-[16px] h-[16px]', src: 'https://sisv2-cdn.phx-smartschool.com/store/product/4-23-2025/84089cd5-7468-4093-a7df-65123cb4704a-Frame-354557.png' })),
                            renderChildren(history)));
                    }))));
            }))) : (React.createElement("p", { className: 'text-xs text-gray-600 font-normal mt-2' }, emptyText))))));
}
//# sourceMappingURL=ActivityHistory.js.map