@startupjs-ui/dropdown 0.1.12 → 0.1.16
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/CHANGELOG.md +16 -0
- package/README.mdx +11 -1
- package/package.json +10 -10
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,22 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [0.1.16](https://github.com/startupjs/startupjs-ui/compare/v0.1.15...v0.1.16) (2026-02-10)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @startupjs-ui/dropdown
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [0.1.13](https://github.com/startupjs/startupjs-ui/compare/v0.1.12...v0.1.13) (2026-02-03)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @startupjs-ui/dropdown
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
6
22
|
## [0.1.12](https://github.com/startupjs/startupjs-ui/compare/v0.1.11...v0.1.12) (2026-01-21)
|
|
7
23
|
|
|
8
24
|
**Note:** Version bump only for package @startupjs-ui/dropdown
|
package/README.mdx
CHANGED
|
@@ -11,7 +11,13 @@ import {
|
|
|
11
11
|
|
|
12
12
|
# Dropdown
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
Dropdown displays a pop-up menu of selectable items. On larger screens it renders as a popover; on small screens it adapts by showing a bottom drawer (controlled by the `hasDrawer` prop, which defaults to `true`).
|
|
15
|
+
|
|
16
|
+
Use the `value` prop for the currently selected value and the `onChange` callback to handle selection. Build the menu content with `Dropdown.Caption` and `Dropdown.Item` sub-components passed as `children`.
|
|
17
|
+
|
|
18
|
+
The component also accepts `style` for the dropdown content container, `captionStyle` for the caption wrapper, `activeItemStyle` for the active item, `position` (defaults to `'bottom'`) and `attachment` (defaults to `'start'`) to control popover placement, `placements` for fallback placement order, `disabled` to prevent opening, and `ref` for programmatic control via `open()` and `close()` methods. The `onDismiss` callback fires when the dropdown is closed via the overlay or cancel button.
|
|
19
|
+
|
|
20
|
+
For the drawer variant on small screens, you can customize behavior with `drawerVariant` (`'list'`, `'buttons'`, or `'pure'`, defaults to `'buttons'`), `drawerListTitle` for the list variant header, `drawerCancelLabel` for the cancel button text (defaults to `'Cancel'`), and `showDrawerResponder` to display a swipe responder zone.
|
|
15
21
|
|
|
16
22
|
```jsx
|
|
17
23
|
import { Dropdown } from 'startupjs-ui'
|
|
@@ -34,6 +40,8 @@ return (
|
|
|
34
40
|
|
|
35
41
|
## Custom caption
|
|
36
42
|
|
|
43
|
+
You can provide a custom element as a child of `Dropdown.Caption` to replace the default caption appearance.
|
|
44
|
+
|
|
37
45
|
```jsx example
|
|
38
46
|
const [sort, setSort] = useState('')
|
|
39
47
|
|
|
@@ -62,6 +70,8 @@ return (
|
|
|
62
70
|
|
|
63
71
|
## Icons in items
|
|
64
72
|
|
|
73
|
+
Each `Dropdown.Item` can display an icon by passing the `icon` prop.
|
|
74
|
+
|
|
65
75
|
```jsx example
|
|
66
76
|
const [value, setValue] = useState('')
|
|
67
77
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@startupjs-ui/dropdown",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.16",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -8,20 +8,20 @@
|
|
|
8
8
|
"types": "index.d.ts",
|
|
9
9
|
"type": "module",
|
|
10
10
|
"dependencies": {
|
|
11
|
-
"@startupjs-ui/button": "^0.1.
|
|
11
|
+
"@startupjs-ui/button": "^0.1.16",
|
|
12
12
|
"@startupjs-ui/core": "^0.1.11",
|
|
13
|
-
"@startupjs-ui/div": "^0.1.
|
|
14
|
-
"@startupjs-ui/drawer": "^0.1.
|
|
15
|
-
"@startupjs-ui/icon": "^0.1.
|
|
16
|
-
"@startupjs-ui/link": "^0.1.
|
|
17
|
-
"@startupjs-ui/menu": "^0.1.
|
|
18
|
-
"@startupjs-ui/popover": "^0.1.
|
|
19
|
-
"@startupjs-ui/span": "^0.1.
|
|
13
|
+
"@startupjs-ui/div": "^0.1.16",
|
|
14
|
+
"@startupjs-ui/drawer": "^0.1.16",
|
|
15
|
+
"@startupjs-ui/icon": "^0.1.16",
|
|
16
|
+
"@startupjs-ui/link": "^0.1.16",
|
|
17
|
+
"@startupjs-ui/menu": "^0.1.16",
|
|
18
|
+
"@startupjs-ui/popover": "^0.1.16",
|
|
19
|
+
"@startupjs-ui/span": "^0.1.16"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
22
|
"react": "*",
|
|
23
23
|
"react-native": "*",
|
|
24
24
|
"startupjs": "*"
|
|
25
25
|
},
|
|
26
|
-
"gitHead": "
|
|
26
|
+
"gitHead": "9943aa3566d5d80f5b404473906eb3c0611f9ee5"
|
|
27
27
|
}
|