View Shadcn UI

Appearance

View Shadcn UI v2025.1.3 正式发布 - 新增IP输入框组件与多项功能增强 ​

🎉 版本信息 / Version Information ​

版本号 / Version: 2025.1.3
发布时间 / Release Date: 2025年5月27日 / May 27, 2025

📖 项目简介 / Project Overview ​

View Shadcn UI 是一个基于 Tailwind CSS 构建的现代化 Vue3 组件库，致力于为开发者提供美观、易用、功能丰富的UI组件解决方案。

View Shadcn UI is a modern Vue3 component library built with Tailwind CSS, dedicated to providing developers with beautiful, user-friendly, and feature-rich UI component solutions.

✨ 本次更新亮点 / Highlights ​

🆕 全新组件 / New Components ​

IP输入框组件 (IP Input Component) ​

我们新增了功能完整的IPv4地址输入框组件，支持：

  • ✅ IPv4地址支持 - 专为IPv4地址格式设计，提供准确的输入验证
  • ✅ 灵活尺寸配置 - 提供多种尺寸选择，适应不同场景需求
  • ✅ 表单集成 - 完美融入表单验证体系
  • ✅ 自定义分隔符 - 支持自定义IP地址分隔符样式
  • ✅ 禁用状态 - 支持禁用状态，增强用户体验

We've introduced a comprehensive IPv4 address input component with support for:

  • ✅ IPv4 Address Support - Specifically designed for IPv4 format with accurate input validation
  • ✅ Flexible Sizing - Multiple size options for different use cases
  • ✅ Form Integration - Seamless integration with form validation
  • ✅ Custom Separators - Customizable IP address separator styles
  • ✅ Disabled State - Support for disabled state for better UX

🔧 组件功能增强 / Component Enhancements ​

流程组件 (Process Component) ​

  • 新增隐藏功能 - 支持 hiddenOnUsed 配置项，可隐藏已使用的列，优化界面显示效果

数据构建组件 (Data Builder Component) ​

  • 布局优化 - 修复组件超越标尺的显示问题，确保界面布局的准确性和美观性

时间组件 (Time Component) ​

  • 实时更新 - 支持配置更新间隔，实现时间的动态刷新显示
  • 相对时间 - 新增相对时间显示功能（如"3分钟前"、"1小时前"等）
  • 国际化支持 - 支持时间格式化和时区配置，满足全球化应用需求

通知中心组件 (Notification Center Component) ​

我们对通知中心组件进行了全面升级：

  • 远程数据加载 - 支持从远程API获取通知数据
  • 灵活定位 - 支持多种位置配置选项
  • 尺寸定制 - 支持自定义宽度和高度设置
  • 交互增强 - 支持自定义触发器，提升用户交互体验
  • 插槽支持 - 子项支持多个插槽，提供更大的自定义空间

🚀 技术改进 / Technical Improvements ​

Enhanced Component Features: ​

Process Component:

  • Added hiddenOnUsed configuration to hide used columns for cleaner interfaces

Data Builder Component:

  • Fixed component overflow issues for better layout precision

Time Component:

  • Configurable update intervals for real-time display
  • Relative time display (e.g., "3 minutes ago", "1 hour ago")
  • Internationalization support with formatting and timezone configuration

Notification Center Component:

  • Remote data loading capabilities
  • Flexible positioning options
  • Customizable dimensions (width & height)
  • Enhanced interaction with custom triggers
  • Multiple slot support for greater customization flexibility

📦 如何升级 / How to Upgrade ​

NPM ​

bash
npm install view-shadcn-ui@2025.1.3

Yarn ​

bash
yarn add view-shadcn-ui@2025.1.3

PNPM ​

bash
pnpm add view-shadcn-ui@2025.1.3

🙏 致谢 / Acknowledgments ​

感谢所有为本次版本贡献代码和建议的开发者们！特别感谢 @qianmoQ 在本次版本中的大量贡献。

Thanks to all developers who contributed code and suggestions for this release! Special thanks to @qianmoQ for the significant contributions in this version.

📢 反馈与支持 / Feedback & Support ​

如果您在使用过程中遇到任何问题或有改进建议，欢迎：

  • 在 GitHub 上提交 Issue
  • 加入我们的社区讨论
  • 访问官方文档获取详细使用指南

If you encounter any issues or have suggestions for improvement, feel free to:

  • Submit issues on GitHub
  • Join our community discussions
  • Visit our official documentation for detailed usage guides

View Shadcn UI 团队
2025年5月27日