@nimbus-ds/popover 4.2.0-rc.4 → 4.2.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.
@@ -0,0 +1,137 @@
1
+ # Changelog
2
+
3
+ Use Popovers to bring attention to specific user interface elements and suggest an action or to guide users through a new experience
4
+
5
+ ## 2023-10-13 `4.1.1`
6
+
7
+ ### 🎉 New features
8
+
9
+ - Added `maxWidth` and `matchReferenceWidth` properties to the Component. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
10
+
11
+ #### 🐛 Bug fixes
12
+
13
+ - Fixed bug where the maximum width of the popover exceeded the maximum size of a screen. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
14
+ - Removed fixed minimum width so that the minimum width respects the content of the popover. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
15
+ - Fixed arrow positioning. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
16
+ - Fixed the positioning of the popover so that if it does not fit in the chosen position, it automatically moves to a position that has positioning space. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
17
+
18
+ #### 📚 3rd party library updates
19
+
20
+ - Updated `@floating-ui/react@0.26.0`. ([#196](https://github.com/TiendaNube/nimbus-design-system/pull/196) by [@juniorconquista](https://github.com/juniorconquista))
21
+
22
+ ## 2023-07-11 `4.1.0`
23
+
24
+ #### 📚 3rd party library updates
25
+
26
+ - Updated `@floating-ui/react@0.24.6`. ([#179](https://github.com/TiendaNube/nimbus-design-system/pull/179) by [@juanchigallego](https://github.com/juanchigallego))
27
+
28
+ ## 2023-05-18 `4.0.0`
29
+
30
+ #### 🛠 Breaking changes
31
+
32
+ - Changed the dynamic sending option of the `zIndex` property to use `zIndex` in the component API. ([#162](https://github.com/TiendaNube/nimbus-design-system/pull/162) by [@juniorconquista](https://github.com/juniorconquista))
33
+
34
+ ## 2023-05-22 `3.2.2`
35
+
36
+ ### 📚 3rd party library updates
37
+
38
+ - Removed `@floating-ui/react-dom-interactions`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
39
+ - Added `@floating-ui/react`. ([#157](https://github.com/TiendaNube/nimbus-design-system/pull/157) by [@juanchigallego](https://github.com/juanchigallego))
40
+
41
+ ## 2023-05-02 `3.1.1`
42
+
43
+ #### 🐛 Bug fixes
44
+
45
+ - Omit `content` HTML prop on `Popover` API. ([#152](https://github.com/TiendaNube/nimbus-design-system/pull/152) by [@juanchigallego](https://github.com/juanchigallego))
46
+
47
+ ## 2023-04-13 `3.1.0`
48
+
49
+ #### 🎉 New features
50
+
51
+ - Added renderProps functionality to the component so that it is possible to obtain the internal state of the popover in the component's children. ([#149](https://github.com/TiendaNube/nimbus-design-system/pull/149) by [@juniorconquista](https://github.com/juniorconquista))
52
+
53
+ ## 2023-03-13 `3.0.0`
54
+
55
+ ### 🛠 Breaking changes
56
+
57
+ - Changed the `backgroundColor` properties to `primary-surfaceHighlight`, `primary-interactiveHover`, `success-surfaceHighlight`, `danger-surfaceHighlight`, `neutral-surfaceHighlight` and `warning-surfaceHighlight`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
58
+ - Changed the `color` properties to `primary-surfaceHighlight`, `primary-interactiveHover`, `success-surfaceHighlight`, `danger-surfaceHighlight`, `neutral-surfaceHighlight` and `warning-surfaceHighlight`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
59
+
60
+ ### 💡 Others
61
+
62
+ - Refactored style classes to have more semantic names. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
63
+
64
+ ## 2023-02-24 `2.3.0`
65
+
66
+ ### 🎉 New features
67
+
68
+ - Added `backgroundColor`, `color`, `zIndex`, `height` and `width` properties to the Component. ([#106](https://github.com/TiendaNube/nimbus-design-system/pull/106) by [@juniorconquista](https://github.com/juniorconquista))
69
+
70
+ ## 2023-02-23 `2.2.0`
71
+
72
+ ### 🎉 New features
73
+
74
+ - Added server side-rendering support to component. ([#105](https://github.com/TiendaNube/nimbus-design-system/pull/105) by [@juniorconquista](https://github.com/juniorconquista))
75
+
76
+ ## 2023-01-27 `2.1.0`
77
+
78
+ ### 🎉 New features
79
+
80
+ - Rename color properties to `neutral.background`, `primary.surfaceHighlight`, `success.surfaceHighlight`, `warning.surfaceHighlight`, `danger.surfaceHighlight` and `neutral.surfaceHighlight`. ([#76](https://github.com/TiendaNube/nimbus-design-system/pull/76) by [@juanchigallego](https://github.com/juanchigallego))
81
+ - Add `primary.interactiveHover` option to `appearance` property. ([#76](https://github.com/TiendaNube/nimbus-design-system/pull/76) by [@juanchigallego](https://github.com/juanchigallego))
82
+
83
+ ## 2022-12-22 `2.0.0`
84
+
85
+ ### 💡 Others
86
+
87
+ - 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))
88
+
89
+ ## 2022-12-07 `1.3.0`
90
+
91
+ ### 🎉 New features
92
+
93
+ - 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))
94
+
95
+ ### 📚 3rd party library updates
96
+
97
+ - Removed `terser-webpack-plugin@5.3.5`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
98
+ - Removed `ts-loader@9.3.1`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
99
+ - Removed `webpack-cli@4.10.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
100
+ - Removed `webpack@5.74.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
101
+ - Removed `typescript@4.7.4`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
102
+
103
+ ## 2022-10-24 `1.2.0`
104
+
105
+ ### 🎉 New features
106
+
107
+ - Added `visible` e `onVisibility` properties to the component. ([#48](https://github.com/TiendaNube/nimbus-design-system/pull/48) by [@juniorconquista](https://github.com/juniorconquista))
108
+
109
+ ## 2022-10-21 `1.1.0`
110
+
111
+ ### 🎉 New features
112
+
113
+ - Added `enabledHover`, `enabledClick`, `enabledDismiss` and `offset` properties to the component. ([#45](https://github.com/TiendaNube/nimbus-design-system/pull/45) by [@juniorconquista](https://github.com/juniorconquista))
114
+ - Added `top-start`, `top-end`, `right-start`, `right-end`, `bottom-start`, `bottom-end`, `left-start` and `left-end` position to the component property. ([#45](https://github.com/TiendaNube/nimbus-design-system/pull/45) by [@juniorconquista](https://github.com/juniorconquista))
115
+
116
+ ## 2022-10-14 `1.0.1`
117
+
118
+ ### 🎉 New features
119
+
120
+ - Added box-shadow to popover arrow. ([#40](https://github.com/TiendaNube/nimbus-design-system/pull/40) by [@juniorconquista](https://github.com/juniorconquista))
121
+ - Added styles so that the popover container has a maximum width relative to the anchor size. ([#40](https://github.com/TiendaNube/nimbus-design-system/pull/40) by [@juniorconquista](https://github.com/juniorconquista))
122
+
123
+ ## 2022-10-06 `1.0.0`
124
+
125
+ ### 📚 3rd party library updates
126
+
127
+ - Added `@floating-ui/react-dom-interactions@^0.10.1`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
128
+ - Added `terser-webpack-plugin@5.3.5`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
129
+ - Added `ts-loader@9.3.1`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
130
+ - Added `typescript@4.7.4`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
131
+ - Added `webpack@5.74.0`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
132
+ - Added `webpack-cli@4.10.0`. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
133
+
134
+ ### 🎉 New features
135
+
136
+ - Added `children`, `content`, `arrow`, `appearance`, `padding` and `position` properties to the Component. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
137
+ - Added stories on Component. ([#37](https://github.com/TiendaNube/nimbus-design-system/pull/37) by [@juniorconquista](https://github.com/juniorconquista))
package/dist/README.md ADDED
@@ -0,0 +1,49 @@
1
+ # `@nimbus-ds/popover`
2
+
3
+ [![@nimbus-ds/popover](https://img.shields.io/npm/v/@nimbus-ds/popover?label=%40nimbus-ds%2Fpopover)](https://www.npmjs.com/package/@nimbus-ds/popover)
4
+
5
+ The Popover component allows us to show more elements inside a floating box.
6
+
7
+ ## Installation
8
+
9
+ ```sh
10
+ $ yarn add @nimbus-ds/popover
11
+ # or
12
+ $ npm install @nimbus-ds/popover
13
+ ```
14
+
15
+ ### Component Anatomy
16
+
17
+ The component consists of a floating box with indicative arrows and optional paddings.
18
+
19
+ ## Guidelines
20
+
21
+ We use this component when we need to show additional components to provide more information or context within a visualization without using visible space.
22
+
23
+ This information should be secondary and non-essential, as it will remain hidden until the user interacts with the popover.
24
+
25
+ We can also use it when we need to provide a list of actions for a certain component and we don't have space to include them in it.
26
+
27
+ ### Indicator arrows
28
+
29
+ The use of arrows is recommended to make a reference between the Popover and the component that displays it, and should be used when this link is not clear at first glance.
30
+
31
+ ### Padding
32
+
33
+ We can configure the padding according to the component chosen to be inside the Popover, for example if the inserted element already has padding we can deactivate this functionality.
34
+
35
+ ### Recommendation for use
36
+
37
+ - View list of products within an order
38
+ - View lists of complementary actions
39
+ - Display content related to new features
40
+
41
+ ### Related components
42
+
43
+ - Tooltip - Can be used to give the user quick tips related to some element on the screen.
44
+
45
+ ## Usage
46
+
47
+ View docs [here](https://nimbus.nuvemshop.com.br/documentation/atomic-components/popover).
48
+
49
+ <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/popover",
3
- "version": "4.2.0-rc.4",
3
+ "version": "4.2.0-rc.5",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "files": [
@@ -29,8 +29,8 @@
29
29
  "url": "https://github.com/TiendaNube/nimbus-design-system/issues"
30
30
  },
31
31
  "devDependencies": {
32
- "@nimbus-ds/box": "^4.2.0-rc.4",
33
- "@nimbus-ds/webpack": "^1.4.1-rc.1",
32
+ "@nimbus-ds/box": "^4.2.0-rc.5",
33
+ "@nimbus-ds/webpack": "^1.5.0-rc.1",
34
34
  "@vanilla-extract/dynamic": "^2.0.3"
35
35
  },
36
36
  "stableVersion": "4.1.2"