@coffic/cosy-ui 0.6.42 → 0.7.2

package/dist/footer/EFooterWithProducts.astro

@@ -0,0 +1,24 @@
+---
+/**
+ * @component Footer.WithProducts
+ *
+ * @description
+ * 展示带有产品链接的页脚示例。
+ */
+import { Footer } from '../index';
+---
+
+<Footer
+	siteName="我的网站"
+	homeLink="/"
+	slogan="简单而强大"
+	company="我的公司"
+	copyright="保留所有权利"
+	inspirationalSlogan="构建美好的数字体验"
+	products={[
+		{ name: '产品A', href: '/products/a' },
+		{ name: '产品B', href: '/products/b' },
+		{ name: '产品C', href: '/products/c' },
+		{ name: '外部产品', href: 'https://example.com', external: true },
+	]}
+/>

package/dist/footer/EFooterWithProductsContainer.astro

@@ -0,0 +1,11 @@
+---
+import { CodeContainer } from '../index';
+import FooterWithProducts from './EFooterWithProducts.astro';
+import FooterWithProductsSourceCode from './EFooterWithProducts.astro?raw';
+---
+
+<CodeContainer codes={[FooterWithProductsSourceCode]}>
+	<div id="tab-1">
+		<FooterWithProducts />
+	</div>
+</CodeContainer>

package/dist/footer/EFooterWithSocial.astro

@@ -0,0 +1,24 @@
+---
+/**
+ * @component Footer.WithSocial
+ *
+ * @description
+ * 展示带有社交媒体链接的页脚示例。
+ */
+import { Footer } from '../index';
+---
+
+<Footer
+	siteName="我的网站"
+	homeLink="/"
+	slogan="简单而强大"
+	company="我的公司"
+	copyright="保留所有权利"
+	inspirationalSlogan="构建美好的数字体验"
+	socialLinks={[
+		'https://github.com/myusername',
+		'https://twitter.com/myusername',
+		'https://linkedin.com/in/myusername',
+		'https://facebook.com/myusername',
+	]}
+/>

package/dist/footer/EFooterWithSocialContainer.astro

@@ -0,0 +1,11 @@
+---
+import { CodeContainer } from '../index';
+import FooterWithSocial from './EFooterWithSocial.astro';
+import FooterWithSocialSourceCode from './EFooterWithSocial.astro?raw';
+---
+
+<CodeContainer codes={[FooterWithSocialSourceCode]}>
+	<div id="tab-1">
+		<FooterWithSocial />
+	</div>
+</CodeContainer>

package/dist/footer/FooterSection.astro

