listpage-next 0.0.169 → 0.0.171

package/dist/components/PageLayout/components/PageContent/index.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export interface PageContentProps {
+    children?: ReactNode;
+}
+export declare const PageContent: (props: PageContentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/PageLayout/components/PageContent/index.js

@@ -0,0 +1,15 @@
+import { jsx } from "react/jsx-runtime";
+import { Layout } from "antd";
+import { styled } from "styled-components";
+const { Content } = Layout;
+const PageContent = (props)=>{
+    const { children } = props;
+    return /*#__PURE__*/ jsx(ContentStyled, {
+        children: children
+    });
+};
+const ContentStyled = styled(Content)`
+  background-color: #fff;
+  overflow: auto;
+`;
+export { PageContent };

package/dist/components/PageLayout/components/PageHeader/index.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export interface PageHeaderProps {
+    children?: ReactNode;
+}
+export declare const PageHeader: (props: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/PageLayout/components/PageHeader/index.js

@@ -0,0 +1,5 @@
+import { Fragment, jsx } from "react/jsx-runtime";
+const PageHeader = (props)=>/*#__PURE__*/ jsx(Fragment, {
+        children: props.children
+    });
+export { PageHeader };

package/dist/components/PageLayout/components/PageLayout/index.d.ts

@@ -0,0 +1,10 @@
+import { SiderProps } from 'antd';
+export interface PageLayoutProps {
+    sider?: React.ReactNode;
+    header?: React.ReactNode;
+    content?: React.ReactNode;
+    logo?: React.ReactNode;
+    defaultCollapsed?: boolean;
+    siderProps?: Omit<SiderProps, 'collapsed' | 'onCollapse'>;
+}
+export declare const PageLayout: (props: PageLayoutProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/PageLayout/components/PageLayout/index.js

@@ -0,0 +1,44 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Layout } from "antd";
+import { styled } from "styled-components";
+import { PageSider } from "../PageSider/index.js";
+import { PageHeader } from "../PageHeader/index.js";
+import { PageContent } from "../PageContent/index.js";
+import { PageProvider, usePageContext } from "../PageProvider/index.js";
+const PageLayoutComponent = (props)=>{
+    const { siderProps, sider, header, content, logo } = props;
+    const { collapsed, setCollapsed } = usePageContext();
+    return /*#__PURE__*/ jsxs(LayoutStyled, {
+        children: [
+            /*#__PURE__*/ jsx(PageSider, {
+                ...siderProps,
+                logo: logo,
+                collapsed: collapsed,
+                onCollapse: setCollapsed,
+                children: sider
+            }),
+            /*#__PURE__*/ jsxs(Layout, {
+                hasSider: false,
+                children: [
+                    /*#__PURE__*/ jsx(PageHeader, {
+                        children: header
+                    }),
+                    /*#__PURE__*/ jsx(PageContent, {
+                        children: content
+                    })
+                ]
+            })
+        ]
+    });
+};
+const PageLayout = (props)=>/*#__PURE__*/ jsx(PageProvider, {
+        defaultCollapsed: props.defaultCollapsed,
+        children: /*#__PURE__*/ jsx(PageLayoutComponent, {
+            ...props
+        })
+    });
+const LayoutStyled = styled(Layout)`
+  height: 100vh;
+  overflow: hidden;
+`;
+export { PageLayout };

package/dist/components/{Page/components/Loading → PageLayout/components/PageLoading}/index.js

@@ -15,7 +15,7 @@ const PageLoading = styled_components.div`
   &::after {
     animation: LoadingAnimation 1.5s linear infinite;
     border-radius: 5px;
-    content: "";
+    content: '';
     height: 10px;
     left: 50%;
     position: absolute;
@@ -28,27 +28,37 @@ const PageLoading = styled_components.div`
 
   @keyframes LoadingAnimation {
     0% {
-      box-shadow: -16px 20px 0 -5px #b89dfe, 0 20px 0 0 #2e6ee7,
+      box-shadow:
+        -16px 20px 0 -5px #b89dfe,
+        0 20px 0 0 #2e6ee7,
         16px 20px 0 2px #b89dfe;
     }
 
     25% {
-      box-shadow: -16px 20px 0 0 #b89dfe, 0 20px 0 2px #2e6ee7,
+      box-shadow:
+        -16px 20px 0 0 #b89dfe,
+        0 20px 0 2px #2e6ee7,
         16px 20px 0 0 #b89dfe;
     }
 
     50% {
-      box-shadow: -16px 20px 0 2px #b89dfe, 0 20px 0 0 #2e6ee7,
+      box-shadow:
+        -16px 20px 0 2px #b89dfe,
+        0 20px 0 0 #2e6ee7,
         16px 20px 0 -5px #b89dfe;
     }
 
     75% {
-      box-shadow: -16px 20px 0 0 #b89dfe, 0 20px 0 -5px #2e6ee7,
+      box-shadow:
+        -16px 20px 0 0 #b89dfe,
+        0 20px 0 -5px #2e6ee7,
         16px 20px 0 0 #b89dfe;
     }
 
     to {
-      box-shadow: -16px 20px 0 -5px #b89dfe, 0 20px 0 0 #2e6ee7,
+      box-shadow:
+        -16px 20px 0 -5px #b89dfe,
+        0 20px 0 0 #2e6ee7,
         16px 20px 0 2px #b89dfe;
     }
   }

package/dist/components/{Page/context/page.d.ts → PageLayout/components/PageProvider/index.d.ts}

@@ -2,11 +2,11 @@ export declare const PageContext: import("react").Context<{
     collapsed: boolean;
     setCollapsed: (collapsed: boolean) => void;
 }>;
-export declare const PageContextProvider: ({ children, collapsed, setCollapsed, }: {
+export interface PageProviderProps {
     children: React.ReactNode;
-    collapsed: boolean;
-    setCollapsed: (collapsed: boolean) => void;
-}) => import("react/jsx-runtime").JSX.Element;
+    defaultCollapsed?: boolean;
+}
+export declare const PageProvider: ({ children, defaultCollapsed, }: PageProviderProps) => import("react/jsx-runtime").JSX.Element;
 export declare const usePageContext: () => {
     collapsed: boolean;
     setCollapsed: (collapsed: boolean) => void;

package/dist/components/{Page/context/page.js → PageLayout/components/PageProvider/index.js}

@@ -1,15 +1,18 @@
 import { jsx } from "react/jsx-runtime";
-import { createContext, useContext } from "react";
+import { createContext, useContext, useState } from "react";
 const PageContext = /*#__PURE__*/ createContext({
     collapsed: false,
     setCollapsed: ()=>{}
 });
-const PageContextProvider = ({ children, collapsed, setCollapsed })=>/*#__PURE__*/ jsx(PageContext.Provider, {
+const PageProvider = ({ children, defaultCollapsed = false })=>{
+    const [collapsed, setCollapsed] = useState(defaultCollapsed);
+    return /*#__PURE__*/ jsx(PageContext.Provider, {
         value: {
             collapsed,
             setCollapsed
         },
         children: children
     });
+};
 const usePageContext = ()=>useContext(PageContext);
-export { PageContext, PageContextProvider, usePageContext };
+export { PageContext, PageProvider, usePageContext };

package/dist/components/PageLayout/components/PageSider/index.d.ts

@@ -0,0 +1,7 @@
+import { SiderProps } from 'antd';
+import { ReactNode } from 'react';
+export interface PageSiderProps extends Omit<SiderProps, 'children'> {
+    logo?: ReactNode;
+    children?: ReactNode;
+}
+export declare const PageSider: (props: PageSiderProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/PageLayout/components/PageSider/index.js

@@ -0,0 +1,43 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { styled } from "styled-components";
+import { Layout } from "antd";
+const PageSider = (props)=>{
+    const { logo, children, ...siderProps } = props;
+    return /*#__PURE__*/ jsx(SiderStyled, {
+        trigger: null,
+        width: 256,
+        collapsedWidth: 80,
+        breakpoint: "lg",
+        collapsible: true,
+        ...siderProps,
+        children: /*#__PURE__*/ jsxs(SiderContent, {
+            children: [
+                logo && /*#__PURE__*/ jsx(LogoContentWrapper, {
+                    children: logo
+                }),
+                /*#__PURE__*/ jsx(SiderContentWrapper, {
+                    children: children
+                })
+            ]
+        })
+    });
+};
+const SiderStyled = styled(Layout.Sider)`
+  background-color: #fff;
+  border-right: 1px solid #e5e5e5;
+  display: flex;
+  flex-direction: column;
+`;
+const SiderContent = styled.div`
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+`;
+const SiderContentWrapper = styled.div`
+  flex: 1;
+  overflow: auto;
+`;
+const LogoContentWrapper = styled.div`
+  flex: 0;
+`;
+export { PageSider };

package/dist/components/PageLayout/index.d.ts

@@ -0,0 +1,4 @@
+export { PageLoading } from './components/PageLoading';
+export { PageLayout } from './components/PageLayout';
+export type { PageLayoutProps } from './components/PageLayout';
+export { PageContext, usePageContext } from './components/PageProvider';

package/dist/components/PageLayout/index.js

@@ -0,0 +1,4 @@
+import { PageLoading } from "./components/PageLoading/index.js";
+import { PageLayout } from "./components/PageLayout/index.js";
+import { PageContext, usePageContext } from "./components/PageProvider/index.js";
+export { PageContext, PageLayout, PageLoading, usePageContext };

package/dist/context/index.d.ts

@@ -1 +1 @@
-export { FloatContext, FloatProvider, useFloatContext, type FloatComponentProps } from './float';
+export { FloatContext, FloatProvider, useFloatContext } from './float';

package/dist/demos/demo2.js

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import { PageContainer } from "../components/Page/index.js";
+import { PageLayout } from "../components/PageLayout/index.js";
 const Demo2 = ()=>{
     const sider = /*#__PURE__*/ jsx("div", {
         children: "侧边栏"
@@ -10,7 +10,7 @@ const Demo2 = ()=>{
     const header = /*#__PURE__*/ jsx("div", {
         children: "顶部"
     });
-    return /*#__PURE__*/ jsx(PageContainer, {
+    return /*#__PURE__*/ jsx(PageLayout, {
         sider: sider,
         content: content,
         header: header

package/dist/demos/demo5.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button, DatePicker, Input, Select, Space, Switch } from "antd";
-import { ListPage } from "../components/Page/components/ListPage/v2.js";
+import { ListPage } from "../features/ListPage/index.js";
 const columns = [
     {
         key: 'enable',

package/dist/features/ChatClient/components/ChatContent/index.js

@@ -5,7 +5,7 @@ import { styled } from "styled-components";
 import { ClientContentBody } from "./ClientContentBody.js";
 import { ClientContentHeader } from "./ClientContentHeader.js";
 import { MessageProvider, useChatClientContext } from "../../context/index.js";
-import { PageLoading } from "../../../../components/Page/components/Loading/index.js";
+import { PageLoading } from "../../../../components/PageLayout/index.js";
 const ClientContentComponent = (props)=>{
     const { extra, style, header, sender, className, title, onTitleChange, onClickNewConversation, senderProps, bubbleProps } = props;
     return /*#__PURE__*/ jsxs(Container, {

package/dist/features/ChatClient/components/HistoryConversation/index.d.ts

@@ -1,11 +1,5 @@
-export interface HistoryConversationProps<T = any> {
+export interface HistoryConversationProps {
     rowKey?: string;
-    activeKey?: string;
+    defaultActiveKey?: string;
 }
-export declare const HistoryConversation: <T extends ItemData = any>(props: HistoryConversationProps<T>) => import("react/jsx-runtime").JSX.Element;
-type ItemData = {
-    icon?: React.ReactNode;
-    title: string;
-    key: string;
-};
-export {};
+export declare const HistoryConversation: (props: HistoryConversationProps) => import("react/jsx-runtime").JSX.Element;

package/dist/features/ChatClient/components/HistoryConversation/index.js

@@ -1,87 +1,34 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef } from "react";
-import { Avatar, Button, Dropdown, Tooltip, Typography } from "antd";
+import { Button, Tooltip } from "antd";
 import { useHover } from "ahooks";
-import { ClockCircleOutlined, MessageOutlined, MoreOutlined } from "@ant-design/icons";
-import { InfiniteList } from "../../../../components/InfiniteList/index.js";
+import { ClockCircleOutlined } from "@ant-design/icons";
 import { useChatClientContext } from "../../context/index.js";
-import { HeaderContainer, HeaderTitle, HistoryConversationContainer, ListContainer, ListItemContainer, ListText } from "./styles.js";
+import { ConversationList } from "../../ui/ConversationList/index.js";
+import { HeaderContainer, HeaderTitle, HistoryConversationContainer } from "./styles.js";
 const HistoryConversation = (props)=>{
-    const { rowKey = "id", activeKey } = props;
+    const { rowKey = 'id', defaultActiveKey } = props;
     const { showUpdateTitleModal, conversationListRef, action, request } = useChatClientContext();
     const { onClickConversation, onRenameConversation, onDeleteConversation } = action ?? {};
     return /*#__PURE__*/ jsxs(HistoryConversationContainer, {
         children: [
             /*#__PURE__*/ jsx(Header, {}),
-            /*#__PURE__*/ jsx(ListContainer, {
-                children: /*#__PURE__*/ jsx(InfiniteList, {
-                    ref: conversationListRef,
-                    request: request.getConversations,
-                    rowKey: rowKey,
-                    pageSize: 10,
-                    renderItem: (item, index, actions)=>{
-                        const key = item[rowKey];
-                        const items = [
-                            {
-                                key: 'rename',
-                                label: '重命名',
-                                onClick: ()=>{
-                                    showUpdateTitleModal(item.title, async (newTitle)=>{
-                                        const newItem = {
-                                            ...item,
-                                            title: newTitle
-                                        };
-                                        await onRenameConversation?.(key, newItem);
-                                        actions.updateItem(key, newItem);
-                                    });
-                                }
-                            },
-                            {
-                                key: 'delete',
-                                danger: true,
-                                label: '删除',
-                                onClick: async ()=>{
-                                    await onDeleteConversation?.(key, item);
-                                    actions.deleteItem(key);
-                                }
-                            }
-                        ];
-                        return /*#__PURE__*/ jsxs(ListItemContainer, {
-                            isHover: activeKey === key ? true : void 0,
-                            onClick: ()=>onClickConversation?.(key, item),
-                            children: [
-                                /*#__PURE__*/ jsx(Avatar, {
-                                    size: 20,
-                                    icon: item.icon || /*#__PURE__*/ jsx(MessageOutlined, {})
-                                }),
-                                /*#__PURE__*/ jsx(ListText, {
-                                    children: /*#__PURE__*/ jsx(Typography.Text, {
-                                        ellipsis: {
-                                            tooltip: {
-                                                title: item.title,
-                                                placement: 'right'
-                                            }
-                                        },
-                                        children: item.title
-                                    })
-                                }),
-                                /*#__PURE__*/ jsx("div", {
-                                    onClick: (e)=>e.stopPropagation(),
-                                    children: /*#__PURE__*/ jsx(Dropdown, {
-                                        menu: {
-                                            items
-                                        },
-                                        children: /*#__PURE__*/ jsx(Button, {
-                                            type: "text",
-                                            size: "small",
-                                            icon: /*#__PURE__*/ jsx(MoreOutlined, {})
-                                        })
-                                    })
-                                })
-                            ]
+            /*#__PURE__*/ jsx(ConversationList, {
+                rowKey: rowKey,
+                defaultActiveKey: defaultActiveKey,
+                request: request.getConversations,
+                ref: conversationListRef,
+                onSelectConversation: (data)=>onClickConversation?.(data[rowKey], data),
+                onDeleteConversation: (data)=>{
+                    onDeleteConversation?.(data[rowKey], data);
+                },
+                onRenameConversation: (data)=>new Promise((resolve)=>{
+                        showUpdateTitleModal(data.title, async (newTitle)=>{
+                            data.title = newTitle;
+                            await onRenameConversation?.(data[rowKey], data);
+                            resolve(data);
                         });
-                    }
-                })
+                    })
             })
         ]
     });

package/dist/features/ChatClient/components/HistoryConversation/styles.d.ts

@@ -1,8 +1,3 @@
 export declare const HistoryConversationContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const HeaderContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const HeaderTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ListContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const ListItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    isHover?: boolean;
-}>> & string;
-export declare const ListText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/features/ChatClient/components/HistoryConversation/styles.js

@@ -1,52 +1,24 @@
 import styled_components from "styled-components";
 const HistoryConversationContainer = styled_components.div`
-    flex: 1;
-    display: flex;
-    flex-direction: column;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 `;
 const HeaderContainer = styled_components.div`
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 8px 6px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 6px;
 `;
 const HeaderTitle = styled_components.div`
-    align-items: center;
-    display: flex;
-    flex: 1 1;
-    font-size: 12px;
-    font-weight: 600;
-    min-width: 0;
-    color: #0000004d;
-    line-height: 20px;
-    height: 20px;
+  align-items: center;
+  display: flex;
+  flex: 1 1;
+  font-size: 12px;
+  font-weight: 600;
+  min-width: 0;
+  color: #0000004d;
+  line-height: 20px;
+  height: 20px;
 `;
-const ListContainer = styled_components.div`
-    flex: 1;
-    overflow: hidden;
-    padding: 0 2px;
-`;
-const ListItemContainer = styled_components.div`
-    display: flex;
-    align-items: center;
-    padding: 8px 4px;
-    border-radius: 8px;
-    cursor: pointer;
-    gap: 4px;
-
-    background-color: ${(props)=>props.isHover ? "#0000000a" : "transparent"};
-
-    &:hover {
-        background-color: #0000000a;
-    }
-`;
-const ListText = styled_components.div`
-    flex: 1;
-
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    word-break: break-all;
-    word-wrap: break-word;
-`;
-export { HeaderContainer, HeaderTitle, HistoryConversationContainer, ListContainer, ListItemContainer, ListText };
+export { HeaderContainer, HeaderTitle, HistoryConversationContainer };

package/dist/features/ChatClient/ui/Bubble/BubbleList.d.ts

@@ -2,9 +2,11 @@ import { CSSProperties } from 'react';
 import { BaseMessageInfo, Message } from '../../context';
 export interface BubbleListProps<MessageInfo extends BaseMessageInfo> {
     styles?: {
+        headerPlaceholder?: CSSProperties;
         bottomPlaceholder?: CSSProperties;
         content?: CSSProperties;
     };
+    loading?: boolean;
     messages: Message<MessageInfo>[];
     messageRender: (message: Message<MessageInfo>) => React.ReactNode;
 }

package/dist/features/ChatClient/ui/Bubble/BubbleList.js

@@ -1,24 +1,31 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { useRef } from "react";
 import { styled } from "styled-components";
+import { PageLoading } from "../../../../components/PageLayout/index.js";
 const BubbleList = (props)=>{
-    const { styles, messages, messageRender } = props;
+    const { loading, styles, messages, messageRender } = props;
     const bottomRef = useRef(null);
     const containerRef = useRef(null);
-    return /*#__PURE__*/ jsxs(ContentContainer, {
+    const content = [
+        /*#__PURE__*/ jsx("div", {
+            style: styles?.headerPlaceholder ?? {
+                height: 4
+            }
+        }, "header"),
+        /*#__PURE__*/ jsx("div", {
+            style: styles?.content,
+            children: (messages ?? []).map(messageRender)
+        }, "content"),
+        /*#__PURE__*/ jsx("div", {
+            ref: bottomRef,
+            style: styles?.bottomPlaceholder ?? {
+                height: 60
+            }
+        }, "footer")
+    ];
+    return /*#__PURE__*/ jsx(ContentContainer, {
         ref: containerRef,
-        children: [
-            /*#__PURE__*/ jsx("div", {
-                style: styles?.content,
-                children: (messages ?? []).map(messageRender)
-            }),
-            /*#__PURE__*/ jsx("div", {
-                ref: bottomRef,
-                style: styles?.bottomPlaceholder ?? {
-                    height: 60
-                }
-            })
-        ]
+        children: loading ? /*#__PURE__*/ jsx(PageLoading, {}) : content
     });
 };
 const ContentContainer = styled.div`

package/dist/features/ChatClient/ui/ConversationList/index.d.ts

@@ -0,0 +1,21 @@
+import { ItemType } from 'antd/es/menu/interface';
+import { InfiniteListProps, InfiniteListRef, RenderActions } from '../../../../components/InfiniteList';
+export interface ConverstionListProps<T = any> {
+    rowKey: string;
+    ref?: InfiniteListRef<T>;
+    defaultActiveKey?: string;
+    request: InfiniteListProps<T>['request'];
+    menus?: (Omit<ItemType, 'onClick'> & {
+        onClick?: (item: T, index: number, actions: RenderActions<Record<string, any>>) => void;
+    })[];
+    onSelectConversation?: (data: T) => void;
+    onDeleteConversation?: (data: T) => void;
+    onRenameConversation?: (data: T) => T;
+}
+type ItemData = {
+    icon?: React.ReactNode;
+    title: string;
+    key: string;
+};
+export declare const ConversationList: <T extends ItemData = any>(props: ConverstionListProps<T>) => import("react/jsx-runtime").JSX.Element;
+export {};