diff --git a/.claude/settings.local.json b/.claude/settings.local.json index 74b3e151c..acacb6934 100644 --- a/.claude/settings.local.json +++ b/.claude/settings.local.json @@ -37,7 +37,10 @@ "Bash(done)", "Bash(eslint:*)", "Bash(bunx eslint:*)", - "Bash(bun test:*)" + "Bash(bun test:*)", + "Bash(136*100/234)", + "Bash(\")", + "Bash(python3:*)" ] } } diff --git a/fakemui/icons/Bell.tsx b/fakemui/icons/Bell.tsx new file mode 100644 index 000000000..e7d57e538 --- /dev/null +++ b/fakemui/icons/Bell.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Bell = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/Calendar.tsx b/fakemui/icons/Calendar.tsx new file mode 100644 index 000000000..740e29a28 --- /dev/null +++ b/fakemui/icons/Calendar.tsx @@ -0,0 +1,11 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Calendar = (props: IconProps) => ( + + + + + + +) diff --git a/fakemui/icons/Check.tsx b/fakemui/icons/Check.tsx new file mode 100644 index 000000000..19a2cf553 --- /dev/null +++ b/fakemui/icons/Check.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Check = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/ChevronDown.tsx b/fakemui/icons/ChevronDown.tsx new file mode 100644 index 000000000..d1f2dbb8b --- /dev/null +++ b/fakemui/icons/ChevronDown.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const ChevronDown = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/ChevronLeft.tsx b/fakemui/icons/ChevronLeft.tsx new file mode 100644 index 000000000..0cb827945 --- /dev/null +++ b/fakemui/icons/ChevronLeft.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const ChevronLeft = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/ChevronRight.tsx b/fakemui/icons/ChevronRight.tsx new file mode 100644 index 000000000..25678910e --- /dev/null +++ b/fakemui/icons/ChevronRight.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const ChevronRight = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/ChevronUp.tsx b/fakemui/icons/ChevronUp.tsx new file mode 100644 index 000000000..1643b04d7 --- /dev/null +++ b/fakemui/icons/ChevronUp.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const ChevronUp = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/Clock.tsx b/fakemui/icons/Clock.tsx new file mode 100644 index 000000000..2270a483d --- /dev/null +++ b/fakemui/icons/Clock.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Clock = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/Eye.tsx b/fakemui/icons/Eye.tsx new file mode 100644 index 000000000..13c1a1eba --- /dev/null +++ b/fakemui/icons/Eye.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Eye = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/EyeSlash.tsx b/fakemui/icons/EyeSlash.tsx new file mode 100644 index 000000000..10587fa96 --- /dev/null +++ b/fakemui/icons/EyeSlash.tsx @@ -0,0 +1,12 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const EyeSlash = (props: IconProps) => ( + + + + + + + +) diff --git a/fakemui/icons/Heart.tsx b/fakemui/icons/Heart.tsx new file mode 100644 index 000000000..3a6bec025 --- /dev/null +++ b/fakemui/icons/Heart.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Heart = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/Mail.tsx b/fakemui/icons/Mail.tsx new file mode 100644 index 000000000..a11b160dd --- /dev/null +++ b/fakemui/icons/Mail.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Mail = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/Menu.tsx b/fakemui/icons/Menu.tsx new file mode 100644 index 000000000..f5e457ec9 --- /dev/null +++ b/fakemui/icons/Menu.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Menu = (props: IconProps) => ( + + + + + +) diff --git a/fakemui/icons/Pencil.tsx b/fakemui/icons/Pencil.tsx new file mode 100644 index 000000000..ebcde9aaf --- /dev/null +++ b/fakemui/icons/Pencil.tsx @@ -0,0 +1,10 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Pencil = (props: IconProps) => ( + + + + + +) diff --git a/fakemui/icons/README.md b/fakemui/icons/README.md index 47e79b527..2534d5c26 100644 --- a/fakemui/icons/README.md +++ b/fakemui/icons/README.md @@ -25,20 +25,44 @@ function MyComponent() { ## Available Icons -Current icon count: **7 icons** +Current icon count: **27 icons** -### Actions +### Actions (5) - `Plus` - Add, create, new - `Trash` - Delete, remove - `Copy` - Duplicate, copy +- `Check` - Confirm, success, done +- `X` - Close, cancel, dismiss -### Navigation +### Navigation (7) - `ArrowUp` - Move up, scroll up - `ArrowDown` - Move down, scroll down - `ArrowClockwise` - Refresh, reload, retry +- `ChevronUp` - Expand up, collapse +- `ChevronDown` - Expand down, show more +- `ChevronLeft` - Previous, back +- `ChevronRight` - Next, forward -### Files +### Files & UI (8) - `FloppyDisk` - Save, export +- `Search` - Find, filter +- `Settings` - Configure, preferences +- `User` - Profile, account +- `Menu` - Hamburger menu, navigation +- `Eye` - View, show, visible +- `EyeSlash` - Hide, hidden, password +- `Pencil` - Edit, modify + +### Communication & Time (4) +- `Calendar` - Date, schedule, events +- `Clock` - Time, duration +- `Mail` - Email, message, contact +- `Bell` - Notifications, alerts + +### Social (3) +- `Star` - Favorite, bookmark, featured +- `Heart` - Like, love, favorite +- `Share` - Share, export, send --- @@ -219,23 +243,23 @@ export const Plus = (props: IconProps) => ( - [x] ArrowClockwise - [x] FloppyDisk -### Phase 2: Common Icons (0/20) 🚧 -- [ ] Check -- [ ] X (Close) -- [ ] ChevronUp/Down/Left/Right (4 icons) -- [ ] Search -- [ ] Settings -- [ ] User -- [ ] Menu -- [ ] Eye/EyeSlash -- [ ] Edit (Pencil) -- [ ] Calendar -- [ ] Clock -- [ ] Mail -- [ ] Bell -- [ ] Star -- [ ] Heart -- [ ] Share +### Phase 2: Common Icons (20/20) ✅ +- [x] Check +- [x] X (Close) +- [x] ChevronUp/Down/Left/Right (4 icons) +- [x] Search +- [x] Settings +- [x] User +- [x] Menu +- [x] Eye/EyeSlash +- [x] Edit (Pencil) +- [x] Calendar +- [x] Clock +- [x] Mail +- [x] Bell +- [x] Star +- [x] Heart +- [x] Share ### Phase 3: Specialized Icons (0/30+) ⏳ Add as needed based on component migration diff --git a/fakemui/icons/Search.tsx b/fakemui/icons/Search.tsx new file mode 100644 index 000000000..24d78ea05 --- /dev/null +++ b/fakemui/icons/Search.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Search = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/Settings.tsx b/fakemui/icons/Settings.tsx new file mode 100644 index 000000000..1483c8307 --- /dev/null +++ b/fakemui/icons/Settings.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Settings = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/Share.tsx b/fakemui/icons/Share.tsx new file mode 100644 index 000000000..04dd45ccf --- /dev/null +++ b/fakemui/icons/Share.tsx @@ -0,0 +1,12 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Share = (props: IconProps) => ( + + + + + + + +) diff --git a/fakemui/icons/Star.tsx b/fakemui/icons/Star.tsx new file mode 100644 index 000000000..be069d433 --- /dev/null +++ b/fakemui/icons/Star.tsx @@ -0,0 +1,8 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const Star = (props: IconProps) => ( + + + +) diff --git a/fakemui/icons/User.tsx b/fakemui/icons/User.tsx new file mode 100644 index 000000000..d5019d6ec --- /dev/null +++ b/fakemui/icons/User.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const User = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/X.tsx b/fakemui/icons/X.tsx new file mode 100644 index 000000000..55c2b85bb --- /dev/null +++ b/fakemui/icons/X.tsx @@ -0,0 +1,9 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const X = (props: IconProps) => ( + + + + +) diff --git a/fakemui/icons/index.ts b/fakemui/icons/index.ts index 61feaffe2..380bb6e4a 100644 --- a/fakemui/icons/index.ts +++ b/fakemui/icons/index.ts @@ -4,11 +4,39 @@ export { Icon } from './Icon' export type { IconProps } from './Icon' -// Common icons +// Actions export { Plus } from './Plus' export { Trash } from './Trash' export { Copy } from './Copy' +export { Check } from './Check' +export { X } from './X' + +// Navigation export { ArrowUp } from './ArrowUp' export { ArrowDown } from './ArrowDown' export { ArrowClockwise } from './ArrowClockwise' +export { ChevronUp } from './ChevronUp' +export { ChevronDown } from './ChevronDown' +export { ChevronLeft } from './ChevronLeft' +export { ChevronRight } from './ChevronRight' + +// Files & UI export { FloppyDisk } from './FloppyDisk' +export { Search } from './Search' +export { Settings } from './Settings' +export { User } from './User' +export { Menu } from './Menu' +export { Eye } from './Eye' +export { EyeSlash } from './EyeSlash' +export { Pencil } from './Pencil' + +// Communication & Time +export { Calendar } from './Calendar' +export { Clock } from './Clock' +export { Mail } from './Mail' +export { Bell } from './Bell' + +// Social +export { Star } from './Star' +export { Heart } from './Heart' +export { Share } from './Share' diff --git a/fakemui/index.ts b/fakemui/index.ts index 48c7397f1..3bf50a35e 100644 --- a/fakemui/index.ts +++ b/fakemui/index.ts @@ -4,13 +4,38 @@ // Icons export { Icon, + // Actions Plus, Trash, Copy, + Check, + X, + // Navigation ArrowUp, ArrowDown, ArrowClockwise, + ChevronUp, + ChevronDown, + ChevronLeft, + ChevronRight, + // Files & UI FloppyDisk, + Search, + Settings, + User, + Menu, + Eye, + EyeSlash, + Pencil, + // Communication & Time + Calendar, + Clock, + Mail, + Bell, + // Social + Star, + Heart, + Share, } from './icons' export type { IconProps } from './icons'