@@ -31,9 +31,11 @@ const { title, links } = Astro.props;
 	<ul class="cosy:flex cosy:flex-col cosy:gap-2">
 		{
 			links.map((link) => (
-				<li>
+				<li class="cosy:list-none">
 					{link.href ? (
-						<a href={link.href} class="cosy:link cosy:link-hover">
+						<a
+							href={link.href}
+							class="cosy:link cosy:link-hover cosy:no-underline cosy:hover:no-underline">
 							{link.name}
 						</a>
 					) : (

package/dist/footer/index.ts

@@ -1,11 +1,31 @@
 import Footer from './Footer.astro';
-import FooterBasic from './FooterBasic.astro';
-import BasicSourceCode from './FooterBasic.astro?raw';
+import FooterBasicContainer from './EFooterBasicContainer.astro';
+import FooterWithSocialContainer from './EFooterWithSocialContainer.astro';
+import FooterWithProductsContainer from './EFooterWithProductsContainer.astro';
+import FooterWithLogoContainer from './EFooterWithLogoContainer.astro';
+import FooterWithNavigationContainer from './EFooterWithNavigationContainer.astro';
+import FooterCompleteContainer from './EFooterCompleteContainer.astro';
+import FooterFeaturesContainer from './EFooterFeaturesContainer.astro';
+import EFooterBasicSourceCode from './EFooterBasic.astro?raw';
 import { extractSimpleExample } from '../utils/component';
 
-export { Footer, FooterBasic };
+export { default as Footer } from './Footer.astro';
 
 // 导出示例源代码
 export const FooterExampleCodes = {
-	Basic: extractSimpleExample(BasicSourceCode, 'Footer'),
+    Basic: extractSimpleExample(EFooterBasicSourceCode, 'Footer'),
+};
+
+// 导出页脚包
+export const FooterPackage = {
+    Footer,
+    FooterContainers: {
+        Basic: FooterBasicContainer,
+        WithSocial: FooterWithSocialContainer,
+        WithProducts: FooterWithProductsContainer,
+        WithLogo: FooterWithLogoContainer,
+        WithNavigation: FooterWithNavigationContainer,
+        Complete: FooterCompleteContainer,
+        Features: FooterFeaturesContainer,
+    },
 };

package/dist/icons/index.ts

@@ -0,0 +1,3 @@
+
+// 导出所有图标组件
+export * from '../index_icons';

package/dist/index_astro.ts

@@ -31,6 +31,7 @@ export * from './code-block';
 export * from './modal';
 export * from './hero';
 export * from './code-example';
+export * from './icons';
 export * from './products';
 export * from './blog';
 export * from './layout-basic/BaseLayout.astro';

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@coffic/cosy-ui",
-    "version": "0.6.42",
+    "version": "0.7.2",
     "description": "An astro component library",
     "author": {
         "name": "nookery",
@@ -48,7 +48,6 @@
         "astro": "^5.1.3"
     },
     "dependencies": {
-        "@remixicon/vue": "^4.6.0",
         "astro-integration-kit": "^0.18.0",
         "fs-extra": "^11.3.0",
         "html-to-image": "^1.11.13"
@@ -57,7 +56,6 @@
         "@astrojs/check": "^0.9.4",
         "@astrojs/mdx": "^4.2.6",
         "@astrojs/ts-plugin": "^1.10.4",
-        "@astrojs/vue": "^5.0.13",
         "@eslint/js": "^9.27.0",
         "@tailwindcss/typography": "^0.5.16",
         "@tailwindcss/vite": "^4.1.7",
@@ -69,8 +67,6 @@
         "@types/node": "^22.15.19",
         "@types/react": "^19.1.4",
         "@typescript-eslint/parser": "^8.32.1",
-        "@vitejs/plugin-vue": "^5.2.4",
-        "@vue/tsconfig": "^0.7.0",
         "astro": "^5.7.13",
         "chai": "^4.5.0",
         "daisyui": "^5.0.35",
@@ -86,9 +82,6 @@
         "tsx": "^4.19.4",
         "typescript": "^5.8.3",
         "typescript-eslint": "^8.32.1",
-        "vite": "^6.3.5",
-        "vite-plugin-vue-devtools": "^7.7.6",
-        "vue": "^3.5.14",
-        "vue-eslint-parser": "^10.1.3"
+        "vite": "^6.3.5"
     }
 }

package/dist/button/Button.vue

@@ -1,105 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue'
-
-interface Props {
-  variant?: 
-    | 'primary'
-    | 'secondary'
-    | 'accent'
-    | 'info'
-    | 'success'
-    | 'warning'
-    | 'error'
-    | 'ghost'
-    | 'link'
-    | 'outline'
-    | 'neutral'
-  size?: 'lg' | 'md' | 'sm' | 'xs'
-  shape?: 'circle' | 'square'
-  wide?: boolean
-  block?: boolean
-  loading?: boolean
-  disabled?: boolean
-  type?: 'button' | 'submit' | 'reset'
-  href?: string
-  target?: string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  variant: 'primary',
-  size: 'md',
-  wide: false,
-  block: false,
-  loading: false,
-  disabled: false,
-  type: 'button'
-})
-
-const buttonClasses = computed(() => {
-  const classes = ['cosy:btn']
-
-  // Variant classes
-  const variantClasses = {
-    primary: 'cosy:btn-primary',
-    secondary: 'cosy:btn-secondary',
-    accent: 'cosy:btn-accent',
-    info: 'cosy:btn-info',
-    success: 'cosy:btn-success',
-    warning: 'cosy:btn-warning',
-    error: 'cosy:btn-error',
-    ghost: 'cosy:btn-ghost',
-    link: 'cosy:btn-link',
-    outline: 'cosy:btn-outline',
-    neutral: 'cosy:btn-neutral',
-  }
-
-  // Size classes
-  const sizeClasses = {
-    lg: 'cosy:btn-lg',
-    md: 'cosy:btn-md',
-    sm: 'cosy:btn-sm',
-    xs: 'cosy:btn-xs',
-  }
-
-  // Shape classes
-  const shapeClasses = {
-    circle: 'cosy:btn-circle',
-    square: 'cosy:btn-square',
-  }
-
-  if (variantClasses[props.variant]) {
-    classes.push(variantClasses[props.variant])
-  }
-
-  if (sizeClasses[props.size]) {
-    classes.push(sizeClasses[props.size])
-  }
-
-  if (props.shape && shapeClasses[props.shape]) {
-    classes.push(shapeClasses[props.shape])
-  }
-
-  if (props.wide) classes.push('cosy:btn-wide')
-  if (props.block) classes.push('cosy:btn-block')
-  if (props.loading) classes.push('cosy:loading')
-
-  return classes
-})
-</script>
-
-<template>
-  <component
-    :is="props.href ? 'a' : 'button'"
-    :class="buttonClasses"
-    :type="props.href ? undefined : props.type"
-    :disabled="props.disabled"
-    :href="props.href"
-    :target="props.target"
-  >
-    <span class="cosy:flex cosy:items-center cosy:gap-2">
-      <slot name="icon-left" />
-      <slot />
-      <slot name="icon-right" />
-    </span>
-  </component>
-</template>

package/dist/button/ButtonBasic.vue

@@ -1,11 +0,0 @@
-<script setup lang="ts">
-import Button from './Button.vue'
-</script>
-
-<template>
-  <div class="cosy:flex cosy:gap-2">
-    <Button>默认按钮</Button>
-    <Button variant="primary">主要按钮</Button>
-    <Button variant="secondary">次要按钮</Button>
-  </div>
-</template>

package/dist/button/ButtonFeature.vue

@@ -1,91 +0,0 @@
-
-
-<script setup lang="ts">
-import { ref } from 'vue'
-
-const props = defineProps({
-    title: {
-        type: String,
-        required: false,
-        default: 'Feature Button'
-    },
-    size: {
-        type: String,
-        default: 'w-64',
-        validator: (value: string) => ['w-64', 'w-32', 'w-16', 'w-12', 'w-8'].includes(value)
-    },
-    lang: {
-        type: String,
-        default: 'en',
-        validator: (value: string) => ['en', 'zh'].includes(value)
-    },
-    showTips: {
-        type: Boolean,
-        default: false
-    }
-})
-
-const isPopupVisible = ref(false)
-
-const showPopup = () => {
-    if (props.showTips) {
-        isPopupVisible.value = true
-        setTimeout(hidePopup, 2000) // Auto-hide after 2 seconds
-    }
-}
-
-const hidePopup = () => {
-    isPopupVisible.value = false
-}
-</script>
-<template>
-    <div>
-        <!-- Button with hover effects -->
-        <button :class="[
-            'cosy:bg-cyan-500/20 cosy:text-cyan-500 cosy:border-cyan-500 cosy:border-2 cosy:hover:bg-cyan-500/30 cosy:hover:text-white cosy:hover:border-cyan-500/30 cosy:hover:scale-105 cosy:transition-all cosy:duration-300 cosy:rounded-2xl cosy:text-center cosy:backdrop-blur-lg cosy:text-2xl',
-            props.size
-        ]" @click="showPopup">
-            <slot />
-            {{ props.title }}
-        </button>
-
-        <!-- Popup message -->
-        <Transition name="fade">
-            <div v-if="isPopupVisible"
-                class="cosy:fixed cosy:inset-0 cosy:flex cosy:items-center cosy:justify-center cosy:z-50"
-                @click="hidePopup">
-                <div
-                    class="cosy:bg-black/80 cosy:backdrop-blur-sm cosy:p-6 cosy:rounded-xl cosy:text-white cosy:animate-popup">
-                    {{ lang === 'zh' ? '这是展示图，不支持操作' : 'This is a preview image, no operation is supported' }}
-                </div>
-            </div>
-        </Transition>
-    </div>
-</template>
-<style scoped>
-.fade-enter-active,
-.fade-leave-active {
-    transition: opacity 0.3s ease;
-}
-
-.fade-enter-from,
-.fade-leave-to {
-    opacity: 0;
-}
-
-.animate-popup {
-    animation: popup 0.3s ease-out;
-}
-
-@keyframes popup {
-    from {
-        transform: scale(0.95);
-        opacity: 0;
-    }
-
-    to {
-        transform: scale(1);
-        opacity: 1;
-    }
-}
-</style>

package/dist/button/ButtonFeatureBasic.vue

@@ -1,8 +0,0 @@
-<template>
-    <FeatureButton title="特性按钮" />
-</template>
-
-<script setup lang="ts">
-import '../style';
-import FeatureButton from './ButtonFeature.vue';
-</script>

package/dist/button/ButtonFeatureContainer.astro

@@ -1,18 +0,0 @@
----
-import { CodeContainer } from '../index';
-import ButtonFeatureBasic from './ButtonFeatureBasic.vue';
-import ButtonFeatureWithTips from './ButtonFeatureWithTips.vue';
-import ButtonFeatureBasicSourceCode from './ButtonFeatureBasic.vue?raw';
-import ButtonFeatureWithTipsSourceCode from './ButtonFeatureWithTips.vue?raw';
----
-
-<CodeContainer
-	titles={['Vue-基础用法', 'Vue-带提示功能']}
-	codes={[ButtonFeatureBasicSourceCode, ButtonFeatureWithTipsSourceCode]}>
-	<div id="tab-1">
-		<ButtonFeatureBasic client:load />
-	</div>
-	<div id="tab-2">
-		<ButtonFeatureWithTips client:load />
-	</div>
-</CodeContainer>

package/dist/button/ButtonFeatureWithTips.vue

@@ -1,7 +0,0 @@
-<template>
-    <FeatureButton title="带提示特性" showTips />
-</template>
-
-<script setup lang="ts">
-import FeatureButton from './ButtonFeature.vue';
-</script>

package/dist/button/ButtonLink.vue

@@ -1,13 +0,0 @@
-<script setup lang="ts">
-import VueButton from './Button.vue'
-</script>
-
-<template>
-  <div class="cosy:flex cosy:gap-2">
-    <VueButton href="#" variant="primary">内部链接</VueButton>
-    <VueButton href="https://example.com" target="_blank" variant="primary">
-      外部链接
-      <template #icon-right>↗</template>
-    </VueButton>
-  </div>
-</template>

package/dist/button/ButtonSizes.vue

@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import VueButton from './Button.vue'
-</script>
-
-<template>
-  <div class="cosy:flex cosy:items-center cosy:gap-2">
-    <VueButton size="xs">超小按钮</VueButton>
-    <VueButton size="sm">小型按钮</VueButton>
-    <VueButton size="md">中等按钮</VueButton>
-    <VueButton size="lg">大型按钮</VueButton>
-  </div>
-</template>

package/dist/button/ButtonWithIcons.vue

@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import VueButton from './Button.vue'
-</script>
-
-<template>
-  <div class="cosy:flex cosy:gap-2">
-    <VueButton>
-      <template #icon-left>👈</template>
-      左侧图标
-    </VueButton>
-    <VueButton>
-      右侧图标
-      <template #icon-right>👉</template>
-    </VueButton>
-    <VueButton>
-      <template #icon-left>👈</template>
-      两侧图标
-      <template #icon-right>👉</template>
-    </VueButton>
-  </div>
-</template>

package/dist/button/index_vue.ts

@@ -1,4 +0,0 @@
-import FeatureButton from './ButtonFeature.vue';
-import Button from './Button.vue';
-
-export { FeatureButton, Button };

package/dist/vue/AlertDialog/AlertDialog.vue

@@ -1,120 +0,0 @@
-<!--
-@component AlertDialog
-
-@description
-AlertDialog 组件用于显示简单的确认对话框，支持国际化，带有淡入淡出动画效果。
-
-@usage
-基本用法：
-```vue
-<AlertDialog v-model="showDialog" message="操作已完成" />
-```
-
-指定语言：
-```vue
-<AlertDialog v-model="showDialog" message="Operation completed" lang="en" />
-```
-
-组合使用：
-```vue
-<template>
-  <button @click="showDialog = true">显示对话框</button>
-  <AlertDialog v-model="showDialog" message="确认要继续吗？" />
-</template>
-
-<script setup lang="ts">
-import { ref } from 'vue';
-import { AlertDialog } from 'cosy-ui';
-
-const showDialog = ref(false);
-</script>
-```
-
-@props
-@prop {boolean} modelValue - 控制对话框显示状态，支持v-model双向绑定
-@prop {string} message - 对话框显示的消息内容
-@prop {('zh-cn'|'en')} [lang='zh-cn'] - 语言设置，影响按钮文本
-
-@emits
-@emit {update:modelValue} - 当对话框关闭时触发，用于更新v-model绑定值
--->
-
-<script lang="ts">
-import '../../style'
-import { defineComponent } from 'vue'
-
-type MessageKey = 'confirm';
-
-interface Messages {
-    [key: string]: {
-        [key in MessageKey]: string;
-    };
-}
-
-export default defineComponent({
-    name: 'AlertDialog',
-    props: {
-        modelValue: {
-            type: Boolean,
-            required: true
-        },
-        message: {
-            type: String,
-            required: true
-        },
-        lang: {
-            type: String as () => 'zh-cn' | 'en',
-            default: 'zh-cn'
-        }
-    },
-    emits: ['update:modelValue'],
-    setup(props) {
-        // 多语言文本
-        const t = (key: MessageKey) => {
-            const messages: Messages = {
-                'zh-cn': {
-                    confirm: '确定'
-                },
-                'en': {
-                    confirm: 'OK'
-                }
-            };
-            return messages[props.lang][key];
-        };
-
-        return {
-            t
-        };
-    }
-})
-</script>
-
-<template>
-    <Transition name="fade" class="cosy:transition-opacity cosy:duration-200 cosy:ease-in-out">
-        <div v-if="modelValue"
-            class="cosy:fixed cosy:inset-0 cosy:z-50 cosy:flex cosy:items-center cosy:justify-center cosy:opacity-100 cosy:enter:opacity-0 cosy:leave:opacity-0">
-            <!-- 背景遮罩 -->
-            <div class="cosy:absolute cosy:inset-0 cosy:bg-base-200/80 cosy:backdrop-blur-sm"
-                @click="$emit('update:modelValue', false)" />
-
-            <!-- 对话框 -->
-            <div
-                class="cosy:relative cosy:bg-base-100 cosy:rounded-xl cosy:shadow-lg cosy:w-[400px] cosy:transform cosy:transition-all">
-                <!-- 内容区域 -->
-                <div class="cosy:p-6">
-                    <p class="cosy:text-base-content">
-                        {{ message }}
-                    </p>
-                </div>
-
-                <!-- 按钮区域 -->
-                <div class="cosy:flex cosy:border-t cosy:border-base-300">
-                    <button class="cosy:btn cosy:btn-ghost cosy:flex-1 cosy:rounded-none cosy:rounded-b-xl"
-                        @click="$emit('update:modelValue', false)">
-                        {{ t('confirm') }}
-                    </button>
-                </div>
-            </div>
-        </div>
-    </Transition>
-</template>

package/dist/vue/AlertDialog/Basic.vue

@@ -1,38 +0,0 @@
-<!--
-@component AlertDialog.Basic
-
-@description
-AlertDialog 组件的基础示例，展示最基本的对话框用法。
-
-@usage
-```vue
-<AlertDialogExamples.Basic />
-```
--->
-
-<script lang="ts">
-import '../../app.css'
-import { ref, defineComponent } from 'vue'
-import AlertDialog from './AlertDialog.vue'
-
-export default defineComponent({
-    name: 'AlertDialogBasicExample',
-    components: {
-        AlertDialog
-    },
-    setup() {
-        const isShow = ref(false)
-
-        return {
-            isShow
-        }
-    }
-})
-</script>
-
-<template>
-    <button @click="isShow = true" class="cosy:btn cosy:btn-primary">
-        显示对话框
-    </button>
-    <AlertDialog v-model="isShow" message="这是一条重要信息" />
-</template>