From a430284aa21e3ae1f0d5654e55b2ad2852519cc2 Mon Sep 17 00:00:00 2001 From: wwf <yearningwang@iqtogether.com> Date: 星期三, 04 六月 2025 15:17:49 +0800 Subject: [PATCH] 初始化 --- app/components/base/notion-page-selector/page-selector/index.tsx | 34 ++++++++++++++-------------------- 1 files changed, 14 insertions(+), 20 deletions(-) diff --git a/app/components/base/notion-page-selector/page-selector/index.tsx b/app/components/base/notion-page-selector/page-selector/index.tsx index 4989559..8f39879 100644 --- a/app/components/base/notion-page-selector/page-selector/index.tsx +++ b/app/components/base/notion-page-selector/page-selector/index.tsx @@ -2,9 +2,9 @@ import { useTranslation } from 'react-i18next' import { FixedSizeList as List, areEqual } from 'react-window' import type { ListChildComponentProps } from 'react-window' -import { RiArrowDownSLine, RiArrowRightSLine } from '@remixicon/react' import Checkbox from '../../checkbox' import NotionIcon from '../../notion-icon' +import s from './index.module.css' import cn from '@/utils/classnames' import type { DataSourceNotionPage, DataSourceNotionPageMap } from '@/models/common' @@ -94,16 +94,10 @@ if (hasChild) { return ( <div - className='mr-1 flex h-5 w-5 shrink-0 items-center justify-center rounded-md hover:bg-components-button-ghost-bg-hover' + className={cn(s.arrow, current.expand && s['arrow-expand'], 'shrink-0 mr-1 w-5 h-5 hover:bg-gray-200 rounded-md')} style={{ marginLeft: current.depth * 8 }} onClick={() => handleToggle(index)} - > - { - current.expand - ? <RiArrowDownSLine className='h-4 w-4 text-text-tertiary' /> - : <RiArrowRightSLine className='h-4 w-4 text-text-tertiary' /> - } - </div> + /> ) } if (current.parent_id === 'root' || !pagesMap[current.parent_id]) { @@ -112,18 +106,20 @@ ) } return ( - <div className='mr-1 h-5 w-5 shrink-0' style={{ marginLeft: current.depth * 8 }} /> + <div className='shrink-0 mr-1 w-5 h-5' style={{ marginLeft: current.depth * 8 }} /> ) } return ( <div - className={cn('group flex cursor-pointer items-center rounded-md pl-2 pr-[2px] hover:bg-state-base-hover', - previewPageId === current.page_id && 'bg-state-base-hover')} + className={cn('group flex items-center pl-2 pr-[2px] rounded-md border border-transparent hover:bg-gray-100 cursor-pointer', previewPageId === current.page_id && s['preview-item'])} style={{ ...style, top: style.top as number + 8, left: 8, right: 8, width: 'calc(100% - 16px)' }} > <Checkbox - className='mr-2 shrink-0' + className={cn( + 'shrink-0 mr-2 group-hover:border-primary-600 group-hover:border-[2px]', + disabled && 'group-hover:border-transparent', + )} checked={checkedIds.has(current.page_id)} disabled={disabled} onCheck={() => { @@ -134,12 +130,12 @@ /> {!searchValue && renderArrow()} <NotionIcon - className='mr-1 shrink-0' + className='shrink-0 mr-1' type='page' src={current.page_icon} /> <div - className='grow truncate text-[13px] font-medium leading-4 text-text-secondary' + className='grow text-sm font-medium text-gray-700 truncate' title={current.page_name} > {current.page_name} @@ -147,9 +143,7 @@ { canPreview && ( <div - className='ml-1 hidden h-6 shrink-0 cursor-pointer items-center rounded-md border-[0.5px] border-components-button-secondary-border bg-components-button-secondary-bg px-2 text-xs - font-medium leading-4 text-components-button-secondary-text shadow-xs shadow-shadow-shadow-3 backdrop-blur-[10px] - hover:border-components-button-secondary-border-hover hover:bg-components-button-secondary-bg-hover group-hover:flex' + className='shrink-0 hidden group-hover:flex items-center ml-1 px-2 h-6 rounded-md text-xs font-medium text-gray-500 cursor-pointer hover:bg-gray-50 hover:text-gray-700' onClick={() => handlePreview(index)}> {t('common.dataSource.notion.selector.preview')} </div> @@ -158,7 +152,7 @@ { searchValue && ( <div - className='ml-1 max-w-[120px] shrink-0 truncate text-xs text-text-quaternary' + className='shrink-0 ml-1 max-w-[120px] text-xs text-gray-400 truncate' title={breadCrumbs.join(' / ')} > {breadCrumbs.join(' / ')} @@ -284,7 +278,7 @@ if (!currentDataList.length) { return ( - <div className='flex h-[296px] items-center justify-center text-[13px] text-text-tertiary'> + <div className='flex items-center justify-center h-[296px] text-[13px] text-gray-500'> {t('common.dataSource.notion.selector.noSearchResult')} </div> ) -- Gitblit v1.8.0