@lark-apaas/client-toolkit 0.1.0-alpha.log.1 → 0.1.0-alpha.log.10

package/lib/apis/hooks/useTheme.d.ts

@@ -0,0 +1 @@
+export * from '../../hooks/useTheme';

package/lib/apis/hooks/useTheme.js

@@ -0,0 +1 @@
+export * from "../../hooks/useTheme.js";

package/lib/components/AppContainer/LogInterceptor.js

@@ -1,3 +1,4 @@
+import { batchLogInfo, initBatchLogger } from "../../logger/batch-logger.js";
 import { postMessage } from "../../utils/postMessage.js";
 const PROXY_CONSOLE_METHOD = [
     'log',
@@ -24,10 +25,12 @@ const initHandleError = ()=>{
     };
 };
 const initLogInterceptor = ()=>{
+    initBatchLogger(console);
     PROXY_CONSOLE_METHOD.forEach((method)=>{
         const originalMethod = window.console[method];
         window.console[method] = (...args)=>{
             originalMethod(...args);
+            batchLogInfo(method, JSON.stringify(args));
             const log = args[0];
             if ('string' == typeof log && LOG_FILTER_PREFIX.some((prefix)=>log.startsWith(prefix))) postMessage({
                 type: 'Console',

package/lib/components/AppContainer/index.js

@@ -10,11 +10,13 @@ import { ThemeProvider, findValueByPixel, generateTailwindRadiusToken, themeColo
 import { registerDayjsPlugins } from "./dayjsPlugins.js";
 import "../../index.css";
 import { initAxiosConfig } from "../../utils/axiosConfig.js";
+import { useAppInfo } from "../../hooks/index.js";
 registerDayjsPlugins();
 initAxiosConfig();
 const isMiaodaPreview = window.IS_MIAODA_PREVIEW;
 const App = (props)=>{
     const { themeMeta = {} } = props;
+    useAppInfo();
     const { rem } = findValueByPixel(themeMetaOptions.themeRadius, themeMeta.borderRadius) || {
         rem: '0.625'
     };

package/lib/components/User/UserDisplay.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import type { IUserProfile } from '../../apis/udt-types';
 export interface UserDisplayProps {
     users: IUserProfile[];

package/lib/components/User/UserDisplay.js

@@ -1,38 +1,114 @@
-import { jsx } from "react/jsx-runtime";
-import react from "react";
-import { Popover } from "antd";
-import { UserWithAvatar } from "./UserWithAvatar.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { getDataloom } from "../../integrations/dataloom.js";
 import { clsxWithTw } from "../../utils/utils.js";
 import { UserProfile } from "./UserProfile/index.js";
+import { UserWithAvatar } from "./UserWithAvatar.js";
+import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover.js";
 const UserDisplay = ({ users, size, className, style })=>{
-    const displayUsers = react.useMemo(()=>Array.isArray(users) ? users : [
+    const normalizedUsers = useMemo(()=>Array.isArray(users) ? users : [
             users
         ].filter(Boolean), [
         users
     ]);
-    if (!displayUsers.length) return null;
+    const [resolvedUsers, setResolvedUsers] = useState(normalizedUsers);
+    const [loadingProfiles, setLoadingProfiles] = useState(false);
+    useEffect(()=>{
+        let isCancelled = false;
+        if (!normalizedUsers.length) {
+            setResolvedUsers([]);
+            setLoadingProfiles(false);
+            return ()=>{
+                isCancelled = true;
+            };
+        }
+        const usersNeedingDetails = normalizedUsers.filter((user)=>!user?.name?.trim());
+        if (!usersNeedingDetails.length) {
+            setResolvedUsers(normalizedUsers);
+            setLoadingProfiles(false);
+            return ()=>{
+                isCancelled = true;
+            };
+        }
+        const fetchProfiles = async ()=>{
+            try {
+                setLoadingProfiles(true);
+                const dataloom = await getDataloom();
+                if (!dataloom) throw new Error('dataloom client is unavailable');
+                const ids = usersNeedingDetails.map((user)=>Number(user.user_id)).filter((id)=>Number.isFinite(id));
+                if (!ids.length) {
+                    setResolvedUsers(normalizedUsers);
+                    setLoadingProfiles(false);
+                    return;
+                }
+                const response = await dataloom.service.user.getByIds(ids);
+                const fetchedList = Array.isArray(response?.data) ? response?.data : Array.isArray(response?.data?.user_list) ? response?.data?.user_list : [];
+                const fetchedMap = new Map();
+                fetchedList.forEach((profile)=>{
+                    const id = String(profile?.user_id ?? '');
+                    if (!id) return;
+                    fetchedMap.set(id, {
+                        user_id: id,
+                        name: profile?.name ?? '',
+                        avatar: profile?.avatar ?? '',
+                        email: profile?.email,
+                        status: profile?.status,
+                        ...profile
+                    });
+                });
+                const mergedUsers = normalizedUsers.map((user)=>{
+                    const id = String(user.user_id);
+                    const fetched = fetchedMap.get(id);
+                    if (!fetched) return user;
+                    return {
+                        ...fetched,
+                        ...user,
+                        name: user?.name?.trim() ? user.name : fetched.name,
+                        avatar: user.avatar || fetched.avatar,
+                        email: user.email || fetched.email,
+                        status: user.status ?? fetched.status
+                    };
+                });
+                if (!isCancelled) setResolvedUsers(mergedUsers);
+            } catch (error) {
+                console.error('Failed to resolve user profiles:', error);
+                if (!isCancelled) setResolvedUsers(normalizedUsers);
+            } finally{
+                if (!isCancelled) setLoadingProfiles(false);
+            }
+        };
+        fetchProfiles();
+        return ()=>{
+            isCancelled = true;
+        };
+    }, [
+        normalizedUsers.length
+    ]);
+    if (!resolvedUsers.length || loadingProfiles) return null;
     return /*#__PURE__*/ jsx("div", {
-        className: clsxWithTw('flex gap-1 flex-wrap', className),
+        className: clsxWithTw('flex flex-wrap gap-1', className),
         style: style,
-        children: displayUsers.map((user)=>/*#__PURE__*/ jsx(Popover, {
-                placement: "bottomLeft",
-                trigger: "click",
-                content: /*#__PURE__*/ jsx(UserProfile, {
-                    user_id: user.user_id
-                }),
-                arrow: false,
-                styles: {
-                    body: {
-                        padding: 0
-                    }
-                },
-                children: /*#__PURE__*/ jsx("div", {
-                    children: /*#__PURE__*/ jsx(UserWithAvatar, {
-                        data: user,
-                        size: size,
-                        className: "cursor-pointer hover:bg-[rgba(31,35,41,0.15)] active:bg-[rgba(31,35,41,0.2)]"
+        children: resolvedUsers.map((user)=>/*#__PURE__*/ jsxs(Popover, {
+                children: [
+                    /*#__PURE__*/ jsx(PopoverTrigger, {
+                        asChild: true,
+                        children: /*#__PURE__*/ jsx("div", {
+                            children: /*#__PURE__*/ jsx(UserWithAvatar, {
+                                data: user,
+                                size: size,
+                                className: "cursor-pointer hover:bg-[rgba(31,35,41,0.15)] active:bg-[rgba(31,35,41,0.2)]"
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ jsx(PopoverContent, {
+                        align: "start",
+                        sideOffset: 8,
+                        className: "w-[320px] border-border/50 bg-card p-0 border-0 shadow-[0px_8px_24px_8px_rgba(31,35,41,0.04),0px_6px_12px_rgba(31,35,41,0.04),0px_4px_8px_-8px_rgba(31,35,41,0.06)]",
+                        children: /*#__PURE__*/ jsx(UserProfile, {
+                            user_id: user.user_id
+                        })
                     })
-                })
+                ]
             }, user.user_id))
     });
 };

package/lib/components/User/UserProfile/UserProfile.css

@@ -25,7 +25,7 @@
 }
 
 .user-profile-name {
-  color: #1f2937;
+  color: var(--color-card-foreground);
   margin-bottom: 0;
   font-size: 22px;
   font-weight: 600;

package/lib/components/User/UserProfile/UserProfileContainer.d.ts

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import { PropsWithChildren } from 'react';
+import type { PropsWithChildren } from 'react';
 import './UserProfile.css';
 export declare const UserProfileContainer: ({ children }: PropsWithChildren<any>) => React.JSX.Element;

package/lib/components/User/UserProfile/UserProfileSkeleton.d.ts

@@ -1,3 +1,2 @@
 import * as React from 'react';
-import './UserProfile.css';
 export declare function UserProfileSkeleton(): React.JSX.Element;

package/lib/components/User/UserProfile/UserProfileSkeleton.js

@@ -1,36 +1,28 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import "react";
-import { Skeleton } from "antd";
-import "./UserProfile.css";
+import { Skeleton } from "../../ui/skeleton.js";
 function UserProfileSkeleton() {
-    return /*#__PURE__*/ jsxs("div", {
-        className: "p-5 bg-white",
-        children: [
-            /*#__PURE__*/ jsx(Skeleton, {
-                loading: true,
-                avatar: {
-                    size: 90,
-                    shape: 'circle'
-                },
-                active: true,
-                paragraph: false,
-                round: true,
-                title: false,
-                className: "mt-[68px]"
-            }),
-            /*#__PURE__*/ jsx(Skeleton, {
-                loading: true,
-                title: false,
-                paragraph: {
-                    rows: 2,
-                    width: [
-                        '120px',
-                        '180px'
+    return /*#__PURE__*/ jsx("div", {
+        className: "p-5 bg-background",
+        children: /*#__PURE__*/ jsxs("div", {
+            className: "pt-0",
+            children: [
+                /*#__PURE__*/ jsx(Skeleton, {
+                    className: "h-[90px] w-[90px] rounded-full mt-[68px]"
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: "mt-[22px] flex flex-col gap-4",
+                    children: [
+                        /*#__PURE__*/ jsx(Skeleton, {
+                            className: "h-4 w-[120px] rounded-full"
+                        }),
+                        /*#__PURE__*/ jsx(Skeleton, {
+                            className: "h-4 w-[180px] rounded-full"
+                        })
                     ]
-                },
-                className: "mt-[22px] user-profile-skeleton-lines"
-            })
-        ]
+                })
+            ]
+        })
     });
 }
 export { UserProfileSkeleton };

package/lib/components/User/UserProfile/UserProfileUI.d.ts

@@ -1,6 +1,5 @@
 import * as React from 'react';
-import './UserProfile.css';
-import { User } from './type';
+import type { User } from './type';
 interface UserProfileUIProps {
     user: User;
 }

package/lib/components/User/UserProfile/UserProfileUI.js

@@ -1,107 +1,121 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import "react";
-import { Avatar, Button, Card, Tag, Typography } from "antd";
-import "./UserProfile.css";
-import { getChatAppLink } from "./utils.js";
+import { useState } from "react";
 import { clsxWithTw } from "../../../utils/utils.js";
+import { getChatAppLink } from "./utils.js";
+import { OverflowTooltipText } from "../../ui/overflow-tooltip-text.js";
 function UserProfileUI({ user }) {
-    return /*#__PURE__*/ jsxs(Card, {
-        className: "border-0",
-        cover: /*#__PURE__*/ jsx("img", {
-            alt: "cover",
-            src: "https://lf3-static.bytednsdoc.com/obj/eden-cn/LMfspH/ljhwZthlaukjlkulzlp/miao/default-cover.png",
-            className: "h-[136px] w-full object-cover"
-        }),
-        bodyStyle: {
-            padding: '16px'
-        },
+    const [avatarError, setAvatarError] = useState(false);
+    const canShowAvatar = Boolean(user.avatar) && !avatarError;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "overflow-hidden rounded-[8px] border-0 bg-card text-card-foreground h-full",
         children: [
-            /*#__PURE__*/ jsxs("div", {
-                className: "relative flex flex-col -mt-16 user-profile-button",
-                children: [
-                    /*#__PURE__*/ jsx(Avatar, {
-                        size: 96,
-                        src: user.avatar,
-                        className: "border-4 border-white -mx-1 user-profile-avatar"
-                    }),
-                    /*#__PURE__*/ jsxs("div", {
-                        className: "flex gap-1 items-center user-profile-name-container",
-                        children: [
-                            /*#__PURE__*/ jsx(Typography.Title, {
-                                level: 2,
-                                ellipsis: {
-                                    rows: 1,
-                                    tooltip: user.name
-                                },
-                                className: "user-profile-name",
-                                children: user.name
-                            }),
-                            'inactive' === user.status && /*#__PURE__*/ jsx(Tag, {
-                                color: "#f50",
-                                style: {
-                                    marginRight: 0
-                                },
-                                children: "暂停使用"
-                            })
-                        ]
-                    }),
-                    user.feishu_open_id ? /*#__PURE__*/ jsx("div", {
-                        className: "w-ful mt-2",
-                        children: /*#__PURE__*/ jsx(Button, {
-                            type: "primary",
-                            icon: /*#__PURE__*/ jsx("svg", {
-                                width: "24",
-                                height: "24",
-                                viewBox: "0 0 24 24",
-                                fill: "none",
-                                xmlns: "http://www.w3.org/2000/svg",
-                                className: "w-[18px] h-[18px]",
-                                children: /*#__PURE__*/ jsx("path", {
-                                    d: "M4.44576 19.2236L3.39131 20.7324C2.86623 21.4838 3.41996 22.5 4.35448 22.5H11.7556C11.7556 22.5 11.7593 22.4996 11.7661 22.4995C11.8225 22.4984 12.094 22.4991 12.2975 22.4996L12.5 22.5C12.9236 22.5 13.3414 22.4749 13.7519 22.4261L13.7544 22.4258C18.962 21.8059 23 17.3745 23 12C23 10.567 22.5218 8.58544 22.5 8.52497C21.8654 6.76558 20.7624 5.22024 19.3364 4.03023C17.4995 2.45304 15.111 1.5 12.5 1.5C12.4676 1.5 12.4352 1.50015 12.4028 1.50044C12.3695 1.50015 12.3362 1.5 12.3028 1.5C6.33659 1.5 1.5 6.20101 1.5 12C1.5 12.197 1.50558 12.3928 1.5166 12.5871C1.65458 15.1526 2.74286 17.4735 4.44576 19.2236ZM17 10C17 10.5 16.6133 11 16 11H9.01953C8.39798 11 8 10.5 8 10C8 9.39844 8.5 9 9 9H16C16.5 9 17 9.39844 17 10ZM12.9883 13C13.6055 13 14 13.5 14 14C14 14.5 13.6055 15 13 15H9C8.5 15 8 14.6018 8 14C8 13.3982 8.5 13 9 13H12.9883Z",
-                                    fill: "#2B2F36"
-                                })
-                            }),
-                            className: "gap-1 rounded-[10px] h-[42px] w-full bg-[#F5F6F7] text-[#2B2F36] hover:bg-[rgba(31,35,41,0.08)] active:bg-[rgba(31,35,41,0.12)] border-none",
-                            href: getChatAppLink(user.feishu_open_id),
-                            target: "_blank",
-                            rel: "noopener noreferrer",
-                            children: "消息"
-                        })
-                    }) : null
-                ]
+            /*#__PURE__*/ jsx("div", {
+                className: "mt-[-1px] ms-[-1px] me-[-1px]",
+                children: /*#__PURE__*/ jsx("div", {
+                    className: "h-[136px] w-full",
+                    children: /*#__PURE__*/ jsx("img", {
+                        alt: "cover",
+                        src: "https://lf3-static.bytednsdoc.com/obj/eden-cn/LMfspH/ljhwZthlaukjlkulzlp/miao/default-cover.png",
+                        className: "h-full w-full object-cover"
+                    })
+                })
             }),
             /*#__PURE__*/ jsxs("div", {
-                className: "mt-2",
+                className: "p-4",
                 children: [
-                    /*#__PURE__*/ jsxs("div", {
-                        className: "flex py-2 gap-4",
-                        children: [
-                            /*#__PURE__*/ jsx("span", {
-                                className: "text-sm text-[#646A73] min-w-[74px]",
-                                children: "部门"
-                            }),
-                            /*#__PURE__*/ jsx("span", {
-                                className: clsxWithTw('text-sm text-[#1F2329] flex-1 break-all', {
-                                    'text-[#8F959E]': !user.department
+                    /*#__PURE__*/ jsx("div", {
+                        className: "relative flex flex-col -mt-16 user-profile-button",
+                        children: /*#__PURE__*/ jsxs("div", {
+                            className: "-mx-1 flex flex-col items-start",
+                            children: [
+                                /*#__PURE__*/ jsx("div", {
+                                    className: "flex items-center",
+                                    children: /*#__PURE__*/ jsx("div", {
+                                        className: "h-24 w-24 overflow-hidden rounded-full border-4 border-white bg-muted shadow-[0px_6px_18px_6px_rgba(31,35,41,0.03),0px_3px_6px_-6px_rgba(31,35,41,0.05),0px_4px_8px_rgba(31,35,41,0.03)]",
+                                        children: canShowAvatar ? /*#__PURE__*/ jsx("img", {
+                                            src: user.avatar,
+                                            alt: user.name,
+                                            className: "h-full w-full object-cover",
+                                            onError: ()=>setAvatarError(true)
+                                        }) : null
+                                    })
                                 }),
-                                children: user.department || '--'
-                            })
-                        ]
+                                /*#__PURE__*/ jsxs("div", {
+                                    className: "flex w-full items-center gap-2 user-profile-name-container",
+                                    children: [
+                                        /*#__PURE__*/ jsx("h2", {
+                                            className: "min-w-0",
+                                            children: /*#__PURE__*/ jsx(OverflowTooltipText, {
+                                                text: user.name,
+                                                className: "block truncate text-[22px] font-semibold leading-[28px] text-card-foreground"
+                                            })
+                                        }),
+                                        'inactive' === user.status && /*#__PURE__*/ jsx("span", {
+                                            className: "shrink-0 inline-flex items-center rounded-sm bg-destructive px-2 py-0.5 text-xs font-medium text-white",
+                                            children: "暂停使用"
+                                        })
+                                    ]
+                                }),
+                                user.feishu_open_id ? /*#__PURE__*/ jsx("div", {
+                                    className: "w-full mt-2",
+                                    children: /*#__PURE__*/ jsxs("a", {
+                                        className: "inline-flex h-[42px] w-full items-center justify-center gap-2 rounded-[10px] border border-transparent bg-muted text-sm font-medium text-foreground transition-colors focus-visible:outline-none hover:bg-foreground/10 active:bg-foreground/15",
+                                        href: getChatAppLink(user.feishu_open_id),
+                                        target: "_blank",
+                                        rel: "noopener noreferrer",
+                                        children: [
+                                            /*#__PURE__*/ jsx("svg", {
+                                                width: "18",
+                                                height: "18",
+                                                viewBox: "0 0 24 24",
+                                                fill: "none",
+                                                xmlns: "http://www.w3.org/2000/svg",
+                                                children: /*#__PURE__*/ jsx("path", {
+                                                    d: "M4.44576 19.2236L3.39131 20.7324C2.86623 21.4838 3.41996 22.5 4.35448 22.5H11.7556C11.7556 22.5 11.7593 22.4996 11.7661 22.4995C11.8225 22.4984 12.094 22.4991 12.2975 22.4996L12.5 22.5C12.9236 22.5 13.3414 22.4749 13.7519 22.4261L13.7544 22.4258C18.962 21.8059 23 17.3745 23 12C23 10.567 22.5218 8.58544 22.5 8.52497C21.8654 6.76558 20.7624 5.22024 19.3364 4.03023C17.4995 2.45304 15.111 1.5 12.5 1.5C12.4676 1.5 12.4352 1.50015 12.4028 1.50044C12.3695 1.50015 12.3362 1.5 12.3028 1.5C6.33659 1.5 1.5 6.20101 1.5 12C1.5 12.197 1.50558 12.3928 1.5166 12.5871C1.65458 15.1526 2.74286 17.4735 4.44576 19.2236ZM17 10C17 10.5 16.6133 11 16 11H9.01953C8.39798 11 8 10.5 8 10C8 9.39844 8.5 9 9 9H16C16.5 9 17 9.39844 17 10ZM12.9883 13C13.6055 13 14 13.5 14 14C14 14.5 13.6055 15 13 15H9C8.5 15 8 14.6018 8 14C8 13.3982 8.5 13 9 13H12.9883Z",
+                                                    fill: "currentColor"
+                                                })
+                                            }),
+                                            "消息"
+                                        ]
+                                    })
+                                }) : null
+                            ]
+                        })
                     }),
                     /*#__PURE__*/ jsxs("div", {
-                        className: "flex py-2 gap-4",
+                        className: "mt-2",
                         children: [
-                            /*#__PURE__*/ jsx("span", {
-                                className: "text-sm text-[#646A73] min-w-[74px]",
-                                children: "邮箱"
+                            /*#__PURE__*/ jsxs("div", {
+                                className: "flex items-start gap-4 py-2",
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: "min-w-[74px] text-sm text-muted-foreground",
+                                        children: "部门"
+                                    }),
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: clsxWithTw('flex-1 break-all text-sm text-foreground', {
+                                            'text-muted-foreground': !user.department
+                                        }),
+                                        children: user.department || '--'
+                                    })
+                                ]
                             }),
-                            user.email ? /*#__PURE__*/ jsx("a", {
-                                href: `mailto:${user.email}`,
-                                className: "text-sm text-blue-500 flex-1 break-all",
-                                children: user.email
-                            }) : /*#__PURE__*/ jsx("span", {
-                                className: "text-sm text-[#8F959E] flex-1 break-all",
-                                children: "--"
+                            /*#__PURE__*/ jsxs("div", {
+                                className: "flex items-start gap-4 py-2",
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        className: "min-w-[74px] text-sm text-muted-foreground",
+                                        children: "邮箱"
+                                    }),
+                                    user.email ? /*#__PURE__*/ jsx("a", {
+                                        href: `mailto:${user.email}`,
+                                        className: "flex-1 break-all text-sm text-primary",
+                                        children: user.email
+                                    }) : /*#__PURE__*/ jsx("span", {
+                                        className: "flex-1 break-all text-sm text-muted-foreground",
+                                        children: "--"
+                                    })
+                                ]
                             })
                         ]
                     })

package/lib/components/User/UserSelect.d.ts

@@ -1,11 +1,11 @@
 import React from 'react';
 import type { IUserProfile } from '../../apis/udt-types';
-import './UserSelect.css';
 export interface UserSelectProps {
     value?: IUserProfile | IUserProfile[];
     onChange?: (value: IUserProfile | IUserProfile[]) => void;
     defaultValue?: IUserProfile | IUserProfile[];
     mode?: 'single' | 'multiple';
     placeholder?: string;
+    fetchUsers?: (keyword: string) => Promise<IUserProfile[]>;
 }
 export declare const UserSelect: React.FC<UserSelectProps>;