tpmjs/packages/ui/package.json
Ajax Davis 5e92ae49a3 feat: implement revolutionary dithered landing page with Bayer matrix animation
Core Dithering System:
- Add Bayer matrix 8×8/4×4 ordered dithering algorithm
- Implement DitherEngine with canvas-based text rendering
- Create reveal (one-shot) and pulse (continuous) animation modes
- Add SSR safety checks for Next.js server-side rendering

New UI Components:
- DitherCanvas: Base component with RAF-based animation
- DitherHeadline: Multi-line staggered reveal for hero text
- DitherSectionHeader: Pulsing section headers
- FlowDiagram: Animated SVG showing agent→registry→tools flow
- ActivityStream: Live ticker with mock tool activity

Accessibility Features:
- useReducedMotion hook for prefers-reduced-motion support
- Screen reader compatibility with aria-labels
- Fallback to static rendering when animations disabled

Homepage Redesign:
- Replace generic sections with narrative storytelling
- Add ProblemSection: Fragmented chaos design (before tpmjs)
- Add VisionSection: Dynamic ecosystem visualization (after tpmjs)
- Redesign EcosystemStats with dithered counters and live activity
- Add DeveloperStories: Code-first testimonials
- Update HeroSection with dithered headline and blueprint scanline

Visual Design:
- Minimalist + Blueprint technical aesthetic
- Animated scanline background effect
- Grid patterns with subtle opacity
- Brutalist typography and hard edges

Technical Implementation:
- Export new components in UI package.json
- Add components to tsup.config.ts entry points
- SSR-safe canvas operations with environment checks
- Performance optimizations: frame caching, mobile detection

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-27 22:44:32 +10:00

177 lines
5.5 KiB
JSON

