@e-xi/xion 0.0.6

package/dist/renderer/styles/mixin.less

@@ -0,0 +1,144 @@
+/* ------------------------ */
+// 混合样式
+/* ------------------------ */
+
+// 拖动，electron 中有效
+.drag() {
+    -webkit-app-region : drag;
+}
+
+.no-drag() {
+    -webkit-app-region : no-drag;
+}
+
+// 网页元素拖动
+.user-drag() {
+    -webkit-user-drag : auto;
+    user-drag         : auto;
+}
+
+.no-user-drag() {
+    -webkit-user-drag : none;
+    user-drag         : none;
+}
+
+// 盒模型
+.box-sizing-border-box() {
+    box-sizing : border-box;
+}
+
+// 文字换行
+.word-break-all() {
+    white-space   : pre-wrap;
+    white-space   : -moz-pre-wrap;
+    white-space   : -o-pre-wrap;
+    word-wrap     : break-word;
+    overflow-wrap : anywhere;
+    word-break    : break-all;
+}
+
+// 文字截断
+.text-ellipsis() {
+    min-width     : 0;
+    overflow      : hidden;
+    white-space   : nowrap;
+    text-overflow : ellipsis;
+}
+
+.text-ellipsis-lines(@lines: 2) {
+    overflow           : hidden;
+    display            : -webkit-box;
+    -webkit-line-clamp : @lines;
+    -webkit-box-orient : vertical;
+}
+
+// 圆角
+.radius(@lt:5, @tr:5, @rb:5, @bl:5) {
+    -webkit-border-radius : @lt*1px @tr*1px @rb*1px @bl*1px;
+    -moz-border-radius    : @lt*1px @tr*1px @rb*1px @bl*1px;
+    border-radius         : @lt*1px @tr*1px @rb*1px @bl*1px;
+}
+
+.radius-all(@size:5) {
+    .radius(@size, @size, @size, @size);
+}
+
+.radius-left(@size:5) {
+    .radius(@size, 0, 0, @size);
+}
+
+.radius-top(@size:5) {
+    .radius(@size, @size, 0, 0);
+}
+
+.radius-right(@size:5) {
+    .radius(0, @size, @size, 0);
+}
+
+.radius-bottom(@size:5) {
+    .radius(0, 0, @size, @size);
+}
+
+// 阴影
+.box-shadow(@x:0, @y:0, @w:10, @opacity : 0.1, @color:#000000) {
+    -webkit-box-shadow : @x*1px @y*1px @w*1px hsla(hue(@color), saturation(@color), lightness(@color), @opacity);
+    -moz-box-shadow    : @x*1px @y*1px @w*1px hsla(hue(@color), saturation(@color), lightness(@color), @opacity);
+    box-shadow         : @x*1px @y*1px @w*1px hsla(hue(@color), saturation(@color), lightness(@color), @opacity);
+}
+
+.box-shadow-size(@w:10, @opacity : 0.1, @color:#000000) {
+    .box-shadow(0, 0, @w, @opacity, @color);
+}
+
+// flex
+// flex 居中
+.flex-center() {
+    display         : flex;
+    align-items     : center;
+    justify-content : center;
+}
+
+// flex 垂直居中
+.flex-align-center() {
+    display     : flex;
+    align-items : center;
+}
+
+// flex 水平居中
+.flex-justify-center() {
+    display         : flex;
+    justify-content : center;
+}
+
+// flex 固定尺寸，不伸展不收缩
+.flex-fixed() {
+    flex-shrink : 0;
+    flex-grow   : 0;
+}
+
+// flex 自动填充，可伸展可收缩
+.flex-auto() {
+    flex-shrink : 1;
+    flex-grow   : 1;
+}
+
+// user-select
+.user-select() {
+    -webkit-user-select : text;
+    user-select         : text;
+}
+
+.no-user-select() {
+    -webkit-user-select : none;
+    user-select         : none;
+}
+
+// 禁用输入法
+.no-ime-mode() {
+    ime-mode : disabled;
+}
+
+// 颜色透明
+.color-opacity(@prop, @color, @percent: 100) {
+        @{prop}: color-mix(in srgb, @color (@percent*1%), transparent);
+}

package/dist/renderer/styles/var/element-plus/dark.less

