@qlover/create-app 0.10.1 → 0.10.3

package/dist/templates/next-app/src/uikit/components/BaseHeader.tsx

@@ -1,80 +0,0 @@
-'use client';
-
-import { clsx } from 'clsx';
-import { useLocale } from 'next-intl';
-import { useMemo } from 'react';
-import { useIOC } from '@/uikit/hook/useIOC';
-import { COMMON_ADMIN_TITLE } from '@config/Identifier';
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import { LocaleLink } from './LocaleLink';
-import { useWarnTranslations } from '../hook/useWarnTranslations';
-
-export type RenderLeftFunction = (props: {
-  locale: string;
-  defaultElement: React.ReactNode;
-}) => React.ReactNode;
-
-export function BaseHeader(props: {
-  href?: string;
-  renderLeft?: React.ReactNode | RenderLeftFunction;
-  rightActions?: React.ReactNode;
-  className?: string;
-}) {
-  const { href = '/', className, renderLeft, rightActions } = props;
-  const appConfig = useIOC(IOCIdentifier.AppConfig);
-  const locale = useLocale();
-  const t = useWarnTranslations();
-
-  const tt = {
-    title: appConfig.appName,
-    admin: t(COMMON_ADMIN_TITLE)
-  };
-
-  const leftDefault = useMemo(
-    () => (
-      <LocaleLink
-        data-testid="BaseHeaderLogo"
-        title={tt.title}
-        href={href}
-        locale={locale}
-        className="flex items-center hover:opacity-80 transition-opacity"
-      >
-        <span
-          data-testid="base-header-app-name"
-          className="text-lg font-semibold text-text"
-        >
-          {tt.title}
-        </span>
-      </LocaleLink>
-    ),
-    [href, locale, tt.title]
-  );
-
-  const RenderLeft = useMemo(() => {
-    if (!renderLeft) {
-      return leftDefault;
-    }
-
-    if (typeof renderLeft === 'function') {
-      return renderLeft({ locale, defaultElement: leftDefault });
-    }
-    return renderLeft;
-  }, [renderLeft, locale, leftDefault]);
-
-  return (
-    <header
-      data-testid="BaseHeader"
-      className="h-14 bg-secondary border-b border-c-border sticky top-0 z-50"
-    >
-      <div
-        className={clsx(
-          'flex items-center justify-between h-full px-4 mx-auto max-w-7xl',
-          className
-        )}
-      >
-        <div className="flex items-center">{RenderLeft}</div>
-        <div className="flex items-center gap-2 md:gap-4">{rightActions}</div>
-      </div>
-    </header>
-  );
-}

package/dist/templates/next-app/src/uikit/components/BaseLayout.tsx

@@ -1,65 +0,0 @@
-import { TeamOutlined } from '@ant-design/icons';
-import { useLocale } from 'next-intl';
-import { useMemo, type HTMLAttributes } from 'react';
-import { COMMON_ADMIN_TITLE } from '@config/Identifier';
-import { BaseHeader } from './BaseHeader';
-import { LanguageSwitcher } from './LanguageSwitcher';
-import { LocaleLink } from './LocaleLink';
-import { LogoutButton } from './LogoutButton';
-import { ThemeSwitcher } from './ThemeSwitcher';
-import { useWarnTranslations } from '../hook/useWarnTranslations';
-
-export interface BaseLayoutProps extends HTMLAttributes<HTMLDivElement> {
-  showLogoutButton?: boolean;
-  showAdminButton?: boolean;
-  mainProps?: HTMLAttributes<HTMLElement>;
-}
-
-export function BaseLayout({
-  children,
-  showLogoutButton,
-  showAdminButton,
-  mainProps,
-  ...props
-}: BaseLayoutProps) {
-  const locale = useLocale();
-  const t = useWarnTranslations();
-
-  const tt = {
-    admin: t(COMMON_ADMIN_TITLE)
-  };
-
-  const actions = useMemo(
-    () =>
-      [
-        showAdminButton && (
-          <LocaleLink
-            key="admin-button"
-            href="/admin"
-            title={tt.admin}
-            locale={locale}
-            className="text-text hover:text-text-hover cursor-pointer text-lg transition-colors"
-          >
-            <TeamOutlined className="text-lg text-text" />
-          </LocaleLink>
-        ),
-        <LanguageSwitcher key="language-switcher" />,
-        <ThemeSwitcher key="theme-switcher" />,
-        showLogoutButton && <LogoutButton key="logout-button" />
-      ].filter(Boolean),
-    [showAdminButton, tt.admin, locale, showLogoutButton]
-  );
-
-  return (
-    <div
-      data-testid="BaseLayout"
-      className="flex flex-col min-h-screen"
-      {...props}
-    >
-      <BaseHeader rightActions={actions} />
-      <main className="flex flex-1 flex-col bg-primary" {...mainProps}>
-        {children}
-      </main>
-    </div>
-  );
-}

