@nimbus-ds/modal 1.5.3-rc.1 → 1.6.0-rc.1

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.
Files changed (3) hide show
  1. package/dist/CHANGELOG.md +88 -0
  2. package/dist/README.md +44 -0
  3. package/package.json +9 -9
package/dist/CHANGELOG.md ADDED
@@ -0,0 +1,88 @@
1
+ # Changelog
2
+
3
+ The Modal component allows us to call the user's attention to a floating box that can have text, actions or forms to perform tasks by changing the focus from the background. It is an intrusive component as it interrupts the user's operation to present a message or content.
4
+
5
+ ## 2024-08-05 `1.5.3`
6
+
7
+ ### 🐛 Bug fixes
8
+
9
+ - Made `onDismiss` property optional for `Modal` component. If `onDismiss` is not provided, the modal can no longer be closed by clicking outside or pressing the close button
10
+ - Removed the close button (X) from `Modal` component when `onDismiss` is not provided. ([#246](https://github.com/TiendaNube/nimbus-design-system/pull/246) by [@dommirr](https://github.com/dommirr))
11
+
12
+ ## 2023-12-22 `1.5.1`
13
+
14
+ #### 🎉 New features
15
+
16
+ - Changed default title size to `h4` on `ModalHeader` subcomponent. ([#215](https://github.com/TiendaNube/nimbus-design-system/pull/215) by [@juanchigallego](https://github.com/juanchigallego))
17
+
18
+ ## 2023-10-13 `1.5.0`
19
+
20
+ #### 📚 3rd party library updates
21
+
22
+ - Updated `@floating-ui/react@0.26.0`. ([#195](https://github.com/TiendaNube/nimbus-design-system/pull/195) by [@juanchigallego](https://github.com/juanchigallego))
23
+
24
+ ## 2023-07-11 `1.4.1`
25
+
26
+ ### 🐛 Bug fixes
27
+
28
+ - Adding extra right padding to the modal title to prevent the title from getting overlaid by the close button. ([#179](https://github.com/TiendaNube/nimbus-design-system/pull/179) by [@juniorconquista](https://github.com/juniorconquista))
29
+
30
+ ## 2023-06-13 `1.4.0`
31
+
32
+ #### 🎉 New features
33
+
34
+ - Added `Padding` property to the Component `Modal.Header`. ([#169](https://github.com/TiendaNube/nimbus-design-system/pull/169) by [@juniorconquista](https://github.com/juniorconquista))
35
+ - Added `Padding` property to the Component `Modal.Footer`. ([#169](https://github.com/TiendaNube/nimbus-design-system/pull/169) by [@juniorconquista](https://github.com/juniorconquista))
36
+
37
+ ## 2023-05-22 `1.3.1`
38
+
39
+ ### 🐛 Bug fixes
40
+
41
+ - Fixes a bug where focus wasn't correctly moved to the modal dialog when pressing tab key. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
42
+
43
+ ### 📚 3rd party library updates
44
+
45
+ - Removed `@floating-ui/react-dom-interactions`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
46
+ - Added `@floating-ui/react`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
47
+
48
+ ## 2023-03-13 `1.3.0`
49
+
50
+ ### 💡 Others
51
+
52
+ - 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))
53
+ - Refactored style classes to have more semantic names. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
54
+
55
+ ## 2023-02-24 `1.2.1`
56
+
57
+ ### 💡 Others
58
+
59
+ - Adjust `fontSize` and `lineHeight` properties in `Text` component on stories documentation. ([#106](https://github.com/TiendaNube/nimbus-design-system/pull/106) by [@juanchigallego](https://github.com/juanchigallego))
60
+
61
+ ## 2023-02-23 `1.2.0`
62
+
63
+ ### 🎉 New features
64
+
65
+ - Added server side-rendering support to component. ([#105](https://github.com/TiendaNube/nimbus-design-system/pull/105) by [@juniorconquista](https://github.com/juniorconquista))
66
+
67
+ ## 2023-02-16 `1.1.0`
68
+
69
+ ### 🎉 New features
70
+
71
+ - 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))
72
+
73
+ ### 📚 3rd party library updates
74
+
75
+ - Removed `@tiendanube/icons@0.3.1`. ([#94](https://github.com/TiendaNube/nimbus-design-system/pull/#94) by [@juniorconquista](https://github.com/juniorconquista))
76
+
77
+ ## 2023-01-22 `1.0.0`
78
+
79
+ ### 🎉 New features
80
+
81
+ - Added `children`, `open`, `onDismiss`, `portalId` and `padding` properties to the Component. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
82
+ - Added stories on Component. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
83
+ - Created new `Modal.Header` subcomponent. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
84
+ - Added `children` and `title` properties to the Component `Modal.Header`. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
85
+ - Created new `Modal.Body` subcomponent. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
86
+ - Added `children` and `padding` properties to the Component `Modal.Body`. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
87
+ - Created new `Modal.Footer` subcomponent. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
88
+ - Added `children` properties to the Component `Modal.Footer`. ([#77](https://github.com/TiendaNube/nimbus-design-system/pull/77) by [@juniorconquista](https://github.com/juniorconquista))
package/dist/README.md ADDED
@@ -0,0 +1,44 @@
1
+ # `@nimbus-ds/modal`
2
+
3
+ [![@nimbus-ds/modal](https://img.shields.io/npm/v/@nimbus-ds/modal?label=%40nimbus-ds%2Fmodal)](https://www.npmjs.com/package/@nimbus-ds/modal)
4
+
5
+ The Modal component allows us to call the user's attention to a floating box that can have text, actions or forms to perform tasks by changing the focus from the background. It is an intrusive component as it interrupts the user's operation to present a message or content.
6
+
7
+ ## Installation
8
+
9
+ ```sh
10
+ $ yarn add @nimbus-ds/modal
11
+ # or
12
+ $ npm install @nimbus-ds/modal
13
+ ```
14
+
15
+ ### Component Anatomy
16
+
17
+ The component consists of a full-screen translucent background and a centered floating box with rounded corners and shadow with optional padding.
18
+
19
+ ## Guidelines
20
+
21
+ We use the component to present dialogs or options to the user that must be completed before continuing the operation. They are intrusive as they completely interrupt browsing, but they should be used occasionally.
22
+
23
+ Modal must present actions to the user. Actions must form part of the footer of the modal, and must be located on the right side.
24
+
25
+ The Modal must be able to be closed using the X button in the header, clicking outside the container or pressing the ESC key on the keyboard.
26
+
27
+ Avoid its use for very long forms or screens with many options.
28
+
29
+ ### Recommendations for use
30
+
31
+ - Confirm deletion of an element.
32
+ - Display options as filters in lists.
33
+ - Confirm an action before moving on to another instance.
34
+
35
+ ### Related components
36
+
37
+ - Popover - It is a floating element that can be used to present information or actions in a non-intrusive way.
38
+ - Alert - It is a component that presents critical or sensitive information to the user in a non-intrusive way within the context of a screen.
39
+
40
+ ## Usage
41
+
42
+ View docs [here](https://nimbus.nuvemshop.com.br/documentation/composite-components/modal).
43
+
44
+ <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/modal",
3
- "version": "1.5.3-rc.1",
3
+ "version": "1.6.0-rc.1",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "files": [
@@ -15,8 +15,8 @@
15
15
  },
16
16
  "dependencies": {
17
17
  "@floating-ui/react": "^0.26.0",
18
- "@nimbus-ds/icon": "^3.0.0",
19
- "@nimbus-ds/icons": "^1.5.0"
18
+ "@nimbus-ds/icon": "^3.1.0-rc.5",
19
+ "@nimbus-ds/icons": "^1.7.0-rc.2"
20
20
  },
21
21
  "peerDependencies": {
22
22
  "react": "^16.8 || ^17.0 || ^18.0",
@@ -31,11 +31,11 @@
31
31
  "url": "https://github.com/TiendaNube/nimbus-design-system/issues"
32
32
  },
33
33
  "devDependencies": {
34
- "@nimbus-ds/box": "^4.1.0",
35
- "@nimbus-ds/button": "^2.5.0",
36
- "@nimbus-ds/text": "^6.3.0",
37
- "@nimbus-ds/title": "^3.1.2",
38
- "@nimbus-ds/webpack": "^1.4.0"
34
+ "@nimbus-ds/box": "^4.2.0-rc.5",
35
+ "@nimbus-ds/button": "^2.6.0-rc.5",
36
+ "@nimbus-ds/text": "^6.4.0-rc.5",
37
+ "@nimbus-ds/title": "^3.2.0-rc.1",
38
+ "@nimbus-ds/webpack": "^1.5.0-rc.1"
39
39
  },
40
- "stableVersion": "1.5.2"
40
+ "stableVersion": "1.5.3"
41
41
  }