@@ -0,0 +1,32 @@
+/* ------------------------ */
+// element-plus
+/* ------------------------ */
+html.dark {
+    /* ------------------------------------------------ */
+    // 遮罩层
+    /* ------------------------------------------------ */
+    // 遮罩层颜色
+    --xo-overlay-color-lighter     : rgba(0, 0, 0, 0.66);
+
+    /* ------------------------------------------------ */
+    // 对话框 <el-dialog />
+    /* ------------------------------------------------ */
+    --xo-dialog-border-color       : #555;
+
+    /* ------------------------------------------------ */
+    // 抽屉 <el-drawer />
+    /* ------------------------------------------------ */
+    --xo-drawer-bg-color           : #161616;
+    --xo-drawer-border-color       : #555;
+
+    /* ------------------------------------------------ */
+    // 消息框 ElMessageBox
+    /* ------------------------------------------------ */
+    --xo-message-box-border-color  : #555;
+
+    /* ------------------------------------------------ */
+    // 通知 ElNotification
+    /* ------------------------------------------------ */
+    --xo-notification-bg-color     : #161616;
+    --xo-notification-border-color : #555;
+}

package/dist/renderer/styles/var/element-plus/root.less

@@ -0,0 +1,88 @@
+/* ------------------------ */
+// element-plus
+/* ------------------------ */
+:root {
+    /* ------------------------------------------------ */
+    // 遮罩层
+    /* ------------------------------------------------ */
+    // 遮罩层颜色
+    --xo-overlay-color-lighter                   : rgba(0, 0, 0, 0.2);
+
+    /* ------------------------------------------------ */
+    // 对话框 <el-dialog />
+    /* ------------------------------------------------ */
+    --xo-dialog-padding                          : 20px;
+    --xo-dialog-bg-color                         : var(--xo-layout-body-bg-color);
+    --xo-dialog-box-shadow                       : 0 5px 20px rgba(0, 0, 0, 0.1);
+    --xo-dialog-border-width                     : 1px;
+    --xo-dialog-border-color                     : transparent;
+    --xo-dialog-border-radius                    : 10px;
+    --xo-dialog-close-btn-top                    : 12px;
+    --xo-dialog-close-btn-right                  : 12px;
+    --xo-dialog-close-btn-size                   : 25px;
+    --xo-dialog-close-btn-radius                 : 3px;
+    --xo-dialog-close-btn-font-size              : 20px;
+
+    /* ------------------------------------------------ */
+    // 抽屉 <el-drawer />
+    /* ------------------------------------------------ */
+    --xo-drawer-min-width                        : 350px;
+    --xo-drawer-min-height                       : 350px;
+    --xo-drawer-bg-color                         : #fff;
+    --xo-drawer-box-shadow                       : 0 0 20px rgba(0, 0, 0, 0.16);
+    --xo-drawer-close-btn-radius                 : 3px;
+    --xo-drawer-close-btn-size                   : 25px;
+    --xo-drawer-close-btn-font-size              : 20px;
+    --xo-drawer-border-color                     : transparent;
+    --xo-drawer-header-margin-bottom             : 0;
+
+    /* ------------------------------------------------ */
+    // 消息框 ElMessageBox
+    /* ------------------------------------------------ */
+    --xo-message-box-bg-color                    : var(--xo-layout-body-bg-color);
+    --xo-message-box-border-width                : 1px;
+    --xo-message-box-border-color                : transparent;
+    --xo-message-box-border-radius               : 10px;
+    --xo-message-box-padding                     : 15px;
+    --xo-message-box-title-font-size             : 16px;
+    --xo-message-box-close-btn-top               : 15px;
+    --xo-message-box-close-btn-right             : 15px;
+    --xo-message-box-close-btn-size              : 25px;
+    --xo-message-box-close-btn-radius            : 3px;
+    --xo-message-box-close-btn-font-size         : 20px;
+    --xo-message-box-status-icon-size            : 20px;
+
+    /* ------------------------------------------------ */
+    // 通知 ElNotification
+    /* ------------------------------------------------ */
+    --xo-notification-bg-color                   : #fff;
+    --xo-notification-border-color               : #ddd;
+    --xo-notification-content-font-size          : 14px;
+    --xo-notification-width                      : 330px;
+    --xo-notification-icon-size                  : 20px;
+    --xo-notification-radius                     : 10px;
+    --xo-notification-padding                    : 15px 35px 15px 15px;
+    --xo-notification-shadow                     : 0px 5px 12px rgba(0, 0, 0, 0.15);
+    --xo-notification-close-font-size            : 20px;
+    --xo-notification-close-radius               : 3px;
+
+    /* ------------------------------------------------ */
+    // 图片查看器 <el-image /> viewer
+    /* ------------------------------------------------ */
+    --xo-image-viewer-mask-bg-color              : #000;
+    --xo-image-viewer-mask-opacity               : 0.66;
+    --xo-image-viewer-btn-color                  : #fff;
+    --xo-image-viewer-btn-bg-color               : rgba(0, 0, 0, 0.2);
+    --xo-image-viewer-btn-border-color           : rgba(255, 255, 255, 0.3);
+    --xo-image-viewer-btn-border-width           : 1px;
+    --xo-image-viewer-btn-hover-color            : var(--xo-image-viewer-btn-color);
+    --xo-image-viewer-btn-hover-bg-color         : rgba(0, 0, 0, 0.5);
+    --xo-image-viewer-btn-hover-border-color     : rgba(255, 255, 255, 0.6);
+    --xo-image-viewer-progress-radius            : 3px;
+    --xo-image-viewer-progress-padding           : 3px 10px;
+    --xo-image-viewer-close-margin-top           : 20px;
+    --xo-image-viewer-close-margin-right         : 20px;
+    --xo-image-viewer-close-radius               : 6px;
+    --xo-image-viewer-actions-icon-opacity       : 0.6;
+    --xo-image-viewer-actions-icon-hover-opacity : 1;
+}

package/dist/renderer/styles/var/global/dark.less

@@ -0,0 +1,10 @@
+/* ------------------------ */
+// 全局
+/* ------------------------ */
+html.dark {
+    /* ------------------------------------------------ */
+    // XIon 框架
+    /* ------------------------------------------------ */
+    // 字体颜色
+    --xo-text-color-primary : #fff;
+}

package/dist/renderer/styles/var/global/root.less

@@ -0,0 +1,46 @@
+/* ------------------------ */
+// 全局
+/* ------------------------ */
+:root {
+    /* ------------------------------------------------ */
+    // title bar 样式
+    /* ------------------------------------------------ */
+    /* 此处不用设置，useXoThemeStore 会动态管理 */
+    // 高度
+    --xo-global-title-bar-height     : 0;
+    // 背景
+    --xo-global-title-bar-background : none;
+    // 字体颜色
+    --xo-global-title-bar-color      : none;
+
+    /* ------------------------------------------------ */
+    // 全局关闭按钮
+    /* ------------------------------------------------ */
+    // hover 背景色
+    --xo-close-button-hover-bgcolor  : #E81123;
+    // hover 文字颜色
+    --xo-close-button-hover-color    : #fff;
+
+    /* ------------------------------------------------ */
+    // XIon 框架
+    /* ------------------------------------------------ */
+    // 主颜色
+    --xo-color-primary               : #309eff;
+    // 字体
+    --xo-font-family                 : 'Segoe UI', 'Microsoft YaHei UI', 'Microsoft YaHei', 'PingFang SC', 'Hiragino Sans GB', 'Helvetica Neue', Arial, SimSun, sans-serif;
+    // 默认字体大小
+    --xo-font-size-base              : 14px;
+    // 小字体大小
+    --xo-font-size-small             : 13px;
+    // 额外的小字体大小
+    --xo-font-size-extra-small       : 12px;
+    // 字体颜色
+    --xo-text-color-primary          : #363636;
+    // 字体行高
+    --xo-font-line-height-primary    : 1.5;
+    // 动画
+    --xo-transition-property         : all;
+    --xo-transition-duration         : 0.3s;
+    --xo-transition-timing-function  : ease;
+    --xo-transition-delay            : 0s;
+}

package/dist/renderer/styles/var/layout/dark.less

@@ -0,0 +1,7 @@
+/* ------------------------ */
+// 布局样式
+/* ------------------------ */
+html.dark {
+    --xo-layout-body-bg-color     : #060606;
+    --xo-layout-body-border-color : #363636;
+}

package/dist/renderer/styles/var/layout/root.less

@@ -0,0 +1,9 @@
+/* ------------------------ */
+// 布局样式
+/* ------------------------ */
+:root {
+    --xo-layout-body-left-top-radius : 15px;
+    --xo-layout-body-border-width    : 1px;
+    --xo-layout-body-bg-color        : #fff;
+    --xo-layout-body-border-color    : #e6e6e6;
+}

package/dist/renderer/styles/var/scrollbar/dark.less

@@ -0,0 +1,13 @@
+/* ------------------------ */
+// 元素滚动条
+/* ------------------------ */
+html.dark {
+    // 轨道背景色
+    --xo-scrollbar-track-background        : rgba(255, 255, 255, 0.06);
+    // 滑块背景
+    --xo-scrollbar-thumb-background        : rgba(255, 255, 255, 0.2);
+    // 滑块鼠标悬停背景
+    --xo-scrollbar-thumb-hover-background  : rgba(255, 255, 255, 0.66);
+    // 滑块按住背景
+    --xo-scrollbar-thumb-active-background : rgba(255, 255, 255, 0.99);
+}

package/dist/renderer/styles/var/scrollbar/root.less

@@ -0,0 +1,35 @@
+/* ------------------------ */
+// 元素滚动条
+/* ------------------------ */
+:root {
+    // 垂直滚动条宽度
+    --xo-scrollbar-width                         : 10px;
+    // 水平滚动条高度
+    --xo-scrollbar-height                        : 10px;
+    // 滚动条轨道圆角
+    --xo-scrollbar-track-radius                  : 100px;
+    // 滚动条轨道背景色
+    --xo-scrollbar-track-background              : rgba(0, 0, 0, 0.06);
+    // 滚动条轨道垂直顶部边距
+    --xo-scrollbar-track-vertical-margin-top     : 15px;
+    // 滚动条轨道垂直底部边距
+    --xo-scrollbar-track-vertical-margin-bottom  : 15px;
+    // 滚动条轨道水平左侧边距
+    --xo-scrollbar-track-horizontal-margin-left  : 0;
+    // 滚动条轨道水平右侧边距
+    --xo-scrollbar-track-horizontal-margin-right : 0;
+    // 滑块边框（可以用作控制边距）
+    --xo-scrollbar-thumb-border                  : 2px solid transparent;
+    // 滑块圆角
+    --xo-scrollbar-thumb-radius                  : 100px;
+    // 滑块背景
+    --xo-scrollbar-thumb-background              : rgba(0, 0, 0, 0.2);
+    // 滑块最小高度
+    --xo-scrollbar-thumb-min-height              : 100px;
+    // 滑块鼠标悬停背景
+    --xo-scrollbar-thumb-hover-background        : rgba(0, 0, 0, 0.66);
+    // 滑块按住背景
+    --xo-scrollbar-thumb-active-background       : rgba(0, 0, 0, 0.99);
+    // 水平、垂直轨道交汇处背景
+    --xo-scrollbar-corner-background             : transparent;
+}

package/dist/renderer/utils/auth-route-util.d.ts

@@ -0,0 +1,117 @@
+import { type ComputedRef, type Ref, type WatchHandle } from 'vue';
+import type { Router, RouteRecordName } from 'vue-router';
+/**
+ * 认证路由工具选项
+ */
+export interface AuthRouteUtilOptions {
+    bootstrapAutoRedirect?: boolean;
+    forceErrorMessage?: string;
+    bootstrapRouteName: RouteRecordName;
+    defaultRouteName: RouteRecordName;
+    loginRouteName: RouteRecordName;
+    logoutRouteName?: RouteRecordName;
+    findPasswordRouteName?: RouteRecordName;
+}
+/**
+ * 监听启动认证状态并跳转结果（在启动判定页中使用）
+ */
+export interface BootstrapAuthStateRedirectResult {
+    isError: ComputedRef<boolean>;
+    error: ComputedRef<string | undefined>;
+    retrying: Ref<boolean>;
+    stop: WatchHandle;
+    retryInitialize: () => Promise<void>;
+}
+/**
+ * 认证路由工具
+ *
+ * @class AuthRouteUtil
+ */
+export declare class AuthRouteUtil {
+    /** 启动判定页是否自动跳转 */
+    readonly bootstrapAutoRedirect?: boolean;
+    readonly forceErrorMessage?: string;
+    /** 启动判定路由名称 */
+    readonly bootstrapRouteName: RouteRecordName;
+    /** 认证成功后的默认业务路由名称 */
+    readonly defaultRouteName: RouteRecordName;
+    /** 登录路由名称 */
+    readonly loginRouteName: RouteRecordName;
+    /** 注销路由名称 */
+    readonly logoutRouteName?: RouteRecordName;
+    /** 找回密码路由名称 */
+    readonly findPasswordRouteName?: RouteRecordName;
+    /** 认证流程路由名称集合 */
+    private readonly authenticationRouteNames;
+    /**
+     * 构造认证路由工具
+     * @param {AuthRouteUtilOptions} options 认证路由选项
+     */
+    constructor(options: AuthRouteUtilOptions);
+    /**
+     * 安装认证路由守卫（在路由包中使用）
+     * <p>需要在路由实例创建后调用</p>
+     * @param {Router} router 路由实例
+     * @returns {() => void} 移除路由守卫的方法
+     */
+    installGuard(router: Router): () => void;
+    /**
+     * 监听认证状态并跳转到登录页或业务页（用于在 App.vue 中使用）
+     * <p>在登录页面，监听到认证状态成功后跳转业务页</p>
+     * <p>在业务页面，监听到认证状态失效后跳转登录页</p>
+     *
+     * @returns {WatchHandle}
+     */
+    appAuthStateRedirect(): WatchHandle;
+    /**
+     * 监听认证状态并跳转到登录页或业务页（在启动判定页中使用）
+     * <p>用于启动判定页面，根据认证状态完成首次路由跳转</p>
+     * @returns {BootstrapAuthStateRedirectResult}
+     */
+    bootstrapAuthStateRedirect(): BootstrapAuthStateRedirectResult;
+    /**
+     * 判断重定向路径是否为安全的应用内部路径
+     *
+     * @param {Router}            router        路由实例
+     * @param {unknown}           value         待判断的路径
+     * @param {readonly string[]} excludedPaths 不允许跳转的路径
+     * @returns {value is string}
+     */
+    private isSafeRedirect;
+    /**
+     * 解析认证完成后的重定向路径
+     *
+     * @param {Router}            router        路由实例
+     * @param {unknown}           redirect      路由查询参数中的目标路径
+     * @param {readonly string[]} excludedPaths 不允许跳转的路径
+     * @returns {string}
+     */
+    resolveRedirect(router: Router, redirect: unknown, excludedPaths?: readonly string[]): string;
+    /**
+     * 判断路由是否免认证
+     * @param {RouteLocationNormalized} route 当前路由
+     * @returns {boolean}
+     */
+    private isIgnoreAuthRoute;
+    /**
+     * 判断路由名称是否属于认证流程路由
+     * @param {RouteRecordName | null | undefined} routeName 路由名称
+     * @returns {boolean}
+     */
+    private isAuthenticationRouteName;
+    /**
+     * 路由替换为指定路由名称的路由
+     * @param {RouteRecordName}                routeName 路由名称
+     * @param {RouteLocationNormalizedGeneric} to        目标路由
+     * @return {RouteLocationRaw}
+     * @private
+     */
+    private replaceRoute;
+    /**
+     * 创建新的认证路由名称集合
+     * @param {readonly (RouteRecordName | undefined)[]} names 路由名称数组
+     * @returns {ReadonlySet<RouteRecordName>}
+     * @private
+     */
+    private createAuthenticationRouteNames;
+}

package/dist/renderer/utils/context-util.d.ts

@@ -0,0 +1,13 @@
+import { type InjectionKey } from 'vue';
+/**
+ * 上下文工具类
+ * @class ContextUtil
+ * @author e-xi 136066669@qq.com
+ */
+export declare class ContextUtil {
+    /**
+     * flex 布局表单上下文 Key
+     * @type {InjectionKey<XoComponent.FormFlexContext>}
+     */
+    static readonly FormFlexKey: InjectionKey<XoComponent.FormFlexContext>;
+}

package/dist/renderer/utils/error-util.d.ts

@@ -0,0 +1,12 @@
+/**
+ * 错误工具类
+ * @class ErrorUtil
+ * @author e-xi 136066669@qq.com
+ */
+export declare class ErrorUtil {
+    /**
+     * 抛出错误
+     * @param {string} message 错误消息
+     */
+    static throw(message: string): void;
+}

package/dist/renderer/utils/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @file Automatically generated by scripts/gen-exports.ts
+ */
+export * from './auth-route-util';
+export * from './context-util';
+export * from './error-util';
+export * from './keyboard-util';
+export * from './message-util';
+export * from './renderer-log-util';
+export * from './renderer-util';
+export * from './router-util';
+export * from './shortcut-util';
+export * from './storage-util';
+export type * from './types/vue-router';