feat: add clientWidth/clientHeight for createElementSize

[ylc395]

add extra clientWidth/clientHeight for createElementSize.

If this proposal is acceptable, we can keep on going, otherwise just close PR.

Summary by CodeRabbit

• New Features
  • Element size measurements now include clientWidth and clientHeight alongside width and height.
  • Resize observer size results expose the expanded set of dimensions.
• Bug Fixes
  • When element size is unavailable, size results consistently return width, height, clientWidth, and clientHeight as null.
• Chores
  • Updated the package version and release notes to reflect the new size fields.

[changeset-bot]

🦋 Changeset detected

Latest commit: 636b436

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@solid-primitives/resize-observer	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: d124284c-8f7e-401d-853c-cf51e36ab8b1

📥 Commits

Reviewing files that changed from the base of the PR and between e87ecf8 and 636b436.

📒 Files selected for processing (1)

• .changeset/dull-colts-sip.md

✅ Files skipped from review due to trivial changes (1)

• .changeset/dull-colts-sip.md

---

📝 Walkthrough

Walkthrough

This PR extends the @solid-primitives/resize-observer element size shape to include clientWidth and clientHeight alongside width and height. The type definitions, runtime fallback and measurement logic, tests, and changeset metadata were updated.

Changes

Client dimensions support

Layer / File(s)	Summary
Type definitions for client dimensions packages/resize-observer/src/index.ts	Adds SizeWithClient type and redefines NullableSize to include clientWidth/clientHeight in both non-null and null shapes.
Runtime implementation and fallback updates packages/resize-observer/src/index.ts	Updates ELEMENT_SIZE_FALLBACK to include null client dimensions, getElementSize() to read and return clientWidth/clientHeight, and the createElementSize(target: Element) overload return type to SizeWithClient.
Tests and changelog packages/resize-observer/test/index.test.ts, .changeset/dull-colts-sip.md	Updates test assertions for the richer return shape and adds a changeset entry for the minor version bump.

Estimated code review effort: 2 (Simple) | ~10 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the main change: adding clientWidth/clientHeight support to createElementSize.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[davedbase]

@ylc395 I'd love to merge this. Can you add a changeset? Also I've migrated your changes to the new 2.0 release we're planning. If I don't hear back I'll close this out though which would be a shame.

[ylc395]

Changeset added

[coderabbitai]

🧹 Nitpick comments (2)

.changeset/dull-colts-sip.md (1)

5-5: 📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value

Fix casing to match actual field names.

The added properties are clientWidth/clientHeight, not ClientWidth/ClientHeight.

✏️ Proposed fix

-Add `ClientHeight` and `ClientWidth` for element size
+Add `clientHeight` and `clientWidth` for element size

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In @.changeset/dull-colts-sip.md at line 5, The changeset entry uses the wrong
property casing for the element size fields. Update the note in the changeset so
it matches the actual names used by the related API, `clientWidth` and
`clientHeight`, and make sure the wording in the changeset aligns with those
symbols rather than `ClientWidth`/`ClientHeight`.

packages/resize-observer/src/index.ts (1)

156-163: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Consider updating server.test.ts for parity.

The existing server-side test only asserts Unit test verifies createElementSize returns width/height as null when the element getter returns false. It doesn't cover the new clientWidth/clientHeight null fallback fields introduced here. Since ELEMENT_SIZE_FALLBACK now includes these fields, extending that test would keep coverage consistent with the updated NullableSize contract.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@packages/resize-observer/src/index.ts` around lines 156 - 163, Update the
server-side parity test to cover the expanded NullableSize shape in
getElementSize. In server.test.ts, extend the existing
createElementSize/getElementSize fallback assertion so it also verifies
clientWidth and clientHeight are null when the target is false or unavailable,
matching ELEMENT_SIZE_FALLBACK and the updated NullableSize contract.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Nitpick comments:
In @.changeset/dull-colts-sip.md:
- Line 5: The changeset entry uses the wrong property casing for the element
size fields. Update the note in the changeset so it matches the actual names
used by the related API, `clientWidth` and `clientHeight`, and make sure the
wording in the changeset aligns with those symbols rather than
`ClientWidth`/`ClientHeight`.

In `@packages/resize-observer/src/index.ts`:
- Around line 156-163: Update the server-side parity test to cover the expanded
NullableSize shape in getElementSize. In server.test.ts, extend the existing
createElementSize/getElementSize fallback assertion so it also verifies
clientWidth and clientHeight are null when the target is false or unavailable,
matching ELEMENT_SIZE_FALLBACK and the updated NullableSize contract.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 4aa31849-90b3-4fc8-a1fb-34c566990221

📥 Commits

Reviewing files that changed from the base of the PR and between ea6dfd2 and e87ecf8.

📒 Files selected for processing (3)

• .changeset/dull-colts-sip.md
• packages/resize-observer/src/index.ts
• packages/resize-observer/test/index.test.ts