Update npm packages

Add --dump-dimensions option to rsx:debug for layout debugging
Mark framework publish

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
root
2025-12-03 21:48:28 +00:00
parent cff287e870
commit 8d92b287be
1226 changed files with 16280 additions and 19461 deletions

View File

@@ -140,6 +140,31 @@ SCREENSHOTS
--screenshot-width=1024 --screenshot-path=/tmp/custom.png
# Custom 1024px width
LAYOUT DEBUGGING
--dump-dimensions=<selector>
Add data-dimensions attribute to all elements matching the CSS selector.
The attribute contains JSON with layout information (all values rounded
to nearest pixel):
- x, y: Absolute position on page
- w, h: Element width and height
- margin: Single value if uniform, or "top right bottom left" notation
- padding: Single value if uniform, or "top right bottom left" notation
Example output in DOM:
data-dimensions='{"x":0,"y":60,"w":250,"h":800,"margin":0,"padding":"20 15 20 15"}'
Examples:
--dump-dimensions=".card"
# Add dimensions to all .card elements
--dump-dimensions=".sidebar,.main-content"
# Multiple selectors
Use with --dump-element to see the annotated HTML, or without --no-body
to see the full page DOM with dimensions embedded.
JAVASCRIPT EVALUATION
--eval=<code>
@@ -224,6 +249,10 @@ Capture mobile and desktop screenshots:
php artisan rsx:debug /page --screenshot-width=mobile --screenshot-path=/tmp/mobile.png
php artisan rsx:debug /page --screenshot-width=desktop-large --screenshot-path=/tmp/desktop.png
Debug layout issues by inspecting element dimensions:
php artisan rsx:debug /page --dump-dimensions=".card,.sidebar" --dump-element=".main"
# Shows .main HTML with data-dimensions on matching elements
IMPORTANT NOTES
• When using rsx:debug with grep and no output appears, re-run without grep