Skip to content

@TechUI/Libs Introduction

TechUI Libs (Dependency Integration Library) is the Logistics Arsenal of the TechUI ecosystem.

Modern frontend development is inseparable from the excellent open-source community. To ensure the long-term stability of the TechUI component library, we do not scatter third-party dependencies directly throughout business code. Instead, we established @techui/libs. This is a collection of carefully selected, version-locked, and specifically customized open-source tools.

One-sentence summary: TechUI's official "Dependency Gateway," ensuring that API changes in third-party libraries do not breach your business defenses.

Why Integrate?

You might ask: "Why not just npm install dayjs directly? Why use @techui/libs?"

Avoid Breaking Changes

The iteration of open-source libraries is very fast. A Major version update of an upstream library (e.g., upgrading from v3 to v4) might change core APIs, causing sudden errors in your project. @techui/libs acts as a breakwater. We lock down specific versions that have strictly passed TechUI testing and smooth out potential API differences internally, ensuring that interfaces called within TechUI remain stable regardless of how the external world changes.

Dependency Deduplication

Multiple sub-packages of TechUI (Admin, Prime, Scifi) all depend on chroma.js or dayjs. If each package declares its dependencies separately, your final build artifact might contain multiple copies of duplicate code. By unifying exports from @techui/libs, we ensure that the entire TechUI ecosystem shares the same dependency instance, significantly reducing the Bundle size.

Deep Customization

Some libraries (such as svg-injector), while excellent, may have compatibility issues in specific scenarios (such as Wasm environments or micro-frontend architectures). We have performed source-level fine-tuning and patch fixes on these libraries within @techui/libs to make them perfectly adapt to the TechUI rendering pipeline.

Included Tool Libraries

We have integrated the following industry-standard libraries and express our sincere gratitude to the original authors:

Visual & Animation

  • chroma.js: A powerful color manipulation and conversion library. The TechUI color system (@techui/colors) relies heavily on it for color scale calculations at the bottom layer.
  • animate.css: The classic cross-browser CSS animation library. Used for handling entrance and exit animations for modals, notifications, and page transitions.
  • svg-injector.js: Dynamic SVG injection tool. It converts SVG referenced by <img> tags into inline <svg> code, allowing CSS to control icon colors.

Interaction & DOM

  • @floating-ui (Core & Vue): The next-generation positioning engine. Used to precisely calculate screen coordinates for Tooltips, Popovers, and Dropdowns to prevent occlusion.
  • devtools-detector: Browser developer tools detection. This is part of the TechUI security system, used to trigger specific security policies when debugging behavior is detected.

Logic & Data

  • dayjs: A lightweight (2KB) date and time handling library. A modern alternative to Moment.js, used for date formatting in DataGrid tables.
  • async-validator: Asynchronous form validation library. Schema-based validation rules that support complex validation logic for TechUI form components.

Usage

Typically, @techui/libs is automatically installed as an underlying dependency of @techui/prime or @techui/admin.

However, in your business code, if you need to use these tools, it is strongly recommended to import them directly from this library to maintain version consistency with TechUI:

javascript
// ✅ Recommended: Reuse the dayjs integrated internally within TechUI
import { dayjs } from "@techui/libs";

const date = dayjs().format('YYYY-MM-DD');
javascript
// ❌ Not Recommended: Separate installation may cause version conflicts and increased size
// import dayjs from "dayjs";

Acknowledgments and License

The code contained in this library is built upon multiple open-source projects. We strictly adhere to the open-source licenses of each project (MIT/BSD, etc.) and pay tribute to the original authors here.

Released under the MIT License.