{
"name": "@tpmjs/ui",
"version": "0.1.3",
"type": "module",
"exports": {
"./Button/Button": {
"types": "./dist/Button/Button.d.ts",
"default": "./dist/Button/Button.js"
},
"./Card/Card": {
"types": "./dist/Card/Card.d.ts",
"default": "./dist/Card/Card.js"
},
"./Input/Input": {
"types": "./dist/Input/Input.d.ts",
"default": "./dist/Input/Input.js"
},
"./Label/Label": {
"types": "./dist/Label/Label.d.ts",
"default": "./dist/Label/Label.js"
},
"./Badge/Badge": {
"types": "./dist/Badge/Badge.d.ts",
"default": "./dist/Badge/Badge.js"
},
"./Container/Container": {
"types": "./dist/Container/Container.d.ts",
"default": "./dist/Container/Container.js"
},
"./Icon/Icon": {
"types": "./dist/Icon/Icon.d.ts",
"default": "./dist/Icon/Icon.js"
},
"./ProgressBar/ProgressBar": {
"types": "./dist/ProgressBar/ProgressBar.d.ts",
"default": "./dist/ProgressBar/ProgressBar.js"
},
"./CodeBlock/CodeBlock": {
"types": "./dist/CodeBlock/CodeBlock.d.ts",
"default": "./dist/CodeBlock/CodeBlock.js"
},
"./Tabs/Tabs": {
"types": "./dist/Tabs/Tabs.d.ts",
"default": "./dist/Tabs/Tabs.js"
},
"./Header/Header": {
"types": "./dist/Header/Header.d.ts",
"default": "./dist/Header/Header.js"
},
"./Section/Section": {
"types": "./dist/Section/Section.d.ts",
"default": "./dist/Section/Section.js"
},
"./GridContainer/GridContainer": {
"types": "./dist/GridContainer/GridContainer.d.ts",
"default": "./dist/GridContainer/GridContainer.js"
},
"./Textarea/Textarea": {
"types": "./dist/Textarea/Textarea.d.ts",
"default": "./dist/Textarea/Textarea.js"
},
"./Checkbox/Checkbox": {
"types": "./dist/Checkbox/Checkbox.d.ts",
"default": "./dist/Checkbox/Checkbox.js"
},
"./Radio/Radio": {
"types": "./dist/Radio/Radio.d.ts",
"default": "./dist/Radio/Radio.js"
},
"./Radio/RadioGroup": {
"types": "./dist/Radio/RadioGroup.d.ts",
"default": "./dist/Radio/RadioGroup.js"
},
"./Switch/Switch": {
"types": "./dist/Switch/Switch.d.ts",
"default": "./dist/Switch/Switch.js"
},
"./Select/Select": {
"types": "./dist/Select/Select.d.ts",
"default": "./dist/Select/Select.js"
},
"./Slider/Slider": {
"types": "./dist/Slider/Slider.d.ts",
"default": "./dist/Slider/Slider.js"
},
"./FormField/FormField": {
"types": "./dist/FormField/FormField.d.ts",
"default": "./dist/FormField/FormField.js"
},
"./AnimatedCounter/AnimatedCounter": {
"types": "./dist/AnimatedCounter/AnimatedCounter.d.ts",
"default": "./dist/AnimatedCounter/AnimatedCounter.js"
},
"./StatCard/StatCard": {
"types": "./dist/StatCard/StatCard.d.ts",
"default": "./dist/StatCard/StatCard.js"
},
"./system/hooks/useScrollReveal": {
"types": "./dist/system/hooks/useScrollReveal.d.ts",
"default": "./dist/system/hooks/useScrollReveal.js"
},
"./system/hooks/useCountUp": {
"types": "./dist/system/hooks/useCountUp.d.ts",
"default": "./dist/system/hooks/useCountUp.js"
},
"./system/hooks/useParallax": {
"types": "./dist/system/hooks/useParallax.d.ts",
"default": "./dist/system/hooks/useParallax.js"
},
"./system/hooks/useReducedMotion": {
"types": "./dist/system/hooks/useReducedMotion.d.ts",
"default": "./dist/system/hooks/useReducedMotion.js"
},
"./system/hooks/useDitherAnimation": {
"types": "./dist/system/hooks/useDitherAnimation.d.ts",
"default": "./dist/system/hooks/useDitherAnimation.js"
},
"./DitherCanvas/DitherCanvas": {
"types": "./dist/DitherCanvas/DitherCanvas.d.ts",
"default": "./dist/DitherCanvas/DitherCanvas.js"
},
"./DitherText/DitherHeadline": {
"types": "./dist/DitherText/DitherHeadline.d.ts",
"default": "./dist/DitherText/DitherHeadline.js"
},
"./DitherText/DitherSectionHeader": {
"types": "./dist/DitherText/DitherSectionHeader.d.ts",
"default": "./dist/DitherText/DitherSectionHeader.js"
},
"./FlowDiagram/FlowDiagram": {
"types": "./dist/FlowDiagram/FlowDiagram.d.ts",
"default": "./dist/FlowDiagram/FlowDiagram.js"
},
"./ActivityStream/ActivityStream": {
"types": "./dist/ActivityStream/ActivityStream.d.ts",
"default": "./dist/ActivityStream/ActivityStream.js"
}
},
"files": ["dist"],
"scripts": {
"build": "NODE_OPTIONS='--max-old-space-size=4096' tsup",
"dev": "tsup --watch",
"test": "vitest run",
"test:ui": "vitest --ui",
"type-check": "tsc --noEmit",
"lint": "eslint .",
"clean": "rm -rf dist .turbo"
},
"peerDependencies": {
"react": "^18.0.0 || ^19.0.0",
"react-dom": "^18.0.0 || ^19.0.0"
},
"dependencies": {
"@tpmjs/utils": "workspace:*"
},
"devDependencies": {
"@testing-library/jest-dom": "^6.9.1",
"@testing-library/react": "^16.3.0",
"@testing-library/user-event": "^14.6.1",
"@tpmjs/eslint-config": "workspace:*",
"@tpmjs/test": "workspace:*",
"@tpmjs/tsconfig": "workspace:*",
"@types/react": "^19.0.2",
"@types/react-dom": "^19.0.2",
"eslint": "^9.39.1",
"glob": "^13.0.0",
"happy-dom": "^15.11.7",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"tsup": "^8.3.5",
"typescript": "^5.9.3",
"vitest": "^2.1.8"
},
"publishConfig": {
"access": "public"
}
}