@coffic/cosy-ui 0.9.1 → 0.9.3

package/dist/src-astro/code-container/ButtonCodeToggle.astro

@@ -1,5 +1,5 @@
 ---
-import { CodeIcon } from '../icons';
+import { CodeIcon } from '../icons/index';
 const { isCodeView = false } = Astro.props;
 ---
 

package/dist/src-astro/code-container/ButtonCopyCode.astro

@@ -1,5 +1,5 @@
 ---
-import { ClipboardIcon } from '../icons';
+import { ClipboardIcon } from '../icons/index';
 ---
 
 <button

package/dist/src-astro/header/Header.astro

@@ -12,19 +12,35 @@
  * 2. 响应式适配 - 在移动端和桌面端都有合适的展现形式
  * 3. 可定制性 - 支持多种配置选项，适应不同网站的风格和需求
  * 4. 多语言支持 - 内置语言切换功能，便于构建国际化网站
+ *
+ * @usage
+ * 基本用法：
+ * ```astro
+ * <Header />
+ * ```
+ *
+ * 启用语言切换功能：
+ * ```astro
+ * ---
+ * import * as astroI18n from 'astro:i18n';
+ * ---
+ * <Header astroI18n={astroI18n} />
+ * ```
+ *
+ * @props
+ * - astroI18n - 完整的 astro:i18n 模块（启用语言切换时需要）
  */
 import {
+  Image,
   LanguageSwitcher,
+  Link,
   LinkUtil,
   type IHeaderProps,
   type INavItem,
   NavItems,
-  Link,
-  Image,
   ThemeSwitcher,
 } from '../../index-astro';
 import Logo from '../../src/assets/logo-rounded.png';
