enhance Search widget to accept an object as default value

[anserwaseem]

Describe your changes

Goal: need to auto-populate the Search widget with some value from server WHILE rendering the selected label as a custom widget

Screenshots [Optional]

Issue ticket number and link

Closes #

Checklist before requesting a review

• I have performed a self-review of my code
• I have added tests
• I have added a changeset pnpm changeset add
• I have added example usage in the kitchen sink app

[changeset-bot]

⚠️ No Changeset found

Latest commit: 8182459

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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

[github-actions]

Visit the preview URL for this PR (updated for commit 12bd34d):

https://react-kitchen-sink-dev--pr1092-search-object-value-u6vffv2u.web.app

_{(expires Mon, 04 Aug 2025 16:33:55 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 6267897ade2ba783b6db70a53a60fc3946d625e9}

[Copilot]

Pull Request Overview

This PR enhances the Search widget to accept an object as the default value, enabling auto-population from server data while rendering a custom selected label widget.

• Modified SearchProps to accept objects as values in addition to strings
• Added logic to handle object initial values by extracting search keys and storing full objects separately
• Enhanced label rendering to work with both object and primitive values

Reviewed Changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File	Description
packages/runtime/src/widgets/Search.tsx	Core implementation adding object value support with state management and rendering logic
apps/kitchen-sink/src/ensemble/screens/widgets.yaml	Example usage demonstrating object value initialization with custom selected label

Comments suppressed due to low confidence (2)

packages/runtime/src/widgets/Search.tsx:61

• [nitpick] The variable name 'selectedObject' is ambiguous since it could refer to any selected object. Consider renaming to 'selectedItemData' or 'selectedFullObject' to clarify its purpose of storing the complete object data for rendering.

  const [selectedObject, setSelectedObject] = useState<unknown>(null);

packages/runtime/src/widgets/Search.tsx:181

• [nitpick] The variable name 'selectDefaultValue' is unclear. Consider renaming to 'extractedDefaultValue' or 'processedInitialValue' to better indicate its purpose of processing the initial value for the select component.

  const selectDefaultValue = useMemo(() => {