@nimbus-ds/select 2.5.0-rc.4 → 2.5.0-rc.5
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/dist/CHANGELOG.md +86 -0
- package/dist/README.md +51 -0
- package/package.json +5 -5
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
Use a select box when a user needs to select one option from a list.
|
|
4
|
+
|
|
5
|
+
## 2023-07-18 `2.4.0`
|
|
6
|
+
|
|
7
|
+
#### 🎉 New features
|
|
8
|
+
|
|
9
|
+
- Added `ref` property to `Select` component API. ([#180](https://github.com/TiendaNube/nimbus-design-system/pull/180) by [@juniorconquista](https://github.com/juniorconquista)).
|
|
10
|
+
|
|
11
|
+
## 2023-04-03 `2.3.2`
|
|
12
|
+
|
|
13
|
+
### 🐛 Bug fixes
|
|
14
|
+
|
|
15
|
+
- Add missing dependency for `@nimbus-ds/icon` external package. ([#135](https://github.com/TiendaNube/nimbus-design-system/pull/135) by [@juanchigallego](https://github.com/juanchigallego))
|
|
16
|
+
|
|
17
|
+
## 2023-03-27 `2.3.1`
|
|
18
|
+
|
|
19
|
+
### 🐛 Bug fixes
|
|
20
|
+
|
|
21
|
+
- Fixes bug where `Select.Option` subcomponent would not render the HTML option elements on IOS devices. ([#129](https://github.com/TiendaNube/nimbus-design-system/pull/129) by [@juanchigallego](https://github.com/juanchigallego))
|
|
22
|
+
|
|
23
|
+
## 2023-03-13 `2.3.0`
|
|
24
|
+
|
|
25
|
+
### 💡 Others
|
|
26
|
+
|
|
27
|
+
- Refactored use of `color tokens` in internal components by removing `.` per `-`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
|
|
28
|
+
- Refactored style classes to have more semantic names. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
|
|
29
|
+
|
|
30
|
+
## 2023-02-23 `2.2.0`
|
|
31
|
+
|
|
32
|
+
### 🎉 New features
|
|
33
|
+
|
|
34
|
+
- Added server side-rendering support to component. ([#105](https://github.com/TiendaNube/nimbus-design-system/pull/105) by [@juniorconquista](https://github.com/juniorconquista))
|
|
35
|
+
|
|
36
|
+
## 2023-02-16 `2.1.0`
|
|
37
|
+
|
|
38
|
+
### 🎉 New features
|
|
39
|
+
|
|
40
|
+
- Removed external dependency from `@tiendanube/icons` package to now use internal `@nimbus-ds/icons` package. ([#94](https://github.com/TiendaNube/nimbus-design-system/pull/#94) by [@juniorconquista](https://github.com/juniorconquista))
|
|
41
|
+
|
|
42
|
+
### 📚 3rd party library updates
|
|
43
|
+
|
|
44
|
+
- Removed `@tiendanube/icons@0.3.1`. ([#94](https://github.com/TiendaNube/nimbus-design-system/pull/#94) by [@juniorconquista](https://github.com/juniorconquista))
|
|
45
|
+
|
|
46
|
+
## 2022-12-22 `2.0.0`
|
|
47
|
+
|
|
48
|
+
### 💡 Others
|
|
49
|
+
|
|
50
|
+
- Removed direct dependency on `nimbus-ds/styles` package from component build. ([#69](https://github.com/TiendaNube/nimbus-design-system/pull/69) by [@juniorconquista](https://github.com/juniorconquista))
|
|
51
|
+
|
|
52
|
+
## 2022-12-07 `1.2.0`
|
|
53
|
+
|
|
54
|
+
### 🎉 New features
|
|
55
|
+
|
|
56
|
+
- Changed build build to consume inner package `@nimbus-ds/webpack`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
57
|
+
|
|
58
|
+
### 📚 3rd party library updates
|
|
59
|
+
|
|
60
|
+
- Removed `terser-webpack-plugin@5.3.5`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
61
|
+
- Removed `ts-loader@9.3.1`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
62
|
+
- Removed `webpack-cli@4.10.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
63
|
+
- Removed `webpack@5.74.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
64
|
+
- Removed `typescript@4.7.4`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
|
|
65
|
+
|
|
66
|
+
## 2022-10-14 `1.0.0`
|
|
67
|
+
|
|
68
|
+
### 📚 3rd party library updates
|
|
69
|
+
|
|
70
|
+
- Added `terser-webpack-plugin@5.3.5`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
71
|
+
- Added `ts-loader@9.3.1`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
72
|
+
- Added `typescript@4.7.4`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
73
|
+
- Added `webpack@5.74.0`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
74
|
+
- Added `webpack-cli@4.10.0`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
75
|
+
|
|
76
|
+
### 🎉 New features
|
|
77
|
+
|
|
78
|
+
- Added `name`, `id`, `appearance` and `children` properties to the component. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
79
|
+
- Added stories on component. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
80
|
+
- Created new `Select.Group` subcomponent. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
81
|
+
- Added `label` and `children` properties to the component `Select.Group`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
82
|
+
- Created new `Select.Option` subcomponent. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
83
|
+
- Added `label` and `value` properties to the component `Select.Option`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
84
|
+
- Created new `Select.Skeleton` subcomponent. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
85
|
+
- Added `width` property to the component `Select.Skeleton`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
|
86
|
+
- Added stories on component `Select.Skeleton`. ([#39](https://github.com/TiendaNube/nimbus-design-system/pull/39) by [@juanchigallego](https://github.com/juanchigallego))
|
package/dist/README.md
ADDED
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
# `@nimbus-ds/select`
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@nimbus-ds/select)
|
|
4
|
+
|
|
5
|
+
The Select component allows the user to select an option from a list.
|
|
6
|
+
|
|
7
|
+
## Installation
|
|
8
|
+
|
|
9
|
+
```sh
|
|
10
|
+
$ yarn add @nimbus-ds/select
|
|
11
|
+
# or
|
|
12
|
+
$ npm install @nimbus-ds/select
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### Component Anatomy
|
|
16
|
+
|
|
17
|
+
The component consists of a field with a dropdown list.
|
|
18
|
+
|
|
19
|
+
## Guidelines
|
|
20
|
+
|
|
21
|
+
We use this component when we need the user to enter information in a form, selecting a single option from a dropdown list.
|
|
22
|
+
|
|
23
|
+
### Select native
|
|
24
|
+
|
|
25
|
+
This component is dependent on each browser's native select, so the look of the list of options will depend directly on the operating system and browser used.
|
|
26
|
+
|
|
27
|
+
### Content
|
|
28
|
+
|
|
29
|
+
Given that Select is a component that interacts directly with the user of an application or page, it is important that the information shown is clear and correct and helps guide you when filling out a form.
|
|
30
|
+
|
|
31
|
+
In the first place, we must always accompany the Select with a Label component, which properly informs the data that must be inserted. This label must be visible at all times, as it helps the user to understand the information being requested.
|
|
32
|
+
|
|
33
|
+
Within the list of options, the text of each item should be brief so as not to overload with information. In addition, if there are many items, we can use groups to divide the options into categories.
|
|
34
|
+
|
|
35
|
+
### Recommendation for use
|
|
36
|
+
|
|
37
|
+
- Select options in lists with more than 7 items
|
|
38
|
+
- Select a configuration
|
|
39
|
+
- Select a massive action
|
|
40
|
+
|
|
41
|
+
### Related components
|
|
42
|
+
|
|
43
|
+
- Radio - Can be used to select a single option from a list of less than 7 items.
|
|
44
|
+
- Toggle - Can be used to toggle binary options on and off.
|
|
45
|
+
- Checkbox - Can be used to select multiple options from a list.
|
|
46
|
+
|
|
47
|
+
## Usage
|
|
48
|
+
|
|
49
|
+
View docs [here](https://nimbus.nuvemshop.com.br/documentation/atomic-components/select).
|
|
50
|
+
|
|
51
|
+
<img alt="Nimbus" style="margin-bottom: 30px;" src="https://tiendanube.github.io/design-system-nimbus/static/media/nimbus-logo.ab60bd79.png" height="30" />
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nimbus-ds/select",
|
|
3
|
-
"version": "2.5.0-rc.
|
|
3
|
+
"version": "2.5.0-rc.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"files": [
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"version": "yarn version"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@nimbus-ds/icon": "^3.1.0-rc.
|
|
18
|
-
"@nimbus-ds/icons": "^1.7.0-rc.
|
|
19
|
-
"@nimbus-ds/skeleton": "^3.1.0-rc.
|
|
17
|
+
"@nimbus-ds/icon": "^3.1.0-rc.5",
|
|
18
|
+
"@nimbus-ds/icons": "^1.7.0-rc.2",
|
|
19
|
+
"@nimbus-ds/skeleton": "^3.1.0-rc.5"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
22
|
"react": "^16.8 || ^17.0 || ^18.0",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"url": "https://github.com/TiendaNube/nimbus-design-system/issues"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
|
-
"@nimbus-ds/webpack": "^1.
|
|
34
|
+
"@nimbus-ds/webpack": "^1.5.0-rc.1"
|
|
35
35
|
},
|
|
36
36
|
"stableVersion": "2.4.0"
|
|
37
37
|
}
|