# Fidgets

Users can pick from a library of configurable Fidgets to customize and add functionality to the [Spaces](/nounspace-alpha/spaces.md) on their [Profile](/nounspace-alpha/spaces/profile.md) and [Homebase](/nounspace-alpha/spaces/homebase.md). We’ll start by developing a handful of fidgets that can be configured to support a wide variety of Web3 protocols and communities. Once the concept has been validated, we’ll create a framework enabling anyone to develop their own open source Fidgets. 

### Development Quick Start

*<mark style="color:red;">While Nounspace is in Alpha, Fidgets can be contributed in the form of React components with the above specifications. Just make a PR to the</mark>* [*<mark style="color:red;">Github</mark>*](https://github.com/Nounspace/nounspace.ts) *<mark style="color:red;">and we'll review it and add it to the Fidgets library!</mark>*&#x20;

**Example Fidget -** \[ /src/fidgets/example.tsx ]

**Fidget Testing**\
If you want to test out a fidget you've developed, the easiest way to get it to display is through the Homebase page - \[ */src/pages/homebase/index.tsx* ]

* The `fidgets` constant defines a list of all available fidgets
  * Add another fidget in this list (take note of the 'id' field for the next step)
* The `defaultLayoutData` constant defines a list of which fidgets will be displayed
  * Add another fidget in this list (mapping the the 'i' field to the 'id' of your fidget)&#x20;

### Fidget Configuration

**Fields**\
Fields let developers define their own set of user editable variables for the fidget.

**Size**\
Fidgets need a set of established sizes to fit onto the default grid layout.&#x20;

```typescript
  size: {
    minHeight: NumericRange<1,36>;
    maxHeight: NumericRange<1,36>;
    minWidth: NumericRange<1,36>;
    maxWidth: NumericRange<1,36>;
  }
```

**Settings**\
Fidgets need a set of established sizes to fit onto the default grid layout.&#x20;

## Planned Fidgets

#### [Music](https://shapeshift.notion.site/Music-387fffe8952e46af9a961c63a3662cfb?pvs=4)

Play on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/a27G2Y_nUoOHqmMCQmYVhlD80-S8ZKUWvN8kvn2ItFuQSV8vcopE5xt2H-3z8sszF4EaTtJapipfUwKRdQJ6RA3WyBfMm7NS80C_HlU1qQ75KMUoSHjFnEYpbEmdidwkr_s4NBG9X9WELeAQHjEhTrw" alt="" height="130.1760007022472" width="295"></div>

[**Nounish Auctions**](https://shapeshift.notion.site/Nounish-Auctions-213cd9b63f6a42eb88de2c3516b513d6?pvs=4)

View/display auctions for Nouns or Nouns Forks on your profile or homebase, and enable users to place bids and settle auctions.

<div align="left"><img src="https://lh7-us.googleusercontent.com/mqzS98k2VK9xVJ5RYj5iNdvTLEoO3P0P_yqNlXwmA8zmWt7eJz62ltq4GXxQqbXNys5KBkMZT1gOlTryq8sZFezv65awPihk1KTgxyyFlDPalRlqYtNnte59FFzShjhrcE0moN0igSMTfH88plZ2Jvw" alt="" height="231.54690265486727" width="414"></div>

[**Nounish Governance**](https://shapeshift.notion.site//Nounish-Governance-3f956aea25bc4213aa7ee567a2625fb7?pvs=21)

View/display proposal and candidate details for Nouns or Nouns Forks on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/5BJdS1e3KEFkdRJ4CYW4buQfb7GCEQJYBeqtObRAhwi5hlG161XlCdjPFBmoPIg0hrcdUtVJwvg-N2NVeScUSADuy0SWTFiRsJQhZWuSz9jJm-CF2bpoUqIM3Ks8AMU9oxdKqwZJJ3vIm-jWSUyQ130" alt="" height="304.74516695957817" width="340"></div>

**⚡** [**SnapShot Governance**](https://shapeshift.notion.site/Nounish-Governance-3f956aea25bc4213aa7ee567a2625fb7?pvs=21/SnapShot-Governance-c286e8ea05764013be7b5d9e98b1206e?pvs=21)

View/display proposal and candidate details for any SnapShot governance space on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/hnhWUhOqeWRWuxaiqwuXl3sGGAYbaJ2XRqrc3uT5uu3XoB1X88C6VTWYQe1n_lCbxGZjwcfYxp7rpVzLy0V4G33-LtiCV_UJcL1zEgjM3zDRnfdpzJzTCXRmv7zNFGDD9Sl2PKdSRU72YRNnpO_jg_0" alt="" height="300.27777777777777" width="299"></div>

⚖️ [**Balance**](https://shapeshift.notion.site/Nounish-Governance-3f956aea25bc4213aa7ee567a2625fb7?pvs=21/Balance-fcf849da97ff4609bb96fb0eba57cb8e?pvs=21)

View/display an address/treasury balance on your profile or homebase.

<div><img src="https://lh7-us.googleusercontent.com/HNKoci7usPFz3G0_O8G9FGcw3j3a9R_8_25Kaf2a6qPvfZcNDdjxy2WqS4PqS3AJcjTr2AlWXH3Xh_Np7BuV516S0x2RjTD2zmWXZDvApKUsoA2F53m98F-LhaoXgM545RWL3Acn3d5yjZoTQPCcLdQ" alt="" height="232.0289789244186" width="271"> <img src="https://lh7-us.googleusercontent.com/j5LbnPGtaI46oZ7oTceoJb3WTE0qBqL9k7OEhjGJ9rYbDBfMw6_ERcS5xdIn9mVU7owbiX7jNbAs_DkA86MxyBNIY6ySlBpWVuPsx3bfiCFsqakj2s59KNXBev7sgjEyTTJ3kRbAVcUTe1PsbHPswRg" alt="" height="174.68216630196937" width="364"></div>

<br>

[**Frame**](https://shapeshift.notion.site/Frame-ab3df7f12f62413cbc62268d9a7ad77b?pvs=4)

View/display frames on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/u8WMUwRA0Tr0EhPhfbTSOwE53-avUTPKJ_EGM4zraP795N5hSAY1u_hHwaTb6iAmUMvkFZInCPHueq1r1448W_RLSqx1Cqr2yNEZZh3oyA6bWmUPmq9YOA-UZ9uobLlgMWSL3UK2ClX5FfRLo3Nz4ho" alt="" height="306.45376712328766" width="259"></div>

[**Gallery**](https://shapeshift.notion.site/Gallery-108085ffab0b4f999941825be46e0ca7?pvs=21)

View/display Images and NFTs on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/hK3-kZPuQyKq2SAr4PRL1fYGJhKuUtuGxHlGkEAqBqdcl5-d0LIWG8z8sR4dK_GLb-VsW-R5eGKN7yRk-MxIQp4LreZWnJeKWTa7BiX-xUjlAZ_eMzSoq8FoY9q1jtYItc6JM3z_P1lkijwRhTTyx-w" alt="" height="139" width="139"></div>

[**Profile/channel feed**](https://shapeshift.notion.site/Profile-channel-feed-07b9a79ebb044150aef9e1924f75368a?pvs=21)

View/display profiles/channels on your profile or homebase.

[**Tip Allowance**](https://shapeshift.notion.site/Tip-Allowance-9525e198fabe4710932da245d189c998?pvs=21)

View/display your current Degen, Drakula, or \[other tippable token] on your profile or homebase

[**IPFS Frontend**](https://shapeshift.notion.site/IPFS-Frontend-d354181ae9384c43b78a5342cc1c9dad?pvs=21)

View/display content \[including entire frontends] hosted on IPFS on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/zcYPkokbNCFQBu0va_WDecaxjdqbw-_Mk7Ikg3LeyFU79VC2nzxN-VzRpglU_pPxwaXUP5VCraFIQPqHU8-hrfulGJ89OF1xZGUFmqiW0GlI_n7wvJunWoVSy8ACU7BeOX2vvMI8WiJikSJTTN6zksg" alt="" height="229.33291979613736" width="366"></div>

[**iFrame**](https://shapeshift.notion.site/iFrame-8da39ff17c9f45f9aa785cfe582ea334?pvs=21)

View/display entire websites or apps on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/BZCFQVTsKdRkJQ0ZFB5fhun2jmK_C_XGzcdAeFQ2I4QdHKV6IfZRv9m7HG_jwT10CswqUuHqTq8UNfWDz6QMqrg8l03rXRrpgfqwFMhT9f6iNck7PyoDBNTHO6w-nQnkCeL4BKdtx60zhTmUhDo8HcA" alt="" height="297.47236286212444" width="371"></div>

ℹ️ [**RSS Feed**](https://shapeshift.notion.site/RSS-Feed-46576531a07f4c88881c5b6490be0c3b?pvs=21)

View/display RSS Feeds from other sites on my profile or homebase.<br>

[**Token Swap**](https://shapeshift.notion.site/Token-Swap-a54ed5c13a6d4bedb73c7c9ea3530d7a?pvs=21)

Display a swap modal on your profile or homebase enabling your and your followers to trade.

<div align="left"><img src="https://lh7-us.googleusercontent.com/plth0FUv55XrP2mEKb890p29F_ORyp2GnmBZkGWvv3l0sOoaXbOFCAfxBUIbAg-HLw9uqCBFjXZ29KUwGzGkgN5SmO7XfE57dcxmR79IyZFbhgDKxEBRdxRNte4poLshUweB_MrZBxlbQfwYHZxXZWg" alt="" height="166.82076539855072" width="223"></div>

[**Podcasts**](https://shapeshift.notion.site/Podcasts-49031f5bae1f4e4b977265d748488bb4?pvs=21)

Embed a podcast feed and player on your profile or homebase.

<div align="left"><img src="https://lh7-us.googleusercontent.com/20mLGvh7ACJ5I40ywYLTqwrb_itPiUcJmM45UAveMB0rIjfL11AtGkG7BhKYQrObV25eY_spqBHZs-dS6icbzcvv9MqjlKjv-ERR8fVrrRBk2ndD7WEE0POFTUzBQwo8IUVlC7XdeOBYWRwp6_ckeQE" alt="" height="217.9718309859155" width="212"></div>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.nounspace.com/nounspace-alpha/fidgets.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.