Skip to content

feat: Add default values to theme variables #3162

New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Merged
merged 1 commit into from
Mar 19, 2025
Merged

Conversation

chenxi-20
Copy link
Collaborator

@chenxi-20 chenxi-20 commented Mar 19, 2025

PR

PR Checklist

Please check if your PR fulfills the following requirements:

  • The commit message follows our Commit Message Guidelines
  • Tests for the changes have been added (for bug fixes / features)
  • Docs have been added / updated (for bug fixes / features)

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • Other... Please describe:

What is the current behavior?

Issue Number: N/A

What is the new behavior?

Does this PR introduce a breaking change?

  • Yes
  • No

Other information

Summary by CodeRabbit

  • Style Improvements
    • Added default fallback values for fonts, colors, spacing, and borders across many UI components.
    • Enhanced visual consistency in elements such as buttons, alerts, modals, forms, tables, tooltips, and more.
  • Robustness Enhancements
    • Ensured the interface gracefully reverts to reliable default styling when custom theme variables are unavailable, improving overall rendering quality.

@chenxi-20 chenxi-20 added the enhancement New feature or request (功能增强) label Mar 19, 2025
Copy link

coderabbitai bot commented Mar 19, 2025

Caution

Review failed

The pull request is closed.

Walkthrough

This pull request makes widespread updates to the theme’s styling by adding fallback values for CSS custom properties across nearly all component style files. The changes ensure that if a primary CSS variable is undefined, a sensible default is applied. In addition, the theme’s build scripts that generate or map these variables have been updated to adjust string construction and quotation styles, resulting in more robust and consistent styling across components.

Changes

File(s) Change Summary
packages/theme/build/buildVarToObj.js
packages/theme/build/mapVar.js
Revised variable string construction and updated quotation style in build scripts.
packages/theme/src/**/*.less
(e.g. action-menu, alert, amount, badge, base-select, etc.)
Added default fallback values to CSS custom properties so that if a referenced variable is missing, a predefined default value is used to ensure consistent styling.

Poem

I’m a little rabbit snug in code’s garden,
Hoping through styles with a joyful pardon.
Fallbacks now dance in each CSS line,
Ensuring bright defaults every time.
With each tiny change, my heart skips a beat—
Robust and steady, our theme is complete!

Warning

There were issues while running some tools. Please review the errors and either fix the tool’s configuration or disable the tool if it’s a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

packages/theme/build/buildVarToObj.js

