From 5a67d39ac7aebf4c3b0acef52eb0e9e88d6067ed Mon Sep 17 00:00:00 2001 From: XinSkyrim <461566709@qq.com> Date: Thu, 16 Oct 2025 02:49:49 +1030 Subject: [PATCH] refactor: migrate interface to vue --- .gitignore | 6 + index.html | 4 +- package.json | 65 +- src/App.tsx | 55 -- src/App.vue | 58 ++ src/components/BottomNavigation.tsx | 74 --- src/components/BottomNavigation.vue | 58 ++ src/components/HealthPage.tsx | 175 ----- src/components/HealthPage.vue | 187 ++++++ src/components/ProgressBar.vue | 16 + src/components/SocialPage.tsx | 83 --- src/components/SocialPage.vue | 92 +++ src/components/StatusPage.tsx | 177 ----- src/components/StatusPage.vue | 180 +++++ src/components/TaskPage.tsx | 257 -------- src/components/TaskPage.vue | 256 ++++++++ src/components/VirtualAvatar.tsx | 64 -- src/components/VirtualAvatar.vue | 59 ++ src/components/figma/ImageWithFallback.tsx | 27 - src/components/ui/accordion.tsx | 66 -- src/components/ui/alert-dialog.tsx | 157 ----- src/components/ui/alert.tsx | 66 -- src/components/ui/aspect-ratio.tsx | 11 - src/components/ui/avatar.tsx | 53 -- src/components/ui/badge.tsx | 46 -- src/components/ui/breadcrumb.tsx | 109 ---- src/components/ui/button.tsx | 58 -- src/components/ui/calendar.tsx | 75 --- src/components/ui/card.tsx | 92 --- src/components/ui/carousel.tsx | 241 ------- src/components/ui/chart.tsx | 353 ---------- src/components/ui/checkbox.tsx | 32 - src/components/ui/collapsible.tsx | 33 - src/components/ui/command.tsx | 177 ----- src/components/ui/context-menu.tsx | 252 ------- src/components/ui/dialog.tsx | 135 ---- src/components/ui/drawer.tsx | 132 ---- src/components/ui/dropdown-menu.tsx | 257 -------- src/components/ui/form.tsx | 168 ----- src/components/ui/hover-card.tsx | 44 -- src/components/ui/input-otp.tsx | 77 --- src/components/ui/input.tsx | 21 - src/components/ui/label.tsx | 24 - src/components/ui/menubar.tsx | 276 -------- src/components/ui/navigation-menu.tsx | 168 ----- src/components/ui/pagination.tsx | 127 ---- src/components/ui/popover.tsx | 48 -- src/components/ui/progress.tsx | 31 - src/components/ui/radio-group.tsx | 45 -- src/components/ui/resizable.tsx | 56 -- src/components/ui/scroll-area.tsx | 58 -- src/components/ui/select.tsx | 189 ------ src/components/ui/separator.tsx | 28 - src/components/ui/sheet.tsx | 139 ---- src/components/ui/sidebar.tsx | 726 --------------------- src/components/ui/skeleton.tsx | 13 - src/components/ui/slider.tsx | 63 -- src/components/ui/sonner.tsx | 25 - src/components/ui/switch.tsx | 31 - src/components/ui/table.tsx | 116 ---- src/components/ui/tabs.tsx | 66 -- src/components/ui/textarea.tsx | 18 - src/components/ui/toggle-group.tsx | 73 --- src/components/ui/toggle.tsx | 47 -- src/components/ui/tooltip.tsx | 61 -- src/components/ui/use-mobile.ts | 21 - src/components/ui/utils.ts | 6 - src/main.ts | 5 + src/main.tsx | 7 - vite.config.ts | 75 +-- 70 files changed, 949 insertions(+), 6141 deletions(-) create mode 100644 .gitignore delete mode 100644 src/App.tsx create mode 100644 src/App.vue delete mode 100644 src/components/BottomNavigation.tsx create mode 100644 src/components/BottomNavigation.vue delete mode 100644 src/components/HealthPage.tsx create mode 100644 src/components/HealthPage.vue create mode 100644 src/components/ProgressBar.vue delete mode 100644 src/components/SocialPage.tsx create mode 100644 src/components/SocialPage.vue delete mode 100644 src/components/StatusPage.tsx create mode 100644 src/components/StatusPage.vue delete mode 100644 src/components/TaskPage.tsx create mode 100644 src/components/TaskPage.vue delete mode 100644 src/components/VirtualAvatar.tsx create mode 100644 src/components/VirtualAvatar.vue delete mode 100644 src/components/figma/ImageWithFallback.tsx delete mode 100644 src/components/ui/accordion.tsx delete mode 100644 src/components/ui/alert-dialog.tsx delete mode 100644 src/components/ui/alert.tsx delete mode 100644 src/components/ui/aspect-ratio.tsx delete mode 100644 src/components/ui/avatar.tsx delete mode 100644 src/components/ui/badge.tsx delete mode 100644 src/components/ui/breadcrumb.tsx delete mode 100644 src/components/ui/button.tsx delete mode 100644 src/components/ui/calendar.tsx delete mode 100644 src/components/ui/card.tsx delete mode 100644 src/components/ui/carousel.tsx delete mode 100644 src/components/ui/chart.tsx delete mode 100644 src/components/ui/checkbox.tsx delete mode 100644 src/components/ui/collapsible.tsx delete mode 100644 src/components/ui/command.tsx delete mode 100644 src/components/ui/context-menu.tsx delete mode 100644 src/components/ui/dialog.tsx delete mode 100644 src/components/ui/drawer.tsx delete mode 100644 src/components/ui/dropdown-menu.tsx delete mode 100644 src/components/ui/form.tsx delete mode 100644 src/components/ui/hover-card.tsx delete mode 100644 src/components/ui/input-otp.tsx delete mode 100644 src/components/ui/input.tsx delete mode 100644 src/components/ui/label.tsx delete mode 100644 src/components/ui/menubar.tsx delete mode 100644 src/components/ui/navigation-menu.tsx delete mode 100644 src/components/ui/pagination.tsx delete mode 100644 src/components/ui/popover.tsx delete mode 100644 src/components/ui/progress.tsx delete mode 100644 src/components/ui/radio-group.tsx delete mode 100644 src/components/ui/resizable.tsx delete mode 100644 src/components/ui/scroll-area.tsx delete mode 100644 src/components/ui/select.tsx delete mode 100644 src/components/ui/separator.tsx delete mode 100644 src/components/ui/sheet.tsx delete mode 100644 src/components/ui/sidebar.tsx delete mode 100644 src/components/ui/skeleton.tsx delete mode 100644 src/components/ui/slider.tsx delete mode 100644 src/components/ui/sonner.tsx delete mode 100644 src/components/ui/switch.tsx delete mode 100644 src/components/ui/table.tsx delete mode 100644 src/components/ui/tabs.tsx delete mode 100644 src/components/ui/textarea.tsx delete mode 100644 src/components/ui/toggle-group.tsx delete mode 100644 src/components/ui/toggle.tsx delete mode 100644 src/components/ui/tooltip.tsx delete mode 100644 src/components/ui/use-mobile.ts delete mode 100644 src/components/ui/utils.ts create mode 100644 src/main.ts delete mode 100644 src/main.tsx diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c35f3c8 --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +node_modules +.DS_Store +.idea +.vscode +/dist +/build diff --git a/index.html b/index.html index d669786..e5b6c6c 100644 --- a/index.html +++ b/index.html @@ -8,8 +8,8 @@ -
- +
+ \ No newline at end of file diff --git a/package.json b/package.json index 5335980..b998a3d 100644 --- a/package.json +++ b/package.json @@ -1,58 +1,17 @@ { - "name": "LiveWell+ App Design(1)", - "version": "0.1.0", - "private": true, - "dependencies": { - "@radix-ui/react-accordion": "^1.2.3", - "@radix-ui/react-alert-dialog": "^1.1.6", - "@radix-ui/react-aspect-ratio": "^1.1.2", - "@radix-ui/react-avatar": "^1.1.3", - "@radix-ui/react-checkbox": "^1.1.4", - "@radix-ui/react-collapsible": "^1.1.3", - "@radix-ui/react-context-menu": "^2.2.6", - "@radix-ui/react-dialog": "^1.1.6", - "@radix-ui/react-dropdown-menu": "^2.1.6", - "@radix-ui/react-hover-card": "^1.1.6", - "@radix-ui/react-label": "^2.1.2", - "@radix-ui/react-menubar": "^1.1.6", - "@radix-ui/react-navigation-menu": "^1.2.5", - "@radix-ui/react-popover": "^1.1.6", - "@radix-ui/react-progress": "^1.1.2", - "@radix-ui/react-radio-group": "^1.2.3", - "@radix-ui/react-scroll-area": "^1.2.3", - "@radix-ui/react-select": "^2.1.6", - "@radix-ui/react-separator": "^1.1.2", - "@radix-ui/react-slider": "^1.2.3", - "@radix-ui/react-slot": "^1.1.2", - "@radix-ui/react-switch": "^1.1.3", - "@radix-ui/react-tabs": "^1.1.3", - "@radix-ui/react-toggle": "^1.1.2", - "@radix-ui/react-toggle-group": "^1.1.2", - "@radix-ui/react-tooltip": "^1.1.8", - "class-variance-authority": "^0.7.1", - "clsx": "*", - "cmdk": "^1.1.1", - "embla-carousel-react": "^8.6.0", - "input-otp": "^1.4.2", - "lucide-react": "^0.487.0", - "motion": "*", - "next-themes": "^0.4.6", - "react": "^18.3.1", - "react-day-picker": "^8.10.1", - "react-dom": "^18.3.1", - "react-hook-form": "^7.55.0", - "react-resizable-panels": "^2.1.7", - "recharts": "^2.15.2", - "sonner": "^2.0.3", - "tailwind-merge": "*", - "vaul": "^1.1.2" - }, - "devDependencies": { - "@types/node": "^20.10.0", - "@vitejs/plugin-react-swc": "^3.10.2", - "vite": "6.3.5" - }, + "name": "LiveWell+ App Design(1)", + "version": "0.1.0", + "private": true, + "dependencies": { + "lucide-vue-next": "^0.487.0", + "vue": "^3.5.13" + }, + "devDependencies": { + "@types/node": "^20.10.0", + "@vitejs/plugin-vue": "^5.2.1", + "vite": "6.3.5" + }, "scripts": { "dev": "vite", "build": "vite build" diff --git a/src/App.tsx b/src/App.tsx deleted file mode 100644 index e8f39fa..0000000 --- a/src/App.tsx +++ /dev/null @@ -1,55 +0,0 @@ -import { useState } from "react"; -import { motion, AnimatePresence } from "motion/react"; -import { SocialPage } from "./components/SocialPage"; -import { TaskPage } from "./components/TaskPage"; -import { HealthPage } from "./components/HealthPage"; -import { StatusPage } from "./components/StatusPage"; -import { BottomNavigation } from "./components/BottomNavigation"; - -export default function App() { - const [activeTab, setActiveTab] = useState("social"); - - const renderPage = () => { - switch (activeTab) { - case "social": - return ; - case "tasks": - return ; - case "health": - return ; - case "status": - return ; - default: - return ; - } - }; - - return ( -
- {/* iPhone Frame */} -
- {/* Notch */} -
- - {/* Content Area */} -
- - - {renderPage()} - - -
- - {/* Bottom Navigation */} - -
-
- ); -} diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..d2b1223 --- /dev/null +++ b/src/App.vue @@ -0,0 +1,58 @@ + + + + + diff --git a/src/components/BottomNavigation.tsx b/src/components/BottomNavigation.tsx deleted file mode 100644 index 17152f1..0000000 --- a/src/components/BottomNavigation.tsx +++ /dev/null @@ -1,74 +0,0 @@ -import { motion } from "motion/react"; -import { MessageCircle, CheckSquare, Heart, TrendingUp } from "lucide-react"; - -interface BottomNavigationProps { - activeTab: string; - onTabChange: (tab: string) => void; -} - -export function BottomNavigation({ activeTab, onTabChange }: BottomNavigationProps) { - const tabs = [ - { id: "social", label: "社交", icon: MessageCircle }, - { id: "tasks", label: "任务", icon: CheckSquare }, - { id: "health", label: "健康", icon: Heart }, - { id: "status", label: "状态", icon: TrendingUp }, - ]; - - return ( -
-
- {tabs.map((tab) => { - const isActive = activeTab === tab.id; - const Icon = tab.icon; - - return ( - - ); - })} -
-
- ); -} diff --git a/src/components/BottomNavigation.vue b/src/components/BottomNavigation.vue new file mode 100644 index 0000000..72ac497 --- /dev/null +++ b/src/components/BottomNavigation.vue @@ -0,0 +1,58 @@ + + + diff --git a/src/components/HealthPage.tsx b/src/components/HealthPage.tsx deleted file mode 100644 index 2bfc03b..0000000 --- a/src/components/HealthPage.tsx +++ /dev/null @@ -1,175 +0,0 @@ -import { motion } from "motion/react"; -import { Pill, Syringe, Check, Bell } from "lucide-react"; -import { useState } from "react"; - -interface Supplement { - id: string; - name: string; - description: string; - icon: string; - taken: boolean; -} - -interface Vaccine { - id: string; - name: string; - description: string; - dueDate: string; - completed: boolean; -} - -export function HealthPage() { - const [supplements, setSupplements] = useState([ - { id: "1", name: "钙片", description: "每日补钙，强健骨骼", icon: "💊", taken: true }, - { id: "2", name: "维生素D", description: "促进钙吸收", icon: "☀️", taken: false }, - { id: "3", name: "鱼油", description: "心脑血管保健", icon: "🐟", taken: false }, - { id: "4", name: "叶黄素", description: "保护视力健康", icon: "👁️", taken: true }, - ]); - - const [vaccines, setVaccines] = useState([ - { id: "1", name: "流感疫苗", description: "本月流感疫苗未完成", dueDate: "10月31日前", completed: false }, - { id: "2", name: "肺炎疫苗", description: "建议每年接种一次", dueDate: "11月15日前", completed: false }, - ]); - - const toggleSupplement = (id: string) => { - setSupplements(supplements.map(s => - s.id === id ? { ...s, taken: !s.taken } : s - )); - }; - - const toggleVaccine = (id: string) => { - setVaccines(vaccines.map(v => - v.id === id ? { ...v, completed: !v.completed } : v - )); - }; - - return ( -
- {/* Header with animation */} - - -
💊
- - - - -

健康管理

- - {/* Supplements Section */} -
-
- -

保健品提醒

-
- -
- {supplements.map((supplement, index) => ( - -
-
- {supplement.icon} -
-
-

{supplement.name}

-

{supplement.description}

-
- -
- - ))} -
-
- - {/* Vaccines Section */} -
-
- -

疫苗提醒

-
- -
- {vaccines.map((vaccine, index) => ( - -
-
- -
-
-
-

{vaccine.name}

- {!vaccine.completed && ( - - )} -
-

{vaccine.description}

-

截止时间：{vaccine.dueDate}

-
-
-
- - {!vaccine.completed && ( - - )} -
- - ))} -
-
- - {/* Tips */} - -

💚 关注健康，享受生活

- -
- ); -} diff --git a/src/components/HealthPage.vue b/src/components/HealthPage.vue new file mode 100644 index 0000000..7b842c0 --- /dev/null +++ b/src/components/HealthPage.vue @@ -0,0 +1,187 @@ + + + + + diff --git a/src/components/ProgressBar.vue b/src/components/ProgressBar.vue new file mode 100644 index 0000000..c214e13 --- /dev/null +++ b/src/components/ProgressBar.vue @@ -0,0 +1,16 @@ + + + diff --git a/src/components/SocialPage.tsx b/src/components/SocialPage.tsx deleted file mode 100644 index c076d7f..0000000 --- a/src/components/SocialPage.tsx +++ /dev/null @@ -1,83 +0,0 @@ -import { motion } from "motion/react"; -import { MessageCircle, Users, Home } from "lucide-react"; -import { VirtualAvatar } from "./VirtualAvatar"; - -export function SocialPage() { - const cards = [ - { - icon: MessageCircle, - title: "聊天", - description: "与AI助手或好友畅聊", - color: "from-[#A3B18A] to-[#7E8C77]", - }, - { - icon: Users, - title: "小组活动", - description: "发现附近的兴趣小组", - color: "from-[#DDB892] to-[#C9A87C]", - }, - { - icon: Home, - title: "社区广场", - description: "查看最新动态与互动", - color: "from-[#7E8C77] to-[#588157]", - }, - ]; - - return ( -
- {/* Avatar Section */} - - - - 您好！今天想和谁聊聊呢？ - - - - {/* Cards Section */} -
- {cards.map((card, index) => ( - -
-
- -
-
-

{card.title}

-

{card.description}

-
-
- - ))} -
- - {/* Decorative Element */} - -

💚 让生活更有温度

- -
- ); -} diff --git a/src/components/SocialPage.vue b/src/components/SocialPage.vue new file mode 100644 index 0000000..4bd5012 --- /dev/null +++ b/src/components/SocialPage.vue @@ -0,0 +1,92 @@ + + + + + diff --git a/src/components/StatusPage.tsx b/src/components/StatusPage.tsx deleted file mode 100644 index 96e105e..0000000 --- a/src/components/StatusPage.tsx +++ /dev/null @@ -1,177 +0,0 @@ -import { motion } from "motion/react"; -import { TrendingUp, Moon, Apple, Activity, MessageCircle } from "lucide-react"; -import { LineChart, Line, XAxis, YAxis, ResponsiveContainer, Tooltip } from "recharts"; - -export function StatusPage() { - const weeklyData = [ - { day: "周一", score: 72 }, - { day: "周二", score: 78 }, - { day: "周三", score: 75 }, - { day: "周四", score: 82 }, - { day: "周五", score: 85 }, - { day: "周六", score: 88 }, - { day: "周日", score: 90 }, - ]; - - const indicators = [ - { - icon: Moon, - title: "睡眠充足", - description: "昨晚睡眠 8小时", - progress: 100, - color: "#A3B18A", - emoji: "🌙", - }, - { - icon: Apple, - title: "饮食健康", - description: "今日饮水已达标", - progress: 85, - color: "#DDB892", - emoji: "🍎", - }, - { - icon: Activity, - title: "运动活力", - description: "完成今日步数目标", - progress: 92, - color: "#7E8C77", - emoji: "🏃‍♂️", - }, - { - icon: MessageCircle, - title: "社交互动", - description: "今日互动 5次", - progress: 75, - color: "#588157", - emoji: "💬", - }, - ]; - - const currentScore = weeklyData[weeklyData.length - 1].score; - - return ( -
-

健康趋势

- - {/* Score Card */} - -
-

本周健康分数

- -
- - - {currentScore} - - / 100 - -

比上周提升 8 分 🎉

- - - {/* Chart */} - -

过去7天趋势

- - - - - - - - - - - {/* Indicators */} -
-

关键指标

-
- {indicators.map((indicator, index) => ( - -
-
- {indicator.emoji} -
-
-

{indicator.title}

-

- {indicator.description} -

-
- -
- - ))} -
-
- - {/* Encouragement */} - -

💪 继续保持，您做得真棒！

- -
- ); -} diff --git a/src/components/StatusPage.vue b/src/components/StatusPage.vue new file mode 100644 index 0000000..dd70062 --- /dev/null +++ b/src/components/StatusPage.vue @@ -0,0 +1,180 @@ + + + + + diff --git a/src/components/TaskPage.tsx b/src/components/TaskPage.tsx deleted file mode 100644 index 5d2c372..0000000 --- a/src/components/TaskPage.tsx +++ /dev/null @@ -1,257 +0,0 @@ -import { motion } from "motion/react"; -import { CheckCircle2, Circle, Trophy } from "lucide-react"; -import { useState } from "react"; -import { Progress } from "./ui/progress"; - -interface Task { - id: string; - title: string; - subtitle: string; - points: number; - completed: boolean; - type: "system" | "custom" | "bonus"; -} - -export function TaskPage() { - const [showLeaderboard, setShowLeaderboard] = useState(false); - const [tasks, setTasks] = useState([ - { id: "1", title: "晨间散步", subtitle: "完成30分钟户外活动", points: 1, completed: false, type: "system" }, - { id: "2", title: "饮水提醒", subtitle: "喝够8杯水", points: 1, completed: true, type: "system" }, - { id: "3", title: "健康饮食", subtitle: "记录三餐营养", points: 1, completed: false, type: "system" }, - { id: "4", title: "练习书法", subtitle: "自定义目标", points: 0.5, completed: true, type: "custom" }, - { id: "5", title: "与家人视频", subtitle: "自定义目标", points: 0.5, completed: false, type: "custom" }, - { id: "6", title: "参加社区活动", subtitle: "限时任务：本周结束前", points: 2, completed: false, type: "bonus" }, - ]); - - const completedPoints = tasks.reduce((sum, task) => task.completed ? sum + task.points : sum, 0); - const totalPoints = 5; - const progress = (completedPoints / totalPoints) * 100; - - const toggleTask = (id: string) => { - setTasks(tasks.map(task => - task.id === id ? { ...task, completed: !task.completed } : task - )); - }; - - const leaderboardData = [ - { rank: 1, name: "王阿姨", points: 95, badge: "🥇" }, - { rank: 2, name: "李叔叔", points: 89, badge: "🥈" }, - { rank: 3, name: "张大妈", points: 82, badge: "🥉" }, - { rank: 4, name: "刘爷爷", points: 78, badge: "" }, - { rank: 5, name: "您", points: 72, badge: "", highlight: true }, - { rank: 6, name: "陈阿姨", points: 68, badge: "" }, - { rank: 7, name: "周叔叔", points: 65, badge: "" }, - ]; - - const getTaskBgColor = (type: string) => { - switch(type) { - case "system": return "bg-[#A3B18A]/10"; - case "custom": return "bg-gray-100"; - case "bonus": return "bg-[#DDB892]/20"; - default: return "bg-white"; - } - }; - - if (showLeaderboard) { - return ( -
-
- -

🏆 排行榜

-
-
- - {/* My Rank Card */} - -

我的排名

-
-
-
- 第 5 名 -
-
-
- 72 分 -
-
- - - {/* Leaderboard List */} -
- {leaderboardData.map((user, index) => ( - -
-
- {user.badge || #{user.rank}} -
-
-

{user.name}

-
-
-
-
-
- {user.points} -
-
- - ))} -
-
- ); - } - - return ( -
- {/* Header */} -
-

今日任务

- -
- - {/* Progress Card */} - -
-

今日进度

- {completedPoints}/{totalPoints} 分 -
- - - - {/* Tasks */} -
- {/* System Tasks */} -
-

系统任务 (1分/项)

-
- {tasks.filter(t => t.type === "system").map((task, index) => ( - -
- -
-

{task.title}

-

{task.subtitle}

-
-
- - ))} -
-
- - {/* Custom Tasks */} -
-

自定义任务 (0.5分/项，上限2分)

-
- {tasks.filter(t => t.type === "custom").map((task, index) => ( - -
- -
-

{task.title}

-

{task.subtitle}

-
-
- - ))} -
-
- - {/* Bonus Tasks */} -
-

奖励任务 (2分/项)

-
- {tasks.filter(t => t.type === "bonus").map((task, index) => ( - -
- -
-

{task.title}

-

{task.subtitle}

-
-
- - ))} -
-
-
-
- ); -} diff --git a/src/components/TaskPage.vue b/src/components/TaskPage.vue new file mode 100644 index 0000000..df873ed --- /dev/null +++ b/src/components/TaskPage.vue @@ -0,0 +1,256 @@ + + + + + diff --git a/src/components/VirtualAvatar.tsx b/src/components/VirtualAvatar.tsx deleted file mode 100644 index 0a55459..0000000 --- a/src/components/VirtualAvatar.tsx +++ /dev/null @@ -1,64 +0,0 @@ -import { motion } from "motion/react"; -import { useEffect, useState } from "react"; - -export function VirtualAvatar() { - const [blink, setBlink] = useState(false); - - useEffect(() => { - const blinkInterval = setInterval(() => { - setBlink(true); - setTimeout(() => setBlink(false), 200); - }, 3000 + Math.random() * 2000); - - return () => clearInterval(blinkInterval); - }, []); - - return ( - - {/* Face background */} -
- - {/* Face features */} -
-
- {/* Eyes */} - - - - {/* Smile */} - - - -
-
- - ); -} diff --git a/src/components/VirtualAvatar.vue b/src/components/VirtualAvatar.vue new file mode 100644 index 0000000..53c6bfe --- /dev/null +++ b/src/components/VirtualAvatar.vue @@ -0,0 +1,59 @@ + + + + + diff --git a/src/components/figma/ImageWithFallback.tsx b/src/components/figma/ImageWithFallback.tsx deleted file mode 100644 index 0e26139..0000000 --- a/src/components/figma/ImageWithFallback.tsx +++ /dev/null @@ -1,27 +0,0 @@ -import React, { useState } from 'react' - -const ERROR_IMG_SRC = - 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iODgiIGhlaWdodD0iODgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBvcGFjaXR5PSIuMyIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIzLjciPjxyZWN0IHg9IjE2IiB5PSIxNiIgd2lkdGg9IjU2IiBoZWlnaHQ9IjU2IiByeD0iNiIvPjxwYXRoIGQ9Im0xNiA1OCAxNi0xOCAzMiAzMiIvPjxjaXJjbGUgY3g9IjUzIiBjeT0iMzUiIHI9IjciLz48L3N2Zz4KCg==' - -export function ImageWithFallback(props: React.ImgHTMLAttributes) { - const [didError, setDidError] = useState(false) - - const handleError = () => { - setDidError(true) - } - - const { src, alt, style, className, ...rest } = props - - return didError ? ( -
-
- Error loading image -
-
- ) : ( - {alt} - ) -} diff --git a/src/components/ui/accordion.tsx b/src/components/ui/accordion.tsx deleted file mode 100644 index aa2c37b..0000000 --- a/src/components/ui/accordion.tsx +++ /dev/null @@ -1,66 +0,0 @@ -"use client"; - -import * as React from "react"; -import * as AccordionPrimitive from "@radix-ui/react-accordion@1.2.3"; -import { ChevronDownIcon } from "lucide-react@0.487.0"; - -import { cn } from "./utils"; - -function Accordion({ - ...props -}: React.ComponentProps) { - return ; -} - -function AccordionItem({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AccordionTrigger({ - className, - children, - ...props -}: React.ComponentProps) { - return ( - - svg]:rotate-180", - className, - )} - {...props} - > - {children} - - - - ); -} - -function AccordionContent({ - className, - children, - ...props -}: React.ComponentProps) { - return ( - -
{children}
- - ); -} - -export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }; diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx deleted file mode 100644 index 68f3605..0000000 --- a/src/components/ui/alert-dialog.tsx +++ /dev/null @@ -1,157 +0,0 @@ -"use client"; - -import * as React from "react"; -import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog@1.1.6"; - -import { cn } from "./utils"; -import { buttonVariants } from "./button"; - -function AlertDialog({ - ...props -}: React.ComponentProps) { - return ; -} - -function AlertDialogTrigger({ - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogPortal({ - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogOverlay({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogContent({ - className, - ...props -}: React.ComponentProps) { - return ( - - - - - ); -} - -function AlertDialogHeader({ - className, - ...props -}: React.ComponentProps<"div">) { - return ( -
- ); -} - -function AlertDialogFooter({ - className, - ...props -}: React.ComponentProps<"div">) { - return ( -
- ); -} - -function AlertDialogTitle({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogDescription({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogAction({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AlertDialogCancel({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -export { - AlertDialog, - AlertDialogPortal, - AlertDialogOverlay, - AlertDialogTrigger, - AlertDialogContent, - AlertDialogHeader, - AlertDialogFooter, - AlertDialogTitle, - AlertDialogDescription, - AlertDialogAction, - AlertDialogCancel, -}; diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx deleted file mode 100644 index 856b94d..0000000 --- a/src/components/ui/alert.tsx +++ /dev/null @@ -1,66 +0,0 @@ -import * as React from "react"; -import { cva, type VariantProps } from "class-variance-authority@0.7.1"; - -import { cn } from "./utils"; - -const alertVariants = cva( - "relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current", - { - variants: { - variant: { - default: "bg-card text-card-foreground", - destructive: - "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90", - }, - }, - defaultVariants: { - variant: "default", - }, - }, -); - -function Alert({ - className, - variant, - ...props -}: React.ComponentProps<"div"> & VariantProps) { - return ( -
- ); -} - -function AlertTitle({ className, ...props }: React.ComponentProps<"div">) { - return ( -
- ); -} - -function AlertDescription({ - className, - ...props -}: React.ComponentProps<"div">) { - return ( -
- ); -} - -export { Alert, AlertTitle, AlertDescription }; diff --git a/src/components/ui/aspect-ratio.tsx b/src/components/ui/aspect-ratio.tsx deleted file mode 100644 index 2a2f462..0000000 --- a/src/components/ui/aspect-ratio.tsx +++ /dev/null @@ -1,11 +0,0 @@ -"use client"; - -import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio@1.1.2"; - -function AspectRatio({ - ...props -}: React.ComponentProps) { - return ; -} - -export { AspectRatio }; diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx deleted file mode 100644 index 589b166..0000000 --- a/src/components/ui/avatar.tsx +++ /dev/null @@ -1,53 +0,0 @@ -"use client"; - -import * as React from "react"; -import * as AvatarPrimitive from "@radix-ui/react-avatar@1.1.3"; - -import { cn } from "./utils"; - -function Avatar({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AvatarImage({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -function AvatarFallback({ - className, - ...props -}: React.ComponentProps) { - return ( - - ); -} - -export { Avatar, AvatarImage, AvatarFallback }; diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx deleted file mode 100644 index 3f8eff8..0000000 --- a/src/components/ui/badge.tsx +++ /dev/null @@ -1,46 +0,0 @@ -import * as React from "react"; -import { Slot } from "@radix-ui/react-slot@1.1.2"; -import { cva, type VariantProps } from "class-variance-authority@0.7.1"; - -import { cn } from "./utils"; - -const badgeVariants = cva( - "inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden", - { - variants: { - variant: { - default: - "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90", - secondary: - "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90", - destructive: - "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60", - outline: - "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground", - }, - }, - defaultVariants: { - variant: "default", - }, - }, -); - -function Badge({ - className, - variant, - asChild = false, - ...props -}: React.ComponentProps<"span"> & - VariantProps & { asChild?: boolean }) { - const Comp = asChild ? Slot : "span"; - - return ( - - ); -} - -export { Badge, badgeVariants }; diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx deleted file mode 100644 index d2adf98..0000000 --- a/src/components/ui/breadcrumb.tsx +++ /dev/null @@ -1,109 +0,0 @@ -import * as React from "react"; -import { Slot } from "@radix-ui/react-slot@1.1.2"; -import { ChevronRight, MoreHorizontal } from "lucide-react@0.487.0"; - -import { cn } from "./utils"; - -function Breadcrumb({ ...props }: React.ComponentProps<"nav">) { - return