bilitoolkit-ui 0.0.1

package/dist/styles/mixins.scss

@@ -0,0 +1,146 @@
+/**
+  省略左边内容
+  注意，内容前后需要加上【‎】（左至右符号）
+  https://stackoverflow.com/questions/27957443/strange-special-characters-issue-in-left-side-ellipsis
+ */
+@mixin txt-reverse-ellipsis {
+  background: var(--app-color-foreground-transparent-10);
+  width: fit-content;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  direction: rtl; //定义方向
+  text-align: left; // 防止父元素宽度足够的时候文字靠右右边
+}
+
+/* 省略右边内容 */
+@mixin txt-ellipsis {
+  width: fit-content;
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  direction: ltr; //定义方向
+  text-align: left; // 防止父元素宽度足够的时候文字靠右右边
+  unicode-bidi: plaintext; // 防止尾部特殊字符显示在前面
+}
+
+/** 伪元素实现的svg背景 */
+@mixin pseudo-svg-icon($svg,$bg-color,$padding:4px) {
+  &:before {
+    content: '';
+    position: absolute;
+    left: $padding;
+    top: $padding;
+    right: $padding;
+    bottom: $padding;
+    mask: $svg no-repeat center / contain;
+    -webkit-mask: $svg no-repeat center / contain;
+    background: $bg-color;
+    z-index: 1;
+  }
+}
+
+/*科技风格的背景*/
+@mixin tech-angled-bg(
+  $left-bg: var(--app-color-primary-transparent-5),
+  $right-bg: var(--app-color-primary-transparent-5),
+  $top-x: 90%,
+  $bottom-x: 50%) {
+  position: relative;
+  overflow: hidden !important;
+  background: $left-bg;
+
+  &:before {
+    content: '';
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    width: 200%;
+    height: 100%;
+    background: $left-bg;
+    clip-path: polygon(calc($top-x / 2) 0, 100% 0, 100% 100%, calc($bottom-x / 2) 100%);
+    transition: transform 0.3s ease;
+    pointer-events: none;
+    transform: translateX(50%);
+  }
+
+}
+
+/*科技风格的卡片*/
+@mixin card-tech-style(
+  $init-bg: var(--app-color-primary-transparent-5),
+  $border-color: var(--app-color-primary-transparent-20),
+  $shadow: var(--app-color-primary-transparent-15),
+  $hover-extend-bg: var(--app-color-primary-transparent-2)) {
+  background: $hover-extend-bg;
+  border-radius: 10px;
+  border: 1px solid $border-color;
+  position: relative;
+  overflow: hidden !important;
+
+  &:before {
+    content: '';
+    position: absolute;
+    right: 0;
+    bottom: 0;
+    width: 200%;
+    height: 100%;
+    background: $init-bg;
+    clip-path: polygon(45% 0, 100% 0, 100% 100%, 25% 100%);
+    transition: transform 0.3s ease;
+    pointer-events: none;
+  }
+
+  &:hover {
+    box-shadow: 0 2px 6px $shadow;
+
+    &:before {
+      transform: translateX(50%);
+    }
+  }
+}
+
+@mixin card-tech-style--static(
+  $bg: var(--app-color-primary-transparent-5),
+  $border-color: var(--app-color-primary-transparent-20),
+  $shadow: var(--app-color-primary-transparent-15)
+) {
+  background: $bg;
+  border-radius: 10px;
+  border: 1px solid $border-color;
+
+  &:hover {
+    box-shadow: 0 2px 6px $shadow;
+  }
+}
+
+/* 图标按钮 */
+@mixin icon-btn($size:18px,$color:var(--el-color-primary)) {
+  width: $size;
+  height: $size;
+  font-size: $size;
+  line-height: $size;
+  color: $color;
+  cursor: pointer;
+  padding: 5px;
+
+  &:hover {
+    background: var(--app-color-primary-transparent-15);
+  }
+}
+
+/* 圆形图标按钮 */
+@mixin circle-icon-btn($size:18px,$color:var(--el-color-primary)) {
+  @include icon-btn($size, $color);
+  border-radius: 50%;
+}
+
+/* 旋转的圆形图标按钮 */
+@mixin circle-icon-btn--rotate($size:18px,$color:var(--el-color-primary)) {
+  @include circle-icon-btn($size, $color);
+  &:hover {
+    animation: rotate 3s linear infinite;
+  }
+}

package/dist/styles/variables.scss

@@ -0,0 +1 @@
+$test: 2px;

package/dist/test/menus.d.ts

@@ -0,0 +1,2 @@
+import { PluginMenuInfo } from '../components/plugin/types.ts';
+export declare const testMenus: PluginMenuInfo[];

package/dist/test/user.d.ts

@@ -0,0 +1,12 @@
+export declare const testUser: {
+    mid: number;
+    name: string;
+    face: string;
+    sex: string;
+    level: number;
+    sign: string;
+    moral: number;
+    silence: number;
+    following: number;
+    follower: number;
+};

package/dist/ui.d.ts

@@ -0,0 +1,10 @@
+import { App } from 'vue';
+import { Pinia } from 'pinia';
+/**
+ * 初始化UI
+ * @param pinia
+ * @param isTestMode 测试模式，不使用工具姬的API。方便插件直接本地调试。
+ */
+export declare const initBilitoolkitUi: (pinia: Pinia, isTestMode?: boolean) => Promise<{
+    install(app: App): void;
+}>;