Oops! Something went wrong! :(

ESLint: 8.57.1

ESLint couldn't find the plugin "eslint-plugin-vue".

(The package "eslint-plugin-vue" was not found when loaded as a Node module from the directory "".)

It's likely that the plugin isn't installed correctly. Try reinstalling by running the following:

npm install eslint-plugin-vue@latest --save-dev

The plugin "eslint-plugin-vue" was referenced from the config file in ".eslintrc.js » @antfu/eslint-config » @antfu/eslint-config-vue".

If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.

packages/theme/build/mapVar.js

Oops! Something went wrong! :(

ESLint: 8.57.1

ESLint couldn't find the plugin "eslint-plugin-vue".

(The package "eslint-plugin-vue" was not found when loaded as a Node module from the directory "".)

It's likely that the plugin isn't installed correctly. Try reinstalling by running the following:

npm install eslint-plugin-vue@latest --save-dev

The plugin "eslint-plugin-vue" was referenced from the config file in ".eslintrc.js » @antfu/eslint-config » @antfu/eslint-config-vue".

If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.

Tip

⚡🧪 Multi-step agentic review comment chat (experimental)
  • We're introducing multi-step agentic chat in review comments. This experimental feature enhances review discussions with the CodeRabbit agentic chat by enabling advanced interactions, including the ability to create pull requests directly from comments.
    - To enable this feature, set early_access to true under in the settings.
✨ Finishing Touches
  • 📝 Generate Docstrings

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, 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 generate docstrings to generate docstrings for this 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 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 for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

Copy link

[e2e-test-warn]
The component to be tested is missing.

The title of the Pull request should look like "fix(vue-renderless): [action-menu, alert] fix xxx bug".

Please make sure you've read our contributing guide

@zzcr zzcr merged commit 381036a into dev Mar 19, 2025
11 checks passed
Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 0

🧹 Nitpick comments (5)
packages/theme/src/base-select/vars.less (1)

65-71: Consistent Default Tag Heights for BaseSelect
The new fallback values in the tag height calculations for medium, default, small, and mini sizes (i.e. 40px, 32px, 28px, and 24px respectively) ensure that BaseSelect components render reliably even when custom size variables are missing. Please double-check that these defaults align with the overall design system.

packages/theme/src/link/vars.less (1)

25-30: Reliable Defaults for Link SVG Icon Dimensions
The fallback values for the SVG width (16px) and accompanying margin settings contribute to the consistent rendering of link icons. It might be worth verifying these against design guidelines to ensure complete visual harmony.

packages/theme/src/collapse-item/vars.less (1)

15-17: [Verify Fallback Values & Variable References for Text and Background]
The text color is now defined as
--tv-CollapseItem-text-color: var(--tv-color-text, #191919);
which correctly provides a fallback. However, the background color is set as
--tv-CollapseItem-bg-color: var(--tv-color-bg-gray-1, #fafafa);
while design notes in related documents sometimes expect a fallback of #f5f5f5. Please verify that the intended default is indeed #fafafa and that using --tv-color-bg-gray-1 is correct in the context of your theming guidelines.

packages/theme/src/cascader/vars.less (1)

67-67: [Confirm Width Value Quotation]
The Cascader width is set as:
--tv-Cascader-width: '100%';
Using quotes around 100% is unusual in CSS custom property declarations. If this behavior is required (for example, to force a string literal in JS-based style processing), please add a comment clarifying the reason. Otherwise, consider removing the quotes.

packages/theme/src/button/vars.less (1)

31-73: Button Size Variants with Fallback Defaults
Fallback values have been added for button dimensions across various sizes—from default to large, medium, small, and mini—using tokens like var(--tv-font-size-default, 14px) and var(--tv-size-height-md, 32px). This systematic approach will help maintain consistency. Consider whether the fixed pixel values for padding and minimum widths should also be tokenized or calculated dynamically for scalability.

📜 Review details

Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 9d5e3d3 and bcfcff9.

📒 Files selected for processing (98)
  • packages/theme/build/buildVarToObj.js (1 hunks)
  • packages/theme/build/mapVar.js (1 hunks)
  • packages/theme/src/action-menu/vars.less (1 hunks)
  • packages/theme/src/alert/vars.less (2 hunks)
  • packages/theme/src/amount/vars.less (1 hunks)
  • packages/theme/src/badge/vars.less (1 hunks)
  • packages/theme/src/base-select/vars.less (1 hunks)
  • packages/theme/src/breadcrumb/vars.less (1 hunks)
  • packages/theme/src/bulletin-board/vars.less (1 hunks)
  • packages/theme/src/button-group/vars.less (1 hunks)
  • packages/theme/src/button/vars.less (3 hunks)
  • packages/theme/src/calendar-view/vars.less (1 hunks)
  • packages/theme/src/calendar/vars.less (1 hunks)
  • packages/theme/src/card-template/vars.less (2 hunks)
  • packages/theme/src/card/vars.less (3 hunks)
  • packages/theme/src/carousel-item/vars.less (1 hunks)
  • packages/theme/src/carousel/vars.less (1 hunks)
  • packages/theme/src/cascader-menu/vars.less (1 hunks)
  • packages/theme/src/cascader/vars.less (2 hunks)
  • packages/theme/src/chart-core/vars.less (1 hunks)
  • packages/theme/src/checkbox-button/vars.less (1 hunks)
  • packages/theme/src/checkbox/vars.less (1 hunks)
  • packages/theme/src/collapse-item/vars.less (1 hunks)
  • packages/theme/src/collapse/vars.less (1 hunks)
  • packages/theme/src/color-picker/vars.less (1 hunks)
  • packages/theme/src/color-select-panel/vars.less (1 hunks)
  • packages/theme/src/crop/vars.less (1 hunks)
  • packages/theme/src/dept/vars.less (1 hunks)
  • packages/theme/src/dialog-box/vars.less (1 hunks)
  • packages/theme/src/divider/vars.less (1 hunks)
  • packages/theme/src/drawer/vars.less (1 hunks)
  • packages/theme/src/drop-times/vars.less (1 hunks)
  • packages/theme/src/dropdown-menu/vars.less (1 hunks)
  • packages/theme/src/espace/vars.less (1 hunks)
  • packages/theme/src/fall-menu/vars.less (1 hunks)
  • packages/theme/src/file-upload/vars.less (1 hunks)
  • packages/theme/src/filter-box/vars.less (1 hunks)
  • packages/theme/src/filter-panel/vars.less (1 hunks)
  • packages/theme/src/floatbar/vars.less (1 hunks)
  • packages/theme/src/fluent-editor/vars.less (1 hunks)
  • packages/theme/src/form-item/vars.less (1 hunks)
  • packages/theme/src/form/vars.less (1 hunks)
  • packages/theme/src/grid/vars.less (1 hunks)
  • packages/theme/src/guide/vars.less (1 hunks)
  • packages/theme/src/hrapprover/vars.less (1 hunks)
  • packages/theme/src/image-viewer/vars.less (1 hunks)
  • packages/theme/src/image/vars.less (1 hunks)
  • packages/theme/src/input/vars.less (2 hunks)
  • packages/theme/src/ip-address/vars.less (1 hunks)
  • packages/theme/src/link-menu/vars.less (1 hunks)
  • packages/theme/src/link/vars.less (1 hunks)
  • packages/theme/src/loading/vars.less (1 hunks)
  • packages/theme/src/modal/vars.less (2 hunks)
  • packages/theme/src/nav-menu/vars.less (1 hunks)
  • packages/theme/src/notify/vars.less (1 hunks)
  • packages/theme/src/numeric/vars.less (3 hunks)
  • packages/theme/src/pager/vars.less (1 hunks)
  • packages/theme/src/pop-upload/vars.less (1 hunks)
  • packages/theme/src/popconfirm/vars.less (1 hunks)
  • packages/theme/src/popeditor/vars.less (1 hunks)
  • packages/theme/src/popover/vars.less (1 hunks)
  • packages/theme/src/qr-code/vars.less (1 hunks)
  • packages/theme/src/radio-button/vars.less (1 hunks)
  • packages/theme/src/radio/vars.less (1 hunks)
  • packages/theme/src/rate/vars.less (1 hunks)
  • packages/theme/src/rich-text-editor/vars.less (1 hunks)
  • packages/theme/src/roles/vars.less (1 hunks)
  • packages/theme/src/scroll-text/vars.less (1 hunks)
  • packages/theme/src/scrollbar/vars.less (1 hunks)
  • packages/theme/src/search/vars.less (1 hunks)
  • packages/theme/src/skeleton-item/vars.less (2 hunks)
  • packages/theme/src/slider/vars.less (1 hunks)
  • packages/theme/src/split/vars.less (1 hunks)
  • packages/theme/src/statistic/vars.less (1 hunks)
  • packages/theme/src/steps/vars.less (1 hunks)
  • packages/theme/src/switch/vars.less (3 hunks)
  • packages/theme/src/table/vars.less (1 hunks)
  • packages/theme/src/tag-group/vars.less (1 hunks)
  • packages/theme/src/tag/vars.less (4 hunks)
  • packages/theme/src/tall-storage/vars.less (1 hunks)
  • packages/theme/src/text-popup/vars.less (1 hunks)
  • packages/theme/src/textarea/vars.less (1 hunks)
  • packages/theme/src/time-select/vars.less (1 hunks)
  • packages/theme/src/time-spinner/vars.less (1 hunks)
  • packages/theme/src/toggle-menu/vars.less (1 hunks)
  • packages/theme/src/tooltip/vars.less (1 hunks)
  • packages/theme/src/top-box/vars.less (1 hunks)
  • packages/theme/src/transfer/vars.less (2 hunks)
  • packages/theme/src/tree-menu/vars.less (1 hunks)
  • packages/theme/src/tree/vars.less (1 hunks)
  • packages/theme/src/upload-dragger/vars.less (1 hunks)
  • packages/theme/src/upload-list/vars.less (1 hunks)
  • packages/theme/src/upload/vars.less (1 hunks)
  • packages/theme/src/user-card/vars.less (1 hunks)
  • packages/theme/src/user-contact/vars.less (1 hunks)
  • packages/theme/src/user-head/vars.less (1 hunks)
  • packages/theme/src/user-link/vars.less (1 hunks)
  • packages/theme/src/user/vars.less (1 hunks)
🔇 Additional comments (204)
packages/theme/src/steps/vars.less (1)

253-253: Add Fallback for Timeline Item Padding Bottom
Including the fallback value (24px) for --tv-Steps-timeline-item-padding-bottom ensures that when --tv-space-xxl is not defined, the layout still maintains a consistent spacing. This change strengthens the styling robustness.

packages/theme/src/collapse/vars.less (1)

14-14: Provide Fallback for Collapse Divider Line Color
By updating the variable to var(--tv-color-border-divider, #f0f0f0), the component now gracefully handles scenarios when --tv-color-border-divider is undefined. This change improves consistency in the theming behavior.

packages/theme/src/file-upload/vars.less (1)

14-14: Add Fallback for FileUpload Font Size
Assigning a fallback value of 14px to --tv-FileUpload-font-size guarantees that the font size will remain consistent even if --tv-font-size-default is missing. This aligns with the objective of enhancing theme resilience.

packages/theme/src/amount/vars.less (1)

14-15: Enhance Amount Component with Default Icon Values
The update provides fallback values for both --tv-Amount-icon-color (#808080) and --tv-Amount-icon-size (16px). This ensures that the icons render consistently, even when the primary theme variables are not set.

packages/theme/src/qr-code/vars.less (1)

3-3: Set Fallback for QrCode Container Background Color
Adding #ffffff as a fallback in --tv-QrCode-container-bg-color: var(--tv-color-bg-inverse-tint-1, #ffffff); ensures that the QR Code component will maintain a proper background color even if the primary variable is undefined.

packages/theme/src/action-menu/vars.less (1)

28-28: Good Addition of Fallback for Icon Color
The updated declaration for --tv-ActionMenu-icon-color-card now includes a fallback value (#191919) ensuring that the icon displays a sensible default if --tv-color-icon-control is not defined. This update is consistent with the broader theme improvements across components.

packages/theme/src/tree/vars.less (1)

68-68: Enhanced Node Highlight with Fallback
Adding the fallback value (#f5f5f5) to --tv-Tree-node-highlight-bg-color increases the robustness of the tree component’s appearance by guaranteeing a default background color even when --tv-color-bg-active is undefined.

packages/theme/src/cascader-menu/vars.less (1)

17-17: Reliable Cascader Menu Border Color
The modification for --tv-CascaderMenu-border-color now includes a fallback (#f0f0f0), ensuring the border is consistently styled when the primary variable --tv-color-border-divider is not set. This change improves styling resilience in different environments.

packages/theme/src/fall-menu/vars.less (1)

15-52: Consistent Fallback Values Across Fall Menu Variables
The updates in this file uniformly add fallback values to a comprehensive set of CSS custom properties (such as heights, colors, font sizes, and border radii). This consistent approach guarantees that the Fall Menu component maintains its intended design even if the primary theme variables are missing. Overall, this is a robust enhancement to the styling system.

packages/theme/src/tag-group/vars.less (1)

16-20: Robust Tag Group Spacing with Added Fallbacks
The changes for the TagGroup spacing variables now include defined fallback values (12px for --tv-TagGroup-margin-bottom and 8px for both --tv-TagGroup-item-margin-right and --tv-TagGroup-item-margin-bottom). This update ensures consistent layout behavior even when the primary spacing variables are not provided.

packages/theme/src/dropdown-menu/vars.less (1)

15-15: Excellent enhancement with fallback value

Adding a fallback value (0 4px 16px 0 rgba(0, 0, 0, 0.08)) to the box shadow variable improves the robustness of styling. This ensures the dropdown menu will have a defined shadow even if the --tv-shadow-3-down variable isn't defined, preventing potential rendering issues.

packages/theme/src/nav-menu/vars.less (1)

17-17: Great improvement to styling robustness

The addition of fallback values across multiple CSS variables in the NavMenu component creates a more resilient styling system. This approach ensures that the navigation menu will render correctly with sensible defaults even if the theme variables are not properly defined.

Also applies to: 19-19, 21-37, 39-40, 43-46, 47-48, 49-50, 55-76, 81-83

packages/theme/src/time-spinner/vars.less (1)

41-41: Good addition of fallback hover color

Adding the fallback value #deecff for the hover background color ensures consistent styling even when the theme variable --tv-color-bg-hover-3 is not defined. This maintains the expected user interaction experience regardless of theme configuration.

packages/theme/src/calendar/vars.less (1)

15-59: Comprehensive fallback value implementation

The systematic addition of fallback values to all calendar component variables creates a complete and self-contained styling system. This implementation ensures that the calendar will render with appropriate colors for all states (default, hover, selected, disabled) even if the referenced theme variables are undefined.

packages/theme/build/buildVarToObj.js (1)

4-15: Improved variable processing approach

The revised approach for constructing the varsString better handles the structure of the CSS variables by:

  1. Finding the starting point of variable declarations using bracket detection
  2. Creating a proper JavaScript export statement
  3. Applying transformations only to the relevant portion of the string

This change supports the broader goal of properly processing CSS variables with their newly added fallback values.

packages/theme/src/form-item/vars.less (1)

15-37: Consistent Fallbacks for Form Item Variables
The changes add explicit fallback values for multiple form‐related CSS variables (e.g. line height, font size, text colors, margins, etc.). This update improves resilience against missing primary variables and ensures components render with a consistent design even when some theme values are not provided.

packages/theme/src/form/vars.less (1)

15-17: Robust Default Values for Form Variables
The update to include fallback values for --tv-Form-icon-size and --tv-Form-icon-color-error guarantees that even if the primary theme variables are missing, the form components will maintain a consistent and predictable appearance.

packages/theme/build/mapVar.js (1)

1-507: Uniform Formatting of CSS Variable Declarations
The comprehensive reformatting—from using double quotes to single quotes for all CSS variable names and their values—enhances consistency throughout the file. This change improves readability and maintainability without altering functionality. Make sure that any parts of the code that reference these variables are compatible with the new quoting style.

packages/theme/src/drop-times/vars.less (1)

15-25: Enhanced Robustness in DropTimes Variables
By adding fallback values for properties such as font size, padding, font weight, and colors, the drop-times component is now more resilient to missing base theme values. This ensures that the component styling remains consistent even in the absence of the primary theme settings.

packages/theme/src/scroll-text/vars.less (1)

14-15: Secure Fallbacks for ScrollText Variables
The fallback additions for --tv-ScrollText-height and --tv-ScrollText-bg-color ensure that the scroll-text component always has a defined height and background color, thus avoiding unexpected rendering issues when the primary theme variables are unavailable.

packages/theme/src/tooltip/vars.less (9)

15-19: Fallback values for Tooltip Typography
The updated fallback values for font line-height, border-radius, and font-size (lines 15, 17, and 19) improve the robustness of the component. Please ensure these defaults adhere to your design system’s guidelines.


22-24: Fallback Defaults for Tooltip Normal Style
The fallback values for background and text colors in the normal tooltip (lines 22 and 24) are clearly defined. Confirm that these colors align with the overall theme palette.


29-33: Info Tooltip Fallback Values
The info tooltip properties (lines 29–33) now include sensible fallbacks. This change ensures that if the primary variables are undefined, the component will display with appropriate styling.


36-40: Error Tooltip Fallback Values
The fallback defaults for error tooltip styling (lines 36–40) are well set to indicate error states distinctly. Verify the color choices with your design specifications.


43-47: Warning Tooltip Fallback Values
The warning tooltip now includes fallback color values (lines 43–47) to ensure consistent visual feedback. These values appear appropriate—just double-check with the branding guidelines.


50-54: Success Tooltip Fallback Values
The updates for the success tooltip (lines 50–54) add clear fallback defaults. They should reliably communicate a success state; please ensure the chosen colors match your UI design.


57-61: Dark Theme Tooltip Fallback Values
The fallback values for dark theme tooltip properties (lines 57–61) are correctly applied. It’s a good practice to maintain sufficient contrast—please verify this meets accessibility standards.
[approve_code_changes, request_verification]


64-66: Light Theme Tooltip Fallback Values
The light theme styling now features fallback defaults (lines 64–66) that maintain consistency with the inverse mode.


71-77: Additional Tooltip Property Defaults
The fallback settings for box-shadow, vertical padding, horizontal padding, and the error icon color (lines 71–77) enhance the component’s resilience across different environments. Testing across browsers is recommended.

packages/theme/src/breadcrumb/vars.less (2)

15-23: Breadcrumb Styling Defaults
The fallback values for font-size, line-height, text color, selected text color, and separator icon color (lines 15–23) are neatly defined. These defaults will help maintain consistency if the primary theme variables are absent.


31-31: Breadcrumb Font Weight Fallback
The fallback for the breadcrumb font weight (line 31) is set to 600, which provides a strong, clear default. Please ensure this value is in agreement with the design guidelines.

packages/theme/src/user/vars.less (1)

15-21: User Component Variable Defaults
The changes (lines 15, 17, 19, and 21) inject fallback values for font size, tag background, and SVG icon colors (normal and disabled). These defaults will enhance the robustness of the User component styling.

packages/theme/src/split/vars.less (1)

15-23: Split Component Fallback Values
The updates add sensible default values for the Split component’s border color, trigger icon colors (normal and hover), border radius, and trigger line hover color (lines 15–23). This ensures consistent behavior when custom variables are not provided.

packages/theme/src/user-head/vars.less (2)

14-14: UserHead Font Size Fallback
The fallback for the head font size (line 14) is now explicitly defined as 14px, ensuring that the UserHead component maintains legibility if the primary variable is missing.


19-19: UserHead Border Radius Fallback
The fallback for the head border radius (line 19) has been set to 2px, which should provide a subtle border curve. Verify that this value is consistent with the design across similar components.

packages/theme/src/calendar-view/vars.less (1)

15-106: Consistent Fallback Values for CalendarView Variables
The changes across this file add clear and well‐chosen fallback values for all CalendarView CSS custom properties. This robust approach ensures that in the absence of a primary theme variable, the component will gracefully render with a predictable style. Please verify that each fallback (e.g. colors, spacing, font sizes) aligns with the overall design tokens and UI specifications.

packages/theme/src/time-select/vars.less (1)

15-27: Enhanced Fallbacks in TimeSelect Variables
The modifications here introduce fallback values to critical CSS properties—such as text color, font size, padding, and hover/background colors—for the TimeSelect component. This update improves the component’s resilience and ensures visual consistency even when theme variables are missing.

packages/theme/src/statistic/vars.less (1)

3-29: Robust Defaults for Statistic Component
The update in this file methodically adds fallback values for key typography and spacing properties (font sizes, colors, weights, and line heights) used by the Statistic component. This change will help maintain consistent styling across different environments. Just ensure that these defaults are in line with the design guidelines.

packages/theme/src/toggle-menu/vars.less (1)

17-37: Reliable Fallbacks for ToggleMenu Styling
The changes in this file introduce fallback values for several critical properties in the ToggleMenu component (such as font size, icon colors, button background, and hover states). This proactive measure enhances styling robustness and ensures that the ToggleMenu renders correctly even if certain theme variables are not defined.

packages/theme/src/link-menu/vars.less (1)

15-43: Consistent and Resilient LinkMenu Variables
The modifications in this file add fallback values for nearly every CSS custom property related to the LinkMenu component. This ensures that the component will maintain a consistent presentation regardless of upstream variable definitions. Please double-check that these fallback defaults (e.g. text colors, font sizes, border colors) meet the design requirements across different use cases.

packages/theme/src/espace/vars.less (1)

13-17: Default Fallbacks Added for Espace Theme Variables
The changes on lines 15–16 correctly introduce fallback values for the Espace icon colors, ensuring that if the primary CSS variables aren’t defined, the defaults (#808080 and #191919) are applied. This improves the robustness of the theming.

packages/theme/src/dept/vars.less (1)

13-20: Fallback Values for Dept Theme Variables
Lines 14–19 now include default values for font size, text color, font weight, and spacing properties using the CSS var() function with a fallback. This consistent pattern guarantees that even if the referenced base variables are missing, sensible defaults (e.g., 14px, #191919, 600, etc.) will be used.

packages/theme/src/rate/vars.less (1)

13-22: Consistent Fallbacks for Rate Component Variables
The changes at lines 15, 17, 19, and 21 add explicit fallback values (such as 12px, 14px, and 8px) to spacing and font-size properties. This update helps avoid layout issues when the primary theme variables are not provided, and it maintains consistency across the theme components.

packages/theme/src/divider/vars.less (1)

1-20: Enhanced Robustness for Divider Component via Fallback Defaults
The modifications from lines 3, 5, 7, 9, 11, 13, 15, 17, and 19 systematically add fallback values for various divider properties (such as color, border width, etc.). These changes ensure that even in the absence of custom theme definitions, the divider component will render with appropriate styles (e.g., fallback colors like #dbdbdb, #f0f0f0, and #191919).

packages/theme/src/modal/vars.less (7)

12-18: Modal Mask and Global Box Defaults
Lines 15 and 17 add fallback defaults for the modal mask background color (rgba(0, 0, 0, 20%)) and line-height (1.5). Additionally, lines 23, 25, and 27 in the "box 全局" section ensure that the modal box background, border radius, and shadow have proper fallback values, enhancing component resilience.


29-40: Status Icon Fallbacks for Modal Header
The changes in lines 31, 33, 35, 37, and 39 introduce fallback values for various modal status icon colors. This covers all modal statuses (success, error, warning, info, and question), ensuring that each icon displays with a default color if not overridden by the theme.


41-47: Header Spacing and Typography Defaults
Lines 43 and 45 reinforce header padding defaults with fallbacks (32px), while lines 55, 57, and 59 ensure that the modal title’s text color, font size, and font weight use reliable fallback values. This consistent approach guarantees a cohesive header look even with missing global theme styles.


68-70: Close Icon Color Fallbacks
The modifications on lines 68 and 70 add fallback values for the modal’s close icon color and its hover state. The defaults (#808080 and #191919) provide a safe visual fallback, maintaining the UI’s clarity and usability.


75-83: Body Content Styling Defaults
Lines 76, 80, and 82 update the modal body styling by appending fallback values for padding, font size, and secondary text color. These changes help ensure the modal’s message content is rendered consistently regardless of external theme configurations.


84-89: Footer Padding Fallback
At lines 85 and 89, default fallback values are added for the modal footer’s horizontal padding and bottom padding. This secures a uniform layout across devices and styling contexts, even if the parent theme does not supply the required variables.


91-122: Robust Messaging Styling via Fallback Definitions
The final block (lines 93–122) enhances the messaging component within the modal by assigning fallback values for attributes such as background color, border radius, box shadow, padding, icon size, text color, font size, and margin. These thorough updates ensure that modal messages render as intended under any circumstances.

packages/theme/src/bulletin-board/vars.less (1)

15-57: Consistent Fallback Defaults for Bulletin Board Component

All CSS variable declarations now include appropriate fallback values, ensuring robust styling even when primary tokens are missing. The defaults (e.g., 14px, 18px, 600, #191919, etc.) are consistent and seem well aligned with design expectations.

packages/theme/src/roles/vars.less (1)

15-21: Enhanced Fallbacks for Roles Component

The introduction of fallback values for properties like --tv-Roles-poplist-item-height, --tv-Roles-poplist-item-text-color, --tv-Roles-poplist-item-font-size, and --tv-Roles-poplist-item-hover-bg-color helps ensure consistent rendering. The chosen default values (e.g., 32px, #191919, 14px, #f5f5f5) are sensible and align with the overall theme strategy.

packages/theme/src/table/vars.less (1)

15-37: Robust Table Styling with Sensible Defaults

The table-related CSS variables now include fallback values that guarantee a consistent look even if the primary design tokens are not provided. Default values such as #191919 for text color, #ffffff for background, and 40px for cell height are well chosen and maintain design consistency across the theme.

packages/theme/src/image-viewer/vars.less (1)

14-24: Improved Image Viewer Defaults

The fallback overrides for properties like text color, font sizes, and spacing in the Image Viewer component enhance its resilience. The defaults (for instance, #ffffff for text and 20px for close font size) appear thoughtfully selected to ensure a solid baseline style when the custom properties are absent.

packages/theme/src/popover/vars.less (1)

15-35: Enhanced Popover Styling with Fallback Values

The Popover component now benefits from a complete set of default values for background, text color, border radius, typography, and spacing. These fallbacks (such as #ffffff, #595959, 8px, 14px, and a subtle box-shadow) ensure the popover renders reliably even without custom theme settings.

packages/theme/src/image/vars.less (1)

15-21: Robust Fallbacks for Image Error Styles
The updates add explicit fallback values for image error properties (font size, text color, background color, and line height). This ensures a consistent appearance even if the primary theme variables are not set.

packages/theme/src/link/vars.less (2)

15-20: Enhanced Fallbacks for Link Typography and Borders
The introduction of fallback values (e.g. 14px for font size and #191919 for border color) improves the resilience of link styles by ensuring that text and underline colors are defined even when the primary variables are absent.


31-95: Comprehensive Fallbacks for Link States
The updated variables for various link states (default, primary, danger, success, warning, and info) now include fallback values for text and border colors. This change robustly supports theming by preventing undefined styles. Please ensure that the default colors (e.g. #1476ff, #f23030, #5cb300, etc.) are aligned with the overall project design language.

packages/theme/src/popeditor/vars.less (2)

15-26: Solid Defaults for Popeditor Icon and Input Styles
The additions of fallback values for font size, icon colors (normal, disabled, hover), and icon dimensions help the Popeditor component gracefully degrade in the absence of custom theme variables. The reference to related variables (e.g. using --tv-size-height-md for icon height) continues to support flexibility.


29-39: Clear Fallbacks for Popeditor Tabs Styling
The changes to the Popeditor tabs—setting fallback values for selected text color, line height, font size, and font weight—ensure that the header and tab texts are styled consistently regardless of external variable definitions.

packages/theme/src/user-card/vars.less (1)

15-25: Uniform Fallbacks for UserCard Styling
The updated CSS variables now include fallback values for the border color, image border radius, and different user state text colors. These changes enhance the UserCard component’s resilience by ensuring a consistent look even when certain theme variables are not provided.

packages/theme/src/hrapprover/vars.less (1)

14-22: Default Fallback Values Correctly Implemented.
The added fallback values for all CSS custom properties in the Hrapprover variables (e.g. error border color, table text color, font size, etc.) are correct and align well with the design defaults. This change ensures that the component maintains a consistent appearance even if the primary theme variables are not supplied.

packages/theme/src/floatbar/vars.less (1)

15-27: Floatbar Fallback Defaults Added and Consistent.
The updated fallback values for the Floatbar variables—including border radius, font size, background color, list item hover background, margin, and text colors—are appropriately defined. These changes improve the robustness of the theme by ensuring that sensible defaults are used when the primary variables are missing.

packages/theme/src/upload/vars.less (2)

15-25: Upload Variables: Fallbacks Ensure Consistency.
Fallback defaults for upload-specific variables such as tip font size, tip text color, picture card background, border color, border radius, and hover border color have been correctly added. This implementation guarantees that the upload component retains a consistent style under variable-missing conditions.


29-29: Icon Color Fallback Updated.
The fallback for the picture card icon color now uses a default value, maintaining consistency with the overall theme styling.

packages/theme/src/tall-storage/vars.less (1)

15-23: Tall Storage Variables Updated with Robust Defaults.
The fallback values for background color, border radius, item height, hover background color, and box shadow in the Tall Storage variables are properly specified. This ensures that the component displays reliably even when certain theme variables are missing.

packages/theme/src/drawer/vars.less (1)

17-41: Drawer Component: Comprehensive Fallback Values.
The Drawer variables have been updated comprehensively—with fallback defaults for background color, padding, divider border, border radius, mask background, shadow, head title font size & weight, title color, and icon colors. These changes significantly improve the resilience of the drawer component, ensuring a consistent and predictable appearance regardless of external theme variable definitions.

packages/theme/src/collapse-item/vars.less (2)

19-21: [Review Disabled Text Color Variable Naming]
The disabled text color is declared as
--tv-CollapseItem-disabled-text-color: var(--tv-color-icon-disabled, #c2c2c2);
even though one might expect a variable named something like --tv-color-text-disabled for a text property. Please double-check that referencing --tv-color-icon-disabled here is intentional and aligns with the design/system tokens.


31-33: [Check Header Border and Title Color Defaults]
For the header border, you have:
--tv-CollapseItem-header-border-color: var(--tv-color-border-divider, #f0f0f0);
and for the right title colors:
--tv-CollapseItem-title-right-text-color: var(--tv-color-text-link, #1476ff);
--tv-CollapseItem-title-right-icon-color: var(--tv-color-icon-link, #1476ff);
These fallback values differ from some earlier design references (e.g. expected defaults like #c2c2c2 for a border or #191919 for text). Please verify that these updated defaults are intentional, and that the change to use -link variants is aligned with overall theme improvements.

packages/theme/src/text-popup/vars.less (1)

15-31: [Approve: Comprehensive Fallbacks for TextPopup]
All CSS variables in the .inject-TextPopup-vars() rule now include sensible fallback values. This approach greatly improves style robustness when design tokens aren’t provided. Ensure that values such as 6px, 32px, and color defaults match the design specifications.

packages/theme/src/scrollbar/vars.less (1)

27-35: [Approve: Robust Fallbacks for Scrollbar Variables]
The fallback values for scrollbar spacing, width, thumb background color, hover color, and border-radius are clearly specified and appear sensible. It might be worthwhile to quickly recheck that values like 4px, 8px, and #dbdbdb conform to the design system.

packages/theme/src/cascader/vars.less (2)

19-19: [Verify Cascader Border Color Default]
The border color for the Cascader dropdown is now defined as:
--tv-Cascader-border-color: var(--tv-color-border-divider, #f0f0f0);
Please confirm that the fallback value #f0f0f0 is correct and that using --tv-color-border-divider (instead of, for example, --tv-color-border) matches the intended design token.


53-59: [Review Cascader List and Item Defaults]
The variables controlling text and background colors in the dropdown list have been updated:

  • --tv-Cascader-list-text-color: var(--tv-color-text, #191919);
  • --tv-Cascader-item-hover-bg-color: var(--tv-color-bg-hover, #f5f5f5);
  • --tv-Cascader-empty-text-color: var(--tv-color-text-secondary, #595959);

These changes enhance robustness by providing fallbacks. Please verify that these fallback colors are consistent with other components and the overall design language.

packages/theme/src/chart-core/vars.less (1)

14-16: [Approve: Clear Fallbacks for ChartCore Empty State Variables]
The CSS variables for ChartCore’s empty state now include default values:

  • Text color: #808080
  • Font size: 14px
  • Background color: #ffffff

These additions should ensure that components display consistently even when higher-level tokens are missing.

packages/theme/src/card-template/vars.less (3)

15-15: Solid Fallback for Tool Icon Size.
The update on line 15 ensures that if --tv-icon-size is not defined, a default value of 16px is used. This is a straightforward and effective way to guarantee consistent icon sizing.


26-26: Consistent Fallback for Header Font Size.
The change on line 26 adds a fallback value (16px) to --tv-CardTemplate-header-font-size, which helps maintain consistency in typography if --tv-font-size-lg isn’t provided. Please confirm that this default aligns with the overall design guidelines.


31-31: Robust Shadow Definition with Fallback.
The modification on line 31 ensures that --tv-CardTemplate-more-box-shadow uses a default box-shadow (0 2px 12px 0 rgba(0, 0, 0, 0.16)) when --tv-shadow-2-down is undefined. This enhances the component’s visual resilience.

packages/theme/src/fluent-editor/vars.less (1)

15-35: Comprehensive Fallback Defaults for FluentEditor.
The changes from lines 15 through 35 consistently add fallback values to multiple CSS custom properties in the FluentEditor component. This ensures that sensible defaults (e.g., colors, border radii, shadows) are applied when the primary theme values are missing. Please double-check that these defaults are in sync with the design system.

packages/theme/src/user-link/vars.less (1)

14-17: Appropriate Fallbacks for UserLink Component.
The adjustments from lines 14 to 17 add default values for the font size, text color, font weight, and border radius on the UserLink component. These changes guarantee that the styling remains predictable even when the main theme variables are absent.

packages/theme/src/search/vars.less (1)

15-67: Robust Default Values for Search Component Styles.
The modifications in this file (lines 15–67) introduce fallback values for a wide range of properties in the Search component, including font size, input height, padding, colors, borders, shadows, and more. This extensive update improves the resilience of the component’s styling by ensuring defaults are in place when primary variables are missing. Please verify that all default values comply with the overarching design requirements.

packages/theme/src/filter-panel/vars.less (3)

14-14: Fallback for Panel Margin Top.
On line 14, adding a fallback (8px) to --tv-FilterPanel-margin-top via var(--tv-space-md, 8px) is a useful enhancement to ensure consistent spacing when the primary spacing variable isn’t defined.


20-20: Robust Bottom Shadow Fallback.
The update on line 20 includes a fallback value for --tv-FilterPanel-bottom-box-shadow that improves visual consistency, ensuring the component maintains its intended shadow styling even if --tv-shadow-4-down isn’t provided.


22-22: Clear Fallback for Top Shadow.
Similarly, line 22 now specifies a fallback for --tv-FilterPanel-top-box-shadow, which ensures that the top shadow is consistently rendered via a default value if --tv-shadow-4-up is missing.

packages/theme/src/carousel-item/vars.less (1)

13-19: Solid default fallback values for Carousel item variables.
The updated CSS variables now include explicit fallback values (e.g., 40px for height, #808080 for text color), which ensures the Carousel component renders consistently even if the primary theme variables aren’t defined. Consider adding a short inline comment to reference the design specifications if these values require future coordination.

packages/theme/src/checkbox/vars.less (1)

15-49: Consistent and robust fallback settings for Checkbox variables.
The fallback values added across the Checkbox variables—covering aspects such as icon size, background colors, border styles, and text colors—are well chosen and help ensure reliable rendering under various theme configurations. Please double-check that these defaults align with the design system guidelines.

packages/theme/src/popconfirm/vars.less (1)

15-40: Comprehensive default values for Popconfirm variables.
All updated properties now include sensible fallback values (for font sizes, line heights, spacing, etc.), which increases the styling resilience of the Popconfirm component. It might be beneficial to document if any of these defaults are subject to change based on future de#dates.

packages/theme/src/notify/vars.less (1)

18-69: Robust fallback declarations for Notify styling properties.
The Notify component now benefits from thorough fallback values for layout, color, spacing, and typography properties. This update will help maintain consistent styling even if some theme variables are omitted. Verify that these defaults remain in line with the overall notification design standards.

packages/theme/src/textarea/vars.less (1)

15-63: Well-defined default values for Textarea variables.
The modifications introduce clear fallback values for the Textarea’s text, background, sizing, spacing, and border properties. This ensures that the component degrades gracefully when theme overrides are absent. Ensure that these defaults match the intended design specifications and are documented accordingly.

packages/theme/src/radio-button/vars.less (2)

15-19: Consistency Check on Font Size Default
Line 19 sets the --tv-RadioButton-font-size fallback to 14px, but the PR summary mentioned a fallback of 12px. Please verify whether this change is intentional or if it should be adjusted for consistency with the design specifications.


21-39: Robust Fallbacks Implementation
The addition of fallback values for text color, border radius, background colors, disabled states, and size dimensions greatly enhances resilience when primary theme variables are missing. Nice work ensuring comprehensive coverage.

packages/theme/src/badge/vars.less (1)

15-43: Ensuring Consistent Badge Styles
The default fallback values for the Badge component (including border radius, padding, font size, colors, and spacing) are clear and consistent. These changes will help maintain the intended design even when custom variables are undefined.

packages/theme/src/skeleton-item/vars.less (2)

3-11: Robust Fallback Values for Skeleton Item
The fallback assignments for background color, border radius, image icon color, and square height ensure that the skeleton items render correctly in the absence of primary theme variables.


31-31: Linear Gradient Fallbacks
The linear-gradient property now includes appropriate fallback colors, ensuring visual consistency when custom properties are missing.

packages/theme/src/crop/vars.less (1)

15-29: Enhanced Crop Component Fallbacks
By adding fallback values for modal background, center, face, select background, icon colors, and box shadow properties, the Crop component is now more resilient to missing theme values. This update should help maintain a consistent look-and-feel under varied conditions.

packages/theme/src/upload-dragger/vars.less (1)

19-35: Default Fallbacks for Upload Dragger
The fallback values for background color, border color, border radius, hover text color, icon color, and text properties are well defined, ensuring that the Upload Dragger component maintains a consistent appearance even when custom theme variables are not provided.

packages/theme/src/rich-text-editor/vars.less (8)

3-3: Fallback for Border Color: The border color variable now includes a fallback value (#c2c2c2) via var(--tv-color-border, #c2c2c2), ensuring a consistent default when the primary variable is not defined.


5-5: Fallback for Line Height: The line height property now falls back to 1.5 when --tv-line-height-number is absent, which is a sensible default for text rendering.


7-7: Fallback for Icon Hover Color: Adding a fallback (#191919) for the icon hover color ensures that hover states remain consistent if --tv-color-icon-hover is undefined.


9-9: Fallback for Icon Disabled Color: The icon disabled color now safely defaults to #c2c2c2, maintaining visual consistency when the primary variable is missing.


13-13: Fallback for Options Box-Shadow: The dropdown box-shadow property now provides a default value (0 4px 16px 0 rgba(0, 0, 0, 0.08)), which should help maintain a consistent shadow effect across themes.


15-15: Fallback for Options Border Radius: The border radius for options now correctly defaults to 6px if --tv-border-radius-md is absent, ensuring proper rounding of corners.


17-17: Fallback for Options Text Color: Providing a fallback (#191919) for the text color of options guarantees text remains legible when the primary color variable is not set.


19-19: Fallback for Options Item Background Color: The options item’s background color now falls back to #f5f5f5, which is an appropriate default to maintain visual consistency in dropdown interactions.

packages/theme/src/color-select-panel/vars.less (8)

3-3: Fallback for Large Border Radius: The variable for the large border radius now includes a fallback of 8px (via var(--tv-border-radius-lg, 8px)), ensuring the component’s roundness remains consistent.


5-5: Fallback for Medium Border Radius: Using 6px as a fallback for the medium border radius (var(--tv-border-radius-md, 6px)) guarantees a consistent, expected roundness for panel elements.


7-7: Fallback for Small Border Radius: The small border radius now defaults to 4px when --tv-border-radius-sm is undefined, which is a good fit for tighter UI elements.


9-9: Fallback for Vertical Padding: The vertical padding for the popup is safely set to 8px via var(--tv-space-md, 8px), ensuring uniform spacing even when the variable isn’t provided.


11-11: Fallback for Horizontal Padding: A fallback of 8px (via var(--tv-space-md, 8px)) for horizontal padding supports design consistency across different screen sizes.


13-13: Fallback for Alpha Margin Top: Providing a fallback (8px) for the alpha margin top ensures that spacing remains consistent even if the spacing variable is missing.


15-15: Fallback for Box Shadow: The box-shadow for the popup now falls back to 0 2px 12px 0 rgba(0, 0, 0, 0.16), which should give a subtle yet effective shadow effect when needed.


17-17: Fallback for Background Color: The background color defaults to #ffffff (white), ensuring that the popup remains clear and legible regardless of the theme configuration.

packages/theme/src/transfer/vars.less (6)

49-49: Fallback for Button Background Color: The button background color now safely falls back to #1476ff if --tv-color-bg-active-control isn’t defined, which aligns with the intended active control style.


51-51: Fallback for Button Left Padding: The left padding for the transfer button now offers a fallback (2px) via var(--tv-space-xs, 2px), ensuring consistent spacing.


53-53: Fallback for Button Right Padding: Similar to the left padding, the right padding now includes a fallback value (2px), maintaining balance in the button’s padding.


55-55: Fallback for Button Top Padding: A fallback of 2px for the top padding ensures that the button retains appropriate vertical spacing when the space variable is not set.


57-57: Fallback for Button Bottom Padding: The bottom padding is now consistently defined with a fallback value (2px), matching the other padding settings.


87-87: Fallback for Active Panel Item Background: The active background color for the transfer panel items now falls back to #f0f7ff, ensuring a clear visual cue for selection even if the themed variable is missing.

packages/theme/src/top-box/vars.less (6)

14-14: Fallback for Top Box Background Color: The background color for the TopBox now defaults to #ffffff if --tv-color-bg-secondary is undefined, which helps maintain a clean, consistent look.


16-16: Fallback for Success Icon Color: The success icon color now falls back to #5cb300, ensuring that success messages or indicators are vividly displayed when the primary variable is unavailable.


17-17: Fallback for Error Icon Color: Adding a fallback of #f23030 for error icons ensures they remain prominent and easily distinguishable, contributing to better UI feedback.


18-18: Fallback for Warning Icon Color: The warning icon color now includes a fallback (#ff8800), which is effective in highlighting cautionary elements in the UI.


19-19: Fallback for Help Icon Color: The help icon color’s fallback (#191919) guarantees that informational icons are clearly visible even when the primary theming variable isn’t defined.


20-20: Fallback for Info Icon Color: Using #1476ff as a fallback for the info icon color ensures that informational elements maintain a consistent appearance in the absence of a custom value.

packages/theme/src/color-picker/vars.less (13)

3-3: Fallback for Border Color: The ColorPicker button’s border color now defaults to #808080 when --tv-color-border-ghost is not defined, which helps in maintaining a subtle yet clear border.


5-5: Fallback for Medium Border Radius: The button’s medium border radius now safely falls back to 6px (via --tv-border-radius-md, 6px), ensuring smooth curves even in the absence of a theme setting.


7-7: Fallback for Extra-Small Border Radius: The fallback value 2px for the extra-small border radius ensures that even compact buttons retain a defined rounded corner.


9-9: Fallback for Vertical Padding: The vertical padding for the ColorPicker button now falls back to 4px, ensuring consistent internal spacing.


11-11: Fallback for Horizontal Padding: With a fallback of 4px for horizontal padding, the button maintains a balanced layout even if the primary spacing variable is missing.


14-14: Fallback for Large Size Height: The large size height for the ColorPicker is now robust with a default of 48px, ensuring consistency for super-sized components.


16-16: Fallback for Large Size Width: Similarly, the large size width now has a fallback value of 48px, keeping the component’s proportions in check.


19-19: Fallback for Medium Size Height: The medium size height now defaults to 40px, which is well-suited for mid-sized UI elements.


21-21: Fallback for Medium Size Width: Using 40px as the fallback for the medium size width helps maintain a cohesive design for medium buttons or inputs.


24-24: Fallback for Small Size Height: A fallback of 28px is provided for the small size height, ensuring that even smaller elements are sized appropriately.


26-26: Fallback for Small Size Width: The small size width now defaults to 28px, preserving proportionality in reduced-scale components.


29-29: Fallback for Mini Size Height: The mini size height now reliably defaults to 24px, ensuring that the smallest variant of the component has consistent dimensions.


31-31: Fallback for Mini Size Width: A fallback of 24px is set for the mini size width; this helps ensure that the component appears balanced in its mini version.

packages/theme/src/dialog-box/vars.less (6)

15-27: Consistent Fallback Values for Dialog Box Core Properties
This block now adds explicit fallback values for key properties such as background color, border radius, shadow, container padding, header font size, font weight, and text color. These defaults help ensure consistent styling even when the primary variables are undefined.


34-36: Fallbacks for Close Icon Colors
Fallback values have been provided for both the default and hover states of the close icon color. Please verify that these values (i.e. #808080 and #191919) meet the design requirements.


39-43: Fallbacks for Body and Drawer Text Colors
The body font size, body text color, and drawer body color now include fallback values. This enhances robustness when the primary variables aren’t set, ensuring that the component retains a consistent visual appearance.


50-50: Default Fallback for Drawer Divider Border Color
An explicit fallback (#f0f0f0) has been added for the drawer divider border color. Confirm this value aligns with overall theme guidelines.


52-54: Fallbacks for Resize Icon Colors
The resize icon’s default and hover colors are now safeguarded by fallbacks. This change ensures that the icon renders appropriately if the primary color variables are missing.


56-58: Fallbacks for Resize Icon Size and Vertical Padding
Fallback values for the resize icon size and the dialog box’s vertical padding have been set. These values (16px and 2px, respectively) will help maintain a consistent layout.

packages/theme/src/user-contact/vars.less (1)

15-33: Fallback Values for User Contact Component Variables
All properties in the User Contact block now include explicit fallback values for font size, text colors, border color, and background colors. This ensures the component maintains a consistent appearance even when the theme’s primary variables are not provided.

packages/theme/src/pop-upload/vars.less (1)

15-43: Comprehensive Fallback Values for Pop Upload Component
This update uniformly applies fallback values across various properties—including font sizes, table header styling, row backgrounds, and status icon colors—to ensure robust default styling in the absence of theme overrides. Please verify that all fallback values (e.g. 14px, 24px, #191919, #f5f5f5, etc.) are aligned with the intended design system.

packages/theme/src/switch/vars.less (5)

15-19: Fallbacks for Switch Background Colors
Fallback values are now provided for the switch’s on, off, and disabled background colors. This ensures that the control displays a consistent appearance even if the primary color variables are missing.


23-27: Fallbacks for Switch Disabled and Dot Colors
The defaults for disabled text color, disabled dot background, and the switch dot color have been established. These enhancements ensure visual consistency, particularly when the expected theme values are not available.


37-37: Fallback for Switch Text Color
The primary text color for the switch now includes a fallback value, ensuring proper contrast and readability.


45-47: Fallbacks for Switch Inner Button Styling
Explicit fallback values for the inner button’s font size and border radius have been added, promoting a uniform look across different device resolutions and states.


61-65: Fallbacks for Switch Loading Font Sizes
Both the on and off loading states now have fallback font sizes provided. This change ensures that loading indicators remain consistent in style and legibility.

packages/theme/src/filter-box/vars.less (1)

14-46: Robust Fallback Values for Filter Box Styling
Every CSS custom property within the Filter Box component—from button height and padding to text color, font size, line height, and icon dimensions—now includes an explicit fallback. This comprehensive update safeguards against missing theme variables and ensures that the component maintains its intended visual design.

packages/theme/src/radio/vars.less (1)

15-57: Consistent Fallback Values for Radio Component Variables.
All CSS custom properties inside the radio mixin have been updated to include fallback values (e.g. default text color, font size, border colors, etc.). These defaults should help ensure a consistent appearance when the primary theme variables are missing. Please verify that these default values align with the overall design specifications and branding guidelines.

packages/theme/src/checkbox-button/vars.less (1)

15-51: Fallback Defaults Added for CheckboxButton Styling.
The updated mixin now defines fallback values for various properties including background colors, font sizes, text colors, and border settings. This consistent use of the var() function with default values improves robustness. Ensure that these defaults are in line with the project’s design system.

packages/theme/src/upload-list/vars.less (1)

15-61: Robust Fallbacks in UploadList Variable Definitions.
Fallback values have been uniformly applied to essential properties (font size, text and background colors, border radius, etc.) for the upload list component. These changes should help avoid styling issues in the absence of user-defined theme variables. Please confirm that these defaults are consistent with the overall UI theme.

packages/theme/src/carousel/vars.less (1)

19-59: Comprehensive Fallback Values for Carousel Styling.
The carousel mixin now incorporates fallback defaults for multiple attributes such as arrow font-size, background colors for various states, and indicator styling. This approach enhances the resilience of the component’s styling. Verify that the chosen fallback values (e.g. “16px”, “#e6e6e6”, etc.) meet the design requirements.

packages/theme/src/card/vars.less (1)

15-81: Enhanced Fallback Mechanism in Card Component Variables.
The card mixin now provides default fallback values for background, border, font sizes, and text colors. This update ensures that even if the primary CSS variables are missing, the component will display with a consistent and robust style. Please ensure these defaults are reviewed for alignment with the intended design system.

packages/theme/src/ip-address/vars.less (3)

15-25: Fallback Defaults for Base IPAddress Styling

The updated custom property definitions for the input height, horizontal padding, delimiter margin, text color, and icon color now include explicit fallback values. This ensures that when the corresponding theme variables (e.g., --tv-size-height-md, --tv-space-lg, etc.) are not defined, the IP address component still renders with sane defaults.


29-47: Fallback Defaults for State & Typography

The changes providing fallback values for disabled text color, border color, background color, border radius, font size, font family, as well as focus and hover border colors guarantee consistent visual styling. These defaults protect the component’s appearance against missing or misconfigured theme variables.


51-57: Responsive Sizing with Calculated Defaults

The use of calc() with fallback values for medium, default, small, and mini heights ensures that the component’s responsive sizing remains robust even when the primary size variables are missing. This promotes reliable layout behavior.

packages/theme/src/loading/vars.less (3)

15-23: Fallback Defaults for Loading Component Visuals

The modifications add explicit fallback values for properties such as the loading icon color (#191919), text color (#595959), and font size (16px), which help ensure that the Loading component has a consistent visual presentation even when the primary variables are undefined.


28-39: Consistent Fullscreen Loading Icon Dimensions

The fallback values for the fullscreen loading icon’s widths (small, medium, and large) and heights (small, medium, and large) are clearly defined. This consistency guarantees that the component scales properly across different usage scenarios.


42-53: Robust Fallbacks for Loading Spinner Sizing

By specifying fallback values for the spinner dimensions (both heights and widths, for small, medium, and large variants), the implementation ensures that the spinner will maintain reliable size properties even if custom theme values are missing.

packages/theme/src/alert/vars.less (7)

25-29: Global Alert Styling Fallbacks

The addition of fallback values for the alert’s border radius and padding (horizontal and vertical) establishes a solid base for global alert styling. This makes sure that even if the primary theme variables are absent, the alert maintains a visually appealing, consistent spacing and shape.


40-40: Fallback for Alert Icon Margin

Providing a fallback for the alert icon’s right margin (via --tv-Alert-icon-margin-right) ensures that spacing around the icon remains consistent across various theme configurations.


45-58: Fallbacks for Alert Content Typography

The defaults now applied for alert title font size, weight, color, and margin—as well as for the description font size, weight, and color—ensure that text elements have a consistent and legible appearance regardless of upstream variable definitions.


63-71: Fallbacks for Alert Close Icon Styling

The fallback settings for the close icon’s font size, color, hover color, and spacing (top and right margins) guarantee that the close action remains visually consistent and intuitive even if custom theme variables are not provided.


74-74: Fallback for Alert Close Text

Assigning a fallback for the alert close text’s font size supports a uniform appearance for the alert’s interactive elements.


79-87: Fallbacks for Alert Normal State

The default configurations for the Normal alert state—including icon size and horizontal padding—ensure that even if theme variables are missing, the alert in its “normal” variation displays with appropriate spacing and proportions.


92-110: Fallback Values for Themed Alert Variants

All the theme-specific properties (for success, error, warning, info, and simple variants) now include explicit fallback values. This comprehensive approach ensures that each alert variant exhibits a consistent and predictable appearance, maintaining de#tegrity even when custom values are not provided.

packages/theme/src/guide/vars.less (6)

7-19: Guide Header and Title Fallbacks

The fallback values for the guide header’s border radius, line height, and background color—as well as for the title’s text color, line height, font weight, and font size—provide robust defaults. This ensures that the header and title render consistently regardless of external theme customizations.


21-27: Guide Cancel Icon Fallbacks

Fallback specifications for the cancel icon’s width, height, color, and hover color ensure that the interactive close functionality of the guide component is reliably styled.


29-35: Guide Text Content Styling Fallbacks

The default values for the guide text color, line height, font size, and scrollbar border color enhance content legibility and ensure that the text content is consistently styled when custom variables are not defined.


37-39: Guide Footer Border Radius Defaults

Specifying fallback values for the footer’s bottom-left and bottom-right border radii helps maintain a consistent rounded appearance for the guide component.


41-55: Guide Progress Text and Button Styling Fallbacks

The fallback configurations for progress text color and various button-related properties (text color, border color, border radius, background color, hover border color, and disabled styles) ensure that interactive elements and progress indicators remain coherent with the overall design.


57-65: Guide Button Dimensions and Shepherd Element Defaults

The defaults for the guide button’s font size and height, as well as for the shepherd element’s border radius, provide reliable sizing across components, ensuring that interactive elements retain a consistent look even when theme values aren’t explicitly set.

packages/theme/src/button-group/vars.less (8)

15-23: Button Group Base Defaults

The fallback values for the button group’s border radius, line height, background color for inactive items, and secondary text color establish a solid base style for the component’s container.


25-31: Button Item Dimensions & Disabled State Fallbacks

Defaults for button item height, font size, disabled background, and disabled text colors ensure that the individual buttons maintain a consistent visual identity even when custom theme variables are missing.


33-35: Button Item Hover State Defaults

The fallback values for the hover background and text colors help maintain interactive feedback for non-selected button items.


38-44: Plain Button Styling Fallbacks

The plain button styling now benefits from fallback values for text color, border color, background color, and plain border color. This comprehensive approach ensures that even the less prominent button styles are consistently rendered.


46-50: Active Button State Defaults

The explicit fallbacks for active state background color, disabled active background, and active text color ensure that selected button items stand out with the intended contrast and visual clarity.


57-61: Mini Button Group Fallbacks

The fallback settings for the mini variant—such as border radius, sup font color, and sup font size—ensure that the compact version of the button group is styled appropriately.


63-68: Size Variant Defaults for Button Group

Default values for the medium, small, and mini size variants (derived from height variables) guarantee that the button group scales correctly across different size specifications.


75-75: Additional Hover Background Fallback

The fallback for the hover background of the “more” dropdown item ensures that extended button group options are visually consistent with the rest of the component.

packages/theme/src/input/vars.less (1)

14-80: Solid enhancement with default fallback values in Input variables.
The added fallback values in the CSS custom properties guarantee that if the primary theme variable is missing, each input style still renders with a sensible default (for example, #191919 for text color and #ffffff for background). This consistency across properties such as text color, background, font sizes, border colors, and spacing greatly improves the robustness of the component styling.

packages/theme/src/tree-menu/vars.less (1)

17-83: Consistent fallback defaults for Tree Menu variables.
The modifications introduce fallback values for all relevant CSS properties (e.g., node height, font size, border colors, etc.), ensuring that the Tree Menu component degrades gracefully when custom theme variables are absent. The chosen defaults, such as 32px for height and #191919 for key border or text colors, are appropriate and coherent with the overall design system.

packages/theme/src/numeric/vars.less (1)

17-101: Robust default fallbacks for Numeric component styling.
All numeric input-related variables have been updated to include fallback values, which ensures that numeric inputs display correctly even if certain theme variables aren’t defined. Defaults like 32px for normal height, 14px for font sizes, and appropriate border and background colors maintain visual consistency with other components.

packages/theme/src/slider/vars.less (1)

15-97: Enhanced Slider variables with dependable fallback values.
The updates add sensible fallback values to the slider’s CSS custom properties. For example, specifying 14px for font size, #f5f5f5 for background color, and appropriate fallback colors for hover, disabled, and active states ensures that the slider component always renders predictably—improving both robustness and user experience.

packages/theme/src/pager/vars.less (1)

15-109: Improved Pager variables via default fallbacks.
By introducing fallback values (such as 14px for font sizes, #191919 for text colors, and well-calculated margin/padding values), these changes make the pager component’s styling more resilient. This ensures a consistent appearance even when custom theme variables are missing, aligning the pager’s design with the overall theme system.

packages/theme/src/tag/vars.less (7)

16-70: Fallbacks for Typography and Spacing in Tag Styles
The new declarations for tag typography (e.g. line height, font sizes, and border radii) now use the CSS var() syntax with sensible fallback values (e.g. var(--tv-line-height-number, 1.5) and var(--tv-font-size-sm, 12px)). This greatly improves resiliency in case the design tokens are missing. Please verify that these fallback numbers match your design guidelines.


80-97: Added Fallback Defaults for Basic Color Variables
The light, dark, and plain variations for tag colors (text, background, and border) now include explicit fallback values (for example, var(--tv-color-text, #191919) and var(--tv-color-bg, #f5f5f5)). This makes the styling more robust. In particular, note the comment at line 96 regarding the plain border color; please double-check whether the fallback value is the intended one per your design system.


98-115: Success Theme Colors Updated with Fallbacks
Fallback values for the success states (across light, dark, and plain variations) have been applied consistently. Ensure that using the same fallback color (e.g. #5cb300 for dark background and border) is intentional and aligns with the overall design.


117-134: Error/Danger Theme Fall-back Values Verification
Error (or danger) state variables for both light and dark variants—as well as their plain counterparts—now include fallbacks (e.g. var(--tv-color-error-text, #f23030)). The consistency across these states is good; please confirm that the contrast and visual emphasis conform to accessibility and design standards.


136-153: Warning Theme Fallbacks and Accessibility Check
The warning theme color variables now incorporate fallback values (for both text and borders) via the var() notation. This should reduce styling issues when tokens are undefined. It is recommended to verify that the chosen fallback colors (for example, #ff8800) provide sufficient contrast per accessibility guidelines.


155-172: Info Theme Colors Updated with Defaults
All info-related color variables (light, dark, and plain) now specify fallback values. This update ensures that a defined fallback (for instance, #1476ff) is always available. Please check these values against your design tokens to guarantee visual consistency.


209-227: Icon and Disabled State Variables Updated
The changes to close icon sizing, colors, and related spacing (using fallbacks such as var(--tv-color-icon-disabled, #c2c2c2) and var(--tv-space-sm, 4px)) help ensure that disabled states and icon elements degrade gracefully if the primary tokens are missing. This is a welcome improvement—please verify the final visuals in context.

packages/theme/src/grid/vars.less (1)

15-220: Comprehensive Fallback Defaults for Grid Variables
This file has been overhauled with fallback values for nearly every grid-related CSS custom property—from font sizes and line heights to colors for text, borders, backgrounds, icons, and even spacing for cells, headers, inputs, toolbars, and filters. These updates help maintain a consistent look even when certain design tokens are missing. Given the volume of changes, please ensure each fallback value (e.g. var(--tv-font-size-default, 14px), var(--tv-line-height-number, 1.5), etc.) correctly reflects the intended design system. Also, verify that using calc expressions (for paddings and margins) remains valid and behaves as expected.

packages/theme/src/button/vars.less (8)

16-27: Base Button Typography and Border Radius Defaults
The button’s core properties—such as font weight, border width, line height, and multiple border radius settings (default, round, and circle)—now implement fallback tokens (e.g. var(--tv-font-weight-regular, 400) and var(--tv-border-radius-md, 6px)). This ensures a consistent baseline even if certain global tokens are absent. The values appear reasonable; just confirm that a “circle” button using a fallback of 999px (instead of a percentage) meets your design needs.


85-136: State Color Variables for Button Variants
For the default, primary, success, warning, danger, and info themes, the button’s text, background, border, and icon colors now use fallbacks (for example, var(--tv-color-act-primary-text-inverse-tint, #ffffff)). The consistent use of defaults promotes reliability. Please double-check that the inverse colors and background choices meet contrast and interaction guidelines.


141-182: Plain/“朴素” Theme Styles Updated
Button variants for the plain (or “朴素”) style now all have fallback values (e.g. var(--tv-color-text, #191919) and var(--tv-color-bg, #f5f5f5)). This should safeguard against missing tokens while ensuring consistent appearance. It is advisable to verify that these plain styles continue to provide sufficient contrast and clarity.


188-216: Ghost State Styling Adjustments
For ghost button variants, the text and border colors now include fallback defaults (such as var(--tv-color-text-secondary, #595959) and var(--tv-color-border-ghost, #808080)). This update is important for maintaining visual consistency when no background is applied. Please confirm that the chosen defaults yield adequate visual feedback, especially on hover.


220-308: Active State Enhancements with Fallbacks
A complete set of fallback defaults for active states has been added for default, primary, success, warning, danger, and info themes. These include settings for background, border, and text colors (for both standard and plain variations) and even ghost-active states. This fine-grained approach should strengthen interactive feedback; however, please ensure these active state colors align with user interaction guidelines and provide clear contrast.


310-319: Disabled State Defaults for Button Components
The disabled state now has explicit fallback values for text, background, border, and icon colors using tokens like var(--tv-color-text-disabled, #c2c2c2). These choices look sound; just verify in practice that the disabled appearance meets accessibility standards.


332-364: Fallbacks for Icon-Text Combination and Spacing
When buttons mix icons and text, properties such as border radius, background hover color, icon color, text color, and font size now include fallback defaults (e.g. var(--tv-font-size-default, 14px) and var(--tv-space-sm, 4px)). This detailed attention helps maintain layout consistency. Please ensure these margins and font sizes work harmoniously across different button variants.


368-373: Margin Spacing Adjustments for Button Grouping
The fallback values for margins between adjacent buttons and for spacing around loading icons (such as var(--tv-space-md, 8px) and var(--tv-space-sm, 4px)) are now defined. These changes should help in maintaining consistent spacing in various layouts—just ensure they interact well with responsive design requirements.

@kagol kagol deleted the feat/cssvar-value-20250319 branch April 14, 2025 12:28
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
enhancement New feature or request (功能增强)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants