@qlover/create-app 0.10.2 → 0.10.3

package/dist/templates/react-app/src/core/clientIoc/ClientIOC.ts

@@ -9,15 +9,22 @@ import type { IOCIdentifierMap } from '@config/IOCIdentifier';
 import { ClientIOCRegister } from './ClientIOCRegister';
 import { appConfig } from '../globals';
 
-export class ClientIOC
-  implements IOCInterface<IOCIdentifierMap, IOCContainerInterface>
-{
+export class ClientIOC implements IOCInterface<
+  IOCIdentifierMap,
+  IOCContainerInterface
+> {
   protected ioc: IOCFunctionInterface<
     IOCIdentifierMap,
     IOCContainerInterface
   > | null = null;
 
-  create(): IOCFunctionInterface<IOCIdentifierMap, IOCContainerInterface> {
+  /**
+   * @override
+   */
+  public create(): IOCFunctionInterface<
+    IOCIdentifierMap,
+    IOCContainerInterface
+  > {
     if (this.ioc) {
       return this.ioc;
     }

package/dist/templates/react-app/src/core/clientIoc/ClientIOCRegister.ts

@@ -30,9 +30,10 @@ import type {
 } from '@qlover/corekit-bridge';
 import type { LoggerInterface } from '@qlover/logger';
 
-export class ClientIOCRegister
-  implements IOCRegisterInterface<IOCContainerInterface, IocRegisterOptions>
-{
+export class ClientIOCRegister implements IOCRegisterInterface<
+  IOCContainerInterface,
+  IocRegisterOptions
+> {
   constructor(protected options: IocRegisterOptions) {}
 
   /**
@@ -131,7 +132,7 @@ export class ClientIOCRegister
   /**
    * @override
    */
-  register(
+  public register(
     ioc: IOCContainerInterface,
     _manager: IOCManagerInterface<IOCContainerInterface>
   ): void {

package/dist/templates/react-app/src/pages/base/Layout.tsx

@@ -4,7 +4,7 @@ import { BaseHeader } from '../../uikit/components/BaseHeader';
 
 export default function Layout() {
   return (
-    <BaseLayoutProvider data-testid="Layout">
+    <BaseLayoutProvider>
       <div
         data-testid="basic-layout"
         className="text-base min-h-screen bg-primary"

package/dist/templates/react-app/src/styles/css/antd-themes/_common/_default.css

@@ -277,48 +277,4 @@ html,
     --fe-layout-light-trigger-bg: rgb(var(--color-bg-base));
     --fe-layout-light-trigger-color: rgb(var(--text-primary));
   }
-
-  /* 滚动条样式变量 */
-  --fe-scrollbar-size: 6px;
-  --fe-scrollbar-thumb-bg: rgba(15 23 42 / 0.2);
-  --fe-scrollbar-thumb-hover-bg: rgba(15 23 42 / 0.3);
-  --fe-scrollbar-track-bg: transparent;
-
-  /* 滚动条样式 */
-  ::-webkit-scrollbar {
-    width: var(--fe-scrollbar-size);
-    height: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-track {
-    background: var(--fe-scrollbar-track-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb {
-    background: var(--fe-scrollbar-thumb-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb:hover {
-    background: var(--fe-scrollbar-thumb-hover-bg);
-  }
-
-  ::-webkit-scrollbar-corner {
-    background: transparent;
-  }
-
-  /* 可选的细滚动条样式 */
-  .scrollbar-thin {
-    --fe-scrollbar-size: 4px;
-  }
-
-  /* 隐藏滚动条但保持可滚动 */
-  .scrollbar-hidden {
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-    &::-webkit-scrollbar {
-      display: none;
-    }
-  }
 }

package/dist/templates/react-app/src/styles/css/antd-themes/_common/dark.css

@@ -230,48 +230,4 @@
     --fe-layout-light-trigger-bg: rgb(30 41 59);
     --fe-layout-light-trigger-color: rgb(var(--text-primary));
   }
-
-  /* 滚动条样式变量 */
-  --fe-scrollbar-size: 6px;
-  --fe-scrollbar-thumb-bg: rgba(255 255 255 / 0.2);
-  --fe-scrollbar-thumb-hover-bg: rgba(255 255 255 / 0.3);
-  --fe-scrollbar-track-bg: transparent;
-
-  /* 滚动条样式 */
-  ::-webkit-scrollbar {
-    width: var(--fe-scrollbar-size);
-    height: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-track {
-    background: var(--fe-scrollbar-track-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb {
-    background: var(--fe-scrollbar-thumb-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb:hover {
-    background: var(--fe-scrollbar-thumb-hover-bg);
-  }
-
-  ::-webkit-scrollbar-corner {
-    background: transparent;
-  }
-
-  /* 可选的细滚动条样式 */
-  .scrollbar-thin {
-    --fe-scrollbar-size: 4px;
-  }
-
-  /* 隐藏滚动条但保持可滚动 */
-  .scrollbar-hidden {
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-    &::-webkit-scrollbar {
-      display: none;
-    }
-  }
 }

package/dist/templates/react-app/src/styles/css/antd-themes/_common/pink.css

@@ -243,48 +243,4 @@
     --fe-layout-light-trigger-bg: var(--ant-color-bg-container);
     --fe-layout-light-trigger-color: var(--ant-color-text);
   }
-
-  /* 滚动条样式变量 */
-  --fe-scrollbar-size: 6px;
-  --fe-scrollbar-thumb-bg: rgba(244 114 182 / 0.3);
-  --fe-scrollbar-thumb-hover-bg: rgba(244 114 182 / 0.4);
-  --fe-scrollbar-track-bg: transparent;
-
-  /* 滚动条样式 */
-  ::-webkit-scrollbar {
-    width: var(--fe-scrollbar-size);
-    height: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-track {
-    background: var(--fe-scrollbar-track-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb {
-    background: var(--fe-scrollbar-thumb-bg);
-    border-radius: var(--fe-scrollbar-size);
-  }
-
-  ::-webkit-scrollbar-thumb:hover {
-    background: var(--fe-scrollbar-thumb-hover-bg);
-  }
-
-  ::-webkit-scrollbar-corner {
-    background: transparent;
-  }
-
-  /* 可选的细滚动条样式 */
-  .scrollbar-thin {
-    --fe-scrollbar-size: 4px;
-  }
-
-  /* 隐藏滚动条但保持可滚动 */
-  .scrollbar-hidden {
-    -ms-overflow-style: none;
-    scrollbar-width: none;
-    &::-webkit-scrollbar {
-      display: none;
-    }
-  }
 }

package/dist/templates/react-app/src/styles/css/index.css

@@ -2,5 +2,5 @@
 @import './zIndex.css';
 
 @import './antd-themes/index.css';
-
+@import './scrollbar.css';
 @import './page.css';

package/dist/templates/react-app/src/styles/css/scrollbar.css

@@ -0,0 +1,34 @@
+html,
+.fe-theme {
+  --scrollbar-track-color: var(--color-secondary);
+  --scrollbar-thumb-color: var(--color-text-secondary);
+  --scrollbar-thumb-hover-color: var(--color-brand-hover);
+
+  /* Webkit browsers (Chrome, Safari, Edge) - 全局样式，使用最高优先级 */
+  body *::-webkit-scrollbar,
+  *::-webkit-scrollbar {
+    width: 10px;
+    height: 10px;
+  }
+
+  body *::-webkit-scrollbar-track,
+  *::-webkit-scrollbar-track {
+    background: var(--scrollbar-track-color);
+  }
+
+  body *::-webkit-scrollbar-thumb,
+  *::-webkit-scrollbar-thumb {
+    background-color: var(--scrollbar-thumb-color);
+    border-radius: 6px;
+    border: 1px solid var(--scrollbar-track-color);
+    transition: background-color 0.2s ease;
+  }
+
+  body *::-webkit-scrollbar-thumb:hover {
+    background-color: var(--scrollbar-thumb-hover-color) !important;
+  }
+
+  *::-webkit-scrollbar-thumb:hover {
+    background-color: var(--scrollbar-thumb-hover-color) !important;
+  }
+}

package/dist/templates/react-app/src/uikit/bridges/ExecutorPageBridge.ts

@@ -13,7 +13,7 @@ import {
 } from '@/base/port/ExecutorPageBridgeInterface';
 
 class ExecutorPageBridgeState implements ExecutorPageStateInterface {
-  helloState = new RequestState();
+  public helloState = new RequestState();
 }
 
 const TestPlugin: ExecutorPlugin<RequestAdapterFetchConfig> = {
@@ -41,7 +41,7 @@ export class ExecutorPageBridge extends ExecutorPageBridgeInterface {
     this.feApi.usePlugin(TestPlugin);
   }
 
-  override onTestPlugins = async () => {
+  public override onTestPlugins = async () => {
     this.emit({
       ...this.state,
       helloState: new RequestState(true)

package/dist/templates/react-app/src/uikit/bridges/JSONStoragePageBridge.ts

@@ -18,23 +18,23 @@ export class JSONStoragePageBridge extends JSONStoragePageBridgeInterface {
     }));
   }
 
-  override changeRandomTestKey1 = (): void => {
+  public override changeRandomTestKey1 = (): void => {
     const value = random(100, 9000);
     this.storage.setItem('testKey1', value);
     this.emit({ ...this.state, testKey1: value });
   };
 
-  override onChangeRandomTestKey2 = (): void => {
+  public override onChangeRandomTestKey2 = (): void => {
     const value = random(100, 9000);
     this.storage.setItem('testKey2', value, Date.now() + this.state.expireTime);
     this.emit({ ...this.state, testKey2: value });
   };
 
-  override changeExpireTime = (expireTime: number): void => {
+  public override changeExpireTime = (expireTime: number): void => {
     this.emit({ ...this.state, expireTime });
   };
 
-  override changeRequestTimeout = (requestTimeout: number): void => {
+  public override changeRequestTimeout = (requestTimeout: number): void => {
     this.storage.setItem('requestTimeout', requestTimeout);
     this.emit({ ...this.state, requestTimeout });
   };

package/dist/templates/react-app/src/uikit/bridges/NavigateBridge.ts

@@ -6,11 +6,17 @@ import { NavigateFunction } from 'react-router-dom';
 export class NavigateBridge implements UIBridgeInterface<NavigateFunction> {
   protected navigate: NavigateFunction | null = null;
 
-  setUIBridge(ui: NavigateFunction): void {
+  /**
+   * @override
+   */
+  public setUIBridge(ui: NavigateFunction): void {
     this.navigate = ui;
   }
 
-  getUIBridge(): NavigateFunction | null {
+  /**
+   * @override
+   */
+  public getUIBridge(): NavigateFunction | null {
     return this.navigate;
   }
 }

package/dist/templates/react-app/src/uikit/bridges/RequestPageBridge.ts

@@ -32,7 +32,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     super(createDefaultState);
   }
 
-  override onHello = async () => {
+  public override onHello = async () => {
     if (this.state.helloState.loading) {
       return;
     }
@@ -52,7 +52,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     }
   };
 
-  override onIpInfo = async () => {
+  public override onIpInfo = async () => {
     if (this.state.ipInfoState.loading) {
       return;
     }
@@ -70,7 +70,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     }
   };
 
-  override onRandomUser = async () => {
+  public override onRandomUser = async () => {
     if (this.state.randomUserState.loading) {
       return;
     }
@@ -89,7 +89,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     }
   };
 
-  override onTriggerApiCatchResult = async () => {
+  public override onTriggerApiCatchResult = async () => {
     if (this.state.apiCatchResultState.loading) {
       return;
     }
@@ -107,7 +107,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     }
   };
 
-  override onTriggerAbortRequest = async () => {
+  public override onTriggerAbortRequest = async () => {
     if (this.state.abortState.loading) {
       this.stopAbortRequest();
       return;
@@ -128,7 +128,7 @@ export class RequestPageBridge extends RequestPageBridgeInterface {
     }
   };
 
-  override stopAbortRequest = async () => {
+  public override stopAbortRequest = async () => {
     this.userApi.stop({
       requestId: 'onTriggerAbortRequest'
     });

package/dist/templates/react-app/src/uikit/components/AppRouterProvider.tsx

@@ -31,5 +31,5 @@ export function AppRouterProvider(props: { pages: ComponentValue }) {
     return router;
   }, [routes]);
 
-  return <RouterProvider data-testid="AppRouterProvider" router={routerBase} />;
+  return <RouterProvider router={routerBase} />;
 }

package/dist/templates/react-app/src/uikit/components/BootstrapsProvider.tsx

@@ -6,8 +6,6 @@ export function BootstrapsProvider(props: { children: React.ReactNode }) {
   const IOC = clientIOC.create();
 
   return (
-    <IOCContext.Provider data-testid="BootstrapsProvider" value={IOC}>
-      {props.children}
-    </IOCContext.Provider>
+    <IOCContext.Provider value={IOC}>{props.children}</IOCContext.Provider>
   );
 }

package/dist/templates/react-app/src/uikit/components/MessageBaseList.tsx

@@ -29,7 +29,10 @@ function createMessagesState(): MessagesStateInterface<MessageBaseMsg> {
 }
 
 class MessageBaseApi implements MessageGetwayInterface {
-  async sendMessage<M extends MessageStoreMsg<string>>(
+  /**
+   * @override
+   */
+  public async sendMessage<M extends MessageStoreMsg<string>>(
     message: M
   ): Promise<unknown> {
     const times = random(200, 1000);

package/dist/templates/react-app/src/uikit/components/chatMessage/ChatMessageBridge.ts

@@ -14,9 +14,9 @@ import type {
 } from '@qlover/corekit-bridge';
 import type { TextAreaRef } from 'antd/es/input/TextArea';
 
-export class ChatMessageBridge<T = string>
-  implements ChatMessageBridgeInterface<T>
-{
+export class ChatMessageBridge<
+  T = string
+> implements ChatMessageBridgeInterface<T> {
   protected ref: TextAreaRef | null = null;
   protected readonly messageSender: MessageSender<ChatMessage<T>>;
 
@@ -27,7 +27,12 @@ export class ChatMessageBridge<T = string>
     this.messageSender = new MessageSender(messages, config);
   }
 
-  use(plugin: ChatMessageBridgePlugin<T> | ChatMessageBridgePlugin<T>[]): this {
+  /**
+   * @override
+   */
+  public use(
+    plugin: ChatMessageBridgePlugin<T> | ChatMessageBridgePlugin<T>[]
+  ): this {
     if (Array.isArray(plugin)) {
       plugin.forEach((p) => this.messageSender.use(p));
     } else {
@@ -37,7 +42,10 @@ export class ChatMessageBridge<T = string>
     return this;
   }
 
-  getMessageStore(): ChatMessageStore<T> {
+  /**
+   * @override
+   */
+  public getMessageStore(): ChatMessageStore<T> {
     return this.messages;
   }
 
@@ -45,8 +53,10 @@ export class ChatMessageBridge<T = string>
    * Disable rules
    * 1. If streaming, don't allow sending
    * 2. If sending, don't allow sending
-   */
-  getDisabledSend(params?: DisabledSendParams<T>): boolean {
+
+   * @override
+      */
+  public getDisabledSend(params?: DisabledSendParams<T>): boolean {
     const disabledSend =
       params?.disabledSend || this.messages.state.disabledSend;
 
@@ -62,7 +72,10 @@ export class ChatMessageBridge<T = string>
     return false;
   }
 
-  onChangeContent(content: T): void {
+  /**
+   * @override
+   */
+  public onChangeContent(content: T): void {
     const firstDraft = this.getFirstDraftMessage();
 
     // If draft message exists, update its content
@@ -79,21 +92,24 @@ export class ChatMessageBridge<T = string>
     }
   }
 
-  getFirstDraftMessage(): ChatMessage<T> | null {
+  /**
+   * @override
+   */
+  public getFirstDraftMessage(): ChatMessage<T> | null {
     return this.messages.getFirstDraftMessage();
   }
 
-  setRef(ref: unknown): void {
+  public setRef(ref: unknown): void {
     this.ref = ref as TextAreaRef;
   }
 
-  focus(): void {
+  public focus(): void {
     requestAnimationFrame(() => {
       this.ref?.focus();
     });
   }
 
-  sendMessage(
+  public sendMessage(
     messages: ChatMessage<T>,
     gatewayOptions?: GatewayOptions<ChatMessage<T>>
   ): Promise<ChatMessage<T>> {
@@ -112,10 +128,11 @@ export class ChatMessageBridge<T = string>
    * - If loading, sending is not allowed
    * - If no message to send, sending is not allowed
    *
+   * @override
    * @param message - Message object
    * @param gatewayOptions - Gateway options
    */
-  send(
+  public send(
     message?: ChatMessage<T>,
     gatewayOptions?: GatewayOptions<ChatMessage<T>>
   ): Promise<ChatMessage<T>> {
@@ -140,7 +157,10 @@ export class ChatMessageBridge<T = string>
     return this.sendMessage(targetMessage, gatewayOptions);
   }
 
-  getSendingMessage(messages?: ChatMessage<T>[]): ChatMessage<T> | null {
+  /**
+   * @override
+   */
+  public getSendingMessage(messages?: ChatMessage<T>[]): ChatMessage<T> | null {
     messages = messages || this.messages.getMessages();
 
     return (
@@ -152,7 +172,10 @@ export class ChatMessageBridge<T = string>
     );
   }
 
-  stop(messageId?: string): boolean {
+  /**
+   * @override
+   */
+  public stop(messageId?: string): boolean {
     if (!messageId) {
       const sendingMessage = this.getSendingMessage();
       if (sendingMessage) {
@@ -170,7 +193,7 @@ export class ChatMessageBridge<T = string>
   /**
    * Stop all sending messages
    */
-  stopAll(): void {
+  public stopAll(): void {
     this.messageSender.stopAll();
   }
 }

package/dist/templates/react-app/src/uikit/components/chatMessage/MessageApi.ts

@@ -21,8 +21,10 @@ export class MessageApi implements MessageGetwayInterface {
    * - If options.stream === true, use streaming mode (progressive output)
    * - If options provided but stream !== true, use interruptible normal mode
    * - If no options, use fast normal mode (non-interruptible)
-   */
-  async sendMessage<M extends MessageStoreMsg<string>>(
+
+   * @override
+      */
+  public async sendMessage<M extends MessageStoreMsg<string>>(
     message: M,
     options?: GatewayOptions<M>
   ): Promise<M> {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qlover/create-app",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "Create a new app with a single command",
   "private": false,
   "type": "module",
@@ -33,12 +33,12 @@
     "ignore": "^7.0.3",
     "lodash": "^4.17.21",
     "ora": "^8.1.1",
-    "@qlover/logger": "0.3.0"
+    "@qlover/logger": "0.3.1"
   },
   "dependencies": {
     "commander": "^13.1.0",
     "inquirer": "^12.3.2",
-    "@qlover/scripts-context": "1.2.0"
+    "@qlover/scripts-context": "1.2.1"
   },
   "scripts": {
     "lint": "eslint src --fix",