Hi Ryan,

First, thank you for the ongoing improvements to JCE.

I'd like to suggest a new variable type: a **multi-select (or select) field**, which would allow template authors to define a list of labeled options, each mapping to a specific value, and let the end user pick one or more of them.

---

**Proposed syntax**

Following the existing convention `${VariableName:type}`, I'd suggest:

Single select:

${ClassName:select:Option Label 1=value1|Option Label 2=value2|Option Label 3=value3}

Multi-select (one or more choices):

${Classes:multiselect:Bold=fw-bold|Italic=fst-italic|Highlighted=bg-warning|Small=small}

The separator between the selected values in the output could be configurable via an additional switch (e.g. `:sep- ` for a space, `:sep-,` for a comma), defaulting to a single space.

Practical use case

When building Bootstrap or utility-class-based templates, editors often need to apply one or more CSS classes to a block. With the current system, they have to type class names manually into a plain text field — which is error-prone and not user-friendly.

With a `multiselect` variable, the template author could configure the available classes once, and the content editor would simply tick the relevant options in the dialog:

<div class="card ${CardStyle:select:Default=card-default|Accent=card-accent|Muted=card-muted}">
<div class="card-body ${BodyOptions:multiselect:Shadow=shadow|Rounded=rounded-3|Bordered=border}">
<h2>${Title}</h2>
<p>${Content}</p>
</div>
</div>

In the dialog, the user sees labeled checkboxes/radio buttons instead of raw class names. The selected values are concatenated and inserted at the variable's position.

---

Expected dialog behaviour

- `select` → renders as a `<select>` (single choice), outputs the `value` of the chosen option
- `multiselect` → renders as a group of checkboxes (or a multiselect <select>), outputs the `value`s of all checked options, joined by the configured separator (default: space)
- Option format: `Label=value` — the label is shown in the dialog UI, the value is what gets inserted into the HTML
- Supports `:hidden` and `:disabled` switches like existing variable types

---

This would significantly improve the authoring experience for template-driven workflows, especially for teams using utility-first CSS (Bootstrap, Tailwind-like custom tokens, etc.).

Happy to discuss or provide more detail. Thanks for considering it!

I went ahead and implemented a working PoC as a minimal patch on `plugin.js` (2.9.99.3-beta3), in case it helps to see the expected behaviour in action.

The patch adds ~60 lines, nothing is removed. The approach:

• Intercept `select`/`multiselect` types before the existing ternary
• Create a readonly textbox as backing field so `form.submit()` works untouched
• Use `onPostRender` to inject a native `<select>` or checkbox group directly over the backing field (avoids document-context issues)
• An IIFE closes over each control's options correctly across loop iterations
• A `.wf-patch-widget` guard prevents duplicate injection on repeated template calls

The patched `plugin.js` is attached as a drop-in replacement for testing. This is just a PoC — happy for you to implement it properly however you see fit.

Here the proof of Concept + screenshot + Select.html for testing purpose : https://cloud.semaphore.coop/index.php/s/qYeZLe847oJCeNZ

I can't wait to test these features in v3, but I understand that this feature won't be available in JCE v2.

Until v3 is deployed in production, I'll have to use my modified version to access this very useful feature.

Thanks