fix: harmony review #3002
fix: harmony review #3002
Conversation
|
Warning Rate limit exceeded@oasis-cloud has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 14 minutes and 43 seconds before requesting another review. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📒 Files selected for processing (4)
Walkthrough本次 PR 涉及多个组件的样式与结构调整，主要集中在视觉优化和布局细节改进上。修改内容涵盖 Button、Checkbox、Indicator、Input、Loading、Radio、SearchBar、Navbar 等组件，新增或更新了 CSS 变量、工具函数（pxTransform）以及部分测试用例。各 Demo 文件中也更新了图标颜色、导入顺序和局部组件封装方式，整体调整均面向提升组件在不同平台下的展示一致性。 Changes
Possibly related PRs
Suggested reviewers
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## feat_v3.x #3002 +/- ##
=============================================
+ Coverage 85.82% 86.05% +0.23%
=============================================
Files 281 281
Lines 18491 18254 -237
Branches 2803 2749 -54
=============================================
- Hits 15869 15708 -161
+ Misses 2617 2541 -76
Partials 5 5 ☔ View full report in Codecov by Sentry. |
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (9)
src/packages/loading/demos/taro/demo6.tsx (1)
7-8: 配置方式优化建议将颜色配置从 ConfigProvider 移至组件本身确实简化了使用方式，但建议考虑以下几点：
- 是否需要保持与其他组件的配置方式一致性
- 是否会影响到主题的全局管理
src/packages/loading/loading.scss (1)
37-41: 样式结构优化建议将 padding-top 移动到垂直布局的上下文中是个好的改进，但建议：
- 考虑使用 CSS 变量来管理间距值，提高可定制性
- 为垂直布局模式添加注释，说明其用途和影响
&-vertical { .nut-loading-text { - padding-top: $spacing-base; + // 垂直布局模式下的文本上间距 + padding-top: var(--nut-loading-vertical-spacing, $spacing-base); } }src/packages/checkboxgroup/checkboxgroup.scss (2)
45-46: 调整 checkbox 列表的宽度和弹性布局
将&-list内部的width由固定百分比修改为auto并添加flex-grow: 1能让列表项在容器中更灵活地占据剩余空间。请确认这项更改在各个分辨率和布局环境下能正确响应。
62-63: 调整反向 checkbox 的宽度和弹性布局
在.nut-checkbox-reverse内，将width从100%改为auto同时增加flex-grow: 1，有助于在反向布局中更好地分配空间。建议仔细测试此改动对整体布局的影响，确保所有间距和对齐均符合预期。src/packages/checkbox/checkbox.scss (2)
10-10: 为图标添加防缩行为
在.nut-checkbox-icon中新增flex-shrink: 0属性可以防止图标在容器收缩时被过度压缩，从而保持设计一致性。建议在响应式布局场景下验证其效果。
29-29: 为标签添加防缩行为
为.nut-checkbox-label添加flex-shrink: 0属性确保标签在布局收缩时不会意外挤压，从而维持文本清晰可读。请检查在不同容器宽度下的展示情况。src/packages/radio/radio.scss (1)
54-54: 增强用户体验：为按钮组件添加最小高度
在.nut-radio-button中新增min-height: 30px;可保证组件在不同设备和分辨率下有足够的可点击区域，改善整体用户体验。建议参考设计规范确认该数值是否满足所有场景需求。src/packages/searchbar/demos/taro/demo5.tsx (1)
23-23: 建议使用主题变量而不是硬编码的颜色值将硬编码的颜色值
#ff0f23替换为主题变量，以保持样式的一致性和可维护性。这样在主题切换时也能自动适应。- <Star size={20} color="#ff0f23" /> + <Star size={20} color="var(--nutui-color-primary)" />src/packages/button/demos/taro/demo5.tsx (1)
95-96: 统一颜色值格式将 rgb 格式改为 hex 格式以保持一致性。
- icon={<Plus size={10} color="rgb(255, 173, 190)" />} + icon={<Plus size={10} color="#ffadbe" />}
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (23)
src/packages/button/button.scss(1 hunks)src/packages/button/demos/taro/demo4.tsx(7 hunks)src/packages/button/demos/taro/demo5.tsx(8 hunks)src/packages/checkbox/checkbox.scss(2 hunks)src/packages/checkbox/demos/taro/demo1.tsx(5 hunks)src/packages/checkboxgroup/checkboxgroup.scss(2 hunks)src/packages/indicator/demos/taro/demo1.tsx(1 hunks)src/packages/indicator/indicator.scss(5 hunks)src/packages/indicator/indicator.taro.tsx(3 hunks)src/packages/input/input.scss(1 hunks)src/packages/loading/demos/taro/demo4.tsx(1 hunks)src/packages/loading/demos/taro/demo6.tsx(1 hunks)src/packages/loading/demos/taro/demo7.tsx(1 hunks)src/packages/loading/demos/taro/demo8.tsx(2 hunks)src/packages/loading/loading.scss(3 hunks)src/packages/numberkeyboard/numberkeyboard.taro.tsx(1 hunks)src/packages/radio/radio.scss(1 hunks)src/packages/radiogroup/radiogroup.scss(3 hunks)src/packages/searchbar/demos/taro/demo3.tsx(2 hunks)src/packages/searchbar/demos/taro/demo5.tsx(2 hunks)src/packages/searchbar/searchbar.taro.tsx(0 hunks)src/packages/searchbar/searchbar.tsx(0 hunks)src/styles/variables.scss(1 hunks)
💤 Files with no reviewable changes (2)
- src/packages/searchbar/searchbar.taro.tsx
- src/packages/searchbar/searchbar.tsx
✅ Files skipped from review due to trivial changes (1)
- src/packages/loading/demos/taro/demo7.tsx
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: test
🔇 Additional comments (19)
src/packages/loading/demos/taro/demo4.tsx (1)
6-6: 布局对齐优化！通过添加
align="center"属性使加载指示器在单元格中居中显示，提升了视觉体验。src/packages/loading/loading.scss (1)
7-9: 选择器简化优化！使用
&-vertical替代完整类名，符合 SCSS 最佳实践，提高了代码的可维护性。src/packages/indicator/demos/taro/demo1.tsx (1)
14-14: 代码变更正确！将
current属性从 0 更改为 1 使示例更好地展示了垂直方向指示器的不同状态。src/packages/loading/demos/taro/demo8.tsx (1)
4-4: 优化按钮样式实现！使用
pxTransform函数替代固定像素值，提高了组件在不同设备上的适配性。Also applies to: 26-30
src/packages/indicator/indicator.taro.tsx (2)
57-57: 优化指示器样式类名设计！为每个点添加了带索引的类名（
dot-${item}），这样可以更精确地控制每个点的样式。Also applies to: 63-63
77-77: 改进位置计算的响应式处理！使用
pxTransform函数处理位移计算，提高了组件在不同设备上的兼容性。src/packages/checkbox/demos/taro/demo1.tsx (2)
17-20: 优化边距处理！使用
pxTransform函数统一处理边距，同时保留了marginInlineEnd属性以兼容不同的书写模式。
30-51: 改进标签布局结构！优化了标签的样式结构：
- 使用
pxTransform处理高度，提高响应式表现- 统一使用 flex 布局，改善对齐方式
- 保持字体大小和颜色样式的一致性
Also applies to: 67-88, 103-124
src/packages/input/input.scss (1)
30-30: 样式更新: 修改 .nut-input-native 中的 line-height 属性
在该类中，将原先的line-height: $input-font-size;修改为line-height: $font-size-l;，以更好地匹配新的设计标准。请确认此调整在所有平台上的显示效果均符合预期。src/packages/indicator/indicator.scss (5)
20-21: 样式更新: 统一指示器内边距
将.nut-indicator-dot和.nut-indicator-line中的margin-left属性设置为$indicator-dot-margin，有助于统一组件的间距。请确保该变量的值符合整体视觉设计规范。
23-26: 新增选择器: .nut-indicator-dot-0
添加了&-0选择器，将margin-left明确设置为0px，以保证首个指示器点在水平方向上的对齐效果。请验证这一规则在所有使用场景中的表现。
65-73: 新增样式规则: 固定宽度与白色主题下的指示器样式
在竖直布局中，通过新增.nut-indicator-fixed-width .nut-indicator-white下的.nut-indicator-dot &-active样式，将 active 状态下的高度统一设置为6px。此改动有助于不同主题与固定宽度场景下风格的一致性，请确认其不会对现有设计造成不良影响。
151-157: 调整竖直布局中指示器的间距
修改了.nut-indicator-vertical内部.nut-indicator-dot的 margin 设置：先将所有外边距归零，再单独设置margin-top: $indicator-dot-margin;；同时对&-0选择器中的margin-top进行归零。此调整旨在确保竖直布局下各指示器的间距准确，请根据设计稿再次确认。
177-182: RTL 布局调整: 指示器间距的左右互换
在从右向左（RTL）布局下，通过新增.nut-rtl或[dir='rtl']中的.nut-indicator-dot &-0规则，将margin-right设为$indicator-dot-margin，并将margin-left清零，以保证视觉效果与布局逻辑的一致性。src/styles/variables.scss (1)
1857-1857: 变量更新: 调整 $indicator-dot-margin 的默认 fallback 值
将$indicator-dot-margin的 fallback 值从原来的$spacing-xxxs更新为$spacing-xxs，以适应最新的间距标准。请确保所有依赖此变量的组件均已协调更新。src/packages/radiogroup/radiogroup.scss (2)
12-15: 样式一致性：重置最后一个单选按钮的间距
在.nut-radio内新增的&:last-child { margin: 0; }能够确保在所有布局模式下，最后一个单选按钮不会多出额外间距，从而实现统一的视觉效果。请确认该规则与其他相关组件样式无冲突。
37-50: 水平布局优化：调整显示模式和最后元素间距
在水平布局下，将容器设置为display: flex;可更好地支持响应式设计，同时对.nut-radio下最后一个元素重设 margin （margin: 0 $radiogroup-radio-margin $radiogroup-radio-margin-bottom 0;）有助于确保间隔一致。建议在各种屏幕尺寸上测试以验证最终效果。src/packages/numberkeyboard/numberkeyboard.taro.tsx (1)
164-164: 样式优化：设置弹出层最小高度将 Popup 组件的 minHeight 设置为 0 是一个合理的优化，这样可以确保弹出层在收起时能够完全折叠，提升过渡动画的视觉效果。
src/packages/button/button.scss (1)
256-256: 样式完善：图标按钮禁用状态为仅包含图标的主要按钮（Primary Button）添加禁用状态样式规则，确保与其他禁用状态的主要按钮保持一致的视觉效果，提升了组件样式的完整性。
| <SearchBar | ||
| onSearch={() => toastShow()} | ||
| style={{ backgroundColor: '#ff0f23' }} | ||
| /> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
建议保持主题系统的一致性
当前实现直接使用内联样式和硬编码颜色值，建议：
- 使用 ConfigProvider 的主题变量系统
- 避免直接使用内联样式设置背景色
- <SearchBar
- onSearch={() => toastShow()}
- style={{ backgroundColor: '#ff0f23' }}
- />
+ <SearchBar
+ onSearch={() => toastShow()}
+ />同时在 ConfigProvider 中添加：
theme={{
nutuiSearchbarInputBackground: '#eee',
nutuiSearchbarInputTextAlign: 'right',
+ nutuiSearchbarBackground: 'var(--nutui-color-primary)',
}}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <SearchBar | |
| onSearch={() => toastShow()} | |
| style={{ backgroundColor: '#ff0f23' }} | |
| /> | |
| <SearchBar | |
| onSearch={() => toastShow()} | |
| /> |
| <SearchBar | |
| onSearch={() => toastShow()} | |
| style={{ backgroundColor: '#ff0f23' }} | |
| /> | |
| <ConfigProvider | |
| theme={{ | |
| nutuiSearchbarInputBackground: '#eee', | |
| nutuiSearchbarInputTextAlign: 'right', | |
| nutuiSearchbarBackground: 'var(--nutui-color-primary)', | |
| }} | |
| > | |
| {/* ...rest of your app/components */} | |
| </ConfigProvider> |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
src/packages/navbar/demos/taro/demo2.tsx (1)
18-18: 建议提取共享样式demo1 和 demo2 中存在相同的样式定义，建议提取为共享样式以提高可维护性。
建议创建一个共享的样式文件：
// src/packages/navbar/demos/taro/styles.ts import pxTransform from '@/utils/px-transform' export const styles = { flexCenter: { display: 'flex', alignItems: 'center', }, title: { fontSize: pxTransform(18), fontWeight: 'bold', height: pxTransform(26), }, description: { fontSize: pxTransform(12), fontWeight: 400, color: 'rgba(0,0,0, 0.5)', height: pxTransform(16), }, }然后在 demo1 和 demo2 中引用：
import { styles } from './styles'Also applies to: 24-24
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
src/packages/navbar/demos/taro/demo1.tsx(1 hunks)src/packages/navbar/demos/taro/demo2.tsx(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: test
🔇 Additional comments (1)
src/packages/navbar/demos/taro/demo1.tsx (1)
18-18: 建议验证文本样式在不同场景下的显示效果将
lineHeight替换为height可能会影响文本的显示效果：
- 多行文本可能会被截断
- 文本的垂直对齐方式可能会改变
- 在不同设备密度下可能会出现显示问题
建议验证以下场景：
- 标题文本超过一行时的显示效果
- 不同设备密度下的显示效果
- 动态内容的显示效果
如果需要保持文本的垂直居中对齐，可以考虑：
title: { fontSize: pxTransform(18), fontWeight: 'bold', - height: pxTransform(26), + lineHeight: pxTransform(26), + display: 'flex', + alignItems: 'center', }Also applies to: 24-24
|
以下组件还存在问题 checkbox: |
|
@irisSong |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (5)
src/packages/indicator/demos/taro/demo4.tsx (1)
12-24: 样式优化使用了 flex 布局并采用响应式设计通过使用
display: 'flex'和pxTransform工具函数，样式更加清晰且具有更好的响应式特性。移除了boxShadow属性，解决了 PR 中提到的在鸿蒙（Harmony）环境中的兼容性问题。这种改进使组件在不同平台上展示更加一致。为了提高代码可维护性，可以考虑将这些通用样式提取到一个单独的常量或样式文件中，因为 demo2.tsx 中使用了相同的样式。
src/packages/input/doc.zh-TW.md (1)
155-167: 語言一致性提醒
靜態分析工具標記此處可能存在“input”的用詞問題（雖然此處只是變量名稱與描述），建議確認文檔中所用的術語是否符合目標地區語言慣例。如果需要，可考慮統一使用更貼切的譯法，但目前這不影響功能。🧰 Tools
🪛 LanguageTool
[locale-violation] ~159-~159: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ... | 默认值 | | --- | --- | --- | | --nutui-input-border-bottom | 边框颜色 |#eaf0fb| | -...(GL_BARBARISM_REPLACE)
[locale-violation] ~160-~160: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...-bottom | 边框颜色 |#eaf0fb| | --nutui-input-border-bottom-width | 边框宽度 |0px| | ...(GL_BARBARISM_REPLACE)
[locale-violation] ~161-~161: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ottom-width | 边框宽度 |0px| | --nutui-input-color | 文本颜色 |$color-title| | --nu...(GL_BARBARISM_REPLACE)
[locale-violation] ~162-~162: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or | 文本颜色 |$color-title| | --nutui-input-disabled-color | 禁用的文本颜色 |#c8c9cc| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~163-~163: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...olor | 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-ba...(GL_BARBARISM_REPLACE)
[locale-violation] ~163-~163: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ... 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-background-ov...(GL_BARBARISM_REPLACE)
[locale-violation] ~163-~163: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...utui-input-background-color | 输入框背景颜色 |$color-background-overlay| | --nutui-input-border-radi...(GL_BARBARISM_REPLACE)
[locale-violation] ~164-~164: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-background-overlay| | \--nutui-input-border-radius | 输入框圆角 |0` | | --nutu...(GL_BARBARISM_REPLACE)
[locale-violation] ~165-~165: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...order-radius | 输入框圆角 |0| | --nutui-input-font-size | 文本字号 |$font-size-base| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 |$font-size-base| | --nutui-input-lineheight | 行高 |$font-size-l| | -...(GL_BARBARISM_REPLACE)
[locale-violation] ~167-~167: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ight | 行高 |$font-size-l| | --nutui-input-padding | 输入框容器的内边距 |10px 25px|(GL_BARBARISM_REPLACE)
🪛 markdownlint-cli2 (0.17.2)
155-155: Link fragments should be valid
null(MD051, link-fragments)
src/packages/input/doc.taro.md (1)
164-170: 注意靜態檢查提示
與其他文檔一樣，此處可能收到關於“input”字詞的語言建議，請確認此處描述符合母語用詞標準，不影響變量功能。🧰 Tools
🪛 LanguageTool
[locale-violation] ~164-~164: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ottom-width | 边框宽度 |0px| | --nutui-input-color | 文本颜色 |$color-title| | --nu...(GL_BARBARISM_REPLACE)
[locale-violation] ~165-~165: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or | 文本颜色 |$color-title| | --nutui-input-disabled-color | 禁用的文本颜色 |#c8c9cc| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...olor | 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-ba...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ... 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-background-ov...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...utui-input-background-color | 输入框背景颜色 |$color-background-overlay| | --nutui-input-border-radi...(GL_BARBARISM_REPLACE)
[locale-violation] ~167-~167: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-background-overlay| | \--nutui-input-border-radius | 输入框圆角 |0` | | --nutu...(GL_BARBARISM_REPLACE)
[locale-violation] ~168-~168: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...order-radius | 输入框圆角 |0| | --nutui-input-font-size | 文本字号 |$font-size-base| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~169-~169: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 |$font-size-base| | --nutui-input-lineheight | 行高 |$font-size-l| | -...(GL_BARBARISM_REPLACE)
[locale-violation] ~170-~170: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ight | 行高 |$font-size-l| | --nutui-input-padding | 输入框容器的内边距 |10px 25px|(GL_BARBARISM_REPLACE)
src/styles/variables-jmapp.scss (1)
593-603: 變量命名與結構清晰
新增的變量在上下文中與其他輸入框相關變量（如$input-font-size、$input-border-bottom等）一起定義，便於後續維護和使用。建議保持此種命名規則和排版風格。src/styles/variables-jrkf.scss (1)
618-618: 新增输入框行高变量的定义
在此行中添加了$input-lineheight变量，用于设置输入框的行高，其默认值从 CSS 变量--nutui-input-lineheight获取，并回退至$font-size-l。此改动有助于为输入组件提供更灵活的行高配置。建议检查该变量在对应组件（例如
.nut-input-native）中是否正确应用，同时确保其它相关文件（如variables.scss和variables-jmapp.scss）中保持一致的命名和默认值设置。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (10)
src/packages/indicator/demos/taro/demo2.tsx(1 hunks)src/packages/indicator/demos/taro/demo4.tsx(1 hunks)src/packages/input/doc.en-US.md(1 hunks)src/packages/input/doc.md(1 hunks)src/packages/input/doc.taro.md(1 hunks)src/packages/input/doc.zh-TW.md(1 hunks)src/packages/input/input.scss(1 hunks)src/styles/variables-jmapp.scss(1 hunks)src/styles/variables-jrkf.scss(1 hunks)src/styles/variables.scss(2 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- src/packages/input/input.scss
🧰 Additional context used
🪛 LanguageTool
src/packages/input/doc.taro.md
[locale-violation] ~169-~169: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 | $font-size-base | | --nutui-input-lineheight | 行高 | $font-size-l | | -...
(GL_BARBARISM_REPLACE)
src/packages/input/doc.md
[locale-violation] ~169-~169: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 | $font-size-base | | --nutui-input-lineheight | 行高 | $font-size-l | | -...
(GL_BARBARISM_REPLACE)
src/packages/input/doc.zh-TW.md
[locale-violation] ~166-~166: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 | $font-size-base | | --nutui-input-lineheight | 行高 | $font-size-l | | -...
(GL_BARBARISM_REPLACE)
⏰ Context from checks skipped due to timeout of 90000ms (2)
- GitHub Check: build
- GitHub Check: test
🔇 Additional comments (11)
src/packages/indicator/demos/taro/demo4.tsx (1)
26-26: 内容表达方式简化将
{5}简化为5，使代码更加简洁。这是一个小改进，但能提高代码的可读性。src/packages/indicator/demos/taro/demo2.tsx (3)
11-23: 样式优化与 demo4 保持一致性与 demo4.tsx 中相同，使用了
display: 'flex'和pxTransform工具函数对样式进行了优化。这种一致性有助于提高代码的可维护性，并解决了在 Harmony 环境中的显示问题。
25-25: 内容表达方式简化将
{5}简化为5，与 demo4.tsx 保持一致，使代码更加简洁。
4-4: 新增 pxTransform 工具函数的引用引入 pxTransform 工具函数用于处理响应式单位转换，这是一个很好的实践，有助于确保组件在不同屏幕尺寸下的一致性表现。
src/packages/input/doc.zh-TW.md (1)
166-166: 新增 CSS 變量說明正確
在此文件中新增了--nutui-input-lineheight變量，用於自定義輸入框的行高，默認值為$font-size-l。文檔中對此變量的描述簡潔明了，有助於設計人員和開發人員根據需求調整樣式。🧰 Tools
🪛 LanguageTool
[locale-violation] ~166-~166: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 |$font-size-base| | --nutui-input-lineheight | 行高 |$font-size-l| | -...(GL_BARBARISM_REPLACE)
src/packages/input/doc.taro.md (1)
168-170: 新變量在 Taro 文檔中引入正確
該文件中新增了--nutui-input-lineheight變量，與其他語言版本保持一致，使得在 Taro 平台上也能透過 CSS 自定義輸入框行高，默認值設定合理。🧰 Tools
🪛 LanguageTool
[locale-violation] ~168-~168: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...order-radius | 输入框圆角 |0| | --nutui-input-font-size | 文本字号 |$font-size-base| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~169-~169: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...| 文本字号 |$font-size-base| | --nutui-input-lineheight | 行高 |$font-size-l| | -...(GL_BARBARISM_REPLACE)
[locale-violation] ~170-~170: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...ight | 行高 |$font-size-l| | --nutui-input-padding | 输入框容器的内边距 |10px 25px|(GL_BARBARISM_REPLACE)
src/packages/input/doc.en-US.md (1)
165-167: New CSS variable documentation is clear
The addition of the--nutui-input-lineheightvariable (default value$font-size-l) clearly describes the customizability for the input component’s line height. The text is consistent with the other language versions.src/packages/input/doc.md (1)
165-167: 新增 CSS 變量文檔更新正確
在該中新增了--nutui-input-lineheight變量，描述內容與其他版本保持一致，能夠提升輸入框樣式的可定制性，說明清楚且具備一致性。🧰 Tools
🪛 LanguageTool
[locale-violation] ~165-~165: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...or | 文本颜色 |$color-title| | --nutui-input-disabled-color | 禁用的文本颜色 |#c8c9cc| ...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...olor | 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-ba...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ... 禁用的文本颜色 |#c8c9cc| | --nutui-input-background-color | 输入框背景颜色 | `$color-background-ov...(GL_BARBARISM_REPLACE)
[locale-violation] ~166-~166: 'background' é un xenismo. É preferíbel dicir "formación de base"
Context: ...utui-input-background-color | 输入框背景颜色 |$color-background-overlay| | --nutui-input-border-radi...(GL_BARBARISM_REPLACE)
[locale-violation] ~167-~167: 'input' é un xenismo. É preferíbel dicir "entrada"
Context: ...$color-background-overlay| | \--nutui-input-border-radius | 输入框圆角 |0` | | --nutu...(GL_BARBARISM_REPLACE)
src/styles/variables-jmapp.scss (1)
598-598: 新增 $input-lineheight 變量定義正確
此文件中新增的$input-lineheight: var(--nutui-input-lineheight, $font-size-l) !default;定義與其他樣式文件（例如variables.scss）保持一致，保證了輸入框行高可通過 CSS 變量進行靈活配置。src/styles/variables.scss (2)
595-595: 更新输入框行高变量的定义
该改动将$input-lineheight变量定义为：$input-lineheight: var(--nutui-input-lineheight, $font-size-l) !default;使用 CSS 变量优先，fallback 值设为
$font-size-l，有助于统一输入组件行高的样式。请确认该 fallback 值在各个响应式场景下是否符合设计预期。
1858-1858: 更新指示器点间距变量的 fallback 值
此改动将$indicator-dot-margin变量的 fallback 值从原来的可能值调整为$spacing-xxs，如下所示：$indicator-dot-margin: var(--nutui-indicator-dot-margin, $spacing-xxs) !default;这种调整更符合设计要求，能够为指示器元素提供更合理的间距。请确保该改动与整个组件体系中的其他间距设置保持一致。
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
src/packages/checkbox/__test__/checkbox.spec.tsx (1)
45-45: 验证自定义图标设置实现 Harmony 框架兼容根据PR目标，此更改旨在修复自定义图标在Harmony框架中的显示问题。这里使用了
Check图标作为activeIcon，是很好的测试方法，但应该添加更具体的验证。建议更新测试以明确验证自定义图标的渲染：
<Checkbox data-testid="checkbox" activeIcon={<Check className="nut-checkbox-button-icon-checked" />} shape="button" value="1" checked label="复选框" /> // 在测试断言部分 + // 验证自定义图标是否正确渲染 + expect(container.querySelector('.nut-checkbox-button-icon-checked')).toBeInTheDocument()
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
src/packages/checkbox/__test__/checkbox.spec.tsx(2 hunks)
🧰 Additional context used
🪛 GitHub Actions: CI
src/packages/checkbox/__test__/checkbox.spec.tsx
[error] 54-54: expect(received).toBeInTheDocument() - received value must be an HTMLElement or an SVGElement.
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: test
🔇 Additional comments (1)
src/packages/checkbox/__test__/checkbox.spec.tsx (1)
4-4: 正确引入了Check图标组件新增了
@nutui/icons-react中Check图标的导入，这与后续新增的测试用例相匹配。
xiaoyatong
left a comment
There was a problem hiding this comment.
1、Button loading 这个：
2、checkbox 在小程序下：
3、indicator 在小程序和h5 下：纵向处理下border
4、 input demo 底部可以给它加个 margin啥的，理论上我们的demo框支持才对。这是个问题。
| type="primary" | ||
| icon={<Star />} | ||
| rightIcon={<Star />} | ||
| icon={<Star color="#ffffff" />} |
There was a problem hiding this comment.
其实只有 鸿蒙不支持，感觉写了浪费~
默认的放在样式里写更好。
There was a problem hiding this comment.
Icon 使用的 currentcolor，鸿蒙不支持，所以才这样写的
| backgroundColor: `var(--nutui-color-primary-light-pressed)`, | ||
| borderColor: `var(--nutui-color-primary)`, | ||
| color: `var(--nutui-color-primary)`, | ||
| backgroundColor: `#ffebf1`, |
There was a problem hiding this comment.
这种需要给它加个 harmony 判断，保留其他端自定义变量的支持~
| style={{ | ||
| display: 'flex', | ||
| width: pxTransform(14), | ||
| height: pxTransform(14), |
There was a problem hiding this comment.
lineHeight 少了会导致 其他端有问题，可以写1
| <Cell> | ||
| <ConfigProvider theme={{ nutuiLoadingTextColor: '#396aca' }}> | ||
| <Loading>加载中</Loading> | ||
| <ConfigProvider> |
| <Button | ||
| type="success" | ||
| onClick={() => showOverlay()} | ||
| style={{ width: pxTransform(250) }} |
There was a problem hiding this comment.
这样修改按钮看上去在不同端大小差不多
button 通过 loading 属性展示出来的 loading 在组件内部，由于鸿蒙的不支持 currentcolor，无法更改颜色。 |
Summary by CodeRabbit
新功能 / 改进
样式更新
文档更新
测试 & 依赖更新