reactive-bulma 1.16.0 → 1.18.0
Sign up to get free protection for your applications and to get access to all the features.
- package/LICENSE +21 -21
- package/README.md +192 -190
- package/dist/cjs/index.js +33 -4
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/atoms/Button/Button.d.ts +4 -0
- package/dist/cjs/types/components/atoms/Delete/index.d.ts +4 -0
- package/dist/cjs/types/components/atoms/Select/index.d.ts +4 -0
- package/dist/cjs/types/components/atoms/index.d.ts +2 -0
- package/dist/cjs/types/enums/styleEnums.d.ts +38 -0
- package/dist/cjs/types/functions/persers.d.ts +3 -0
- package/dist/cjs/types/interfaces/atomProps.d.ts +20 -0
- package/dist/esm/index.js +32 -5
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/atoms/Button/Button.d.ts +4 -0
- package/dist/esm/types/components/atoms/Delete/index.d.ts +4 -0
- package/dist/esm/types/components/atoms/Select/index.d.ts +4 -0
- package/dist/esm/types/components/atoms/index.d.ts +2 -0
- package/dist/esm/types/enums/styleEnums.d.ts +38 -0
- package/dist/esm/types/functions/persers.d.ts +3 -0
- package/dist/esm/types/interfaces/atomProps.d.ts +20 -0
- package/dist/index.d.ts +25 -1
- package/package.json +106 -106
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,191 +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]
|
|
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
|
-
[
|
|
51
|
-
[
|
|
52
|
-
[
|
|
53
|
-
[
|
|
54
|
-
[
|
|
55
|
-
[badge-soundcloud-
|
|
56
|
-
[badge-soundcloud-
|
|
57
|
-
[badge-soundcloud-
|
|
58
|
-
[
|
|
59
|
-
[
|
|
60
|
-
[
|
|
61
|
-
[
|
|
62
|
-
[badge-github-
|
|
63
|
-
[badge-github-
|
|
64
|
-
[badge-
|
|
65
|
-
[
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
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
|
+
|
|
191
193
|
Code released under the [MIT License](https://github.com/nicolasomar/reactive-bulma/blob/main/LICENSE).
|
package/dist/cjs/index.js
CHANGED
|
@@ -2923,21 +2923,21 @@ const Tag = ({ text, testId = null, style = null, color = null, isLight = null,
|
|
|
2923
2923
|
});
|
|
2924
2924
|
return withAddon ? (React.createElement("section", { "data-testid": _testId, style: style !== null && style !== void 0 ? style : undefined, className: tagsWrapperClasses },
|
|
2925
2925
|
React.createElement("span", { className: tagClasses }, text),
|
|
2926
|
-
withDelete ? (React.createElement("a", { "data-testid": `${_testId}-delete`, className: 'tag is-delete', onClick: onDeleteClick
|
|
2926
|
+
withDelete ? (React.createElement("a", { "data-testid": `${_testId}-delete`, className: 'tag is-delete', onClick: onDeleteClick !== null && onDeleteClick !== void 0 ? onDeleteClick : undefined })) : (React.createElement("span", { className: addonTagClasses }, addonText)))) : (React.createElement("span", { "data-testid": _testId, style: style !== null && style !== void 0 ? style : undefined, className: tagClasses },
|
|
2927
2927
|
text,
|
|
2928
|
-
withDelete ? (React.createElement("button", { "data-testid": `${_testId}-delete`, className: 'delete', onClick: onDeleteClick
|
|
2928
|
+
withDelete ? (React.createElement("button", { "data-testid": `${_testId}-delete`, className: 'delete', onClick: onDeleteClick !== null && onDeleteClick !== void 0 ? onDeleteClick : undefined })) : null));
|
|
2929
2929
|
};
|
|
2930
2930
|
|
|
2931
2931
|
const Box = ({ testId = 'test-box', style = null, children = null }) => children ? (React.createElement("section", { "data-testid": testId, className: 'box', style: style !== null && style !== void 0 ? style : undefined }, children)) : null;
|
|
2932
2932
|
|
|
2933
2933
|
const renderTitleSection = (section) => {
|
|
2934
|
-
var _a, _b;
|
|
2934
|
+
var _a, _b, _c;
|
|
2935
2935
|
const sectionClasses = parseClasses([
|
|
2936
2936
|
section === null || section === void 0 ? void 0 : section.prop,
|
|
2937
2937
|
(_a = section === null || section === void 0 ? void 0 : section.size) !== null && _a !== void 0 ? _a : 'is-6',
|
|
2938
2938
|
(section === null || section === void 0 ? void 0 : section.prop) === 'title' && (section === null || section === void 0 ? void 0 : section.isSpaced) ? 'is-spaced' : null
|
|
2939
2939
|
]);
|
|
2940
|
-
return section ? (React.createElement("p", { "data-testid": (_b = section === null || section === void 0 ? void 0 : section.testId) !== null && _b !== void 0 ? _b : `${section === null || section === void 0 ? void 0 : section.prop}-test`, className: sectionClasses, style: section.style
|
|
2940
|
+
return section ? (React.createElement("p", { "data-testid": (_b = section === null || section === void 0 ? void 0 : section.testId) !== null && _b !== void 0 ? _b : `${section === null || section === void 0 ? void 0 : section.prop}-test`, className: sectionClasses, style: (_c = section.style) !== null && _c !== void 0 ? _c : undefined }, section === null || section === void 0 ? void 0 : section.text)) : null;
|
|
2941
2941
|
};
|
|
2942
2942
|
const Title = ({ main, secondary }) => (React.createElement(React.Fragment, null,
|
|
2943
2943
|
renderTitleSection(main),
|
|
@@ -3038,13 +3038,42 @@ const TextArea = ({ testId = null, text = null, cols = null, rows = null, isDisa
|
|
|
3038
3038
|
return (React.createElement("textarea", { "data-testid": _testId, defaultValue: text !== null && text !== void 0 ? text : undefined, cols: cols !== null && cols !== void 0 ? cols : undefined, rows: rows !== null && rows !== void 0 ? rows : undefined, disabled: isDisabled, readOnly: isReadonly, style: style !== null && style !== void 0 ? style : undefined, className: textAreaClasses, onClick: onClick !== null && onClick !== void 0 ? onClick : undefined, onChange: onChange !== null && onChange !== void 0 ? onChange : undefined }));
|
|
3039
3039
|
};
|
|
3040
3040
|
|
|
3041
|
+
const Delete = ({ testId = null, style = null, size = null, onClick = null }) => {
|
|
3042
|
+
const deleteClasses = parseClasses(['delete', size]);
|
|
3043
|
+
const _testId = testId !== null && testId !== void 0 ? testId : parseTestId({
|
|
3044
|
+
tag: 'delete',
|
|
3045
|
+
parsedClasses: deleteClasses
|
|
3046
|
+
});
|
|
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
|
+
};
|
|
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
|
+
|
|
3041
3068
|
exports.Block = Block;
|
|
3042
3069
|
exports.Box = Box;
|
|
3043
3070
|
exports.Button = Button;
|
|
3044
3071
|
exports.Column = Column;
|
|
3072
|
+
exports.Delete = Delete;
|
|
3045
3073
|
exports.Icon = Icon;
|
|
3046
3074
|
exports.Input = Input;
|
|
3047
3075
|
exports.ProgressBar = ProgressBar;
|
|
3076
|
+
exports.Select = Select;
|
|
3048
3077
|
exports.Tag = Tag;
|
|
3049
3078
|
exports.TextArea = TextArea;
|
|
3050
3079
|
exports.Title = Title;
|