Skip to content

update ui - #465

Open
gzcqqqqqqqq1 wants to merge 2 commits into
masterfrom
newsearch
Open

update ui#465
gzcqqqqqqqq1 wants to merge 2 commits into
masterfrom
newsearch

Conversation

@gzcqqqqqqqq1

Copy link
Copy Markdown
Contributor

No description provided.

@seafile-dev seafile-dev left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verdict: Comment

Warnings:

  • 新增清除控件不是可访问的交互元素;详见 inline comment。
    Suggested fix: 统一改为带本地化 aria-label 的 button type="button"

<span
className=" dtable-font dtable-icon-x"
aria-hidden="true"
onClick={this.clearSearchValue}

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[Warning] 清除控件无法由键盘或读屏操作

Why this matters:
清除操作只绑定在带有 aria-hidden="true"span 上。该元素不可聚焦、没有可访问名称,也没有键盘事件,因此键盘和屏幕阅读器用户无法使用新增加的清除按钮;同一实现模式也出现在本 PR 的 LinkEditor 搜索框。

Suggested fix: 使用原生 button type="button"(或项目现有的可访问图标按钮),提供本地化的 aria-label,并保留点击处理;避免将可交互元素标记为 aria-hidden

@seafile-dev seafile-dev left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Verdict: Comment

Warnings:

  • The new clear-control markup depends on utility classes not supplied by this component package; see inline comment.
    Suggested fix: ship the clearable-input layout styles with the component or use an existing package-owned control, then ensure consumers receive that contract.

{this.renderParticipantList()}
<div className="dtable-ui-participants-editor-search">
<input className="form-control" type="text" placeholder={getLocale('Search_collaborator')} value={this.state.searchVal} onChange={this.onChangeSearch}/>
<div className="seatable-input-wrapper">

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[Warning] Clear-control styles are not packaged

Why this matters:
This adds seatable-input-wrapper, form-control-clear-icon, and search-icon-right, but this PR adds no stylesheet and the component package has no definitions for the wrapper or icon-positioning classes. A consumer that loads only the published component CSS will render the icon in normal flow instead of as an in-field clear control.

Suggested fix: define and export these layout/padding rules with dtable-ui-component, or replace this markup with an existing package-owned clearable-input component and release the matching dependency contract.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants