Skip to content

feat: add List example and image #34

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
pandapandapandapandapandapanda wants to merge 2 commits into
base: main
Choose a base branch
from
Open

feat: add List example and image #34

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c9ae8f4
Add files via upload
pandapandapandapandapandapanda Jul 23, 2026
a6fb835
Create lists.mdx
pandapandapandapandapandapanda Jul 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file added images/gen2/lists.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
92 changes: 92 additions & 0 deletions rayfield-gen2/elements/lists.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
---
title: List
description: An always-visible list of options, single or multi-select.
icon: rows-3
---

import Gen2SentivelBanner from '/snippets/gen2-sentivel.mdx'

<Gen2SentivelBanner />

A list shows all options at once, with no search or collapse. Pick one, or several with `multiSelect`.

<Frame>
<img src="/images/gen2/lists.png" alt="List element." />
</Frame>

```lua
tab:CreateList({
name = "Mods",
multiSelect = true,
options = { "Aimbot", "ESP", "Fly", "Noclip" },
value = { "ESP" },
callback = function(selected)
print(selected) -- { "ESP" }
end,
})
```

## Properties

<ResponseField name="name" type="string">
The label.
</ResponseField>

<ResponseField name="description" type="string">
Hint text under the label. Optional.
</ResponseField>

<ResponseField name="icon" type="string | number">
An icon shown beside the label. Optional.
</ResponseField>

<ResponseField name="options" type="{ string }" default="{}">
The choices.
</ResponseField>

<ResponseField name="value" type="string | { string }">
The initial selection. A string in single mode, a table in multi.
</ResponseField>

<ResponseField name="multiSelect" type="boolean" default="false">
Allow more than one option at a time.
</ResponseField>

<ResponseField name="placeholder" type="string" default="None">
Shown when nothing is selected.
</ResponseField>

<ResponseField name="flag" type="string" default="name">
The save key. Optional.
</ResponseField>

<ResponseField name="forgetState" type="boolean" default="false">
Skip saving.
</ResponseField>

<ResponseField name="callback" type="function">
Runs with the selection. A string in single mode, a `{ string }` in multi. The table is a copy, so keeping or editing it won't affect the list.
</ResponseField>

## Handle

<ResponseField name=".value" type="{ string }">
The current selection. Always a table, even in single mode — the choice is the first entry.
Only the callback unwraps it to a bare string in single mode.
</ResponseField>

<ResponseField name="Set(value, skipCallback?)">
Set the selection.
</ResponseField>

<ResponseField name="Refresh(options)">
Replace the whole option list. Anything selected that is no longer an option is dropped (single-select picks the first new option automatically), and the callback runs if that changed the selection.
</ResponseField>

<ResponseField name="Add(option)">
Add one option.
</ResponseField>

<ResponseField name="Remove(option)">
Remove one option. Removing a selected one clears it from the selection and runs the callback.
</ResponseField>