Component Badges
When browsing the TechUI component documentation, you will see specific Badge indicators next to the titles of some components.
TechUI always upholds the principles of honesty and respect. To clarify component ownership and design sources, we have established the following badge standards.
Badge Meanings
| Badge (Type) | Description | Applicable Scenarios / Properties |
|---|---|---|
🏆 Industry Pioneerind | Disruptive Innovation: Indicates pioneering significance within the entire frontend industry,breaking existing technical boundaries or interaction patterns (e.g., Frontend License). | danger(Highlight Alert) |
👑 Pioneer1st | TechUI Exclusive Invention: Indicates the concept or implementation is an industry first,and the code is completely self-developed by the TechUI team. Represents core innovation capability. | warning(Gold Quality) |
🏅 Originalori | Self-Developed Code: Although similar functions exist in the industry, it is independentlydesigned and written by TechUI, with 100% self-developed code. | warning(Quality Assurance) |
⭐ Starstar | Highly Recommended: Refers to core benchmark components with excellent community feedback,most complete functionality, or high usage frequency. | danger(Key Focus) |
💎 Advancedadv | High-Value Component: Belongs to flagship components or specific advanced feature sets,involving core business logic or complex underlying technology. | primary(Professional Authorization) |
🧬 Ported from [Lib Name]port | Tribute & Replica: Deeply referenced and ported from other excellent open-source libraries.The original author's copyright notice is retained and adaptation optimizations are made during porting. | primary(Open Source Compatible) |
🧊 Enhancedenh | Deep Customization: Deep secondary development based on mature third-party libraries, simplifyingcumbersome configurations and injecting TechUI visual genes to achieve out-of-the-box usage. | primary(Usability Enhancement) |
🧪 Experimentexp | Experiment Component: First release, still in the testing phase. Component contentsuch as appearance and Props may change at any time. Use with caution. | success(Subject to Change) |
💛 Contributed by [Author]cont | Community Contribution: Indicates the component was contributed by a community developer.If self-developed by the contributor, it will be marked as Original Contribution by [Author]. | important(Honorary Contribution) |
⚡ WASM Poweredwasm | High-Performance Core: Indicates the component's core calculation logic is written in Rustand compiled to Wasm, possessing extreme performance. | info(Hardcore Tech) |
🧊 WebGL/3Dgl | 3D Rendering: Indicates the component relies on Three.js or native WebGLcontext. Usually has certain requirements for the graphics card and belongs to heavy visualization components. | info(Visual Engine) |
🎨 Pure CSScss | Lightweight: Indicates the component is implemented entirely by CSS/SVG with no orminimal JS logic. Zero dependencies, extremely low rendering overhead, suitable for static decoration. | success(Lightweight Efficient) |
🧠 Logic Onlylogic | No UI: Indicates this is a "headless" component or Hooks, providing onlyinteraction logic or data processing capabilities, without specific UI styles. | warning(Underlying Capability) |
🆕 Newnew | Recently Released: Indicates the component is a new member added within the last 1-2 minor versions.Used to quickly attract user attention in the sidebar or lists. | danger(Fresh Release) |
⏳ Legacyleg | End of Maintenance: Indicates the component has reached the end of its lifecycle and will be removedin a future version. It is recommended not to use it in new features and to migrate to alternatives as soon as possible. | default(Gray/Outdated) |
⛔ Deprecateddep | End of Maintenance: Indicates the component is no longer recommended for use and may be removedin a future version. Alternatives or migration guides are usually provided. | default(Gray/Outdated) |
Unbadged Components
You will find that the vast majority of basic components in the TechUI component library (such as Button, Input, Layout, etc.) do not have any badges.
This does not represent plagiarism ("grab-ism"), but stems from the universality of design patterns.
In the long history of frontend UI development, the interaction paradigms of many basic components have converged, making it difficult (and unnecessary) to trace their earliest origins:
- Row+Col (Grid): First popularized by Bootstrap, now a standard feature of all UI libraries.
- Tree / Message: Interaction logic is deeply influenced by pioneers like Element UI.
- Button / Form: Belong to wrappers of Web standard controls.
For these highly generalized components, TechUI adopts the approach of "Reference Industry Standards + Independent Implementation Code", so no separate source badge is added.
Future & Ecosystem Strategy
TechUI's vision is to build an all-encompassing component ecosystem.
To allow the TechUI base library to quickly meet complex business needs, in future iterations, we may adopt a "Grab-ism" strategy—directly porting some market-proven, excellent open-source components (such as complex date pickers, rich text editors, etc.).
For such ported components, we will strictly abide by open-source licenses and mark them as Ported from [XXX] in a prominent position in the documentation to pay the highest tribute to the original authors.
We believe that only by standing on the shoulders of giants can we see further.