Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughIntroduces a new animated icon component Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
Comment |
Greptile SummaryThis PR adds a new animated brand icon for bag.fm to the icon library. The implementation follows the standard icon pattern with React forwardRef, motion animations, and proper TypeScript typing. All necessary registry files have been updated correctly. Key changes:
Minor style inconsistencies noted:
Confidence Score: 4/5
Important Files Changed
Sequence DiagramsequenceDiagram
participant Dev as Developer
participant Icon as BrandBagsFmIcon
participant Registry as Icon Registry
participant User as User Browser
Dev->>Icon: Create brand-bags-fm-icon.tsx
Note over Icon: Defines animated icon component<br/>with hover animations
Dev->>Registry: Add to icons/index.ts
Note over Registry: Import and register with keywords
Dev->>Registry: Update registry.json files
Note over Registry: Add metadata for<br/>component registry
User->>Icon: Hover on icon
Icon->>Icon: onHoverStart triggers
Icon->>Icon: animate .bag element
Note over Icon: Rotate & translate animation<br/>[0,-8,8,-6,6,-3,3,0]<br/>y: [0,-5,0,-3,0,-2,0]
User->>Icon: Mouse leaves
Icon->>Icon: onHoverEnd triggers
Icon->>Icon: Reset to default position
Note over Icon: rotate: 0, y: 0
|
| viewBox="0 0 1024 1024" | ||
| fill="none" | ||
| stroke={color} |
There was a problem hiding this comment.
style: SVG has conflicting fill/stroke attributes. The root SVG specifies fill="none" and stroke={color}, but the path on line 53 uses fill={color}. This mismatch could cause rendering issues. Should either remove stroke={color} from the SVG or use stroke instead of fill on the path.
| viewBox="0 0 1024 1024" | |
| fill="none" | |
| stroke={color} | |
| viewBox="0 0 1024 1024" | |
| fill={color} | |
| strokeWidth={strokeWidth} |
Prompt To Fix With AI
This is a comment left during a code review.
Path: icons/brand-bags-fm-icon.tsx
Line: 42:44
Comment:
**style:** SVG has conflicting fill/stroke attributes. The root SVG specifies `fill="none"` and `stroke={color}`, but the path on line 53 uses `fill={color}`. This mismatch could cause rendering issues. Should either remove `stroke={color}` from the SVG or use `stroke` instead of `fill` on the path.
```suggestion
viewBox="0 0 1024 1024"
fill={color}
strokeWidth={strokeWidth}
```
How can I resolve this? If you propose a fix, please make it concise.| strokeWidth={strokeWidth} | ||
| strokeLinecap="round" | ||
| strokeLinejoin="round" | ||
| className={`cursor-pointer ${className}`} |
There was a problem hiding this comment.
style: Missing select-none class. Other brand icons like brand-aws-icon.tsx:60 use cursor-pointer select-none to prevent text selection during interaction.
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Prompt To Fix With AI
This is a comment left during a code review.
Path: icons/brand-bags-fm-icon.tsx
Line: 48:48
Comment:
**style:** Missing `select-none` class. Other brand icons like `brand-aws-icon.tsx:60` use `cursor-pointer select-none` to prevent text selection during interaction.
<sub>Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!</sub>
How can I resolve this? If you propose a fix, please make it concise.There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@icons/brand-bags-fm-icon.tsx`:
- Around line 50-55: The motion.g element with className "bag" uses string
percentages for originX/originY which is invalid for Framer Motion; update the
originX and originY props on the motion.g (and any similar icon components) to
numeric values between 0 and 1 (e.g., 50% -> 0.5, 100% -> 1) so transforms use
the documented transform-origin API.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
icons/brand-bags-fm-icon.tsxicons/index.tspublic/r/brand-bags-fm-icon.jsonpublic/r/registry.jsonregistry.json
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Greptile Review
🔇 Additional comments (6)
registry.json (1)
704-720: LGTM!The new registry entry follows the established pattern for other icons in this auto-generated file. The structure correctly declares
motionas a dependency and includes both the icon component and types files.public/r/registry.json (1)
704-720: LGTM!Entry correctly added to the public registry following the established pattern.
icons/brand-bags-fm-icon.tsx (1)
1-32: LGTM - Component structure and animation logic.The component correctly implements the
AnimatedIconHandleinterface viauseImperativeHandle, properly usesuseAnimatefor scoped animations, and follows the established pattern for animated icons in this project.public/r/brand-bags-fm-icon.json (1)
1-20: LGTM!Registry item JSON is correctly structured with embedded source code for both the icon component and types file. Dependencies are properly declared.
icons/index.ts (2)
47-47: LGTM!Import follows the established naming convention and placement pattern.
1421-1425: LGTM!The ICON_LIST entry follows the established pattern with appropriate keywords for discoverability.
✏️ Tip: You can disable this entire section by setting review_details to false in your review settings.
| <motion.g className="bag" style={{ originX: "50%", originY: "100%" }}> | ||
| <motion.path | ||
| d="M 561.64 1018.00 C541.03,1019.15 482.25,1019.09 461.00,1017.88 C428.17,1016.02 384.57,1010.43 359.50,1004.88 C276.24,986.43 221.60,959.81 176.15,915.53 C130.14,870.72 104.87,814.62 98.92,744.08 C97.58,728.12 98.21,685.69 99.98,673.00 C100.56,668.88 101.74,660.33 102.61,654.00 C112.42,582.33 148.13,492.03 190.38,432.09 C218.55,392.11 255.44,354.21 296.61,322.93 C307.25,314.85 311.79,313.00 321.00,313.00 C329.04,313.00 333.32,314.38 342.31,319.88 C359.36,330.32 385.72,341.87 407.76,348.57 C432.77,356.17 453.66,360.10 482.00,362.55 C553.43,368.72 624.89,353.61 682.14,320.22 C693.80,313.42 696.44,312.53 705.00,312.57 C714.85,312.61 718.38,314.30 734.00,326.45 C797.73,376.03 845.64,435.94 877.67,506.14 C903.33,562.37 919.23,617.23 925.67,671.74 C928.13,692.55 928.10,740.24 925.61,758.50 C921.88,785.96 914.99,811.78 905.35,834.43 C891.92,866.01 874.02,892.03 848.86,916.54 C835.25,929.80 824.91,938.14 809.00,948.70 C748.01,989.18 666.12,1012.12 561.64,1018.00 ZM 536.19 826.97 C540.81,825.68 545.00,820.86 545.00,816.82 C545.00,812.50 547.56,807.69 550.92,805.71 C553.43,804.22 557.01,804.00 578.26,804.00 C615.47,804.00 633.30,802.14 651.41,796.38 C673.82,789.25 686.65,776.74 691.55,757.22 C692.87,752.00 693.07,745.89 692.76,721.22 C692.35,689.59 691.82,685.50 686.70,675.01 C681.23,663.80 665.70,653.24 646.15,647.43 C641.39,646.02 631.88,643.14 625.00,641.03 C606.42,635.34 582.75,628.19 572.00,625.02 C547.05,617.65 508.45,605.77 504.70,604.29 C498.82,601.98 493.27,598.38 492.04,596.08 C491.47,595.01 491.00,592.36 491.00,590.20 C491.00,582.30 497.66,577.84 509.50,577.82 C522.74,577.81 528.73,582.58 530.47,594.50 C530.87,597.25 531.71,599.83 532.35,600.23 C532.98,600.64 563.97,600.98 601.21,600.98 C666.27,601.00 669.13,600.92 674.21,599.02 C681.74,596.20 686.42,591.92 690.06,584.53 C693.16,578.23 693.20,577.94 692.85,565.76 C692.51,553.79 692.38,553.15 688.72,545.75 C683.93,536.06 676.81,529.50 664.50,523.44 C645.31,513.99 626.50,511.02 585.20,510.94 C565.67,510.91 555.41,510.51 553.09,509.69 C548.74,508.17 546.24,504.73 545.14,498.78 C544.01,492.65 541.66,489.17 537.45,487.42 C532.52,485.36 487.43,485.38 482.49,487.44 C478.47,489.12 475.01,494.22 475.00,498.50 C474.99,502.15 471.94,507.40 468.80,509.17 C467.11,510.13 457.40,510.64 432.00,511.12 C406.48,511.60 395.22,512.20 388.74,513.42 C358.34,519.14 340.06,529.78 331.91,546.50 L 328.50 553.50 L 328.19 578.78 C327.93,599.97 328.14,604.97 329.53,609.74 C335.16,629.13 346.66,638.38 379.50,649.96 C384.45,651.71 390.75,653.74 393.50,654.47 C396.25,655.20 408.85,658.81 421.50,662.49 C449.39,670.59 469.49,676.41 494.00,683.46 C524.12,692.13 528.85,695.08 531.01,706.53 C531.93,711.45 531.93,714.46 531.00,719.97 C529.70,727.74 527.09,731.84 521.63,734.73 C517.07,737.14 505.64,737.00 500.56,734.46 C494.61,731.49 493.04,728.63 492.03,718.81 C490.65,705.44 486.14,698.82 476.50,696.04 C473.62,695.21 455.29,694.97 411.00,695.19 L 349.50 695.50 L 344.64 697.89 C338.22,701.06 333.29,706.13 330.30,712.66 C327.92,717.87 327.87,718.49 328.18,739.30 L 328.50 760.61 L 332.27 768.24 C342.28,788.48 366.04,799.76 405.50,802.99 C412.10,803.53 428.38,803.98 441.68,803.98 C454.99,803.99 467.02,804.44 468.43,804.98 C471.68,806.21 474.99,811.57 475.00,815.60 C475.00,819.92 478.87,825.26 483.03,826.69 C487.42,828.20 530.93,828.43 536.19,826.97 ZM 538.50 289.97 C496.13,293.54 448.71,287.35 418.42,274.29 C400.92,266.74 395.55,263.15 374.23,244.71 C335.15,210.90 308.78,179.14 298.10,153.00 C294.86,145.06 294.63,143.75 294.57,133.00 C294.51,122.90 294.78,120.98 296.76,117.28 C300.36,110.53 304.53,106.44 318.44,96.01 C343.30,77.37 350.32,70.84 389.50,29.94 C408.14,10.48 415.56,6.96 439.53,6.23 C452.01,5.85 456.43,6.13 465.56,7.87 C476.52,9.97 479.33,10.84 509.50,21.49 C533.06,29.80 540.92,31.28 562.00,31.37 C573.44,31.41 582.10,30.94 587.00,29.99 C597.54,27.96 620.67,28.11 628.72,30.27 C635.91,32.20 646.41,37.33 653.28,42.26 C655.91,44.15 665.14,52.63 673.79,61.10 C693.45,80.36 701.04,86.89 714.89,96.47 C726.70,104.63 730.32,108.22 733.07,114.50 C744.54,140.60 718.47,183.79 657.88,239.05 C629.95,264.53 617.87,271.89 589.75,280.53 C576.65,284.56 554.66,288.61 538.50,289.97 Z" | ||
| fill={color} | ||
| /> | ||
| </motion.g> |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check how other icons in the project set transform origins
rg -n "originX|originY" --type=tsx -C2Repository: itshover/itshover
Length of output: 88
🏁 Script executed:
#!/bin/bash
# Search for originX/originY usage in all files
rg -n "originX|originY" -C2Repository: itshover/itshover
Length of output: 26659
🌐 Web query:
Framer Motion originX originY API documentation string percentage
💡 Result:
Short answer: originX/originY expect numbers (interpreted as a progress value 0 → 1) or MotionValues; they are not documented as taking percentage strings like "50%". If you need percentage CSS form, set transformOrigin in style (e.g. style={{ transformOrigin: "50% 50%" }}). [1][2]
Sources:
- Framer/Motion docs: transform-origin — numbers are treated as progress between 0 and 1. [1]
- stylefire / Popmotion note: originX/originY set as numbers become progress (originZ uses px). [2]
🏁 Script executed:
#!/bin/bash
# Count how many files have the same pattern
rg -c "originX.*%|originY.*%" --type-list | head -5
# Show all files with this pattern
rg -l "originX.*%"Repository: itshover/itshover
Length of output: 737
Use numeric values for originX/originY instead of string percentages.
Framer Motion's originX and originY properties expect numeric values between 0 and 1 (where 0.5 = 50%, 1 = 100%), not string percentages. The current format originX: "50%" and originY: "100%" diverges from the documented API and may cause unexpected behavior. Use numeric values to ensure correct transform-origin behavior.
♻️ Suggested fix
- <motion.g className="bag" style={{ originX: "50%", originY: "100%" }}>
+ <motion.g className="bag" style={{ originX: 0.5, originY: 1 }}>Note: This pattern appears in multiple icon files across the codebase and should be addressed consistently.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <motion.g className="bag" style={{ originX: "50%", originY: "100%" }}> | |
| <motion.path | |
| d="M 561.64 1018.00 C541.03,1019.15 482.25,1019.09 461.00,1017.88 C428.17,1016.02 384.57,1010.43 359.50,1004.88 C276.24,986.43 221.60,959.81 176.15,915.53 C130.14,870.72 104.87,814.62 98.92,744.08 C97.58,728.12 98.21,685.69 99.98,673.00 C100.56,668.88 101.74,660.33 102.61,654.00 C112.42,582.33 148.13,492.03 190.38,432.09 C218.55,392.11 255.44,354.21 296.61,322.93 C307.25,314.85 311.79,313.00 321.00,313.00 C329.04,313.00 333.32,314.38 342.31,319.88 C359.36,330.32 385.72,341.87 407.76,348.57 C432.77,356.17 453.66,360.10 482.00,362.55 C553.43,368.72 624.89,353.61 682.14,320.22 C693.80,313.42 696.44,312.53 705.00,312.57 C714.85,312.61 718.38,314.30 734.00,326.45 C797.73,376.03 845.64,435.94 877.67,506.14 C903.33,562.37 919.23,617.23 925.67,671.74 C928.13,692.55 928.10,740.24 925.61,758.50 C921.88,785.96 914.99,811.78 905.35,834.43 C891.92,866.01 874.02,892.03 848.86,916.54 C835.25,929.80 824.91,938.14 809.00,948.70 C748.01,989.18 666.12,1012.12 561.64,1018.00 ZM 536.19 826.97 C540.81,825.68 545.00,820.86 545.00,816.82 C545.00,812.50 547.56,807.69 550.92,805.71 C553.43,804.22 557.01,804.00 578.26,804.00 C615.47,804.00 633.30,802.14 651.41,796.38 C673.82,789.25 686.65,776.74 691.55,757.22 C692.87,752.00 693.07,745.89 692.76,721.22 C692.35,689.59 691.82,685.50 686.70,675.01 C681.23,663.80 665.70,653.24 646.15,647.43 C641.39,646.02 631.88,643.14 625.00,641.03 C606.42,635.34 582.75,628.19 572.00,625.02 C547.05,617.65 508.45,605.77 504.70,604.29 C498.82,601.98 493.27,598.38 492.04,596.08 C491.47,595.01 491.00,592.36 491.00,590.20 C491.00,582.30 497.66,577.84 509.50,577.82 C522.74,577.81 528.73,582.58 530.47,594.50 C530.87,597.25 531.71,599.83 532.35,600.23 C532.98,600.64 563.97,600.98 601.21,600.98 C666.27,601.00 669.13,600.92 674.21,599.02 C681.74,596.20 686.42,591.92 690.06,584.53 C693.16,578.23 693.20,577.94 692.85,565.76 C692.51,553.79 692.38,553.15 688.72,545.75 C683.93,536.06 676.81,529.50 664.50,523.44 C645.31,513.99 626.50,511.02 585.20,510.94 C565.67,510.91 555.41,510.51 553.09,509.69 C548.74,508.17 546.24,504.73 545.14,498.78 C544.01,492.65 541.66,489.17 537.45,487.42 C532.52,485.36 487.43,485.38 482.49,487.44 C478.47,489.12 475.01,494.22 475.00,498.50 C474.99,502.15 471.94,507.40 468.80,509.17 C467.11,510.13 457.40,510.64 432.00,511.12 C406.48,511.60 395.22,512.20 388.74,513.42 C358.34,519.14 340.06,529.78 331.91,546.50 L 328.50 553.50 L 328.19 578.78 C327.93,599.97 328.14,604.97 329.53,609.74 C335.16,629.13 346.66,638.38 379.50,649.96 C384.45,651.71 390.75,653.74 393.50,654.47 C396.25,655.20 408.85,658.81 421.50,662.49 C449.39,670.59 469.49,676.41 494.00,683.46 C524.12,692.13 528.85,695.08 531.01,706.53 C531.93,711.45 531.93,714.46 531.00,719.97 C529.70,727.74 527.09,731.84 521.63,734.73 C517.07,737.14 505.64,737.00 500.56,734.46 C494.61,731.49 493.04,728.63 492.03,718.81 C490.65,705.44 486.14,698.82 476.50,696.04 C473.62,695.21 455.29,694.97 411.00,695.19 L 349.50 695.50 L 344.64 697.89 C338.22,701.06 333.29,706.13 330.30,712.66 C327.92,717.87 327.87,718.49 328.18,739.30 L 328.50 760.61 L 332.27 768.24 C342.28,788.48 366.04,799.76 405.50,802.99 C412.10,803.53 428.38,803.98 441.68,803.98 C454.99,803.99 467.02,804.44 468.43,804.98 C471.68,806.21 474.99,811.57 475.00,815.60 C475.00,819.92 478.87,825.26 483.03,826.69 C487.42,828.20 530.93,828.43 536.19,826.97 ZM 538.50 289.97 C496.13,293.54 448.71,287.35 418.42,274.29 C400.92,266.74 395.55,263.15 374.23,244.71 C335.15,210.90 308.78,179.14 298.10,153.00 C294.86,145.06 294.63,143.75 294.57,133.00 C294.51,122.90 294.78,120.98 296.76,117.28 C300.36,110.53 304.53,106.44 318.44,96.01 C343.30,77.37 350.32,70.84 389.50,29.94 C408.14,10.48 415.56,6.96 439.53,6.23 C452.01,5.85 456.43,6.13 465.56,7.87 C476.52,9.97 479.33,10.84 509.50,21.49 C533.06,29.80 540.92,31.28 562.00,31.37 C573.44,31.41 582.10,30.94 587.00,29.99 C597.54,27.96 620.67,28.11 628.72,30.27 C635.91,32.20 646.41,37.33 653.28,42.26 C655.91,44.15 665.14,52.63 673.79,61.10 C693.45,80.36 701.04,86.89 714.89,96.47 C726.70,104.63 730.32,108.22 733.07,114.50 C744.54,140.60 718.47,183.79 657.88,239.05 C629.95,264.53 617.87,271.89 589.75,280.53 C576.65,284.56 554.66,288.61 538.50,289.97 Z" | |
| fill={color} | |
| /> | |
| </motion.g> | |
| <motion.g className="bag" style={{ originX: 0.5, originY: 1 }}> | |
| <motion.path | |
| d="M 561.64 1018.00 C541.03,1019.15 482.25,1019.09 461.00,1017.88 C428.17,1016.02 384.57,1010.43 359.50,1004.88 C276.24,986.43 221.60,959.81 176.15,915.53 C130.14,870.72 104.87,814.62 98.92,744.08 C97.58,728.12 98.21,685.69 99.98,673.00 C100.56,668.88 101.74,660.33 102.61,654.00 C112.42,582.33 148.13,492.03 190.38,432.09 C218.55,392.11 255.44,354.21 296.61,322.93 C307.25,314.85 311.79,313.00 321.00,313.00 C329.04,313.00 333.32,314.38 342.31,319.88 C359.36,330.32 385.72,341.87 407.76,348.57 C432.77,356.17 453.66,360.10 482.00,362.55 C553.43,368.72 624.89,353.61 682.14,320.22 C693.80,313.42 696.44,312.53 705.00,312.57 C714.85,312.61 718.38,314.30 734.00,326.45 C797.73,376.03 845.64,435.94 877.67,506.14 C903.33,562.37 919.23,617.23 925.67,671.74 C928.13,692.55 928.10,740.24 925.61,758.50 C921.88,785.96 914.99,811.78 905.35,834.43 C891.92,866.01 874.02,892.03 848.86,916.54 C835.25,929.80 824.91,938.14 809.00,948.70 C748.01,989.18 666.12,1012.12 561.64,1018.00 ZM 536.19 826.97 C540.81,825.68 545.00,820.86 545.00,816.82 C545.00,812.50 547.56,807.69 550.92,805.71 C553.43,804.22 557.01,804.00 578.26,804.00 C615.47,804.00 633.30,802.14 651.41,796.38 C673.82,789.25 686.65,776.74 691.55,757.22 C692.87,752.00 693.07,745.89 692.76,721.22 C692.35,689.59 691.82,685.50 686.70,675.01 C681.23,663.80 665.70,653.24 646.15,647.43 C641.39,646.02 631.88,643.14 625.00,641.03 C606.42,635.34 582.75,628.19 572.00,625.02 C547.05,617.65 508.45,605.77 504.70,604.29 C498.82,601.98 493.27,598.38 492.04,596.08 C491.47,595.01 491.00,592.36 491.00,590.20 C491.00,582.30 497.66,577.84 509.50,577.82 C522.74,577.81 528.73,582.58 530.47,594.50 C530.87,597.25 531.71,599.83 532.35,600.23 C532.98,600.64 563.97,600.98 601.21,600.98 C666.27,601.00 669.13,600.92 674.21,599.02 C681.74,596.20 686.42,591.92 690.06,584.53 C693.16,578.23 693.20,577.94 692.85,565.76 C692.51,553.79 692.38,553.15 688.72,545.75 C683.93,536.06 676.81,529.50 664.50,523.44 C645.31,513.99 626.50,511.02 585.20,510.94 C565.67,510.91 555.41,510.51 553.09,509.69 C548.74,508.17 546.24,504.73 545.14,498.78 C544.01,492.65 541.66,489.17 537.45,487.42 C532.52,485.36 487.43,485.38 482.49,487.44 C478.47,489.12 475.01,494.22 475.00,498.50 C474.99,502.15 471.94,507.40 468.80,509.17 C467.11,510.13 457.40,510.64 432.00,511.12 C406.48,511.60 395.22,512.20 388.74,513.42 C358.34,519.14 340.06,529.78 331.91,546.50 L 328.50 553.50 L 328.19 578.78 C327.93,599.97 328.14,604.97 329.53,609.74 C335.16,629.13 346.66,638.38 379.50,649.96 C384.45,651.71 390.75,653.74 393.50,654.47 C396.25,655.20 408.85,658.81 421.50,662.49 C449.39,670.59 469.49,676.41 494.00,683.46 C524.12,692.13 528.85,695.08 531.01,706.53 C531.93,711.45 531.93,714.46 531.00,719.97 C529.70,727.74 527.09,731.84 521.63,734.73 C517.07,737.14 505.64,737.00 500.56,734.46 C494.61,731.49 493.04,728.63 492.03,718.81 C490.65,705.44 486.14,698.82 476.50,696.04 C473.62,695.21 455.29,694.97 411.00,695.19 L 349.50 695.50 L 344.64 697.89 C338.22,701.06 333.29,706.13 330.30,712.66 C327.92,717.87 327.87,718.49 328.18,739.30 L 328.50 760.61 L 332.27 768.24 C342.28,788.48 366.04,799.76 405.50,802.99 C412.10,803.53 428.38,803.98 441.68,803.98 C454.99,803.99 467.02,804.44 468.43,804.98 C471.68,806.21 474.99,811.57 475.00,815.60 C475.00,819.92 478.87,825.26 483.03,826.69 C487.42,828.20 530.93,828.43 536.19,826.97 ZM 538.50 289.97 C496.13,293.54 448.71,287.35 418.42,274.29 C400.92,266.74 395.55,263.15 374.23,244.71 C335.15,210.90 308.78,179.14 298.10,153.00 C294.86,145.06 294.63,143.75 294.57,133.00 C294.51,122.90 294.78,120.98 296.76,117.28 C300.36,110.53 304.53,106.44 318.44,96.01 C343.30,77.37 350.32,70.84 389.50,29.94 C408.14,10.48 415.56,6.96 439.53,6.23 C452.01,5.85 456.43,6.13 465.56,7.87 C476.52,9.97 479.33,10.84 509.50,21.49 C533.06,29.80 540.92,31.28 562.00,31.37 C573.44,31.41 582.10,30.94 587.00,29.99 C597.54,27.96 620.67,28.11 628.72,30.27 C635.91,32.20 646.41,37.33 653.28,42.26 C655.91,44.15 665.14,52.63 673.79,61.10 C693.45,80.36 701.04,86.89 714.89,96.47 C726.70,104.63 730.32,108.22 733.07,114.50 C744.54,140.60 718.47,183.79 657.88,239.05 C629.95,264.53 617.87,271.89 589.75,280.53 C576.65,284.56 554.66,288.61 538.50,289.97 Z" | |
| fill={color} | |
| /> | |
| </motion.g> |
🤖 Prompt for AI Agents
In `@icons/brand-bags-fm-icon.tsx` around lines 50 - 55, The motion.g element with
className "bag" uses string percentages for originX/originY which is invalid for
Framer Motion; update the originX and originY props on the motion.g (and any
similar icon components) to numeric values between 0 and 1 (e.g., 50% -> 0.5,
100% -> 1) so transforms use the documented transform-origin API.
Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.