@stackline/react-multiselect-dropdown 19.1.0 → 19.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +20 -10
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,16 +3,19 @@
|
|
|
3
3
|
> A maintained React multiselect dropdown for React 19 applications, with controlled React state, custom slots, headless/state hooks, searchable/grouped options, lazy loading hooks, custom render functions, skins, body-overlay positioning, and accessibility-focused and keyboard/ARIA tested behavior.
|
|
4
4
|
|
|
5
5
|
[](https://www.npmjs.com/package/@stackline/react-multiselect-dropdown)
|
|
6
|
-
[](https://www.npmjs.com/package/@stackline/react-multiselect-dropdown)
|
|
7
6
|
[](https://www.npmjs.com/package/@stackline/react-multiselect-dropdown)
|
|
8
7
|
[](https://github.com/alexandroit/react-multiselect-dropdown/blob/main/LICENSE)
|
|
9
8
|
[](https://alexandro.net/docs/react/multiselect/react-19/)
|
|
10
9
|
[](https://www.typescriptlang.org)
|
|
11
|
-
[](https://www.reddit.com/r/Stackline/)
|
|
12
11
|
|
|
13
|
-
**[Documentation & Live Demos](https://alexandro.net/docs/react/multiselect/)** | **[React 19 Demo](https://alexandro.net/docs/react/multiselect/react-19/)** | **[React 19 StackBlitz](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fbasic%2Fbasic.component.tsx&startScript=start&initialpath=%2Fbasic)** | **[npm](https://www.npmjs.com/package/@stackline/react-multiselect-dropdown)** | **[Issues](https://github.com/alexandroit/react-multiselect-dropdown/issues)** | **[Repository](https://github.com/alexandroit/react-multiselect-dropdown)**
|
|
12
|
+
**[Documentation & Live Demos](https://alexandro.net/docs/react/multiselect/)** | **[React 19 Demo](https://alexandro.net/docs/react/multiselect/react-19/)** | **[React 19 StackBlitz](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fbasic%2Fbasic.component.tsx&startScript=start&initialpath=%2Fbasic)** | **[npm](https://www.npmjs.com/package/@stackline/react-multiselect-dropdown)** | **[Issues](https://github.com/alexandroit/react-multiselect-dropdown/issues)** | **[Repository](https://github.com/alexandroit/react-multiselect-dropdown)** | **[Community Discussions](https://www.reddit.com/r/Stackline/)**
|
|
14
13
|
|
|
15
|
-
|
|
14
|
+
<p align="center">
|
|
15
|
+
<img src="https://alexandro.net/images/public/2026/06/dropdownlist.gif" alt="@stackline/react-multiselect-dropdown live dropdown preview" width="420">
|
|
16
|
+
</p>
|
|
17
|
+
|
|
18
|
+
**Latest React 19 release:** `19.1.1` for React `19.x`
|
|
16
19
|
|
|
17
20
|
---
|
|
18
21
|
|
|
@@ -26,7 +29,7 @@
|
|
|
26
29
|
|
|
27
30
|
The package is built around a controlled React API: pass `data`, bind `selectedItems`, receive updates through `onChange`, and customize behavior through a `settings` object. It also supports a Slots API for replacing component structure without losing ARIA/focus behavior, a headless `useMultiSelectDropdown` hook, a lower-level `useMultiSelectState` hook, custom React render functions for option rows and selected badges, lazy loading callbacks, imperative `ref` methods, and body-overlay positioning for dialogs or clipped containers.
|
|
28
31
|
|
|
29
|
-
The current stable React 19 release is `19.1.
|
|
32
|
+
The current stable React 19 release is `19.1.1`. It adds guided structural slots, a headless hook, a state hook, a type-safe factory helper, and a strengthened combobox contract while keeping the styled `<MultiSelectDropdown />` component compatible with the existing visual contract.
|
|
30
33
|
|
|
31
34
|
## Features
|
|
32
35
|
|
|
@@ -85,15 +88,15 @@ Each package family installs on its matching React family. Keep the package fami
|
|
|
85
88
|
| :---: | :---: | :---: | :---: | :--- |
|
|
86
89
|
| **17.x** | **React 17 only** | **`>=17.0.0 <18.0.0`** | **17.0.0 -> 17.0.2** | [React 17 family docs](https://alexandro.net/docs/react/multiselect/react-17/) |
|
|
87
90
|
| **18.x** | **React 18 only** | **`>=18.0.0 <19.0.0`** | **18.0.0 -> 18.3.1** | [React 18 family docs](https://alexandro.net/docs/react/multiselect/react-18/) |
|
|
88
|
-
| **19.x** | **React 19 only** | **`>=19.0.0 <20.0.0`** | **19.1.
|
|
91
|
+
| **19.x** | **React 19 only** | **`>=19.0.0 <20.0.0`** | **19.1.1 -> 19.2.4** | [React 19 family docs](https://alexandro.net/docs/react/multiselect/react-19/) |
|
|
89
92
|
|
|
90
93
|
## Installation
|
|
91
94
|
|
|
92
95
|
```bash
|
|
93
|
-
npm install @stackline/react-multiselect-dropdown@19.1.
|
|
96
|
+
npm install @stackline/react-multiselect-dropdown@19.1.1 --save-exact
|
|
94
97
|
```
|
|
95
98
|
|
|
96
|
-
Install `19.1.
|
|
99
|
+
Install `19.1.1` for React 19.x applications. The styled component includes its component styles and injects them at runtime. The headless hook does not inject CSS and lets your application own the markup and styling.
|
|
97
100
|
|
|
98
101
|
## Setup
|
|
99
102
|
|
|
@@ -478,7 +481,7 @@ The styled component remains available for drop-in usage. The headless hooks are
|
|
|
478
481
|
|
|
479
482
|
## Combobox Contract
|
|
480
483
|
|
|
481
|
-
Version `19.1.
|
|
484
|
+
Version `19.1.1` tightens the interaction details that usually matter most in production forms:
|
|
482
485
|
|
|
483
486
|
| Behavior | Contract |
|
|
484
487
|
| :--- | :--- |
|
|
@@ -522,6 +525,13 @@ Use the dedicated React 19 StackBlitz project when you want a fast editable exam
|
|
|
522
525
|
| Example | StackBlitz |
|
|
523
526
|
| :--- | :--- |
|
|
524
527
|
| Basic usage | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fbasic%2Fbasic.component.tsx&startScript=start&initialpath=%2Fbasic) |
|
|
528
|
+
| Keyboard contract | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fkeyboard-contract%2Fkeyboard-contract.component.tsx&startScript=start&initialpath=%2Fkeyboard-contract) |
|
|
529
|
+
| ARIA state audit | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Faria-state%2Faria-state.component.tsx&startScript=start&initialpath=%2Faria-state) |
|
|
530
|
+
| Headless + ARIA | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fheadless-aria%2Fheadless-aria.component.tsx&startScript=start&initialpath=%2Fheadless-aria) |
|
|
531
|
+
| State hook | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fstate-hook%2Fstate-hook.component.tsx&startScript=start&initialpath=%2Fstate-hook) |
|
|
532
|
+
| Slots API | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fslots-api%2Fslots-api.component.tsx&startScript=start&initialpath=%2Fslots-api) |
|
|
533
|
+
| Type-safe factory | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Ftype-safe-factory%2Ftype-safe-factory.component.tsx&startScript=start&initialpath=%2Ftype-safe-factory) |
|
|
534
|
+
| Async object preservation | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fasync-object-preservation%2Fasync-object-preservation.component.tsx&startScript=start&initialpath=%2Fasync-object-preservation) |
|
|
525
535
|
| Single selection | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fsingle-selection%2Fsingle-selection.component.tsx&startScript=start&initialpath=%2Fsingle-selection) |
|
|
526
536
|
| Search filter | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fsearch-filter%2Fsearch-filter.component.tsx&startScript=start&initialpath=%2Fsearch-filter) |
|
|
527
537
|
| Custom search from API | [Open](https://stackblitz.com/github/alexandroit/stackline-react-multiselect-react-19?file=src%2Fexamples%2Fcustom-search-api%2Fcustom-search-api.component.tsx&startScript=start&initialpath=%2Fcustom-search-api) |
|
|
@@ -549,7 +559,7 @@ Use the dedicated React 19 StackBlitz project when you want a fast editable exam
|
|
|
549
559
|
|
|
550
560
|
## Official React 19 Test Matrix
|
|
551
561
|
|
|
552
|
-
The React 19 release was tested in a clean React `19.2.4` application with `@stackline/react-multiselect-dropdown@19.1.
|
|
562
|
+
The React 19 release was tested in a clean React `19.2.4` application with `@stackline/react-multiselect-dropdown@19.1.1`. The docs use the same examples from that test app, including keyboard navigation, focus, ARIA behavior, badge counters, responsive action buttons, scrollable lists, dialog-safe body overlays, the corrected left-aligned placeholder with vertical centering, guided Slots API customization, headless/custom HTML, and the combobox contract checks for Backspace, Escape, focused badge removal, focus, and option ARIA.
|
|
553
563
|
|
|
554
564
|
The same core scenarios are validated for the visual skins:
|
|
555
565
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stackline/react-multiselect-dropdown",
|
|
3
|
-
"version": "19.1.
|
|
3
|
+
"version": "19.1.1",
|
|
4
4
|
"description": "Maintained React 19 multiselect dropdown with accessibility-focused and keyboard/ARIA tested support, controlled state, slots, headless/state hooks, Stackline skins, body overlays, live docs, search, grouping, lazy loading, and custom renderers.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|