feat(form): 多端适配

oasis-cloud commented 2 months ago

由于 RN 和鸿蒙的选择器只能支持类选择、多类选择器和伪元素选择器，所以无法实现通过 form 控制 input textarea 等的样式，需要从视觉层面来进行一些组件样式的修复。这样可以确保放到 form 中样式表现良好。

Summary by CodeRabbit

新功能
- 增加了对 formitem 组件的支持，增强了文件复制和修改操作的功能。
- 新增 Input、InputNumber、Range、Switch 和 TextArea 组件，并更新了多个组件的版本。
- 增加了 disabled 和 validateTrigger 属性，以增强表单的功能和控制。
文档
- 更新了 Form 组件的文档，增加了 validateTrigger 属性的描述和新方法 setFieldValue 的介绍。
样式
- 修改了表单项的样式，新增了多个布局类，以改善视觉效果和响应设计。

coderabbitai[bot] commented 2 months ago

Walkthrough

本次变更主要涉及多个文件的更新，增强了表单组件的功能和样式。copy-file.js 脚本新增了对 formitem 组件的处理，config.json 文件中更新了多个组件的版本和属性。表单相关的组件（如 Form 和 FormItem）进行了接口和渲染逻辑的改进，添加了新的属性如 disabled 和 validateTrigger，并引入了新的实用函数 merge 和 toArray 来优化状态管理。样式文件也进行了大幅修改，以改善表单项的布局和视觉表现。

Changes

文件路径	变更摘要
`scripts/rn/copy-file.js`	新增字符串 `'formitem'` 到 `childAdaptedArray`，更新 `copyFile` 函数以处理 `formitem` 组件。
`src/config.json`	多个组件版本从 `2.0.0` 更新到 `3.0.0`，新增 `Input`、`InputNumber`、`Range`、`Switch`、`TextArea` 组件。
`src/packages/form/demos/taro/demo1.tsx`	移除 `InputNumber` 组件，更新 `username` 字段的验证规则，修改 `TextArea` 组件的样式。
`src/packages/formitem/formitem.taro.tsx`	中心化上下文方法访问，新增 `getClassNameWithDirection` 方法，更新 `align` 属性为必填。
`src/packages/form/form.taro.tsx`	新增 `disabled` 和 `validateTrigger` 属性，更新渲染逻辑使用 `<TForm>` 组件。
`src/packages/form/form.tsx`	新增 `disabled` 和 `validateTrigger` 属性，更新上下文值。
`src/packages/form/useform.taro.ts`	新增 `updateStore` 方法，更新 `setInitialValues` 和 `setFieldsValue` 方法以合并值。
`src/packages/form/useform.ts`	新增 `updateStore` 方法，更新 `setInitialValues` 和 `setFieldsValue` 方法以合并值。
`src/packages/formitem/formitem.scss`	新增多个样式类以改善表单项的布局和视觉效果。
`src/packages/formitem/formitem.tsx`	更新上下文访问逻辑，新增 `getClassNameWithDirection` 方法，更新 `align` 属性为必填。
`src/utils/merge.ts`	新增 `merge` 函数以合并多个对象。
`src/utils/to-array.ts`	新增 `toArray` 函数以确保返回数组。
`src/packages/form/doc.en-US.md`	更新文档以包含 `validateTrigger` 属性和 `setFieldValue` 方法。
`src/packages/form/doc.md`	更新文档以包含 `validateTrigger` 属性和 `setFieldValue` 方法。
`src/packages/form/doc.taro.md`	更新文档以包含 `validateTrigger` 属性和 `setFieldValue` 方法。
`src/packages/form/doc.zh-TW.md`	更新文档以包含 `validateTrigger` 属性和 `setFieldValue` 方法。
`src/packages/form/types.ts`	更新接口以添加 `regex` 属性和 `setFieldValue` 方法。

Suggested labels

size/XL

Suggested reviewers

irisSong

🐰 在草地上跳跃，代码更新如春风，
表单组件新生，功能更强更灵动。
样式焕然一新，布局更显美观，
让我们一起欢庆，代码的每一次变换！ 🌼✨

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?

❤️ Share

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

🪧 Tips

### Chat There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai): - Review comments: Directly reply to a review comment made by CodeRabbit. Example: - `I pushed a fix in commit , please review it.` - `Generate unit testing code for this file.` - `Open a follow-up GitHub issue for this discussion.` - Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples: - `@coderabbitai generate unit testing code for this file.` - `@coderabbitai modularize this function.` - PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples: - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.` - `@coderabbitai read src/utils.ts and generate unit testing code.` - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.` - `@coderabbitai help me debug CodeRabbit configuration file.` 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) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai full review` to do a full review from scratch and review all the files again. - `@coderabbitai summary` to regenerate the summary of the PR. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository. - `@coderabbitai help` to get help. ### Other keywords and placeholders - Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. - Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description. - Add `@coderabbitai` anywhere in the PR title to generate the title automatically. ### CodeRabbit Configuration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information. - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json` ### Documentation and Community - Visit our [Documentation](https://docs.coderabbit.ai) for detailed information on how to use CodeRabbit. - Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback. - Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

codecov[bot] commented 2 weeks ago

Codecov Report

Attention: Patch coverage is 98.07692% with 2 lines in your changes missing coverage. Please review.

Project coverage is 83.95%. Comparing base (6341c78) to head (a2c1d07). Report is 1 commits behind head on V3.0.

Files with missing lines	Patch %	Lines
src/packages/formitem/formitem.tsx	95.55%	2 Missing :warning:

Additional details and impacted files

```diff @@ Coverage Diff @@ ## V3.0 #2595 +/- ## ======================================= Coverage 83.95% 83.95% ======================================= Files 221 221 Lines 17849 17849 Branches 2679 2679 ======================================= Hits 14986 14986 Misses 2858 2858 Partials 5 5 ```

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.