package/dist/templates/next-app/src/uikit/components/ComboProvider.tsx

@@ -1,58 +0,0 @@
-'use client';
-import '@ant-design/v5-patch-for-react-19';
-import { AntdRegistry } from '@ant-design/nextjs-registry';
-import { AntdThemeProvider } from '@brain-toolkit/antd-theme-override/react';
-import { useMountedClient } from '@brain-toolkit/react-kit';
-import { ThemeProvider } from 'next-themes';
-import { clientIOC } from '@/core/clientIoc/ClientIOC';
-import { IOCIdentifier } from '@config/IOCIdentifier';
-import type { CommonThemeConfig } from '@config/theme';
-import { BootstrapsProvider } from './BootstrapsProvider';
-
-/**
- * CommonProvider is a provider for the common components
- *
- * - IOCProvider
- * - BootstrapsProvider
- * - ThemeProvider
- * - AntdProvider
- *
- * @param param0
- * @returns
- */
-export function ComboProvider(props: {
-  themeConfig: CommonThemeConfig;
-  children: React.ReactNode;
-}) {
-  /**
-   * useMountedClient 会等待客户端完全初始化
-   * 只有在客户端准备就绪后才渲染组件内容
-   * 这样可以确保所有的客户端代码（包括 API 配置、插件等）都已经正确初始化
-   */
-  const mounted = useMountedClient();
-
-  const { themeConfig, children } = props;
-
-  const IOC = clientIOC.create();
-
-  return (
-    <AntdThemeProvider
-      data-testid="ComboProvider"
-      theme={themeConfig.antdTheme}
-      staticApi={IOC(IOCIdentifier.DialogHandler)}
-    >
-      <ThemeProvider
-        themes={themeConfig.supportedThemes as unknown as string[]}
-        attribute={themeConfig.domAttribute}
-        defaultTheme={themeConfig.defaultTheme}
-        enableSystem
-        enableColorScheme={false}
-        storageKey={themeConfig.storageKey}
-      >
-        <BootstrapsProvider>
-          <AntdRegistry>{mounted ? children : null}</AntdRegistry>
-        </BootstrapsProvider>
-      </ThemeProvider>
-    </AntdThemeProvider>
-  );
-}

package/dist/templates/next-app/src/uikit/components/NextIntlProvider.tsx

@@ -1,21 +0,0 @@
-import { NextIntlClientProvider, useMessages } from 'next-intl';
-import type { ReactNode } from 'react';
-
-type Props = {
-  children: ReactNode;
-  locale: string;
-};
-
-export function NextIntlProvider({ children, locale }: Props) {
-  const messages = useMessages();
-
-  return (
-    <NextIntlClientProvider
-      data-testid="NextIntlProvider"
-      locale={locale}
-      messages={messages}
-    >
-      {children}
-    </NextIntlClientProvider>
-  );
-}

package/dist/templates/react-app/makes/eslint-utils.mjs

