reactive-bulma 1.17.0 → 1.18.0

Sign up to get free protection for your applications and to get access to all the features.
package/LICENSE CHANGED
@@ -1,21 +1,21 @@
1
- MIT License
2
-
3
- Copyright (c) 2022 Nicolás Omar González Passerino
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
1
+ MIT License
2
+
3
+ Copyright (c) 2022 Nicolás Omar González Passerino
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,193 +1,193 @@
1
- <p align="center">
2
- <a href="https://reactivebulma.netlify.app">
3
- <img width="75" src="https://cdn.svgporn.com/logos/react.svg">
4
- <img width="50" src="https://cdn.svgporn.com/logos/bulma.svg">
5
- </a>
6
- </p>
7
-
8
- <h1 align="center">Reactive Bulma</h1>
9
-
10
- <div align="center">
11
-
12
- Component library based on React, Bulma, Typescript and Rollup
13
-
14
- <div align="left">
15
-
16
- ## Table of contents
17
-
18
- - [Status](#status)
19
- - [Dependencies](#dependencies)
20
- - [Quick start](#quick-start)
21
- - [Folder structure](#folder-structure)
22
- - [Documentation](#documentation)
23
- - [Usage](#usage)
24
- - [Versioning](#versioning)
25
- - [Roadmap](#roadmap)
26
- - [Changelog](#changelog)
27
- - [Credit](#credit)
28
- - [License](#license)
29
-
30
- ## Status
31
-
32
- ![Npm Version][badge-npm-version]
33
- ![Npm Bundle Size][badge-npm-size]
34
- [![Npm Downloads][badge-npm-downloads]][link-npm-downloads]
35
- [![Netlify Status][badge-netlify-status]][link-netlify-status]
36
- [![Code Coverage][badge-code-coverage]][link-code-coverage]
37
- [![Quality Gate Status][badge-soundcloud-quality]][link-soundcloud-status]
38
- [![Maintainability Rating][badge-soundcloud-maintanibility]][link-soundcloud-status]
39
- [![Security Rating][badge-soundcloud-security]][link-soundcloud-status]
40
- [![Technical Debt][badge-soundcloud-tech-debt]][link-soundcloud-status]
41
- [![Known Vulnerabilities][badge-snyk-status]][link-snyk-status]
42
- ![GitHub Repo stars][badge-github-repo-stars]
43
- ![GitHub commit activity][badge-github-commits]
44
- ![GitHub last commit][badge-github-last-commit]
45
- [![Semantic Commits][badge-semantic-commits]][link-semantic-commits]
46
-
47
- [badge-npm-version]: https://img.shields.io/github/package-json/v/nicolasomar/reactive-bulma?label=npm%20version&logo=npm&labelColor=535353&color=success&style=flat
48
- [badge-npm-size]: https://img.shields.io/bundlephobia/min/reactive-bulma?label=bundle%20size&labelColor=535353&logo=npm&style=flat
49
- [badge-npm-downloads]: https://img.shields.io/npm/dm/reactive-bulma?label=downloads&labelColor=535353&style=flat&logo=npm
50
- [link-npm-downloads]: https://www.npmjs.com/package/reactive-bulma?activeTab=versions
51
- [badge-netlify-status]: https://api.netlify.com/api/v1/badges/3101f2b5-0e28-4734-b749-ebb0e3e413c6/deploy-status
52
- [link-netlify-status]: https://app.netlify.com/sites/reactivebulma/deploys
53
- [badge-code-coverage]: https://img.shields.io/codecov/c/github/nicolasomar/reactive-bulma?label=coverage&labelColor=535353&logo=codecov&style=flat
54
- [link-code-coverage]: https://app.codecov.io/gh/NicolasOmar/reactive-bulma
55
- [badge-soundcloud-quality]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=alert_status
56
- [badge-soundcloud-maintanibility]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=sqale_rating
57
- [badge-soundcloud-security]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=security_rating
58
- [badge-soundcloud-tech-debt]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=sqale_index
59
- [link-soundcloud-status]: https://sonarcloud.io/summary/new_code?id=NicolasOmar_reactive-bulma
60
- [badge-snyk-status]: https://img.shields.io/snyk/vulnerabilities/github/nicolasomar/reactive-bulma?logo=snyk
61
- [link-snyk-status]: https://snyk.io/test/github/nicolasomar/reactive-bulma
62
- [badge-github-repo-stars]: https://img.shields.io/github/stars/nicolasomar/reactive-bulma?label=stars&logo=github&labelColor=535353&style=flat
63
- [badge-github-commits]: https://img.shields.io/github/commit-activity/m/nicolasomar/reactive-bulma?logo=github
64
- [badge-github-last-commit]: https://img.shields.io/github/last-commit/nicolasomar/reactive-bulma?logo=github
65
- [badge-semantic-commits]: https://img.shields.io/badge/using-conventional%20commits-e10079?logo=conventional-commits
66
- [link-semantic-commits]: https://github.com/semantic-release/semantic-release
67
-
68
- ## Dependencies
69
-
70
- ![react dependency][badge-dependency-react]
71
- ![bulma dependency][badge-dependency-bulma]
72
- ![material design dependency][badge-dependency-material-design]
73
- ![typescript dependency][badge-dependency-typescript]
74
- ![rollup dependency][badge-dependency-rollup]
75
- ![storybook dependency][badge-dependency-storybook]
76
- ![semantic release dependency][badge-dependency-semantic-release]
77
- ![babel dependency][badge-dependency-babel]
78
- ![jest dependency][badge-dependency-jest]
79
- ![react testing library dependency][badge-dependency-react-testing]
80
- ![prettier dependency][badge-dependency-prettier]
81
- ![eslint dependency][badge-dependency-eslint]
82
- ![husky dependency][badge-dependency-husky]
83
-
84
- [badge-dependency-react]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/react/main?logo=react
85
- [badge-dependency-bulma]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/bulma/main?logo=bulma
86
- [badge-dependency-material-design]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@mdi/font/main?logo=materialdesignicons
87
- [badge-dependency-typescript]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/typescript/main?logo=typescript
88
- [badge-dependency-rollup]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/rollup/main?logo=rollup.js
89
- [badge-dependency-storybook]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/storybook/main?logo=storybook
90
- [badge-dependency-semantic-release]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/semantic-release/main?logo=semantic-release
91
- [badge-dependency-babel]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@babel/core/main?logo=babel
92
- [badge-dependency-jest]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/jest/main?logo=jest
93
- [badge-dependency-react-testing]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@testing-library/react/main?logo=testing-library
94
- [badge-dependency-prettier]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/prettier/main?logo=prettier
95
- [badge-dependency-eslint]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/eslint/main?logo=eslint
96
- [badge-dependency-husky]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/husky/main?logo=husky
97
-
98
- ## Quick start
99
-
100
- Several quick start options are available:
101
-
102
- - Clone the repo: `git clone https://github.com/NicolasOmar/reactive-bulma.git`
103
- - Install with [npm](https://www.npmjs.com/package/reactive-bulma): `npm install reactive-bulma@latest`
104
- - Before cloning this repo, I recommend installing [Node](https://nodejs.org/en/download/) `>=18` to install packages.
105
-
106
- ## Folder structure
107
-
108
- In case you have cloned the repo, it will show you the following folders:
109
- - `.github:` [Github Actions](https://github.com/features/actions/) files used to run post-merge.commits like unit test coverage collection.
110
- - `.husky:` Dedicated to [Husky](https://typicode.github.io/husky/) configuration files.
111
- - `.storybook:` Dedicated to [Storybook](https://storybook.js.org/) configuration files.
112
- - `src:`
113
- - `components:` Location of all used components, using [Atomic Design hierarchy structure](https://atomicdesign.bradfrost.com/chapter-2/)
114
- - `atoms` (from `v1.0.0`).
115
- - `molecules` (from `v2.0.0`).
116
- - `organisms` (from `v3.0.0`).
117
-
118
- ## Documentation
119
-
120
- Reactive bulma's documentation, included in this repo in the root directory, is built with [Storybook](https://storybook.js.org/) and publicly hosted on `Netlify` at <https://reactivebulma.netlify.app/>. The docs may also be run locally.
121
-
122
- ### Running documentation locally
123
- - Go to `reactive-bulma` folder (where you cloned the repo before).
124
- - Run `npm install` to install the Node.js dependencies, including Storybook (the site builder).
125
- - Run `npm start`.
126
- - Wait until a new tab opens with url <http://localhost:6006/> in your browser.
127
- - In case you want to initiate it on the background, you can run `npm run start:off`.
128
-
129
- Learn more about using `Storybook` by reading its [documentation](https://storybook.js.org/docs/react/get-started/install).
130
-
131
- ## Usage
132
- ```jsx
133
- import React from 'react'
134
- import { Button } from 'reactive-bulma'
135
-
136
- const App = () => (
137
- <Button text="This is a test" />
138
- );
139
- ```
140
- To see all component's variants and its code snippets, go to [Documentation](#documentation) section
141
-
142
- ## Versioning
143
-
144
- After investigating [semantic-release documentation](https://semantic-release.gitbook.io/semantic-release/) (reffer to [#3](https://github.com/NicolasOmar/reactive-bulma/issues/3)) and having a problematic implementation, I decided to change version meaning for this project with the following:
145
- - Major versions (`1.0.0`, `2.0.0` and beyond) will reffer to milestones/version achievement.
146
- - Minor versions (`1.1.0`, `1.2.0` and so on) will reffer to branch/story completition.
147
- - Patch versions (`1.0.1`, `1.0.2` and so on) will reffer to bugfixes only.
148
-
149
- In case you are interested in check current project's status, you can go to [Roadmap](#roadmap) section.
150
-
151
- ### Branching
152
-
153
- Giving the mentioned release logic, `main` is the only static branch, and each developed feature or fix will have an unique branch with its PR and a merge commit following [semantic versioning](https://semver.org/) and [semantic commits](https://github.com/semantic-release/semantic-release#commit-message-format) specifications.
154
-
155
- ## Roadmap
156
-
157
- Having in mind the [versioning section](#versioning), repo's status in a glance can be observed in this table.
158
-
159
- | Version | Progress | Open issues | Closed issues
160
- | :---: | :---: | :---: | :---: |
161
- | `v1.0.0` | ![v1.0.0, progress][badge-progress-100] | ![v1.0.0, open][badge-issues-open-100] | ![v1.0.0, closed][badge-issues-closed-100] |
162
- | `v2.0.0` | ![v2.0.0, progress][badge-progress-200] | ![v2.0.0, open][badge-issues-open-200] | ![v2.0.0, closed][badge-issues-closed-200] |
163
- | `v3.0.0` | ![v3.0.0, progress][badge-progress-300] | ![v3.0.0, open][badge-issues-open-300] | ![v3.0.0, closed][badge-issues-closed-300] |
164
- | `v4.0.0` | ![v4.0.0, progress][badge-progress-400] | ![v4.0.0, open][badge-issues-open-400] | ![v4.0.0, closed][badge-issues-closed-400] |
165
-
166
- [badge-progress-100]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=informational
167
- [badge-issues-open-100]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=orange
168
- [badge-issues-closed-100]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=success
169
- [badge-progress-200]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=informational
170
- [badge-issues-open-200]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=orange
171
- [badge-issues-closed-200]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=success
172
- [badge-progress-300]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=informational
173
- [badge-issues-open-300]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=orange
174
- [badge-issues-closed-300]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=success
175
- [badge-progress-400]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=informational
176
- [badge-issues-open-400]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=orange
177
- [badge-issues-closed-400]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=success
178
-
179
- In case you want the short-term status, go to the [project board](https://github.com/users/NicolasOmar/projects/3) (powered by `GitHub Projects`).
180
-
181
- In case you want the detailed list of current and future features, go to the [roadmap document](https://docs.google.com/document/d/1kWX-dDTD-cQUeB_Vbu0K6xRvtHaSA38h76yQnhiCe9U).
182
-
183
- ## Changelog
184
-
185
- The [changelog](https://github.com/NicolasOmar/reactive-bulma/blob/main/CHANGELOG.md) (powered by `semantic-release`) is regularly updated to reflect what's changed in each new release.
186
-
187
- ## Credit
188
-
189
- Bulma was beautifully crafted by [@jgthms](https://github.com/jgthms)
190
-
191
- ## License
192
-
1
+ <p align="center">
2
+ <a href="https://reactivebulma.netlify.app">
3
+ <img width="75" src="https://cdn.svgporn.com/logos/react.svg">
4
+ <img width="50" src="https://cdn.svgporn.com/logos/bulma.svg">
5
+ </a>
6
+ </p>
7
+
8
+ <h1 align="center">Reactive Bulma</h1>
9
+
10
+ <div align="center">
11
+
12
+ Component library based on React, Bulma, Typescript and Rollup
13
+
14
+ <div align="left">
15
+
16
+ ## Table of contents
17
+
18
+ - [Status](#status)
19
+ - [Dependencies](#dependencies)
20
+ - [Quick start](#quick-start)
21
+ - [Folder structure](#folder-structure)
22
+ - [Documentation](#documentation)
23
+ - [Usage](#usage)
24
+ - [Versioning](#versioning)
25
+ - [Roadmap](#roadmap)
26
+ - [Changelog](#changelog)
27
+ - [Credit](#credit)
28
+ - [License](#license)
29
+
30
+ ## Status
31
+
32
+ ![Npm Version][badge-npm-version]
33
+ ![Npm Bundle Size][badge-npm-size]
34
+ [![Npm Downloads][badge-npm-downloads]][link-npm-downloads]
35
+ [![Netlify Status][badge-netlify-status]][link-netlify-status]
36
+ [![Code Coverage][badge-code-coverage]][link-code-coverage]
37
+ [![Quality Gate Status][badge-soundcloud-quality]][link-soundcloud-status]
38
+ [![Maintainability Rating][badge-soundcloud-maintanibility]][link-soundcloud-status]
39
+ [![Security Rating][badge-soundcloud-security]][link-soundcloud-status]
40
+ [![Technical Debt][badge-soundcloud-tech-debt]][link-soundcloud-status]
41
+ [![Known Vulnerabilities][badge-snyk-status]][link-snyk-status]
42
+ ![GitHub Repo stars][badge-github-repo-stars]
43
+ ![GitHub commit activity][badge-github-commits]
44
+ ![GitHub last commit][badge-github-last-commit]
45
+ [![Semantic Commits][badge-semantic-commits]][link-semantic-commits]
46
+
47
+ [badge-npm-version]: https://img.shields.io/github/package-json/v/nicolasomar/reactive-bulma?label=npm%20version&logo=npm&labelColor=535353&color=success&style=flat
48
+ [badge-npm-size]: https://img.shields.io/bundlephobia/min/reactive-bulma?label=bundle%20size&labelColor=535353&logo=npm&style=flat
49
+ [badge-npm-downloads]: https://img.shields.io/npm/dm/reactive-bulma?label=downloads&labelColor=535353&style=flat&logo=npm
50
+ [link-npm-downloads]: https://www.npmjs.com/package/reactive-bulma?activeTab=versions
51
+ [badge-netlify-status]: https://api.netlify.com/api/v1/badges/3101f2b5-0e28-4734-b749-ebb0e3e413c6/deploy-status
52
+ [link-netlify-status]: https://app.netlify.com/sites/reactivebulma/deploys
53
+ [badge-code-coverage]: https://img.shields.io/codecov/c/github/nicolasomar/reactive-bulma?label=coverage&labelColor=535353&logo=codecov&style=flat
54
+ [link-code-coverage]: https://app.codecov.io/gh/NicolasOmar/reactive-bulma
55
+ [badge-soundcloud-quality]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=alert_status
56
+ [badge-soundcloud-maintanibility]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=sqale_rating
57
+ [badge-soundcloud-security]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=security_rating
58
+ [badge-soundcloud-tech-debt]: https://sonarcloud.io/api/project_badges/measure?project=NicolasOmar_reactive-bulma&metric=sqale_index
59
+ [link-soundcloud-status]: https://sonarcloud.io/summary/new_code?id=NicolasOmar_reactive-bulma
60
+ [badge-snyk-status]: https://img.shields.io/snyk/vulnerabilities/github/nicolasomar/reactive-bulma?logo=snyk
61
+ [link-snyk-status]: https://snyk.io/test/github/nicolasomar/reactive-bulma
62
+ [badge-github-repo-stars]: https://img.shields.io/github/stars/nicolasomar/reactive-bulma?label=stars&logo=github&labelColor=535353&style=flat
63
+ [badge-github-commits]: https://img.shields.io/github/commit-activity/m/nicolasomar/reactive-bulma?logo=github
64
+ [badge-github-last-commit]: https://img.shields.io/github/last-commit/nicolasomar/reactive-bulma?logo=github
65
+ [badge-semantic-commits]: https://img.shields.io/badge/using-conventional%20commits-e10079?logo=conventional-commits
66
+ [link-semantic-commits]: https://github.com/semantic-release/semantic-release
67
+
68
+ ## Dependencies
69
+
70
+ ![react dependency][badge-dependency-react]
71
+ ![bulma dependency][badge-dependency-bulma]
72
+ ![material design dependency][badge-dependency-material-design]
73
+ ![typescript dependency][badge-dependency-typescript]
74
+ ![rollup dependency][badge-dependency-rollup]
75
+ ![storybook dependency][badge-dependency-storybook]
76
+ ![semantic release dependency][badge-dependency-semantic-release]
77
+ ![babel dependency][badge-dependency-babel]
78
+ ![jest dependency][badge-dependency-jest]
79
+ ![react testing library dependency][badge-dependency-react-testing]
80
+ ![prettier dependency][badge-dependency-prettier]
81
+ ![eslint dependency][badge-dependency-eslint]
82
+ ![husky dependency][badge-dependency-husky]
83
+
84
+ [badge-dependency-react]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/react/main?logo=react
85
+ [badge-dependency-bulma]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/bulma/main?logo=bulma
86
+ [badge-dependency-material-design]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@mdi/font/main?logo=materialdesignicons
87
+ [badge-dependency-typescript]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/typescript/main?logo=typescript
88
+ [badge-dependency-rollup]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/rollup/main?logo=rollup.js
89
+ [badge-dependency-storybook]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/storybook/main?logo=storybook
90
+ [badge-dependency-semantic-release]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/semantic-release/main?logo=semantic-release
91
+ [badge-dependency-babel]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@babel/core/main?logo=babel
92
+ [badge-dependency-jest]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/jest/main?logo=jest
93
+ [badge-dependency-react-testing]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/@testing-library/react/main?logo=testing-library
94
+ [badge-dependency-prettier]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/prettier/main?logo=prettier
95
+ [badge-dependency-eslint]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/eslint/main?logo=eslint
96
+ [badge-dependency-husky]: https://img.shields.io/github/package-json/dependency-version/nicolasomar/reactive-bulma/dev/husky/main?logo=husky
97
+
98
+ ## Quick start
99
+
100
+ Several quick start options are available:
101
+
102
+ - Clone the repo: `git clone https://github.com/NicolasOmar/reactive-bulma.git`
103
+ - Install with [npm](https://www.npmjs.com/package/reactive-bulma): `npm install reactive-bulma@latest`
104
+ - Before cloning this repo, I recommend installing [Node](https://nodejs.org/en/download/) `>=18` to install packages.
105
+
106
+ ## Folder structure
107
+
108
+ In case you have cloned the repo, it will show you the following folders:
109
+ - `.github:` [Github Actions](https://github.com/features/actions/) files used to run post-merge.commits like unit test coverage collection.
110
+ - `.husky:` Dedicated to [Husky](https://typicode.github.io/husky/) configuration files.
111
+ - `.storybook:` Dedicated to [Storybook](https://storybook.js.org/) configuration files.
112
+ - `src:`
113
+ - `components:` Location of all used components, using [Atomic Design hierarchy structure](https://atomicdesign.bradfrost.com/chapter-2/)
114
+ - `atoms` (from `v1.0.0`).
115
+ - `molecules` (from `v2.0.0`).
116
+ - `organisms` (from `v3.0.0`).
117
+
118
+ ## Documentation
119
+
120
+ Reactive bulma's documentation, included in this repo in the root directory, is built with [Storybook](https://storybook.js.org/) and publicly hosted on `Netlify` at <https://reactivebulma.netlify.app/>. The docs may also be run locally.
121
+
122
+ ### Running documentation locally
123
+ - Go to `reactive-bulma` folder (where you cloned the repo before).
124
+ - Run `npm install` to install the Node.js dependencies, including Storybook (the site builder).
125
+ - Run `npm start`.
126
+ - Wait until a new tab opens with url <http://localhost:6006/> in your browser.
127
+ - In case you want to initiate it on the background, you can run `npm run start:cli`.
128
+
129
+ Learn more about using `Storybook` by reading its [documentation](https://storybook.js.org/docs/react/get-started/install).
130
+
131
+ ## Usage
132
+ ```jsx
133
+ import React from 'react'
134
+ import { Button } from 'reactive-bulma'
135
+
136
+ const App = () => (
137
+ <Button text="This is a test" />
138
+ );
139
+ ```
140
+ To see all component's variants and its code snippets, go to [Documentation](#documentation) section
141
+
142
+ ## Versioning
143
+
144
+ After investigating [semantic-release documentation](https://semantic-release.gitbook.io/semantic-release/) (reffer to [#3](https://github.com/NicolasOmar/reactive-bulma/issues/3)) and having a problematic implementation, I decided to change version meaning for this project with the following:
145
+ - Major versions (`1.0.0`, `2.0.0` and beyond) will reffer to milestones/version achievement.
146
+ - Minor versions (`1.1.0`, `1.2.0` and so on) will reffer to branch/story completition.
147
+ - Patch versions (`1.0.1`, `1.0.2` and so on) will reffer to bugfixes only.
148
+
149
+ In case you are interested in check current project's status, you can go to [Roadmap](#roadmap) section.
150
+
151
+ ### Branching
152
+
153
+ Giving the mentioned release logic, `main` is the only static branch, and each developed feature or fix will have an unique branch with its PR and a merge commit following [semantic versioning](https://semver.org/) and [semantic commits](https://github.com/semantic-release/semantic-release#commit-message-format) specifications.
154
+
155
+ ## Roadmap
156
+
157
+ Having in mind the [versioning section](#versioning), repo's status in a glance can be observed in this table.
158
+
159
+ | Version | Progress | Open issues | Closed issues
160
+ | :---: | :---: | :---: | :---: |
161
+ | `v1.0.0` | ![v1.0.0, progress][badge-progress-100] | ![v1.0.0, open][badge-issues-open-100] | ![v1.0.0, closed][badge-issues-closed-100] |
162
+ | `v2.0.0` | ![v2.0.0, progress][badge-progress-200] | ![v2.0.0, open][badge-issues-open-200] | ![v2.0.0, closed][badge-issues-closed-200] |
163
+ | `v3.0.0` | ![v3.0.0, progress][badge-progress-300] | ![v3.0.0, open][badge-issues-open-300] | ![v3.0.0, closed][badge-issues-closed-300] |
164
+ | `v4.0.0` | ![v4.0.0, progress][badge-progress-400] | ![v4.0.0, open][badge-issues-open-400] | ![v4.0.0, closed][badge-issues-closed-400] |
165
+
166
+ [badge-progress-100]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=informational
167
+ [badge-issues-open-100]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=orange
168
+ [badge-issues-closed-100]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/1?label=%20&style=flat&color=success
169
+ [badge-progress-200]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=informational
170
+ [badge-issues-open-200]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=orange
171
+ [badge-issues-closed-200]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/2?label=%20&style=flat&color=success
172
+ [badge-progress-300]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=informational
173
+ [badge-issues-open-300]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=orange
174
+ [badge-issues-closed-300]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/3?label=%20&style=flat&color=success
175
+ [badge-progress-400]: https://img.shields.io/github/milestones/progress-percent/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=informational
176
+ [badge-issues-open-400]: https://img.shields.io/github/milestones/issues-open/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=orange
177
+ [badge-issues-closed-400]: https://img.shields.io/github/milestones/issues-closed/nicolasomar/reactive-bulma/4?label=%20&style=flat&color=success
178
+
179
+ In case you want the short-term status, go to the [project board](https://github.com/users/NicolasOmar/projects/3) (powered by `GitHub Projects`).
180
+
181
+ In case you want the detailed list of current and future features, go to the [roadmap document](https://docs.google.com/document/d/1kWX-dDTD-cQUeB_Vbu0K6xRvtHaSA38h76yQnhiCe9U).
182
+
183
+ ## Changelog
184
+
185
+ The [changelog](https://github.com/NicolasOmar/reactive-bulma/blob/main/CHANGELOG.md) (powered by `semantic-release`) is regularly updated to reflect what's changed in each new release.
186
+
187
+ ## Credit
188
+
189
+ Bulma was beautifully crafted by [@jgthms](https://github.com/jgthms)
190
+
191
+ ## License
192
+
193
193
  Code released under the [MIT License](https://github.com/nicolasomar/reactive-bulma/blob/main/LICENSE).
package/dist/cjs/index.js CHANGED
@@ -3047,6 +3047,24 @@ const Delete = ({ testId = null, style = null, size = null, onClick = null }) =>
3047
3047
  return (React.createElement("button", { "data-testid": _testId, style: style !== null && style !== void 0 ? style : undefined, className: deleteClasses, onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }));
3048
3048
  };
3049
3049
 
3050
+ const Select = ({ testId = null, showOptions = 1, options = [], isMultiple = false, color = null, size = null, isRounded = null, isHovered = null, isFocused = null, onClick = null }) => {
3051
+ const selectClasses = parseClasses([
3052
+ 'select',
3053
+ color,
3054
+ size,
3055
+ isMultiple ? 'is-multiple' : null,
3056
+ isRounded ? 'is-rounded' : null,
3057
+ isHovered ? 'is-hovered' : null,
3058
+ isFocused ? 'is-focused' : null
3059
+ ]);
3060
+ const selectTestId = testId !== null && testId !== void 0 ? testId : parseTestId({
3061
+ tag: 'select',
3062
+ parsedClasses: selectClasses
3063
+ });
3064
+ return (React.createElement("section", { "data-testid": `${selectTestId}-container`, className: selectClasses },
3065
+ React.createElement("select", { multiple: isMultiple, size: showOptions, "data-testid": selectTestId }, options.map(({ id, name, selected }, i) => (React.createElement("option", { "data-testid": `${selectTestId}-option-${i}`, key: id.toString(), selected: selected !== null && selected !== void 0 ? selected : false, onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }, name))))));
3066
+ };
3067
+
3050
3068
  exports.Block = Block;
3051
3069
  exports.Box = Box;
3052
3070
  exports.Button = Button;
@@ -3055,6 +3073,7 @@ exports.Delete = Delete;
3055
3073
  exports.Icon = Icon;
3056
3074
  exports.Input = Input;
3057
3075
  exports.ProgressBar = ProgressBar;
3076
+ exports.Select = Select;
3058
3077
  exports.Tag = Tag;
3059
3078
  exports.TextArea = TextArea;
3060
3079
  exports.Title = Title;