eli-video-interview 1.2.42-alpha.40 → 1.2.42-alpha.42

package/esm/modules/ai-ability-select/Root.js

@@ -21,7 +21,8 @@ import { Stack } from 'fbm-ui/lib/mui';
 import { forwardRef, memo, useEffect } from 'react';
 var ScrollDialogContent = styled(Box)({
     maxHeight: 'calc(100vh - 192px)',
-    overflow: 'scroll',
+    height: 'calc(100vh - 192px)',
+    overflow: 'hidden',
 });
 var AiAbilitySelectRoot = forwardRef(function (_a, ref) {
     var jobToken = _a.jobToken, thirdToken = _a.thirdToken, token = _a.token, hiddenTips = _a.hiddenTips;
@@ -41,7 +42,7 @@ var AiAbilitySelectRoot = forwardRef(function (_a, ref) {
         setEnterprise({ jobToken: jobToken, thirdToken: thirdToken });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [jobToken, thirdToken]);
-    return (_jsx(ScrollDialogContent, __assign({ ref: ref }, { children: _jsxs(Box, __assign({ display: "flex", flexDirection: "column", width: 760 }, { children: [_jsxs(Stack, __assign({ spacing: 2, mb: 2 }, { children: [_jsx(Typography, __assign({ variant: "body1", fontWeight: 500 }, { children: !hiddenTips ? '请选择要优先使用的考察能力，也可以点击「下一步」直接出题' : '已选择的考察能力会优先在面试题目中展示' })), (aiAbilityList === null || aiAbilityList === void 0 ? void 0 : aiAbilityList.some(function (v) { return v.isNew; })) && (_jsxs(Stack, __assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx("img", { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn", alt: "", width: 38, height: 16 }), _jsx(Typography, __assign({ variant: "caption", color: "textSecondary" }, { children: "AI\u6839\u636E\u5C97\u4F4D\u4FE1\u606F\u751F\u6210\u7684\u80FD\u529B\uFF0C\u521B\u5EFA\u5B8C\u6B65\u9AA4\u540E\uFF0C\u4F1A\u81EA\u52A8\u5C06\u9009\u62E9\u7684\u65B0\u589E\u80FD\u529B\u52A0\u5165\u5230\u8BBE\u7F6E\u9875\u7684\u8003\u5BDF\u80FD\u529B\u5217\u8868\u4E2D\u3002" }))] })))] })), _jsx(AiAbilityList, { items: aiAbilityList })] })) })));
+    return (_jsx(ScrollDialogContent, __assign({ ref: ref }, { children: _jsxs(Box, __assign({ display: "flex", flexDirection: "column", width: 760, height: 1 }, { children: [_jsxs(Stack, __assign({ spacing: 2, mb: 2 }, { children: [_jsx(Typography, __assign({ variant: "body1", fontWeight: 500 }, { children: !hiddenTips ? '请选择要优先使用的考察能力，也可以点击「下一步」直接出题' : '已选择的考察能力会优先在面试题目中展示' })), (aiAbilityList === null || aiAbilityList === void 0 ? void 0 : aiAbilityList.some(function (v) { return v.isNew; })) && (_jsxs(Stack, __assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [_jsx("img", { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn", alt: "", width: 38, height: 16 }), _jsx(Typography, __assign({ variant: "caption", color: "textSecondary" }, { children: "AI\u6839\u636E\u5C97\u4F4D\u4FE1\u606F\u751F\u6210\u7684\u80FD\u529B\uFF0C\u521B\u5EFA\u5B8C\u6B65\u9AA4\u540E\uFF0C\u4F1A\u81EA\u52A8\u5C06\u9009\u62E9\u7684\u65B0\u589E\u80FD\u529B\u52A0\u5165\u5230\u8BBE\u7F6E\u9875\u7684\u8003\u5BDF\u80FD\u529B\u5217\u8868\u4E2D\u3002" }))] })))] })), _jsx(AiAbilityList, { items: aiAbilityList })] })) })));
 });
 AiAbilitySelectRoot.displayName = 'AiAbilitySelectRoot';
 export default memo(AiAbilitySelectRoot);

package/esm/modules/ai-ability-select/components/AiAbilityItem/AiAbilityDetail.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { AiAbilityDetailProps } from './interface';
-declare const AiAbilityDetail: React.FC<AiAbilityDetailProps>;
-export default AiAbilityDetail;
+declare const _default: import("react").NamedExoticComponent<AiAbilityDetailProps>;
+export default _default;

package/esm/modules/ai-ability-select/components/AiAbilityItem/AiAbilityDetail.js

@@ -12,6 +12,7 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box, Typography } from 'fbm-ui';
 import { Stack } from 'fbm-ui/lib/mui';
+import { memo } from 'react';
 var AiAbilityDetail = function (_a) {
     var detail = _a.detail;
     return (_jsx(Box, __assign({ p: 2, maxHeight: 582, overflow: "scroll" }, { children: detail === null || detail === void 0 ? void 0 : detail.map(function (v) {
@@ -19,4 +20,4 @@ var AiAbilityDetail = function (_a) {
             return (_jsxs(Stack, __assign({ mb: 2, spacing: 1, width: 300 }, { children: [_jsx(Typography, __assign({ variant: "body2", fontWeight: 500 }, { children: v.name })), _jsx(Typography, __assign({ variant: "body2", color: "textSecondary" }, { children: (_a = v.items) === null || _a === void 0 ? void 0 : _a.join('\n') }))] }), v.name));
         }) })));
 };
-export default AiAbilityDetail;
+export default memo(AiAbilityDetail);

package/esm/modules/ai-ability-select/components/AiAbilityItem/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { AiAbilityItemProps } from './interface';
-declare const AiAbilityItem: React.FC<AiAbilityItemProps>;
-export default AiAbilityItem;
+declare const _default: import("react").NamedExoticComponent<AiAbilityItemProps>;
+export default _default;

package/esm/modules/ai-ability-select/components/AiAbilityItem/index.js

@@ -39,15 +39,14 @@ import AiAbilityDetail from './AiAbilityDetail';
 import { NewBadge } from './styled';
 import { useAiAbilityListStore } from "../../../../store/ai-ability-select/question-ability-store";
 import { Box, Checkbox, Paper, Popover, Typography } from 'fbm-ui';
+import { memo } from 'react';
 var AiAbilityItem = function (_a) {
     var name = _a.name, isNew = _a.isNew, token = _a.token, detail = _a.detail;
     var _b = useAiAbilityListStore(), selctedAbilitys = _b.selctedAbilitys, setSelctedAbilitys = _b.setSelctedAbilitys;
     var handleChange = function (_, checked) {
         return setSelctedAbilitys(__spreadArray(__spreadArray([], __read(selctedAbilitys.filter(function (v) { return v !== token; })), false), __read((checked ? [token] : [])), false));
     };
-    return (_jsx(Paper, __assign({ variant: "outlined" }, { children: _jsxs(Box, __assign({ sx: { pl: 2, width: 240, height: 54, display: 'flex', alignItems: 'center', position: 'relative' } }, { children: [_jsx(Checkbox, { onChange: handleChange, label: _jsx(AiAbilityLable, { name: name, detail: detail }), checked: selctedAbilitys.includes(token), 
-                    // @ts-ignore
-                    sx: { width: 1, height: 1 } }), isNew && _jsx(NewBadge, { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn" })] })) })));
+    return (_jsx(Paper, __assign({ variant: "outlined" }, { children: _jsxs(Box, __assign({ sx: { pl: 2, width: 240, height: 54, display: 'flex', alignItems: 'center', position: 'relative' } }, { children: [_jsx(Checkbox, { onChange: handleChange, label: _jsx(MemoAiAbilityLable, { name: name, detail: detail }), checked: selctedAbilitys.includes(token), sx: { width: 1, height: 1 } }), isNew && _jsx(NewBadge, { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn" })] })) })));
 };
 var AiAbilityLable = function (_a) {
     var name = _a.name, detail = _a.detail;
@@ -55,4 +54,5 @@ var AiAbilityLable = function (_a) {
         return (_jsx(Popover, __assign({ content: _jsx(AiAbilityDetail, { detail: detail }), trigger: "hover", placement: "right" }, { children: _jsx(Typography, __assign({ noWrap: true, maxWidth: 180, variant: "body2", sx: { mt: 0.5 } }, { children: name })) })));
     return (_jsx(Typography, __assign({ noWrap: true, maxWidth: 180, variant: "body2" }, { children: name })));
 };
-export default AiAbilityItem;
+var MemoAiAbilityLable = memo(AiAbilityLable);
+export default memo(AiAbilityItem);

package/esm/modules/ai-ability-select/components/AiAbilityList/index.js

@@ -11,9 +11,21 @@ var __assign = (this && this.__assign) || function () {
 };
 import { jsx as _jsx } from "react/jsx-runtime";
 import AiAbilityItem from '../AiAbilityItem';
-import { Grid } from 'fbm-ui';
+import AutoSizer from 'react-virtualized-auto-sizer';
+import { FixedSizeGrid as Grid } from 'react-window';
+var Cell = function (_a) {
+    var data = _a.data, columnIndex = _a.columnIndex, rowIndex = _a.rowIndex, style = _a.style;
+    var item = data[rowIndex * 3 + columnIndex];
+    if (!item) {
+        return null;
+    }
+    return (_jsx("div", __assign({ style: __assign(__assign({}, style), { width: style.width - 8, height: style.height - 8 }) }, { children: _jsx(AiAbilityItem, __assign({}, item)) })));
+};
 var AiAbilityList = function (_a) {
     var items = _a.items;
-    return (_jsx(Grid, __assign({ container: true, spacing: 1, rowSpacing: 1, columnSpacing: 1 }, { children: items === null || items === void 0 ? void 0 : items.map(function (item) { return (_jsx(Grid, __assign({ item: true }, { children: _jsx(AiAbilityItem, __assign({}, item)) }), item.token)); }) })));
+    return (_jsx(AutoSizer, { children: function (_a) {
+            var height = _a.height, width = _a.width;
+            return (_jsx(Grid, __assign({ columnCount: 3, columnWidth: 240, overscanRowCount: 10, height: height, rowCount: Math.ceil(items.length / 3), rowHeight: 62, width: width, itemData: items }, { children: Cell })));
+        } }));
 };
 export default AiAbilityList;

package/esm/modules/ai-question/components/BaseAccordion/index.js

@@ -41,7 +41,7 @@ import { Accordion, AccordionDetails, AccordionSummary, List, ListItem, ListItem
 import { memo, useCallback, useEffect, useRef, useState } from 'react';
 var LANGUAGE_TYPE_LIST = [LANGUAGE_TYPE.MANDARIN, LANGUAGE_TYPE.CANTONESE, LANGUAGE_TYPE.JAPANESE, LANGUAGE_TYPE.ENGLISH];
 var BaseAccordion = function (props) {
-    var name = props.name, positionName = props.positionName, list = props.list, index = props.index, isShowOnlyAITest = props.isShowOnlyAITest, _a = props.isShowDesc, isShowDesc = _a === void 0 ? false : _a, _b = props.isShowSummaryAction, isShowSummaryAction = _b === void 0 ? false : _b, _c = props.isShowConfirm, isShowConfirm = _c === void 0 ? false : _c, _d = props.isShowPreview, isShowPreview = _d === void 0 ? true : _d, _e = props.isNew, isNew = _e === void 0 ? false : _e, _f = props.isOem, isOem = _f === void 0 ? false : _f;
+    var name = props.name, positionName = props.positionName, list = props.list, index = props.index, isShowOnlyAITest = props.isShowOnlyAITest, _a = props.isShowDesc, isShowDesc = _a === void 0 ? false : _a, _b = props.isShowSummaryAction, isShowSummaryAction = _b === void 0 ? false : _b, _c = props.isShowConfirm, isShowConfirm = _c === void 0 ? false : _c, _d = props.isShowPreview, isShowPreview = _d === void 0 ? true : _d, _e = props.isNew, isNew = _e === void 0 ? false : _e, _f = props.isOem, isOem = _f === void 0 ? false : _f, expanded = props.expanded, token = props.token, onExpandedChange = props.onExpandedChange;
     var ref = useRef(null);
     var isHovering = useHover(ref);
     var updatePreview = useQuestionPreviewStore().updatePreview;
@@ -104,7 +104,7 @@ var BaseAccordion = function (props) {
             setQuestionsList(filterList);
         }
     }, [list, isShowOnlyAITest, isOem]);
-    return (_jsx(_Fragment, { children: questionsList.length > 0 && (_jsx(AccordionRoot, { children: _jsxs(Accordion, __assign({ defaultExpanded: index === 0 }, { children: [_jsx(AccordionSummary, __assign({ expandIcon: _jsx(ExpandMore, {}), sx: {
+    return (_jsx(_Fragment, { children: questionsList.length > 0 && (_jsx(AccordionRoot, { children: _jsxs(Accordion, __assign({ defaultExpanded: index === 0, expanded: expanded === token, onChange: onExpandedChange(token) }, { children: [_jsx(AccordionSummary, __assign({ expandIcon: _jsx(ExpandMore, {}), sx: {
                             '&:after': {
                                 content: "".concat(isNew ? 'url(//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn)' : '" "'),
                                 position: 'absolute',
@@ -113,13 +113,13 @@ var BaseAccordion = function (props) {
                                 width: 38,
                                 height: 16,
                             },
-                        } }, { children: _jsxs(Box, __assign({ flex: "1 0", display: "flex", justifyContent: "space-between", alignItems: "center", overflow: "hidden" }, { children: [_jsxs(Box, __assign({ flex: "1 0", overflow: "hidden" }, { children: [_jsx(AccordionTitle, { children: positionName || name }), positionName && _jsxs(AccordionSubTitle, __assign({ color: "secondary" }, { children: ["\u6B65\u9AA4\uFF1A", name] }))] })), isShowSummaryAction && (_jsx(Button, __assign({ sx: { mr: 1, flexShrink: 0, height: 24 }, variant: "outlined", color: "inherit", size: "small", onClick: handleUseAllQuestion }, { children: "\u4F7F\u7528" })))] })) })), _jsxs(AccordionDetails, { children: [_jsx(List, __assign({ ref: ref }, { children: questionsList.map(function (item) {
+                        } }, { children: _jsxs(Box, __assign({ flex: "1 0", display: "flex", justifyContent: "space-between", alignItems: "center", overflow: "hidden" }, { children: [_jsxs(Box, __assign({ flex: "1 0", overflow: "hidden" }, { children: [_jsx(AccordionTitle, { children: positionName || name }), positionName && _jsxs(AccordionSubTitle, __assign({ color: "secondary" }, { children: ["\u6B65\u9AA4\uFF1A", name] }))] })), isShowSummaryAction && (_jsx(Button, __assign({ sx: { mr: 1, flexShrink: 0, height: 24 }, variant: "outlined", color: "inherit", size: "small", onClick: handleUseAllQuestion }, { children: "\u4F7F\u7528" })))] })) })), expanded === token && (_jsxs(AccordionDetails, { children: [_jsx(List, __assign({ ref: ref }, { children: questionsList.map(function (item) {
                                     var token = item.token, name = item.name, category = item.category;
                                     var isUsed = questionModelData === null || questionModelData === void 0 ? void 0 : questionModelData.steps.find(function (step) { return step.originToken === token; });
                                     return (_jsx(ListItem, __assign({ secondaryAction: [
                                             isUsed && _jsx(Done, {}, "icon"),
                                             _jsx(Box, __assign({ className: "secondary-action-buttons" }, { children: _jsx(Button, __assign({ variant: "outlined", color: "inherit", size: "small", onClick: function () { return handleUseQuestion(item); } }, { children: "\u4F7F\u7528" })) }), "buttons"),
                                         ], onMouseOver: function () { return handleMouseOver(item); } }, { children: _jsx(ListItemText, { primary: name, secondary: isShowDesc && category ? category[0] : '' }) }), token));
-                                }) })), isPaging && (_jsx(Button, __assign({ variant: "text", sx: { width: '100%', justifyContent: 'start', color: '#576B95' }, onClick: handleShowAll }, { children: "\u5C55\u793A\u5168\u90E8" })))] })] })) })) }));
+                                }) })), isPaging && (_jsx(Button, __assign({ variant: "text", sx: { width: '100%', justifyContent: 'start', color: '#576B95' }, onClick: handleShowAll }, { children: "\u5C55\u793A\u5168\u90E8" })))] }))] })) })) }));
 };
 export default memo(BaseAccordion);

package/esm/modules/ai-question/components/BaseAccordion/interface.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { AiEvaluationDataList } from '../QuestionTemplate/interface';
 export interface BaseAccordionProps extends AiEvaluationDataList {
     index?: number;
@@ -7,4 +8,6 @@ export interface BaseAccordionProps extends AiEvaluationDataList {
     isShowSummaryAction?: boolean;
     isShowConfirm?: boolean;
     isOem?: boolean;
+    expanded: string | false;
+    onExpandedChange: (panel: string) => (event: React.SyntheticEvent, expanded: boolean) => void;
 }

package/esm/modules/ai-question/components/QuestionTemplate/AiEvaluation.js

@@ -40,7 +40,7 @@ import { uniqueId } from "../../../../utils/utils";
 import { useSetState } from 'ahooks';
 import { AddIcon, Box, Button, LayerOutlineIcon, MicIcon, Popover, RadioCheckedIcon, SMSOneIcon, Typography } from 'fbm-ui';
 import { List, ListItem, ListItemButton, ListItemIcon, ListItemText } from 'fbm-ui/lib/mui';
-import { useCallback } from 'react';
+import { useCallback, useState } from 'react';
 var ICONS = (_a = {},
     _a[ADD_QUESTION_TYPE.FREE] = _jsx(SMSOneIcon, { color: "secondary" }),
     _a[ADD_QUESTION_TYPE.LANGUAGE] = _jsx(MicIcon, { color: "secondary" }),
@@ -59,6 +59,10 @@ var AiEvaluation = function (_a) {
         showOnlyAITest: false,
     }), 2), state = _b[0], setState = _b[1];
     var addQuestionOpen = state.addQuestionOpen, showOnlyAITest = state.showOnlyAITest;
+    var _c = __read(useState(false), 2), expanded = _c[0], setExpanded = _c[1];
+    var handleExpandedChange = function (panel) { return function (event, isExpanded) {
+        setExpanded(isExpanded ? panel : false);
+    }; };
     var handleClickAdd = useCallback(function (aiShowType) {
         setState({ addQuestionOpen: false });
         updateQuestionState({
@@ -77,7 +81,7 @@ var AiEvaluation = function (_a) {
                 var name = _a.name, list = _a.list;
                 return (_jsxs(Box, { children: [_jsx(Typography, __assign({ fontSize: 12, lineHeight: 1.5, weight: "500", mb: 2 }, { children: name })), list
                             .filter(function (v) { return !isEdit || !v.isNew || selctedAbilitys.includes(v.token); })
-                            .map(function (item, i) { return (_jsx(BaseAccordion, __assign({ index: i, isOem: isOem, isShowOnlyAITest: showOnlyAITest, isShowDesc: index !== 0, isShowSummaryAction: index !== 0, isShowConfirm: index !== 0 }, item), item.token)); })] }, name));
+                            .map(function (item, i) { return (_jsx(BaseAccordion, __assign({ index: i, isOem: isOem, isShowOnlyAITest: showOnlyAITest, isShowDesc: index !== 0, isShowSummaryAction: index !== 0, isShowConfirm: index !== 0, expanded: expanded, onExpandedChange: handleExpandedChange }, item), item.token)); })] }, name));
             })] }));
 };
 export default AiEvaluation;

package/lib/modules/ai-ability-select/Root.js

@@ -26,7 +26,8 @@ var mui_1 = require("fbm-ui/lib/mui");
 var react_1 = require("react");
 var ScrollDialogContent = (0, fbm_ui_2.styled)(fbm_ui_1.Box)({
     maxHeight: 'calc(100vh - 192px)',
-    overflow: 'scroll',
+    height: 'calc(100vh - 192px)',
+    overflow: 'hidden',
 });
 var AiAbilitySelectRoot = (0, react_1.forwardRef)(function (_a, ref) {
     var jobToken = _a.jobToken, thirdToken = _a.thirdToken, token = _a.token, hiddenTips = _a.hiddenTips;
@@ -46,7 +47,7 @@ var AiAbilitySelectRoot = (0, react_1.forwardRef)(function (_a, ref) {
         setEnterprise({ jobToken: jobToken, thirdToken: thirdToken });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [jobToken, thirdToken]);
-    return ((0, jsx_runtime_1.jsx)(ScrollDialogContent, __assign({ ref: ref }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ display: "flex", flexDirection: "column", width: 760 }, { children: [(0, jsx_runtime_1.jsxs)(mui_1.Stack, __assign({ spacing: 2, mb: 2 }, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "body1", fontWeight: 500 }, { children: !hiddenTips ? '请选择要优先使用的考察能力，也可以点击「下一步」直接出题' : '已选择的考察能力会优先在面试题目中展示' })), (aiAbilityList === null || aiAbilityList === void 0 ? void 0 : aiAbilityList.some(function (v) { return v.isNew; })) && ((0, jsx_runtime_1.jsxs)(mui_1.Stack, __assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn", alt: "", width: 38, height: 16 }), (0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "caption", color: "textSecondary" }, { children: "AI\u6839\u636E\u5C97\u4F4D\u4FE1\u606F\u751F\u6210\u7684\u80FD\u529B\uFF0C\u521B\u5EFA\u5B8C\u6B65\u9AA4\u540E\uFF0C\u4F1A\u81EA\u52A8\u5C06\u9009\u62E9\u7684\u65B0\u589E\u80FD\u529B\u52A0\u5165\u5230\u8BBE\u7F6E\u9875\u7684\u8003\u5BDF\u80FD\u529B\u5217\u8868\u4E2D\u3002" }))] })))] })), (0, jsx_runtime_1.jsx)(AiAbilityList_1.default, { items: aiAbilityList })] })) })));
+    return ((0, jsx_runtime_1.jsx)(ScrollDialogContent, __assign({ ref: ref }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ display: "flex", flexDirection: "column", width: 760, height: 1 }, { children: [(0, jsx_runtime_1.jsxs)(mui_1.Stack, __assign({ spacing: 2, mb: 2 }, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "body1", fontWeight: 500 }, { children: !hiddenTips ? '请选择要优先使用的考察能力，也可以点击「下一步」直接出题' : '已选择的考察能力会优先在面试题目中展示' })), (aiAbilityList === null || aiAbilityList === void 0 ? void 0 : aiAbilityList.some(function (v) { return v.isNew; })) && ((0, jsx_runtime_1.jsxs)(mui_1.Stack, __assign({ direction: "row", spacing: 1, alignItems: "center" }, { children: [(0, jsx_runtime_1.jsx)("img", { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn", alt: "", width: 38, height: 16 }), (0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "caption", color: "textSecondary" }, { children: "AI\u6839\u636E\u5C97\u4F4D\u4FE1\u606F\u751F\u6210\u7684\u80FD\u529B\uFF0C\u521B\u5EFA\u5B8C\u6B65\u9AA4\u540E\uFF0C\u4F1A\u81EA\u52A8\u5C06\u9009\u62E9\u7684\u65B0\u589E\u80FD\u529B\u52A0\u5165\u5230\u8BBE\u7F6E\u9875\u7684\u8003\u5BDF\u80FD\u529B\u5217\u8868\u4E2D\u3002" }))] })))] })), (0, jsx_runtime_1.jsx)(AiAbilityList_1.default, { items: aiAbilityList })] })) })));
 });
 AiAbilitySelectRoot.displayName = 'AiAbilitySelectRoot';
 exports.default = (0, react_1.memo)(AiAbilitySelectRoot);

package/lib/modules/ai-ability-select/components/AiAbilityItem/AiAbilityDetail.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { AiAbilityDetailProps } from './interface';
-declare const AiAbilityDetail: React.FC<AiAbilityDetailProps>;
-export default AiAbilityDetail;
+declare const _default: import("react").NamedExoticComponent<AiAbilityDetailProps>;
+export default _default;

package/lib/modules/ai-ability-select/components/AiAbilityItem/AiAbilityDetail.js

@@ -14,6 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var fbm_ui_1 = require("fbm-ui");
 var mui_1 = require("fbm-ui/lib/mui");
+var react_1 = require("react");
 var AiAbilityDetail = function (_a) {
     var detail = _a.detail;
     return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Box, __assign({ p: 2, maxHeight: 582, overflow: "scroll" }, { children: detail === null || detail === void 0 ? void 0 : detail.map(function (v) {
@@ -21,4 +22,4 @@ var AiAbilityDetail = function (_a) {
             return ((0, jsx_runtime_1.jsxs)(mui_1.Stack, __assign({ mb: 2, spacing: 1, width: 300 }, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "body2", fontWeight: 500 }, { children: v.name })), (0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ variant: "body2", color: "textSecondary" }, { children: (_a = v.items) === null || _a === void 0 ? void 0 : _a.join('\n') }))] }), v.name));
         }) })));
 };
-exports.default = AiAbilityDetail;
+exports.default = (0, react_1.memo)(AiAbilityDetail);

package/lib/modules/ai-ability-select/components/AiAbilityItem/index.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { AiAbilityItemProps } from './interface';
-declare const AiAbilityItem: React.FC<AiAbilityItemProps>;
-export default AiAbilityItem;
+declare const _default: import("react").NamedExoticComponent<AiAbilityItemProps>;
+export default _default;

package/lib/modules/ai-ability-select/components/AiAbilityItem/index.js

@@ -44,15 +44,14 @@ var AiAbilityDetail_1 = __importDefault(require("./AiAbilityDetail"));
 var styled_1 = require("./styled");
 var question_ability_store_1 = require("../../../../store/ai-ability-select/question-ability-store");
 var fbm_ui_1 = require("fbm-ui");
+var react_1 = require("react");
 var AiAbilityItem = function (_a) {
     var name = _a.name, isNew = _a.isNew, token = _a.token, detail = _a.detail;
     var _b = (0, question_ability_store_1.useAiAbilityListStore)(), selctedAbilitys = _b.selctedAbilitys, setSelctedAbilitys = _b.setSelctedAbilitys;
     var handleChange = function (_, checked) {
         return setSelctedAbilitys(__spreadArray(__spreadArray([], __read(selctedAbilitys.filter(function (v) { return v !== token; })), false), __read((checked ? [token] : [])), false));
     };
-    return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Paper, __assign({ variant: "outlined" }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ sx: { pl: 2, width: 240, height: 54, display: 'flex', alignItems: 'center', position: 'relative' } }, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Checkbox, { onChange: handleChange, label: (0, jsx_runtime_1.jsx)(AiAbilityLable, { name: name, detail: detail }), checked: selctedAbilitys.includes(token), 
-                    // @ts-ignore
-                    sx: { width: 1, height: 1 } }), isNew && (0, jsx_runtime_1.jsx)(styled_1.NewBadge, { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn" })] })) })));
+    return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Paper, __assign({ variant: "outlined" }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ sx: { pl: 2, width: 240, height: 54, display: 'flex', alignItems: 'center', position: 'relative' } }, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Checkbox, { onChange: handleChange, label: (0, jsx_runtime_1.jsx)(MemoAiAbilityLable, { name: name, detail: detail }), checked: selctedAbilitys.includes(token), sx: { width: 1, height: 1 } }), isNew && (0, jsx_runtime_1.jsx)(styled_1.NewBadge, { src: "//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn" })] })) })));
 };
 var AiAbilityLable = function (_a) {
     var name = _a.name, detail = _a.detail;
@@ -60,4 +59,5 @@ var AiAbilityLable = function (_a) {
         return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Popover, __assign({ content: (0, jsx_runtime_1.jsx)(AiAbilityDetail_1.default, { detail: detail }), trigger: "hover", placement: "right" }, { children: (0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ noWrap: true, maxWidth: 180, variant: "body2", sx: { mt: 0.5 } }, { children: name })) })));
     return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ noWrap: true, maxWidth: 180, variant: "body2" }, { children: name })));
 };
-exports.default = AiAbilityItem;
+var MemoAiAbilityLable = (0, react_1.memo)(AiAbilityLable);
+exports.default = (0, react_1.memo)(AiAbilityItem);

package/lib/modules/ai-ability-select/components/AiAbilityList/index.js

@@ -16,9 +16,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var AiAbilityItem_1 = __importDefault(require("../AiAbilityItem"));
-var fbm_ui_1 = require("fbm-ui");
+var react_virtualized_auto_sizer_1 = __importDefault(require("react-virtualized-auto-sizer"));
+var react_window_1 = require("react-window");
+var Cell = function (_a) {
+    var data = _a.data, columnIndex = _a.columnIndex, rowIndex = _a.rowIndex, style = _a.style;
+    var item = data[rowIndex * 3 + columnIndex];
+    if (!item) {
+        return null;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", __assign({ style: __assign(__assign({}, style), { width: style.width - 8, height: style.height - 8 }) }, { children: (0, jsx_runtime_1.jsx)(AiAbilityItem_1.default, __assign({}, item)) })));
+};
 var AiAbilityList = function (_a) {
     var items = _a.items;
-    return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Grid, __assign({ container: true, spacing: 1, rowSpacing: 1, columnSpacing: 1 }, { children: items === null || items === void 0 ? void 0 : items.map(function (item) { return ((0, jsx_runtime_1.jsx)(fbm_ui_1.Grid, __assign({ item: true }, { children: (0, jsx_runtime_1.jsx)(AiAbilityItem_1.default, __assign({}, item)) }), item.token)); }) })));
+    return ((0, jsx_runtime_1.jsx)(react_virtualized_auto_sizer_1.default, { children: function (_a) {
+            var height = _a.height, width = _a.width;
+            return ((0, jsx_runtime_1.jsx)(react_window_1.FixedSizeGrid, __assign({ columnCount: 3, columnWidth: 240, overscanRowCount: 10, height: height, rowCount: Math.ceil(items.length / 3), rowHeight: 62, width: width, itemData: items }, { children: Cell })));
+        } }));
 };
 exports.default = AiAbilityList;

package/lib/modules/ai-question/components/BaseAccordion/index.js

@@ -43,7 +43,7 @@ var mui_1 = require("fbm-ui/lib/mui");
 var react_1 = require("react");
 var LANGUAGE_TYPE_LIST = [ai_question_2.LANGUAGE_TYPE.MANDARIN, ai_question_2.LANGUAGE_TYPE.CANTONESE, ai_question_2.LANGUAGE_TYPE.JAPANESE, ai_question_2.LANGUAGE_TYPE.ENGLISH];
 var BaseAccordion = function (props) {
-    var name = props.name, positionName = props.positionName, list = props.list, index = props.index, isShowOnlyAITest = props.isShowOnlyAITest, _a = props.isShowDesc, isShowDesc = _a === void 0 ? false : _a, _b = props.isShowSummaryAction, isShowSummaryAction = _b === void 0 ? false : _b, _c = props.isShowConfirm, isShowConfirm = _c === void 0 ? false : _c, _d = props.isShowPreview, isShowPreview = _d === void 0 ? true : _d, _e = props.isNew, isNew = _e === void 0 ? false : _e, _f = props.isOem, isOem = _f === void 0 ? false : _f;
+    var name = props.name, positionName = props.positionName, list = props.list, index = props.index, isShowOnlyAITest = props.isShowOnlyAITest, _a = props.isShowDesc, isShowDesc = _a === void 0 ? false : _a, _b = props.isShowSummaryAction, isShowSummaryAction = _b === void 0 ? false : _b, _c = props.isShowConfirm, isShowConfirm = _c === void 0 ? false : _c, _d = props.isShowPreview, isShowPreview = _d === void 0 ? true : _d, _e = props.isNew, isNew = _e === void 0 ? false : _e, _f = props.isOem, isOem = _f === void 0 ? false : _f, expanded = props.expanded, token = props.token, onExpandedChange = props.onExpandedChange;
     var ref = (0, react_1.useRef)(null);
     var isHovering = (0, ahooks_1.useHover)(ref);
     var updatePreview = (0, question_preview_store_1.useQuestionPreviewStore)().updatePreview;
@@ -106,7 +106,7 @@ var BaseAccordion = function (props) {
             setQuestionsList(filterList);
         }
     }, [list, isShowOnlyAITest, isOem]);
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: questionsList.length > 0 && ((0, jsx_runtime_1.jsx)(styled_1.AccordionRoot, { children: (0, jsx_runtime_1.jsxs)(mui_1.Accordion, __assign({ defaultExpanded: index === 0 }, { children: [(0, jsx_runtime_1.jsx)(mui_1.AccordionSummary, __assign({ expandIcon: (0, jsx_runtime_1.jsx)(icons_material_1.ExpandMore, {}), sx: {
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: questionsList.length > 0 && ((0, jsx_runtime_1.jsx)(styled_1.AccordionRoot, { children: (0, jsx_runtime_1.jsxs)(mui_1.Accordion, __assign({ defaultExpanded: index === 0, expanded: expanded === token, onChange: onExpandedChange(token) }, { children: [(0, jsx_runtime_1.jsx)(mui_1.AccordionSummary, __assign({ expandIcon: (0, jsx_runtime_1.jsx)(icons_material_1.ExpandMore, {}), sx: {
                             '&:after': {
                                 content: "".concat(isNew ? 'url(//webcdn.fbmms.cn/assets/XXRf/bdUI9qZoTx-l2k_OHTotn)' : '" "'),
                                 position: 'absolute',
@@ -115,13 +115,13 @@ var BaseAccordion = function (props) {
                                 width: 38,
                                 height: 16,
                             },
-                        } }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ flex: "1 0", display: "flex", justifyContent: "space-between", alignItems: "center", overflow: "hidden" }, { children: [(0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ flex: "1 0", overflow: "hidden" }, { children: [(0, jsx_runtime_1.jsx)(styled_1.AccordionTitle, { children: positionName || name }), positionName && (0, jsx_runtime_1.jsxs)(styled_1.AccordionSubTitle, __assign({ color: "secondary" }, { children: ["\u6B65\u9AA4\uFF1A", name] }))] })), isShowSummaryAction && ((0, jsx_runtime_1.jsx)(fbm_ui_1.Button, __assign({ sx: { mr: 1, flexShrink: 0, height: 24 }, variant: "outlined", color: "inherit", size: "small", onClick: handleUseAllQuestion }, { children: "\u4F7F\u7528" })))] })) })), (0, jsx_runtime_1.jsxs)(mui_1.AccordionDetails, { children: [(0, jsx_runtime_1.jsx)(mui_1.List, __assign({ ref: ref }, { children: questionsList.map(function (item) {
+                        } }, { children: (0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ flex: "1 0", display: "flex", justifyContent: "space-between", alignItems: "center", overflow: "hidden" }, { children: [(0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, __assign({ flex: "1 0", overflow: "hidden" }, { children: [(0, jsx_runtime_1.jsx)(styled_1.AccordionTitle, { children: positionName || name }), positionName && (0, jsx_runtime_1.jsxs)(styled_1.AccordionSubTitle, __assign({ color: "secondary" }, { children: ["\u6B65\u9AA4\uFF1A", name] }))] })), isShowSummaryAction && ((0, jsx_runtime_1.jsx)(fbm_ui_1.Button, __assign({ sx: { mr: 1, flexShrink: 0, height: 24 }, variant: "outlined", color: "inherit", size: "small", onClick: handleUseAllQuestion }, { children: "\u4F7F\u7528" })))] })) })), expanded === token && ((0, jsx_runtime_1.jsxs)(mui_1.AccordionDetails, { children: [(0, jsx_runtime_1.jsx)(mui_1.List, __assign({ ref: ref }, { children: questionsList.map(function (item) {
                                     var token = item.token, name = item.name, category = item.category;
                                     var isUsed = questionModelData === null || questionModelData === void 0 ? void 0 : questionModelData.steps.find(function (step) { return step.originToken === token; });
                                     return ((0, jsx_runtime_1.jsx)(mui_1.ListItem, __assign({ secondaryAction: [
                                             isUsed && (0, jsx_runtime_1.jsx)(icons_material_1.Done, {}, "icon"),
                                             (0, jsx_runtime_1.jsx)(fbm_ui_1.Box, __assign({ className: "secondary-action-buttons" }, { children: (0, jsx_runtime_1.jsx)(fbm_ui_1.Button, __assign({ variant: "outlined", color: "inherit", size: "small", onClick: function () { return handleUseQuestion(item); } }, { children: "\u4F7F\u7528" })) }), "buttons"),
                                         ], onMouseOver: function () { return handleMouseOver(item); } }, { children: (0, jsx_runtime_1.jsx)(mui_1.ListItemText, { primary: name, secondary: isShowDesc && category ? category[0] : '' }) }), token));
-                                }) })), isPaging && ((0, jsx_runtime_1.jsx)(fbm_ui_1.Button, __assign({ variant: "text", sx: { width: '100%', justifyContent: 'start', color: '#576B95' }, onClick: handleShowAll }, { children: "\u5C55\u793A\u5168\u90E8" })))] })] })) })) }));
+                                }) })), isPaging && ((0, jsx_runtime_1.jsx)(fbm_ui_1.Button, __assign({ variant: "text", sx: { width: '100%', justifyContent: 'start', color: '#576B95' }, onClick: handleShowAll }, { children: "\u5C55\u793A\u5168\u90E8" })))] }))] })) })) }));
 };
 exports.default = (0, react_1.memo)(BaseAccordion);

package/lib/modules/ai-question/components/BaseAccordion/interface.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { AiEvaluationDataList } from '../QuestionTemplate/interface';
 export interface BaseAccordionProps extends AiEvaluationDataList {
     index?: number;
@@ -7,4 +8,6 @@ export interface BaseAccordionProps extends AiEvaluationDataList {
     isShowSummaryAction?: boolean;
     isShowConfirm?: boolean;
     isOem?: boolean;
+    expanded: string | false;
+    onExpandedChange: (panel: string) => (event: React.SyntheticEvent, expanded: boolean) => void;
 }

package/lib/modules/ai-question/components/QuestionTemplate/AiEvaluation.js

@@ -64,6 +64,10 @@ var AiEvaluation = function (_a) {
         showOnlyAITest: false,
     }), 2), state = _b[0], setState = _b[1];
     var addQuestionOpen = state.addQuestionOpen, showOnlyAITest = state.showOnlyAITest;
+    var _c = __read((0, react_1.useState)(false), 2), expanded = _c[0], setExpanded = _c[1];
+    var handleExpandedChange = function (panel) { return function (event, isExpanded) {
+        setExpanded(isExpanded ? panel : false);
+    }; };
     var handleClickAdd = (0, react_1.useCallback)(function (aiShowType) {
         setState({ addQuestionOpen: false });
         updateQuestionState({
@@ -82,7 +86,7 @@ var AiEvaluation = function (_a) {
                 var name = _a.name, list = _a.list;
                 return ((0, jsx_runtime_1.jsxs)(fbm_ui_1.Box, { children: [(0, jsx_runtime_1.jsx)(fbm_ui_1.Typography, __assign({ fontSize: 12, lineHeight: 1.5, weight: "500", mb: 2 }, { children: name })), list
                             .filter(function (v) { return !isEdit || !v.isNew || selctedAbilitys.includes(v.token); })
-                            .map(function (item, i) { return ((0, jsx_runtime_1.jsx)(BaseAccordion_1.default, __assign({ index: i, isOem: isOem, isShowOnlyAITest: showOnlyAITest, isShowDesc: index !== 0, isShowSummaryAction: index !== 0, isShowConfirm: index !== 0 }, item), item.token)); })] }, name));
+                            .map(function (item, i) { return ((0, jsx_runtime_1.jsx)(BaseAccordion_1.default, __assign({ index: i, isOem: isOem, isShowOnlyAITest: showOnlyAITest, isShowDesc: index !== 0, isShowSummaryAction: index !== 0, isShowConfirm: index !== 0, expanded: expanded, onExpandedChange: handleExpandedChange }, item), item.token)); })] }, name));
             })] }));
 };
 exports.default = AiEvaluation;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eli-video-interview",
-  "version": "1.2.42-alpha.40",
+  "version": "1.2.42-alpha.42",
   "description": "鳄梨科技 AI视频面试 React SDK",
   "author": "鳄梨科技",
   "license": "MIT",
@@ -30,7 +30,9 @@
     "sortablejs": "^1.15.0",
     "typescript": "^4.7.2",
     "use-immer": "^0.7.0",
-    "yup": "^1.3.3"
+    "yup": "^1.3.3",
+    "react-window":"1.8.10",
+    "react-virtualized-auto-sizer":"1.0.5"
   },
   "devDependencies": {
     "@types/jest": "^27.5.1",