@@ -1,195 +0,0 @@
-/**
- * 禁用特定的全局变量（使用 ESLint 原生 globals 配置）
- * 这是最简洁的方式，直接在 languageOptions.globals 中设置为 'off'
- *
- * @param {import('eslint').Linter.Config} config - ESLint 配置对象
- * @param {Object} options - 配置选项
- * @param {string[]} options.disabledGlobals - 要禁用的全局变量列表
- * @returns {import('eslint').Linter.Config}
- *
- * @example
- * // 禁用 window, document 等全局变量
- * disableGlobals(
- *   {
- *     files: ['src/**\/*.{ts,tsx}'],
- *     languageOptions: { globals: globals.browser },
- *     rules: {}
- *   },
- *   {
- *     disabledGlobals: ['window', 'document', 'localStorage']
- *   }
- * )
- */
-export function disableGlobals(config, options = {}) {
-  const { disabledGlobals = [] } = options;
-
-  const disabledGlobalsConfig = {};
-  disabledGlobals.forEach((name) => {
-    disabledGlobalsConfig[name] = 'off';
-  });
-
-  return {
-    ...config,
-    languageOptions: {
-      ...config.languageOptions,
-      globals: {
-        ...(config.languageOptions && config.languageOptions.globals),
-        ...disabledGlobalsConfig
-      }
-    }
-  };
-}
-
-/**
- * 限制特定的浏览器全局变量（黑名单模式，使用 no-restricted-globals 规则）
- * 只需指定要禁止的变量，其他全部允许
- * 相比 disableGlobals，此方法可以提供自定义错误消息
- *
- * @param {import('eslint').Linter.Config} config - ESLint 配置对象
- * @param {Object} options - 配置选项
- * @param {string[]} options.restrictedGlobals - 禁止使用的全局变量列表
- * @param {string | ((name: string) => string)} [options.message] - 自定义错误消息，支持模板字符串（使用 ${name}）或函数
- * @param {Record<string, string>} [options.customMessages] - 为特定全局变量自定义消息
- * @returns {import('eslint').Linter.Config}
- *
- * @example
- * // 只禁止 window, document 等少数变量
- * restrictSpecificGlobals(
- *   {
- *     files: ['src/**\/*.{ts,tsx}'],
- *     languageOptions: { globals: globals.browser },
- *     rules: {}
- *   },
- *   {
- *     restrictedGlobals: ['window', 'document', 'localStorage'],
- *     message: '❌ 禁止使用 ${name}，请从 @/core/globals 导入',
- *     customMessages: {
- *       window: '❌ 禁止直接使用 window 对象'
- *     }
- *   }
- * )
- */
-export function restrictSpecificGlobals(config, options = {}) {
-  const { restrictedGlobals = [], message, customMessages = {} } = options;
-
-  // 默认消息模板
-  const defaultMessage =
-    message ||
-    '不允许直接使用 ${name}，请从 @/core/globals 导入或使用允许的替代方案';
-
-  // 生成消息的函数
-  const generateMessage = (name) => {
-    // 优先使用自定义消息
-    if (customMessages[name]) {
-      return customMessages[name];
-    }
-
-    // 如果 message 是函数，调用它
-    if (typeof defaultMessage === 'function') {
-      return defaultMessage(name);
-    }
-
-    // 如果是字符串模板，替换 ${name}
-    return defaultMessage.replace(/\$\{name\}/g, name);
-  };
-
-  // 构建限制规则
-  const restrictedGlobalsConfig = restrictedGlobals.map((name) => ({
-    name,
-    message: generateMessage(name)
-  }));
-
-  return {
-    ...config,
-    rules: {
-      ...config.rules,
-      'no-restricted-globals': ['error', ...restrictedGlobalsConfig]
-    }
-  };
-}
-
-/**
- * 自动生成 no-restricted-globals 规则，限制所有未明确允许的浏览器全局变量（白名单模式）
- *
- * @param {import('eslint').Linter.Config} config - ESLint 配置对象
- * @param {Object} options - 配置选项
- * @param {string[]} options.allowedGlobals - 允许使用的全局变量列表
- * @param {Record<string, any>} [options.allGlobals] - 所有浏览器全局变量（如 globals.browser），如果不提供则从 config.languageOptions.globals 获取
- * @param {string | ((name: string) => string)} [options.message] - 自定义错误消息，支持模板字符串（使用 ${name}）或函数
- * @param {Record<string, string>} [options.customMessages] - 为特定全局变量自定义消息
- * @returns {import('eslint').Linter.Config}
- *
- * @example
- * // 从 languageOptions.globals 自动获取（推荐）
- * restrictGlobals(
- *   {
- *     files: ['src/**\/*.{ts,tsx}'],
- *     languageOptions: { globals: globals.browser },
- *     rules: {}
- *   },
- *   {
- *     allowedGlobals: ['console', 'setTimeout'],
- *     message: '❌ 禁止使用 ${name}',
- *     customMessages: {
- *       window: '❌ window 请从 @/core/globals 导入'
- *     }
- *   }
- * )
- *
- * @example
- * // 使用函数形式的消息
- * restrictGlobals(config, {
- *   allowedGlobals: ['console'],
- *   message: (name) => `不允许使用全局变量 "${name}"`
- * })
- */
-export function restrictGlobals(config, options = {}) {
-  const {
-    allowedGlobals = [],
-    allGlobals,
-    message,
-    customMessages = {}
-  } = options;
-
-  // 优先从 options 获取 allGlobals，否则从 config.languageOptions.globals 获取
-  const globals = allGlobals || (config.languageOptions && config.languageOptions.globals) || {};
-  const allGlobalKeys = Object.keys(globals);
-  const allowedSet = new Set(allowedGlobals);
-
-  // 默认消息模板
-  const defaultMessage =
-    message ||
-    '不允许直接使用 ${name}，请从 @/core/globals 导入或使用允许的替代方案';
-
-  // 生成消息的函数
-  const generateMessage = (name) => {
-    // 优先使用自定义消息
-    if (customMessages[name]) {
-      return customMessages[name];
-    }
-
-    // 如果 message 是函数，调用它
-    if (typeof defaultMessage === 'function') {
-      return defaultMessage(name);
-    }
-
-    // 如果是字符串模板，替换 ${name}
-    return defaultMessage.replace(/\$\{name\}/g, name);
-  };
-
-  // 过滤出不允许使用的全局变量
-  const restrictedGlobals = allGlobalKeys
-    .filter((key) => !allowedSet.has(key))
-    .map((name) => ({
-      name,
-      message: generateMessage(name)
-    }));
-
-  return {
-    ...config,
-    rules: {
-      ...config.rules,
-      'no-restricted-globals': ['error', ...restrictedGlobals]
-    }
-  };
-}