Prime Component Library Licensing

@techui/prime is the flagship collection library of the TechUI series. It integrates the visual style of Scifi, the data presentation capabilities of Base, and the business framework of Admin, while exclusively holding all advanced visualization components.

Unlike Base, Scifi, and Admin, Prime adopts a Heavy License mechanism. This means it does not have a free trial mode and must be correctly configured with a Keychain and License during engineering initialization to operate.

License Categories

TechUI license categories are divided into:

• Heavy License: Two-way joint decryption, Client Key + Npm Keychain.
• Lite License: Single key string, Client Key.

Prime utilizes the Heavy License to protect copyright through a dual verification mechanism. The Wasm core module must simultaneously obtain the local Client Key and the externally injected Keychain to complete the decryption process.

• Mandatory: If authorization parameters are not configured, Prime will enter Experience Mode, limited to 10 minutes.
• Dependency Package: After obtaining authorization, Must install and import @techui/prime-keychain.

License Description

The Prime component library will be in one of the following different operating states based on the decryption results of the passed license parameter. Please choose the appropriate license type according to your business needs.

Authorized Status

Upon obtaining formal authorization, the Wasm module will lift all restrictions, and the console will output specific authorized entity information.

• Commerce License
  • Target Audience: Software developers (ISV) or technology providers.
  • Benefits: As a "Master License," besides owning permanent usage rights, it also possesses Distribution Rights. During the subscription period, you can generate and issue secondary sub-licenses (Company, Project, Development licenses) to your end customers.
  • Restrictions: Annual subscription. After the subscription expires, new sub-licenses cannot be generated, but previously issued licenses and self-usage are unaffected.
• Company License
  • Target Audience: End-user enterprises.
  • Benefits: Permanently valid. Authorization is bound to a specific enterprise entity; the enterprise can use the Prime component library in any number of internal projects without project quantity limits.
  • Features: When verification is triggered, the company name may occasionally flash briefly for 3 seconds in the browser tab title document.title.
• Project License
  • Target Audience: Specific business systems or projects.
  • Benefits: Permanently valid. Authorization is strictly bound to a specific project name; system names do not support broad definitions.
  • Features: The browser tab title document.title will be permanently locked to the authorized project name and cannot be modified.
• Development License
  • Target Audience: Pre-sales demonstrations, POC validation, or short-term internal development.
  • Benefits: Time-limited validity (usually 1 month). Functionality is consistent with the formal version but includes a time lock.
  • Features: The console will explicitly prompt the expiration time.

Unauthorized - Experience Mode

Unlike the Scifi or Base component libraries, the Prime component library does not have a free mode, but it can enter a time-limited experience mode.

When you do not pass a license, or the passed license is invalid/decryption fails, Prime will automatically enter Experience Mode.

• Trigger Condition: The license in initialization parameters is empty or fails verification.
• Run Time: 10 minutes.
• Mode Behavior:
  • After startup, the console will output a message indicating it is in "Experience Mode, limited to 10 minutes".
  • During this period, you can fully use all of Prime's advanced components (such as T3D, PanicAlert, Echarts, etc.) for functional evaluation and testing.
• Denial of Service:
  • When the 10-minute countdown ends, the Wasm guard will trigger a circuit breaker mechanism.
  • All DOM elements are removed.
  • The page will pop up a "Trial Ended" blocking window.
• Reset Method: Refresh the browser page to restart the 10-minute experience.

Note: Experience mode is only for developers to evaluate functions locally and is strictly prohibited for use in any production environment.

Installation and Configuration

When initializing Prime, in addition to the standard license string, you must pass the keychain object installed from npm.

Step A: Install Dependencies

Ensure that the Prime core library and the corresponding keychain package are installed in your project.

npm install @techui/prime @techui/prime-keychain

Step B: Initialization Code

In the project entry file (such as main.js or main.ts), import the keychain and pass it to TechUIInit.

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";

// 1. Import Prime Core and Keychain
import TechUIInit from "@techui/prime";
import keychain from "@techui/prime-keychain";

// 2. Import your license file (usually containing license string and config)
import { license, licenseConfig } from "./utils/license.js";

const app = createApp(App);

// 3. Build configuration parameters
const params = {
  app,

  // Core authorization parameters
  license, // Client Key (Encrypted)
  keychain, // Keychain, located in Npm, used for joint decryption
  licenseConfig, // License configuration info

  debug: true, // Recommended to enable during development to view auth status logs

  // Feature switches
  features: {
    echarts: true, // Enable TuiEcharts related components
    admin: true, // Enable Admin business components (login/layout, etc.)
    advanced: true, // Enable Advanced components (3D/MGS/PanicAlert)
  },
};

// 4. Initialization
TechUIInit(params)
  .then(() => {
    app.use(router);
    app.use(store);
    app.mount("#app");
  })
  .catch((err) => {
    console.error("TechUI Prime Initialization Failed:", err);
  });

Unlocking Benefits

After successfully obtaining authorization and correctly initializing Prime, the system will unlock all the following capabilities:

Full Component Access

• UI Visuals: Includes all dynamic SVG components, sci-fi panels, and decorators from the Scifi library.
• Data Presentation: Includes all tables, forms, and toolbar components from the Base library.
• Business Framework: Includes dynamic routing, workbench layouts, and login page templates from the Admin library.

Advanced Components

Prime authorization exclusively includes the usage rights for the following advanced components (no additional cost):

• T3DPanel: A 3D container featuring physical thickness and light/shadow calculations.
• Bar3D / Pie3D: 3D engine-based liquid level bar charts and volumetric ring charts.
• PanicAlert: A system-level blocking alert component.
• TuiEcharts: Deeply integrated Echarts charts and map encapsulations.

Authorization Feedback

Upon successful initialization of Prime, the Wasm module will output an authorization nameplate in the browser console:

• Authorization Info: Displays "TechUI Prime vX.X" and labels it as "Authorized to [Company Name/Project Name]".
• Validity: Displays "Permanently Valid" or a specific expiration date (for development licenses).
• Ownership Identifiers:
• For Company Licenses, the page title (document.title) may briefly flash the company name when verification is triggered.
• For Project Licenses, the page title will be permanently locked to the project name.