import { Card, Drawer, Modal } from '@arco-design/web-vue'
// 额外引入 Arco Design Icon图标库
import ArcoVueIcon from '@arco-design/web-vue/es/icon'
import { createApp } from 'vue'
// 状态管理
import pinia from '@/stores'
import App from './App.vue'
// 自定义指令
import directives from './directives'
import router from './router'
// ⚠️ Arco 组件样式必须显式引入：
//    vite.config.ts 里 ArcoResolver 配了 sideEffect:false（样式不随组件自动引入），
//    原本靠 @arco-themes/vue-gi-demo 主题包带入；我们换成自己的主题后就没人带了。
//    不引的后果是「组件能用但完全没样式」，页面直接散架，且构建不报错。
import '@arco-design/web-vue/dist/arco.css'
// 导入本项目主题（内部会覆盖 Arco 默认变量）
import '@/styles/arco-ui/index.less'
// 使用动画库
import 'animate.css/animate.min.css'
// 自定义过渡动画
import '@/styles/css/transition.css'
// 导入全局scss主文件
import '@/styles/index.scss'
// 注册离线图标集
import '@/icons/index'

// 对特定组件进行默认配置
Card.props.bordered = false

const app = createApp(App)
Modal._context = app._context
Drawer._context = app._context

app.use(router)
app.use(pinia)
app.use(ArcoVueIcon)
app.use(directives)

app.mount('#app')