@abtnode/ux 1.16.53 → 1.16.54-beta-20251017-133309-7d40faa6

package/lib/blocklet/audit-logs.js

@@ -15,6 +15,7 @@ import styled from '@emotion/styled';
 import { get } from 'lodash';
 import Tag from '@arcblock/ux/lib/Tag';
 import Tooltip from '@mui/material/Tooltip';
+import useMediaQuery from '@mui/material/useMediaQuery';
 import { useMemo } from 'react';
 import { parseAvatar } from '../team/members/util';
 import { useAuditLogContext, AuditLogProvider } from '../contexts/audit-log';
@@ -163,6 +164,21 @@ function AuditLogs() {
     actionOrContent,
     setActionOrContent
   } = useAuditLogContext();
+  const theme = useTheme();
+  const isBreakpointsDownSm = useMediaQuery(theme.breakpoints.down('sm'));
+  const responsiveStyles = useMemo(() => ({
+    flexDirection: isBreakpointsDownSm ? 'column' : 'row',
+    alignItems: isBreakpointsDownSm ? 'flex-start' : 'center',
+    justifyContent: isBreakpointsDownSm ? 'flex-start' : 'space-between',
+    '& > div': isBreakpointsDownSm ? {
+      width: '100%',
+      flex: 1,
+      '.toolbar-search-area': {
+        width: '100% !important',
+        flex: '1 !important'
+      }
+    } : {}
+  }), [isBreakpointsDownSm]);
   const handleRowsPerPageChange = e => {
     const pageSize = Number(e.target.value);
     setPaging({
@@ -198,15 +214,22 @@ function AuditLogs() {
   return /*#__PURE__*/_jsxs(Div, {
     "data-cy": "audit-logs",
     children: [/*#__PURE__*/_jsxs(Box, {
+      className: "audit-logs-toolbar",
       sx: {
         display: 'flex',
-        flexDirection: 'row',
+        flexDirection: isBreakpointsDownSm ? 'column' : 'row',
         gap: 2,
-        alignItems: 'center'
+        alignItems: isBreakpointsDownSm ? 'flex-start' : 'center',
+        justifyContent: isBreakpointsDownSm ? 'flex-start' : 'space-between',
+        ...responsiveStyles
       },
       children: [/*#__PURE__*/_jsxs(FormControl, {
-        style: {
-          width: '240px'
+        sx: isBreakpointsDownSm ? {
+          width: '100%',
+          flex: 1
+        } : {
+          width: 240,
+          flexShrink: 0
         },
         variant: "outlined",
         children: [/*#__PURE__*/_jsx(InputLabel, {
@@ -232,10 +255,6 @@ function AuditLogs() {
             })
           }, x.label))
         })]
-      }), /*#__PURE__*/_jsx(Box, {
-        sx: {
-          flex: 1
-        }
       }), /*#__PURE__*/_jsx(TableSearch, {
         options: {
           searchPlaceholder: t('common.auditLogsSearch'),

package/lib/blocklet/notification-records/index.js

@@ -8,6 +8,7 @@ import isEqual from 'lodash/isEqual';
 import Datatable, { getDurableData } from '@arcblock/ux/lib/Datatable';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import { ThemeProvider, useTheme } from '@mui/material';
+import useMediaQuery from '@mui/material/useMediaQuery';
 import { deepmerge } from '@arcblock/ux/lib/Theme';
 import dayjs from '@abtnode/util/lib/dayjs';
 import FormControl from '@mui/material/FormControl';
@@ -51,6 +52,7 @@ function NotificationRecords({
     locale
   } = useLocaleContext();
   const parentTheme = useTheme();
+  const isBreakpointsDownSm = useMediaQuery(parentTheme.breakpoints.down('sm'));
   const mergedTheme = useMemo(() => deepmerge(parentTheme, getMuiThemeOpts()), [parentTheme]);
   const [loading, setLoading] = useState(false);
   const {
@@ -474,6 +476,7 @@ function NotificationRecords({
       }
     },
     children: [/*#__PURE__*/_jsx(Div, {
+      isBreakpointsDownSm: isBreakpointsDownSm,
       children: /*#__PURE__*/_jsx(ThemeProvider, {
         theme: mergedTheme,
         children: /*#__PURE__*/_jsx(Datatable, {
@@ -501,10 +504,10 @@ function NotificationRecords({
               setNotificationDialog(data[dataIndex]);
             }
           },
-          customPreButtons: [/*#__PURE__*/_jsx(DatePicker, {
+          title: /*#__PURE__*/_jsx(DatePicker, {
             value: search.dateRange,
             onChange: onDateRangeChange
-          })],
+          }),
           customButtons: customButtons,
           components: {
             TableFilterList: props => /*#__PURE__*/_jsx(CustomFilterList, {
@@ -565,6 +568,17 @@ const Div = styled.div`
   .custom-toobar-btns {
     gap: 4px;
   }
+  .custom-toobar-title-inner {
+    display: flex;
+    justify-content: ${({
+  isBreakpointsDownSm
+}) => isBreakpointsDownSm ? 'space-between' : 'flex-end'};
+    padding-right: ${({
+  isBreakpointsDownSm
+}) => isBreakpointsDownSm ? '0' : '8px'};
+    flex-wrap: wrap;
+    gap: 8px;
+  }
 `;
 WrapperNotificationRecords.propTypes = {
   blocklet: PropTypes.object.isRequired,

package/lib/blocklet/publish/create-release/header.js

@@ -224,7 +224,8 @@ function Header({
           did: blocklet.meta.did,
           projectId,
           releaseId: '',
-          status
+          status,
+          blockletSingleton: typeof _params.blockletSingleton === 'boolean' ? _params.blockletSingleton : false
         }
       });
       clearHistoryParams();

package/lib/blocklet/security/form-access-role-input.js

@@ -4,6 +4,7 @@ import GroupIcon from '@mui/icons-material/Group';
 import GroupRemoveIcon from '@mui/icons-material/GroupRemove';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
 import { Box, TextField, MenuItem } from '@mui/material';
+import ArrowDownwardIcon from '@arcblock/icons/lib/ArrowDown';
 import AccessConfig from '../../who-can-access/config';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export default function FormAccessRoleInput({
@@ -49,6 +50,16 @@ export default function FormAccessRoleInput({
     fullWidth: true,
     value: value,
     onChange: onChange,
+    sx: {
+      '& .MuiInputBase-input': {
+        width: 'calc(100% - 46px)',
+        '& > .MuiBox-root:first-of-type': {
+          overflow: 'hidden',
+          textOverflow: 'ellipsis',
+          whiteSpace: 'nowrap'
+        }
+      }
+    },
     slotProps: {
       select: {
         renderValue: selected => {
@@ -64,7 +75,13 @@ export default function FormAccessRoleInput({
               }
             }), d.title[locale] || d.title.en]
           }) : null;
-        }
+        },
+        // eslint-disable-next-line react/no-unstable-nested-components
+        IconComponent: iconProps => /*#__PURE__*/_jsx(ArrowDownwardIcon, {
+          ...iconProps,
+          width: 20,
+          height: 20
+        })
       }
     },
     children: Configs.map(d => {

package/lib/blocklet/webhook/create-or-edit.js

@@ -2,7 +2,7 @@ import React, { useMemo, useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { useForm, Controller } from 'react-hook-form';
 import Toast from '@arcblock/ux/lib/Toast';
-import { Button, Dialog, DialogTitle, DialogContent, DialogActions, TextField, Tooltip, Checkbox, Box, List, ListItem, Collapse, Typography, IconButton, Chip, FormHelperText, Avatar, Alert, CircularProgress, FormControlLabel } from '@mui/material';
+import { Button, Dialog, useMediaQuery, DialogTitle, DialogContent, DialogActions, TextField, Tooltip, Checkbox, Box, List, ListItem, Collapse, Typography, IconButton, Chip, FormHelperText, Avatar, Alert, CircularProgress, FormControlLabel, useTheme } from '@mui/material';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import ExpandLessIcon from '@mui/icons-material/ExpandLess';
 import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
@@ -182,16 +182,18 @@ function EventSelector({
         })
       })]
     }), /*#__PURE__*/_jsx(Box, {
+      className: "webhook-event-selector",
       sx: {
         maxHeight: '50vh',
-        overflow: 'auto'
+        overflowY: 'auto',
+        overflowX: 'hidden'
       },
       children: /*#__PURE__*/_jsx(List, {
         disablePadding: true,
         sx: {
           border: '1px solid',
           borderColor: 'divider',
-          borderRadius: '4px'
+          borderRadius: 0.5
         },
         children: Object.entries(eventsBySource).map(([did, {
           source,
@@ -207,8 +209,8 @@ function EventSelector({
                 borderBottom: ({
                   palette
                 }) => index < Object.keys(eventsBySource).length - 1 ? `1px solid ${palette.divider}` : 'none',
-                px: 2,
-                py: 1.5,
+                px: 0,
+                py: 1,
                 '&:hover': {
                   bgcolor: 'rgba(0, 0, 0, 0.02)'
                 }
@@ -303,9 +305,7 @@ function EventSelector({
               children: /*#__PURE__*/_jsx(List, {
                 disablePadding: true,
                 sx: {
-                  pl: 2,
-                  pr: 2,
-                  py: 1,
+                  p: 0,
                   bgcolor: 'rgba(0, 0, 0, 0.01)'
                 },
                 children: events.map(event => {
@@ -314,7 +314,8 @@ function EventSelector({
                   return /*#__PURE__*/_jsx(ListItem, {
                     dense: true,
                     sx: {
-                      py: 0.75
+                      py: 0.75,
+                      px: 1
                     },
                     onClick: () => handleToggleEvent(event),
                     children: /*#__PURE__*/_jsxs(Box, {
@@ -326,14 +327,21 @@ function EventSelector({
                       children: [/*#__PURE__*/_jsx(Checkbox, {
                         checked: isChecked,
                         sx: {
-                          mr: 1
+                          flexShrink: 0
                         }
                       }), /*#__PURE__*/_jsxs(Box, {
+                        sx: {
+                          flex: 1,
+                          minWidth: 0
+                        },
                         children: [/*#__PURE__*/_jsx(Typography, {
                           variant: "body1",
+                          className: "webhook-event-type",
                           sx: {
                             cursor: 'pointer',
-                            color: 'text.primary'
+                            color: 'text.primary',
+                            wordBreak: 'break-word',
+                            overflowWrap: 'break-word'
                           },
                           children: event.type
                         }), /*#__PURE__*/_jsx(Typography, {
@@ -341,7 +349,9 @@ function EventSelector({
                           sx: {
                             color: 'text.secondary',
                             display: 'block',
-                            cursor: 'pointer'
+                            cursor: 'pointer',
+                            wordBreak: 'break-word',
+                            overflowWrap: 'break-word'
                           },
                           children: event.description
                         })]
@@ -406,6 +416,7 @@ function CreateOrEditHook({
     error,
     eventsBySource
   } = useOpenEvent();
+  const theme = useTheme();
   const {
     control,
     handleSubmit: validateSubmit,
@@ -421,6 +432,7 @@ function CreateOrEditHook({
       description: ''
     }
   });
+  const isBreakpointsDownSm = useMediaQuery(theme.breakpoints.down('md'));
   useEffect(() => {
     const hasSelectedEvents = Object.values(selectedEvents).some(value => value);
     setValue('selectedEvents', hasSelectedEvents ? 'valid' : '');
@@ -486,6 +498,7 @@ function CreateOrEditHook({
     onClose: handleClose,
     maxWidth: "lg",
     fullWidth: true,
+    fullScreen: isBreakpointsDownSm,
     sx: {
       '& .MuiDialog-paper': {
         minHeight: 600

package/lib/locales/ar.js

@@ -432,7 +432,8 @@ export default {
     generate: 'توليد',
     copy: 'نسخ',
     copied: 'نسخ',
-    orgs: 'المؤسسات'
+    orgs: 'المؤسسات',
+    userSessions: 'جلسات المستخدم'
   },
   blocklet: {
     external: 'خارجي',

package/lib/locales/de.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Generieren',
     copy: 'Kopieren',
     copied: 'Kopiert',
-    orgs: 'Organisationen'
+    orgs: 'Organisationen',
+    userSessions: 'Benutzersitzungen'
   },
   blocklet: {
     external: 'Extern',

package/lib/locales/en.js

@@ -326,7 +326,8 @@ export default {
     mcpServers: 'MCP Servers',
     generate: 'Generate',
     copy: 'Copy',
-    copied: 'Copied'
+    copied: 'Copied',
+    userSessions: 'User Sessions'
   },
   setup: {
     connect: {

package/lib/locales/es.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Generar',
     copy: 'Copiar',
     copied: 'Copiado',
-    orgs: 'Organizaciones'
+    orgs: 'Organizaciones',
+    userSessions: 'Sesiones de Usuario'
   },
   blocklet: {
     external: 'Externo',

package/lib/locales/fr.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Générer',
     copy: 'Copier',
     copied: 'Copié',
-    orgs: 'Organisations'
+    orgs: 'Organisations',
+    userSessions: 'Sessions utilisateur'
   },
   blocklet: {
     external: 'Externe',

package/lib/locales/hi.js

@@ -432,7 +432,8 @@ export default {
     generate: 'उत्पन्न करें',
     copy: 'कॉपी करें',
     copied: 'नकल किया गया',
-    orgs: 'संगठन'
+    orgs: 'संगठन',
+    userSessions: 'उपयोगकर्ता सत्र'
   },
   blocklet: {
     external: 'बाहरी',

package/lib/locales/i18n.json

@@ -45538,5 +45538,25 @@
       "vi": "Chỉ một thực thể",
       "th": "มีเพียงอินสแตนซ์เดียว"
     }
+  },
+  "common.userSessions": {
+    "en": "User Sessions",
+    "value": {
+      "en": "User Sessions",
+      "es": "Sesiones de Usuario",
+      "zh": "用户会话",
+      "zh-TW": "使用者工作階段",
+      "ja": "ユーザーセッション",
+      "ko": "사용자 세션",
+      "de": "Benutzersitzungen",
+      "hi": "उपयोगकर्ता सत्र",
+      "fr": "Sessions utilisateur",
+      "ar": "جلسات المستخدم",
+      "ru": "Сеансы пользователя",
+      "pt": "Sessões de Usuário",
+      "id": "Sesi Pengguna",
+      "vi": "Phiên người dùng",
+      "th": "เซสชันผู้ใช้"
+    }
   }
 }

package/lib/locales/id.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Hasilkan',
     copy: 'Salin',
     copied: 'Disalin',
-    orgs: 'Organisasi'
+    orgs: 'Organisasi',
+    userSessions: 'Sesi Pengguna'
   },
   blocklet: {
     external: 'Eksternal',

package/lib/locales/ja.js

@@ -432,7 +432,8 @@ export default {
     generate: '生成',
     copy: 'コピー',
     copied: 'コピー済み',
-    orgs: '組織'
+    orgs: '組織',
+    userSessions: 'ユーザーセッション'
   },
   blocklet: {
     external: '外部',

package/lib/locales/ko.js

@@ -432,7 +432,8 @@ export default {
     generate: '생성',
     copy: '복사',
     copied: '복사됨',
-    orgs: '조직'
+    orgs: '조직',
+    userSessions: '사용자 세션'
   },
   blocklet: {
     external: '외부의',

package/lib/locales/pt.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Gerar',
     copy: 'Copiar',
     copied: 'Copiado',
-    orgs: 'Organizações'
+    orgs: 'Organizações',
+    userSessions: 'Sessões de Usuário'
   },
   blocklet: {
     external: 'Externo',

package/lib/locales/ru.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Сгенерировать',
     copy: 'Копировать',
     copied: 'Скопировано',
-    orgs: 'Организации'
+    orgs: 'Организации',
+    userSessions: 'Сеансы пользователя'
   },
   blocklet: {
     external: 'Внешний',

package/lib/locales/th.js

@@ -432,7 +432,8 @@ export default {
     generate: 'สร้าง',
     copy: 'คัดลอก',
     copied: 'คัดลอกแล้ว',
-    orgs: 'องค์กร'
+    orgs: 'องค์กร',
+    userSessions: 'เซสชันผู้ใช้'
   },
   blocklet: {
     external: 'ภายนอก',

package/lib/locales/vi.js

@@ -432,7 +432,8 @@ export default {
     generate: 'Tạo',
     copy: 'Sao chép',
     copied: 'Đã sao chép',
-    orgs: 'Tổ chức'
+    orgs: 'Tổ chức',
+    userSessions: 'Phiên người dùng'
   },
   blocklet: {
     external: 'Bên ngoài',

package/lib/locales/zh-tw.js

@@ -432,7 +432,8 @@ export default {
     generate: '產生',
     copy: '複製',
     copied: '已複製',
-    orgs: '組織'
+    orgs: '組織',
+    userSessions: '用戶會話'
   },
   blocklet: {
     external: '外部的',

package/lib/locales/zh.js

@@ -445,7 +445,8 @@ export default {
     mcpServers: 'MCP 服务器',
     generate: '生成',
     copy: '复制',
-    copied: '已复制'
+    copied: '已复制',
+    userSessions: '用户会话'
   },
   blocklet: {
     external: '外部',

package/lib/notifications/pages/preview/attachment/asset.js

@@ -8,11 +8,13 @@ import { mergeDarkStyle } from '../utils';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 AssetPreview.propTypes = {
   locale: PropTypes.string,
-  data: PropTypes.object.isRequired
+  data: PropTypes.object.isRequired,
+  type: PropTypes.oneOf(['asset', 'vc'])
 };
 function AssetPreview({
   locale = 'en',
-  data
+  data,
+  type = 'asset'
 }) {
   const title = {
     zh: '接收',
@@ -48,6 +50,10 @@ function AssetPreview({
         display: 'block'
       },
       onClick: e => {
+        if (type === 'vc') {
+          e.preventDefault();
+          return;
+        }
         e.customPreventRedirect = true;
       },
       rel: "noreferrer",

package/lib/notifications/pages/preview/attachment/index.js

@@ -40,7 +40,8 @@ function AttachmentPreviewPage({
     }), attachment.type === 'asset' || attachment.type === 'vc' ? /*#__PURE__*/_jsx(AssetPreview, {
       data: attachment.data,
       local: local,
-      isMd: isMd
+      isMd: isMd,
+      type: attachment.type
     }) : null, attachment.type === 'dapp' && /*#__PURE__*/_jsx(DAPPPreview, {
       data: attachment.data,
       local: local,

package/lib/simple-select.js

@@ -1,6 +1,7 @@
 /* eslint-disable react/require-default-props */
 import PropTypes from 'prop-types';
-import { Box, Chip, FormControl, FormHelperText, InputLabel, ListItemText, MenuItem, OutlinedInput, Select, Typography } from '@mui/material';
+import { Box, Chip, FormControl, FormHelperText, InputLabel, MenuItem, OutlinedInput, Select, Typography } from '@mui/material';
+import ArrowDownwardIcon from '@arcblock/icons/lib/ArrowDown';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function SimpleSelect({
   fullWidth = false,
@@ -12,7 +13,6 @@ function SimpleSelect({
   helperText = '',
   error = false,
   margin = '',
-  textDirection = 'row',
   size,
   ...rest
 }) {
@@ -27,6 +27,16 @@ function SimpleSelect({
       children: `${label}${required ? '*' : ''}`
     }), /*#__PURE__*/_jsxs(Select, {
       multiple: multiple,
+      sx: {
+        '& .MuiInputBase-input': {
+          width: 'calc(100% - 46px)',
+          '& > .MuiBox-root:first-of-type': {
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+            whiteSpace: 'nowrap'
+          }
+        }
+      },
       input: /*#__PURE__*/_jsx(OutlinedInput, {
         defaultValue: defaultValue,
         sx: {
@@ -71,7 +81,14 @@ function SimpleSelect({
             children: option.description
           })]
         });
-      },
+      }
+      // eslint-disable-next-line react/no-unstable-nested-components
+      ,
+      IconComponent: props => /*#__PURE__*/_jsx(ArrowDownwardIcon, {
+        ...props,
+        width: 20,
+        height: 20
+      }),
       ...rest,
       children: [/*#__PURE__*/_jsx(MenuItem, {
         disabled: true,
@@ -81,25 +98,21 @@ function SimpleSelect({
       }), !required && !multiple && /*#__PURE__*/_jsx(MenuItem, {
         value: "",
         children: "None"
-      }), options.map(option => option && option.value && /*#__PURE__*/_jsxs(MenuItem, {
-        sx: [{
-          justifyContent: 'center'
-        }, textDirection === 'column' ? {
-          flexDirection: 'column',
-          alignItems: 'flex-start'
-        } : {}],
+      }), options.map(option => option && option.value && /*#__PURE__*/_jsx(MenuItem, {
         value: option.value,
-        children: [/*#__PURE__*/_jsx(ListItemText, {
-          children: option.title
-        }), option.description && /*#__PURE__*/_jsx(Typography, {
-          variant: "body2",
-          sx: {
-            color: 'text.secondary',
-            maxWidth: '100%',
-            whiteSpace: 'normal'
-          },
-          children: option.description
-        })]
+        children: /*#__PURE__*/_jsxs(Box, {
+          children: [/*#__PURE__*/_jsx("span", {
+            children: option.title
+          }), option.description && /*#__PURE__*/_jsx(Box, {
+            sx: {
+              maxWidth: 510,
+              fontSize: 12,
+              color: '#999',
+              whiteSpace: 'normal'
+            },
+            children: option.description
+          })]
+        })
       }, option.value))]
     }), /*#__PURE__*/_jsx(FormHelperText, {
       children: helperText