package/dist/utils/app-utils.d.ts

@@ -0,0 +1,20 @@
+import { ElMessageBoxOptions } from 'element-plus';
+/**
+ * App工具，包含一些全局的方法
+ */
+export declare class AppUtils {
+    /**
+     * 统一处理异常
+     * @param error
+     */
+    static handleError(error: unknown): void;
+    static message(message: string): void;
+    static message({ message, type, duration, }: {
+        message: string;
+        type?: 'success' | 'warning' | 'info' | 'error';
+        duration?: number;
+    }): void;
+    static error(msg: string): void;
+    static warning(msg: string): void;
+    static confirm(message: string, title?: string, options?: ElMessageBoxOptions): Promise<void>;
+}

package/dist/utils/theme-utils.d.ts

@@ -0,0 +1,10 @@
+import { AppThemeMode, AppThemeState } from 'bilitoolkit-api-types';
+export type AppThemeCssVars = Record<string, string>;
+export declare class ThemeUtils {
+    static isDark(themeMode?: AppThemeMode): Promise<boolean>;
+    /**
+     * 更新css变量
+     */
+    static updateAppTheme(initState?: AppThemeState): Promise<void>;
+    static initAppTheme(): Promise<void>;
+}

package/dist/views/HomeView.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/package.json

@@ -0,0 +1,94 @@
+{
+  "name": "bilitoolkit-ui",
+  "version": "0.0.1",
+  "private": false,
+  "type": "module",
+  "productName": "bilitoolkit-ui",
+  "description": "「哔哩工具姬」的 UI 库",
+  "author": "hzhilong",
+  "keywords": [
+    "BiliToolkit",
+    "哔哩工具姬"
+  ],
+  "license": "Apache-2.0",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/hzhilong/bilitoolkit-ui"
+  },
+  "bugs": {
+    "url": "https://github.com/hzhilong/bilitoolkit-ui/issues"
+  },
+  "homepage": "https://github.com/hzhilong/bilitoolkit-ui#readme",
+  "engines": {
+    "node": "^20.19.0 || >=22.12.0"
+  },
+  "main": "dist/bilitoolkit-ui.umd.cjs",
+  "module": "dist/bilitoolkit-ui.js",
+  "types": "dist/index.d.ts",
+  "style": "dist/bilitoolkit-ui.css",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/bilitoolkit-ui.js",
+      "require": "./dist/bilitoolkit-ui.umd.cjs"
+    },
+    "./style.css": "./dist/bilitoolkit-ui.css",
+    "./variables.scss": "./dist/styles/variables.scss",
+    "./mixins.scss": "./dist/styles/mixins.scss",
+    "./functions.scss": "./dist/styles/functions.scss"
+  },
+  "files": [
+    "dist",
+    "!dist/bundle-stats.*"
+  ],
+  "scripts": {
+    "dev": "chcp 65001 && vite",
+    "类型检查": "tsc --noEmit",
+    "构建前记得补全桶": "构建前记得补全桶",
+    "build": "vite build --mode library",
+    "npm 登录": " npm login",
+    "npm 发布": " npm publish --access public",
+    "本地构建并发布": "vite build --mode library && yalc publish",
+    "添加本地依赖包": "yalc add bilitoolkit-api-types @ybgnb/utils --peer",
+    "移除本地依赖包": "yalc remove --all",
+    "type-check": "vue-tsc --build",
+    "lint": "eslint . --fix"
+  },
+  "devDependencies": {
+    "@tsconfig/node22": "^22.0.2",
+    "@types/node": "^22.16.5",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vitejs/plugin-vue-jsx": "^5.0.1",
+    "@vue/eslint-config-prettier": "^10.2.0",
+    "@vue/eslint-config-typescript": "^14.6.0",
+    "@vue/language-core": "^3.0.7",
+    "@vue/tsconfig": "^0.7.0",
+    "eslint": "^9.31.0",
+    "eslint-plugin-vue": "~10.3.0",
+    "jiti": "^2.4.2",
+    "npm-run-all2": "^8.0.4",
+    "prettier": "3.6.2",
+    "rollup-plugin-bundle-stats": "^4.21.3",
+    "sass": "^1.92.1",
+    "typescript": "~5.8.0",
+    "unplugin-auto-import": "^20.1.0",
+    "unplugin-vue-components": "^29.0.0",
+    "vite": "^7.0.6",
+    "vite-plugin-dts": "^4.5.4",
+    "vite-plugin-static-copy": "^3.1.2",
+    "vue-tsc": "^3.0.4"
+  },
+  "peerDependencies": {
+    "@vue/language-core": "^3.0.7",
+    "@ybgnb/utils": "file:.yalc/@ybgnb/utils",
+    "bilitoolkit-api-types": "file:.yalc/bilitoolkit-api-types",
+    "element-plus": "^2.11.2",
+    "lodash-es": "^4.17.21",
+    "pinia": "^3.0.3",
+    "vue": "^3.5.18"
+  },
+  "dependencies": {
+    "@ybgnb/utils": "file:.yalc/@ybgnb/utils",
+    "bilitoolkit-api-types": "file:.yalc/bilitoolkit-api-types"
+  }
+}