Cool Unix Development Scaffold

PassThrough (pt) is an API that allows developers to access and manipulate the internal DOM structure of a component. By using the :pt prop, you can apply arbitrary attributes, styles (via className), and listeners directly to specific internal elements of a component (like icons, labels, or loading indicators). This bypasses the limitations of the component's primary public API and provides deep customization capabilities.

Example of customizing a cl-button internal elements:

<cl-button
	:pt="{
    className: '!rounded-2xl',
    icon: {
      size: 50,
      className: 'mr-5',
    },
    label: {
      color: 'red',
      className: 'font-bold',
    },
    loading: {
      size: 50,
    },
  }"
>
	点击
</cl-button>

To use Cool Unix as a standalone component library in your project, first install the CLI globally, then initialize your project root. The unix-init command automatically integrates the necessary configurations and dependency files into your project.

npm install -g @cool-vue/unix-cli

# Run this in your project root
nunix-init

The cool-open-web module provides a unified way to open a web URL across different platforms. It is compatible with iOS, Android, Web, and Mini-programs (小程序).

import { openWeb } from "@/uni_modules/cool-open-web";

openWeb("https://cool-js.com/");

Cool Unix supports multi-language development without manual maintenance of translation tables. You can use the t function for simple translations or $t for translations with dynamic parameters. After configuring your project, you can use the CLI to trigger an AI-driven process that automatically retrieves and translates the entire content of your application.

To initialize or run the translation process, use: npx cool-i18n create

<text>{{ t('你好') }}</text>

import { $t, t } from "@/.cool";
import { useUi } from "@/uni_modules/cool-ui";

const ui = useUi();

ui.showToast({
	message: t("操作成功")
});

ui.showToast({
	message: $t("欢迎回来，{name}", { name: "神仙都没用" })
});

npx cool-i18n create

The cool-vibrate module provides a cross-platform vibration API. It is compatible with iOS, Android, Web, and various Mini Programs (小程序).

To use it, import the vibrate function from the module path and call it with a duration or pattern parameter.

import { vibrate } from "@/uni_modules/cool-vibrate";

vibrate(1);

Cool Unix is deeply compatible with TailwindCSS. Unlike many UI libraries that only provide basic styles, Cool Unix supports advanced TailwindCSS operators such as dark: for dark mode and ! for important modifiers, allowing for highly flexible and extensible styling.

<view class="bg-surface-100 dark:!bg-surface-900">
	<text class="text-surface-700 dark:!text-white">Cool Unix</text>
</view>

When using image(), the mode property determines how the source image is mapped to the target width and height on the canvas:

• scaleToFill: Stretches the image to fill the area (may distort aspect ratio).
• aspectFit: Scales the image to fit entirely within the area (may leave empty space).
• aspectFill: Scales the image to cover the entire area (may crop edges).
• center: Centers the image without scaling (may crop edges).
• top, bottom, left, right: Aligns the image to the specified edge and centers it on the opposite axis.
• topLeft, topRight, bottomLeft, bottomRight: Aligns the image to a specific corner.

The PassThrough (or pt) API allows you to access and modify the internal DOM structure of a component. By passing a :pt object, you can apply arbitrary attributes, styles, or listeners directly to specific sub-elements (like icons, labels, or loading indicators) within a component, bypassing the limitations of the standard component props.

<cl-button
	:pt="{
    className: '!rounded-2xl',
    icon: {
      size: 50,
      className: 'mr-5',
    },
    label: {
      color: 'red',
      className: 'font-bold',
    },
    loading: {
      size: 50,
    },
  }"
>
	点击
</cl-button>

The cool-open-web module supports the following platforms:

• iOS
• Android
• Web
• Mini-programs (小程序)

The cool-vibrate module supports the following platforms:

• iOS
• Android
• Web
• Mini Programs (小程序)