[1104] Add Link widget and corresponding tests#1105
Conversation
🦋 Changeset detectedLatest commit: d5c6443 The changes in this PR will be included in the next version bump. This PR includes changesets to release 4 packages
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 |
justEhmadSaeed
changed the title
There was a problem hiding this comment.
Pull Request Overview
This PR adds a new Link widget component to the runtime package along with comprehensive tests and example usage. It also includes type improvements by making various properties use the Expression type for better binding support.
- Implements a new Link widget component for navigation with internal/external URL support
- Adds comprehensive test coverage for the Link widget functionality
- Updates several widget type definitions to properly use Expression types
Reviewed Changes
Copilot reviewed 11 out of 11 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/runtime/src/widgets/index.ts | Exports the new Link widget |
| packages/runtime/src/widgets/Link.tsx | Main Link widget implementation with internal/external navigation |
| packages/runtime/src/widgets/tests/Link.test.tsx | Comprehensive test suite for Link widget |
| packages/runtime/src/widgets/Form/TextInput.tsx | Makes onKeyDown optional |
| packages/runtime/src/widgets/Form/Form.tsx | Makes label style properties optional |
| packages/runtime/src/widgets/DataGrid/DataGrid.tsx | Makes column type and header style properties optional |
| packages/runtime/src/widgets/Button.tsx | Updates loading prop to use Expression type |
| packages/runtime/src/shared/types.ts | Updates visible and flexbox properties to use Expression types |
| packages/runtime/src/shared/coreSchema.ts | Adds Link widget to schema |
| apps/kitchen-sink/src/ensemble/screens/widgets.yaml | Adds Link widget examples |
| .changeset/old-boxes-drive.md | Documents the changes |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| if (!values?.url) { | ||
| return ( | ||
| <span ref={rootRef} style={linkStyles}> | ||
| {EnsembleRuntime.render([unwrappedWidget])} | ||
| </span> | ||
| ); | ||
| } |
There was a problem hiding this comment.
This check should also handle empty strings as falsy values. Consider using if (!values?.url || values.url.trim() === '') to properly handle whitespace-only URLs.
| e.currentTarget.style.color = values.styles.color; | ||
| if (values?.styles?.textDecoration) | ||
| e.currentTarget.style.textDecoration = values.styles.textDecoration; |
There was a problem hiding this comment.
The mouse event handlers for hover effects are duplicated across external and internal link sections. Consider extracting these into reusable helper functions to reduce code duplication.
|
Visit the preview URL for this PR (updated for commit d5c6443): https://react-kitchen-sink-dev--pr1105-1104-4w5d4i9d.web.app (expires Thu, 18 Sep 2025 14:47:10 GMT) 🔥 via Firebase Hosting GitHub Action 🌎 Sign: 6267897ade2ba783b6db70a53a60fc3946d625e9 |
2 participants
Describe your changes
Screenshots [Optional]
Issue ticket number and link
Closes #1104
Checklist before requesting a review
pnpm changeset add