-import { i18n } from 'astro:config/server';
 
 export interface Props extends IHeaderProps {
   debug?: boolean;
@@ -42,6 +58,7 @@ const {
   paddingVertical = 'none',
   navPosition = 'center',
   showThemeSwitcher = true,
+  astroI18n,
 } = Astro.props;
 
 // 根据高度设置样式
@@ -79,6 +96,10 @@ const logoSizeClasses = {
 
 const logoSizeClass = logoSizeClasses[height];
 const linkHeightClass = linkHeightClasses[height];
+
+// 检查 i18n 是否启用，通过 Astro.currentLocale 来判断
+let isI18nEnabled = Astro.currentLocale !== undefined;
+
 const currentPath = Astro.url.pathname;
 const activeLink = LinkUtil.getActiveLink(
   currentPath,
@@ -200,7 +221,7 @@ const activeLink = LinkUtil.getActiveLink(
       }
 
       {showThemeSwitcher && <ThemeSwitcher />}
-      {i18n !== undefined && <LanguageSwitcher />}
+      {isI18nEnabled && <LanguageSwitcher astroI18n={astroI18n} />}
 
       <slot name="navbar-end" />
     </div>

package/dist/src-astro/language-switcher/LanguageSwitcher.astro

@@ -14,51 +14,71 @@
  * 4. 一致的视觉风格 - 使用与整体设计系统一致的下拉菜单样式
  *
  * @usage
- * 基本用法：
+ * 基本用法（需要用户传入 astro:i18n 模块）：
  * ```astro
- * <LanguageSwitcher />
+ * ---
+ * import * as astroI18n from 'astro:i18n';
+ * ---
+ * <LanguageSwitcher astroI18n={astroI18n} />
  * ```
  *
+ * @props
+ * - astroI18n - 完整的 astro:i18n 模块
+ * - class - 自定义CSS类名
  */
 
+import { ChevronDownIcon, Link, ListItem } from '../../index-astro';
 import {
-  ChevronDownIcon,
-  LanguageUtil,
-  Link,
-  ListItem,
-} from '../../index-astro';
+  checkSwitcherRenderState,
+  generateSwitcherLinks,
+  type SwitcherLink,
+} from './switcher_util';
 import '../../style.ts';
-import { i18n } from 'astro:config/server';
 
 interface Props {
+  /**
+   * 完整的 astro:i18n 模块
+   */
+  astroI18n?: any;
+
   /**
    * 自定义类名
    */
   class?: string;
 }
 
-const { class: className = '' } = Astro.props;
+const { astroI18n, class: className = '' } = Astro.props;
 
-let links: any[] = [];
-let currentLocale: string | undefined = undefined;
-let currentLanguageName: string | undefined = undefined;
+// 检查渲染状态
+const renderState = checkSwitcherRenderState(Astro.currentLocale, astroI18n);
+
+// 输出警告信息
+if (renderState.warnings) {
+  renderState.warnings.forEach((warning) => console.warn(warning));
+}
 
-if (i18n !== undefined) {
-  const { getSwitcherLinks } = await import('./switcher_util.ts');
-  links = getSwitcherLinks(Astro);
+let links: SwitcherLink[] = [];
 
-  currentLocale = Astro.currentLocale!;
-  currentLanguageName = LanguageUtil.getLanguageName(currentLocale);
-} else {
-  throw new Error('can not use LanguageSwitcher when i18n is disabled');
+// 如果应该渲染，生成切换链接
+if (renderState.shouldRender && Astro.currentLocale) {
+  try {
+    links = generateSwitcherLinks(
+      astroI18n,
+      Astro.currentLocale,
+      Astro.url.pathname
+    );
+  } catch (error) {
+    // 如果生成链接失败，设置为不渲染
+    renderState.shouldRender = false;
+  }
 }
 ---
 
 {
-  i18n !== undefined && (
+  renderState.shouldRender && (
     <div class={`cosy:dropdown cosy:dropdown-end ${className}`}>
       <div tabindex="0" role="button" class:list={['cosy:btn cosy:btn-ghost']}>
-        <span class="cosy:mr-1">{currentLanguageName}</span>
+        <span class="cosy:mr-1">{renderState.currentLanguageName}</span>
         <ChevronDownIcon size="16px" class="cosy:w-4 cosy:h-4" />
       </div>
       <ul
@@ -66,7 +86,7 @@ if (i18n !== undefined) {
         class="cosy:z-[1] cosy:bg-base-100 cosy:shadow cosy:p-2 cosy:rounded-box cosy:w-32 cosy:dropdown-content cosy:menu">
         {links.map((link) => (
           <ListItem>
-            <Link href={link.url} active={currentLocale === link.locale}>
+            <Link href={link.url} active={Astro.currentLocale === link.locale}>
               {link.name}
             </Link>
           </ListItem>

package/dist/src-astro/language-switcher/switcher_util.ts

@@ -1,6 +1,4 @@
-import { getRelativeLocaleUrl, getRelativeLocaleUrlList } from 'astro:i18n';
-import type { AstroGlobal } from 'astro';
-import { LanguageUtil } from '../../index-astro';
+import { LanguageUtil } from "../../src/utils/language"
 
 export interface SwitcherLink {
     locale: string;
@@ -8,33 +6,79 @@ export interface SwitcherLink {
     url: string;
 }
 
-// 获取基础路径
-const getBaseUrl = (): string => {
-    return import.meta.env.BASE_URL;
+/**
+ * 获取基础 URL
+ */
+export const getBaseUrl = (): string => {
+    return import.meta.env.BASE_URL || '/';
 };
 
-const getLocaleFromUrl = (url: string): string => {
+/**
+ * 从 URL 中提取语言代码
+ */
+export const getLocaleFromUrl = (url: string): string => {
     return url.replace(getBaseUrl(), '').split('/')[0];
 };
 
-export function getSwitcherLinks(astro: AstroGlobal): SwitcherLink[] {
-    const currentLocale = astro.currentLocale;
+/**
+ * 生成语言切换链接
+ * @param astroI18n - astro:i18n 模块
+ * @param currentLocale - 当前语言代码
+ * @param pathname - 当前页面路径
+ * @returns 语言切换链接数组
+ */
+export const generateSwitcherLinks = (
+    astroI18n: any,
+    currentLocale: string,
+    pathname: string
+): SwitcherLink[] => {
+    try {
+        const { getRelativeLocaleUrl, getRelativeLocaleUrlList } = astroI18n;
 
-    if (currentLocale === undefined) {
-        throw new Error('can not get switcher links when i18n is disabled');
+        const currentLocalURLPrefix = getRelativeLocaleUrl(currentLocale, '');
+        const pathWithSlash = pathname + '/';
+        const slug = pathWithSlash.replace(currentLocalURLPrefix, '');
+        const urls = getRelativeLocaleUrlList(slug);
+
+        return urls.map((url: string) => ({
+            locale: getLocaleFromUrl(url),
+            name: LanguageUtil.getLanguageName(getLocaleFromUrl(url)),
+            url: url,
+        }));
+    } catch (error) {
+        console.warn('LanguageSwitcher: Error generating switcher links:', error);
+        throw error;
     }
+};
 
-    const currentLocalURLPrefix = getRelativeLocaleUrl(currentLocale, '');
-    const pathname = astro.url.pathname + '/';
-    const slug = pathname.replace(
-        currentLocalURLPrefix,
-        ''
-    );
-    const urls = getRelativeLocaleUrlList(slug);
-
-    return urls.map((url) => ({
-        locale: getLocaleFromUrl(url),
-        name: LanguageUtil.getLanguageName(getLocaleFromUrl(url)),
-        url: url
-    }));
-}
+/**
+ * 检查语言切换器是否应该渲染
+ * @param currentLocale - 当前语言代码
+ * @param astroI18n - astro:i18n 模块
+ * @returns 是否应该渲染的状态信息
+ */
+export const checkSwitcherRenderState = (
+    currentLocale: string | undefined,
+    astroI18n: any
+): {
+    shouldRender: boolean;
+    currentLanguageName?: string;
+    warnings?: string[];
+} => {
+    const warnings: string[] = [];
+
+    if (!currentLocale) {
+        warnings.push('LanguageSwitcher: i18n is not enabled in the current project');
+        return { shouldRender: false, warnings };
+    }
+
+    if (!astroI18n) {
+        warnings.push('LanguageSwitcher: astroI18n module is required. Please pass the astro:i18n module as a prop.');
+        return { shouldRender: false, warnings };
+    }
+
+    return {
+        shouldRender: true,
+        currentLanguageName: LanguageUtil.getLanguageName(currentLocale),
+    };
+};

package/dist/src-astro/layout-dashboard/DashboardLayout.astro

@@ -141,8 +141,6 @@
  * - userMenuItems?: UserMenuItem[] - 用户菜单项，默认包含个人资料、设置、退出登录，图标会自动匹配
  * - sidebarCollapsed?: boolean - 是否折叠侧边栏，默认为false
  * - sidebarSize?: 'sm' | 'md' | 'lg' | 'xl' - 侧边栏尺寸，默认为"md"
- * - sidebarTheme?: SidebarTheme - 侧边栏主题，默认为"default"
- * - mainBackgroundTheme?: MainBackgroundTheme - 主内容区域背景主题，默认为"transparent"
  * - head?: astroHTML.JSX.Element - 自定义头部内容
  * - class?: string - 页面类名
  * - class:list?: any - 类名列表
@@ -158,14 +156,7 @@ import DashboardSidebar from './DashboardSidebar.astro';
 import DashboardTopNavbar from './DashboardTopNavbar.astro';
 import { ToastContainer, ConfirmDialog } from '../../index-astro';
 import '../../style.ts';
-import {
-  type NavItem,
-  type SidebarSize,
-  type SidebarTheme,
-  type MainBackgroundTheme,
-  type UserMenuItem,
-  getMainBackgroundTheme,
-} from './types';
+import { type NavItem, type SidebarSize, type UserMenuItem } from './types';
 
 export interface Props {
   /**
@@ -216,18 +207,6 @@ export interface Props {
    */
   sidebarSize?: SidebarSize;
 
-  /**
-   * 侧边栏主题
-   * @default "default"
-   */
-  sidebarTheme?: SidebarTheme;
-
-  /**
-   * 主内容区域背景主题
-   * @default "transparent"
-   */
-  mainBackgroundTheme?: MainBackgroundTheme;
-
   /**
    * 自定义头部内容
    */
@@ -278,8 +257,6 @@ const {
   userMenuItems,
   sidebarCollapsed = false,
   sidebarSize = 'md',
-  sidebarTheme = 'default',
-  mainBackgroundTheme = 'base-100',
   enableToast = true,
   enableConfirmDialog = true,
   head,
@@ -291,7 +268,6 @@ const {
 } = Astro.props;
 
 const currentPath = Astro.url.pathname;
-const mainBackgroundStyles = getMainBackgroundTheme(mainBackgroundTheme);
 
 const mainPaddingMap = {
   none: '',
@@ -325,8 +301,7 @@ const mainPaddingMap = {
         systemName={systemName}
         navItems={navItems}
         currentPath={currentPath}
-        size={sidebarSize}
-        theme={sidebarTheme}>
+        size={sidebarSize}>
         <slot name="sidebar-footer" slot="footer" />
       </DashboardSidebar>
     </div>
@@ -346,7 +321,7 @@ const mainPaddingMap = {
         class:list={[
           'cosy:flex-1',
           mainPaddingMap[mainPadding],
-          mainBackgroundStyles,
+          'cosy:bg-base-100',
         ]}>
         <slot />
       </main>

package/dist/src-astro/layout-dashboard/DashboardSidebar.astro

@@ -28,7 +28,6 @@
  * - navItems: NavItem[] - 导航项目
  * - currentPath?: string - 当前路径，用于高亮当前页面
  * - size?: 'sm' | 'md' | 'lg' | 'xl' - 侧边栏尺寸，默认为"md"
- * - theme?: SidebarTheme - 侧边栏主题，默认为"default"
  *
  * @slots
  * - footer - 侧边栏底部自定义内容，可用于展示用户信息等
@@ -38,10 +37,8 @@ import '../../style.ts';
 import {
   getNavItemIcon,
   getSidebarWidth,
-  getSidebarTheme,
   type NavItem,
   type SidebarSize,
-  type SidebarTheme,
 } from './types';
 import AstroIcon from '../icons/AstroIcon.astro';
 
@@ -67,12 +64,6 @@ export interface Props {
    * @default "md"
    */
   size?: SidebarSize;
-
-  /**
-   * 侧边栏主题
-   * @default "default"
-   */
-  theme?: SidebarTheme;
 }
 
 const {
@@ -80,26 +71,16 @@ const {
   navItems,
   currentPath = '',
   size = 'md',
-  theme = 'default',
 } = Astro.props;
-
-const themeStyles = getSidebarTheme(theme);
 ---
 
 <aside
   class:list={[
     getSidebarWidth(size),
-    'cosy:min-h-full cosy:flex cosy:flex-col',
-    themeStyles.bg,
-    themeStyles.textColor,
+    'cosy:min-h-full cosy:flex cosy:flex-col cosy:bg-base-200 cosy:text-base-content',
   ]}>
   <!-- 侧边栏头部 -->
-  <div
-    class:list={[
-      'cosy:navbar cosy:border-b',
-      themeStyles.headerBg,
-      themeStyles.borderColor,
-    ]}>
+  <div class:list={['cosy:navbar cosy:border-b cosy:border-base-300']}>
     <div class="cosy:navbar-start">
       <a
         href="/dashboard"
@@ -118,7 +99,7 @@ const themeStyles = getSidebarTheme(theme);
   <!-- 导航菜单 -->
   <div class="cosy:flex-1 cosy:overflow-y-auto">
     <ul
-      class="cosy:menu cosy:p-4 cosy:space-y-1 cosy:list-none cosy:no-underline">
+      class="cosy:menu cosy:p-4 cosy:space-y-1 cosy:list-none cosy:no-underline cosy:w-full">
       {
         navItems.map((item: NavItem) => {
           const isActive =
@@ -129,7 +110,7 @@ const themeStyles = getSidebarTheme(theme);
               ));
 
           return (
-            <li>
+            <li class="cosy:w-full">
               <a
                 href={item.href}
                 class:list={[
@@ -186,7 +167,7 @@ const themeStyles = getSidebarTheme(theme);
   </div>
 
   <!-- 侧边栏底部自定义内容 -->
-  <div class:list={['cosy:mt-auto cosy:border-t', themeStyles.borderColor]}>
+  <div class:list={['cosy:mt-auto cosy:border-t cosy:border-base-300']}>
     <slot name="footer" />
   </div>
 </aside>

package/dist/src-astro/layout-dashboard/index.ts

@@ -7,11 +7,11 @@ import DashboardSidebar from './DashboardSidebar.astro';
 import DashboardTopNavbar from './DashboardTopNavbar.astro';
 
 export {
-  DashboardLayout,
-  DashboardSidebar,
-  DashboardTopNavbar
+    DashboardLayout,
+    DashboardSidebar,
+    DashboardTopNavbar
 };
 
 // 导出类型和函数
-export type { NavItem, SidebarSize, SidebarTheme, ContentTheme } from './types';
-export { getIconFromHref, getNavItemIcon, getSidebarWidth, getSidebarTheme, getContentTheme } from './types';
+export type { NavItem, SidebarSize, UserMenuItem } from './types';
+export { getIconFromHref, getNavItemIcon, getSidebarWidth } from './types';

package/dist/src-astro/layout-dashboard/tools.ts

@@ -115,7 +115,7 @@ const hrefToIconMap: Record<string, string> = {
  */
 export function getIconFromHref(href: string, fallbackIcon: string = 'folder'): string {
     // 将 href 转换为小写并移除路径分隔符
-    const normalizedHref = href.toLowerCase().replace(/[\/\-_]/g, '');
+    const normalizedHref = href.toLowerCase().replace(/[/\-_]/g, '');
 
     // 遍历映射表，找到匹配的关键词
     for (const [keyword, iconName] of Object.entries(hrefToIconMap)) {

package/dist/src-astro/layout-dashboard/types.ts

@@ -43,124 +43,4 @@ export function getSidebarWidth(size: SidebarSize = 'md'): string {
     return sidebarSizeMap[size];
 }
 
-/**
- * 侧边栏背景色主题类型
- */
-export type SidebarTheme = 'default' | 'dark' | 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error';
-
-/**
- * 侧边栏背景色主题配置映射
- */
-export const sidebarThemeMap: Record<SidebarTheme, { bg: string; headerBg: string; textColor: string; borderColor: string }> = {
-    'default': {
-        bg: 'cosy:bg-base-300',
-        headerBg: 'cosy:bg-base-300',
-        textColor: 'cosy:text-base-content',
-        borderColor: 'cosy:border-base-200'
-    },
-    'dark': {
-        bg: 'cosy:bg-base-100',
-        headerBg: 'cosy:bg-base-100',
-        textColor: 'cosy:text-base-content',
-        borderColor: 'cosy:border-base-200'
-    },
-    'neutral': {
-        bg: 'cosy:bg-neutral',
-        headerBg: 'cosy:bg-neutral',
-        textColor: 'cosy:text-neutral-content',
-        borderColor: 'cosy:border-neutral-focus'
-    },
-    'primary': {
-        bg: 'cosy:bg-primary',
-        headerBg: 'cosy:bg-primary',
-        textColor: 'cosy:text-primary-content',
-        borderColor: 'cosy:border-primary-focus'
-    },
-    'secondary': {
-        bg: 'cosy:bg-secondary',
-        headerBg: 'cosy:bg-secondary',
-        textColor: 'cosy:text-secondary-content',
-        borderColor: 'cosy:border-secondary-focus'
-    },
-    'accent': {
-        bg: 'cosy:bg-accent',
-        headerBg: 'cosy:bg-accent',
-        textColor: 'cosy:text-accent-content',
-        borderColor: 'cosy:border-accent-focus'
-    },
-    'info': {
-        bg: 'cosy:bg-info',
-        headerBg: 'cosy:bg-info',
-        textColor: 'cosy:text-info-content',
-        borderColor: 'cosy:border-info-focus'
-    },
-    'success': {
-        bg: 'cosy:bg-success',
-        headerBg: 'cosy:bg-success',
-        textColor: 'cosy:text-success-content',
-        borderColor: 'cosy:border-success-focus'
-    },
-    'warning': {
-        bg: 'cosy:bg-warning',
-        headerBg: 'cosy:bg-warning',
-        textColor: 'cosy:text-warning-content',
-        borderColor: 'cosy:border-warning-focus'
-    },
-    'error': {
-        bg: 'cosy:bg-error',
-        headerBg: 'cosy:bg-error',
-        textColor: 'cosy:text-error-content',
-        borderColor: 'cosy:border-error-focus'
-    }
-};
-
-/**
- * 获取侧边栏主题样式类
- * @param theme 侧边栏主题
- * @returns 对应的样式配置
- */
-export function getSidebarTheme(theme: SidebarTheme = 'default') {
-    return sidebarThemeMap[theme];
-}
-
-/**
- * 主内容区域背景主题类型
- */
-export type MainBackgroundTheme = 'transparent' | 'base-100' | 'base-200' | 'base-300' | 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error' | 'gradient-warm' | 'gradient-cool' | 'gradient-rainbow' | 'gradient-sunset' | 'gradient-ocean' | 'gradient-forest';
-
-
-
-/**
- * 主内容区域背景主题配置映射
- */
-export const mainBackgroundThemeMap: Record<MainBackgroundTheme, string> = {
-    'transparent': '',
-    'base-100': 'cosy:bg-base-100',
-    'base-200': 'cosy:bg-base-200',
-    'base-300': 'cosy:bg-base-300',
-    'neutral': 'cosy:bg-neutral',
-    'primary': 'cosy:bg-primary',
-    'secondary': 'cosy:bg-secondary',
-    'accent': 'cosy:bg-accent',
-    'info': 'cosy:bg-info',
-    'success': 'cosy:bg-success',
-    'warning': 'cosy:bg-warning',
-    'error': 'cosy:bg-error',
-    'gradient-warm': 'cosy:bg-gradient-to-br cosy:from-orange-100 cosy:via-red-50 cosy:to-pink-100',
-    'gradient-cool': 'cosy:bg-gradient-to-br cosy:from-blue-100 cosy:via-cyan-50 cosy:to-green-100',
-    'gradient-rainbow': 'cosy:bg-gradient-to-br cosy:from-purple-100 cosy:via-pink-50 cosy:to-blue-100',
-    'gradient-sunset': 'cosy:bg-gradient-to-br cosy:from-yellow-100 cosy:via-orange-50 cosy:to-red-100',
-    'gradient-ocean': 'cosy:bg-gradient-to-br cosy:from-blue-100 cosy:via-teal-50 cosy:to-cyan-100',
-    'gradient-forest': 'cosy:bg-gradient-to-br cosy:from-green-100 cosy:via-emerald-50 cosy:to-teal-100'
-};
-
-/**
- * 获取主内容区域背景主题样式类
- * @param theme 主内容区域背景主题
- * @returns 对应的样式类名
- */
-export function getMainBackgroundTheme(theme: MainBackgroundTheme = 'base-100'): string {
-    return mainBackgroundThemeMap[theme];
-}
-
 export { getIconFromHref, getNavItemIcon, getUserMenuItemIcon } from './tools'; 

package/dist/src-astro/types/header.ts

@@ -1,4 +1,5 @@
 import type { INavItem } from './nav';
+import type { ImageMetadata } from 'astro';
 
 export interface IHeaderProps {
     /**
@@ -7,6 +8,11 @@ export interface IHeaderProps {
      */
     defaultSidebarOpen?: boolean;
 
+    /**
+     * 完整的 astro:i18n 模块（启用语言切换时需要）
+     */
+    astroI18n?: any;
+
     /**
      * 导航栏高度
      * @default "md"