reactive-bulma 2.5.0 → 2.6.0

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 CHANGED
@@ -153,15 +153,6 @@ Reactive bulma's documentation, included in this repo in the root directory, is
153
153
 
154
154
  Learn more about `Storybook` by reading its [documentation](https://storybook.js.org/docs/react/get-started/install).
155
155
 
156
- ### How to create a template component
157
-
158
- After some time, I understood that creating component files is a repetitive and time-consuming task, so I made issue [#180](https://github.com/NicolasOmar/reactive-bulma/issues/180) to implement a library called [Hygen](https://www.hygen.io), whose function is to provide a way to generate templates for generic files that can consume time at the long term. You can run the script by the following steps:
159
-
160
- - Open a console and run `npm run create` in your console.
161
- - An will assistant will appear asking about how your component will be named. You can answer with text separated with spaces (` `), underscores (`_`), or hyphens (`-`)
162
- - Then, the assistant will ask in which folder you want to create it (based on its type following [Atomic Design hierarchy structure](https://atomicdesign.bradfrost.com/chapter-2/))
163
- - At last, the script should create all base files to reduce time and focus on custom implementation.
164
-
165
156
  Learn more about `Hygen` by reading its [documentation](https://www.hygen.io/docs/quick-start).
166
157
 
167
158
  ## Usage
@@ -178,6 +169,22 @@ To see all component's variants and its code snippets, go to [Documentation](#do
178
169
 
179
170
  In case you want to create a custom component for your forked Reactive Bulma version, the easiest way is by running the creation script I made, which [instructions are here](#how-to-create-a-template-component).
180
171
 
172
+ ### How to create a template component
173
+
174
+ After some time, I understood that creating component files is a repetitive and time-consuming task, so I made issue [#180](https://github.com/NicolasOmar/reactive-bulma/issues/180) to implement a library called [Hygen](https://www.hygen.io), whose function is to provide a way to generate templates for generic files that can consume time at the long term. You can run the script by the following steps:
175
+
176
+ - Open a console and run `npm run create` in your console.
177
+ - An will assistant will appear asking about how your component will be named. You can answer with text separated with spaces (` `), underscores (`_`), or hyphens (`-`)
178
+ - Then, the assistant will ask in which folder you want to create it (based on its type following [Atomic Design hierarchy structure](https://atomicdesign.bradfrost.com/chapter-2/))
179
+ - At last, the script should create all base files to reduce time and focus on custom implementation.
180
+
181
+ ### How to update all dependencies
182
+
183
+ In case you wanted to make your own fork, I recommend you to updated at least weekly using a custom command `npm run update`, which will run the following commands in order:
184
+ - `update:deps`: Using a [npm-check-updates](https://www.npmjs.com/package/npm-check-updates) script, you will be able to choose which dependencies want to update to latest version
185
+ - `update:doctor`: Will run a set of build and test checks in order to assure your update will not break any current build.
186
+ - `update:storybook`: Will update storybook to lastest version (following its recommended command) followed for a build check (similar to update:doctor, but for storybook only)
187
+
181
188
  ## Versioning
182
189
 
183
190
  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:
package/dist/cjs/index.js CHANGED
@@ -3337,7 +3337,7 @@ const Breadcrumbs = ({ testId = 'breadcrumbs', containerTestId = null, cssClasse
3337
3337
 
3338
3338
  const renderDropdownMenu = (items) => (React.createElement("section", { className: 'dropdown-content' }, items.map((dropdownItemConfig, i) => {
3339
3339
  const isFirstItemInMenu = items.length > 1 && i === 0;
3340
- return isFirstItemInMenu ? (React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))) : (React.createElement(React.Fragment, null,
3340
+ return isFirstItemInMenu ? (React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))) : (React.createElement("section", { key: `dropdown-item-${i}-section` },
3341
3341
  React.createElement(DropdownItem, { key: `dropdown-item-${i}-divider`, type: 'divider', itemText: 'divider' }),
3342
3342
  React.createElement(DropdownItem, Object.assign({ key: `dropdown-item-${i}` }, dropdownItemConfig))));
3343
3343
  })));
@@ -3356,6 +3356,16 @@ const Dropdown = ({ testId = null, cssClasses = null, style = null, inputText, d
3356
3356
  React.createElement("section", { className: 'dropdown-menu', id: dropdownPointer, role: 'menu' }, renderDropdownMenu(listOfItems))));
3357
3357
  };
3358
3358
 
3359
+ const Message = ({ testId = null, cssClasses = null, style = null, headerText = null, bodyText, deleteButton = null, color = null, size = null }) => {
3360
+ const messageClasses = parseClasses(['message', color, size, cssClasses]);
3361
+ const messageTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'message', parsedClasses: messageClasses });
3362
+ return (React.createElement("article", { "data-testid": messageTestId, className: messageClasses, style: style !== null && style !== void 0 ? style : undefined },
3363
+ headerText && (React.createElement("section", { "data-testid": `${messageTestId}-header`, className: 'message-header' },
3364
+ React.createElement("p", null, headerText),
3365
+ deleteButton ? React.createElement(Delete, Object.assign({}, deleteButton)) : null)),
3366
+ React.createElement("section", { "data-testid": `${messageTestId}-body`, className: 'message-body' }, bodyText)));
3367
+ };
3368
+
3359
3369
  exports.Block = Block;
3360
3370
  exports.Box = Box;
3361
3371
  exports.BreadcrumbItem = BreadcrumbItem;
@@ -3372,6 +3382,7 @@ exports.DropdownTrigger = DropdownTrigger;
3372
3382
  exports.File = File;
3373
3383
  exports.Icon = Icon;
3374
3384
  exports.Input = Input;
3385
+ exports.Message = Message;
3375
3386
  exports.Notification = Notification;
3376
3387
  exports.ProgressBar = ProgressBar;
3377
3388
  exports.RadioButton = RadioButton;