feat/shared svg icons#2
Merged
cjpillsbury merged 2 commits intomainfrom Aug 13, 2025
Merged
Conversation
- Create centralized SVG files in core icons package assets directory - Add rollup-plugin-string to core icons for SVG file processing - Export SVG_ICONS object from core package for cross-package sharing - Refactor html-icons to import SVG strings from @vjs-10/icons - Remove hardcoded SVG strings in favor of shared definitions - Add TypeScript declarations for SVG imports This establishes a foundation for sharing more code across the monorepo while maintaining proper package boundaries and build system integration. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
…tyling support Replace manually-coded React icon components with SVGR-generated ones from shared SVG assets. This establishes a maintainable, single-source-of-truth system for icons across the monorepo. ## Key Changes ### ✨ SVGR Integration - Add @svgr/cli with custom configuration for React component generation - Generate components from packages/core/icons/assets/ SVG files - Implement custom templates with generation warnings and JSDoc @generated tags - Replace manual src/icons/ with auto-generated src/generated-icons/ ### 🎨 Complete Styling Support - Add fill="currentColor" to all SVG source files in core package - Configure replaceAttrValues to transform currentColor → {color} in React components - Restore full color prop functionality (fill={color} on path elements) - Maintain backwards compatibility with existing IconProps interface ### 📚 Developer Experience - Add comprehensive README.md with usage examples and development workflow - Include clear "DO NOT EDIT" warnings in all generated files - Add .gitignore to exclude generated files from version control - Provide detailed generation instructions and architecture explanation ### 🏗️ Build System Integration - Update package.json scripts: npm run generate creates React components - Integrate generation into build pipeline (npm run build runs generate first) - Add SVGR dependencies: @svgr/cli, plugins, and babel-plugin-add-jsx-attribute - Maintain existing rollup + TypeScript build chain ## Technical Implementation - **Source**: SVG files in packages/core/icons/assets/ (single source of truth) - **Generator**: SVGR v8 with custom TypeScript React templates - **Output**: Auto-generated components in src/generated-icons/ with full JSDoc - **Styling**: fill={color} props + currentColor inheritance for dynamic theming - **Types**: Preserved IconProps interface with SVGAttributes<SVGElement> + color prop ## Verification ✅ Playwright testing confirms icons render correctly with proper colors ✅ All 5 icons (Play, Pause, VolumeHigh, VolumeLow, VolumeOff) generate successfully ✅ Color prop functionality verified (fill attribute updates dynamically) ✅ Build system integration working across full monorepo ✅ Backwards compatibility maintained with existing components This implementation provides automatic React component generation while maintaining full feature parity with the original manually-coded icons. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
decepulis
added a commit
that referenced
this pull request
Apr 15, 2026
Replace the static og-default.png with per-page OG images generated at build time via satori + @resvg/resvg-js. Each page gets two variants: 1200×630 (og:image) and 1200×600 (twitter:image). Design: dark background (#1e1d1d), SVGO-optimised Video.js mono logo (800px wide), page title in uppercase Eurostile LT Pro Bold Extended #2, and the site's colour bars (118px) at the bottom. - Add Astro endpoint at src/pages/og/[...path].png.ts with prerender=true - Add rendering utility at src/utils/og/render-og-image.tsx - Update Base.astro to auto-derive OG/Twitter image URLs from pathname - Add ogTitle optional frontmatter field to blog and docs schemas - Remove generate-og-default.mjs script and static og-default.png - Clean up videojs-mono.svg with SVGO - Document ogTitle in write-guides.mdx, site/CLAUDE.md, and skills Closes #1294 (Phase 2)
luwes
added a commit
that referenced
this pull request
Apr 22, 2026
Split the rationale into two sections — one for the preset split, one for the live-only skin — and lead each with its actual driver. - Split rationale: filesize. VOD is the dominant case; every byte the shared preset carries for live is paid by VOD-only apps that don't use it. Enumerates what a shared preset forces onto the VOD bundle (streamType slice, live UI tree, branching logic). - Live-only rationale: smaller live bundle — no time slider, thumbnail previews, seek buttons, or remaining-time display. A dual-mode skin can't ship smaller, only differently shaped. - Drop playbackRateFeature from liveVideoFeatures / liveAudioFeatures; speed controls aren't meaningful for live. - Add a note that no live-specific timeFeature is needed — duration already resolves to seekable.end(last) for live. - Flag textTrackFeature as the clearest follow-up feature split (captions vs chapters vs thumbnails) in Open Question #2. - Tighten Context and cut AI-verbosity throughout. Addresses review feedback from @heff on #1395. Made-with: Cursor
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.