@nimbus-ds/box 4.2.0-rc.2 → 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,146 @@
1
+ # Changelog
2
+
3
+ A low-level utility component that accepts styled system props to enable custom theme-aware styling
4
+
5
+ ## 2023-08-04 `4.1.0`
6
+
7
+ #### 🎉 New features
8
+
9
+ - Added `fontSize` property to the Component `Box` API. ([#184](https://github.com/TiendaNube/nimbus-design-system/pull/184) by [@juniorconquista](https://github.com/juniorconquista))
10
+ - Added `fontWeight` property to the Component `Box` API. ([#184](https://github.com/TiendaNube/nimbus-design-system/pull/184) by [@juniorconquista](https://github.com/juniorconquista))
11
+ - Added `lineHeight` property to the Component `Box` API. ([#184](https://github.com/TiendaNube/nimbus-design-system/pull/184) by [@juniorconquista](https://github.com/juniorconquista))
12
+ - Added `textAlign` property to the Component `Box` API. ([#184](https://github.com/TiendaNube/nimbus-design-system/pull/184) by [@juniorconquista](https://github.com/juniorconquista))
13
+
14
+ ## 2023-05-18 `4.0.0`
15
+
16
+ #### 🛠 Breaking changes
17
+
18
+ - Removed `level-` prefix from `boxShadow` component API property. ([#162](https://github.com/TiendaNube/nimbus-design-system/pull/162) by [@juniorconquista](https://github.com/juniorconquista))
19
+
20
+ ## 2023-03-31 `3.2.0`
21
+
22
+ ### 🎉 New features
23
+
24
+ - Added `textDecoration` property to the Component. ([#136](https://github.com/TiendaNube/nimbus-design-system/pull/136) by [@juniorconquista](https://github.com/juniorconquista))
25
+
26
+ ## 2023-03-24 `3.1.0`
27
+
28
+ ### 💡 Others
29
+
30
+ - Adjusted the component properties interface to use `ComponentPropsWithRef` and include the `as` prop in the output interface. ([#134](https://github.com/TiendaNube/nimbus-design-system/pull/134) by [@juniorconquista](https://github.com/juniorconquista))
31
+
32
+ ## 2023-03-13 `3.0.0`
33
+
34
+ ### 🛠 Breaking changes
35
+
36
+ - Changed the `backgroundColor` properties to `primary-interactive`, `primary-surface`, `primary-surfaceHighlight`, `primary-textLow`, `success-interactive`, `success-surface`, `success-surfaceHighlight`, `success-textLow`, `warning-interactive`, `warning-surface`, `warning-surfaceHighlight`, `warning-textLow`, `danger-interactive`, `danger-surface`, `danger-surfaceHighlight`, `danger-textLow`, `neutral-background`, `neutral-interactive`, `neutral-surface`, `neutral-surfaceHighlight`, `neutral-surfaceDisabled` and `neutral-textLow`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
37
+ - Changed the `color` properties to `primary-interactive`, `primary-surface`, `primary-surfaceHighlight`, `primary-textLow`, `success-interactive`, `success-surface`, `success-surfaceHighlight`, `success-textLow`, `warning-interactive`, `warning-surface`, `warning-surfaceHighlight`, `warning-textLow`, `danger-interactive`, `danger-surface`, `danger-surfaceHighlight`, `danger-textLow`, `neutral-background`, `neutral-interactive`, `neutral-surface`, `neutral-surfaceHighlight`, `neutral-surfaceDisabled` and `neutral-textLow`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
38
+ - Changed the `borderColor` properties to `primary-interactive`, `primary-surface`, `primary-surfaceHighlight`, `success-interactive`, `success-surface`, `success-surfaceHighlight`, `warning-interactive`, `warning-surface`, `warning-surfaceHighlight`, `danger-interactive`, `danger-surface`, `danger-surfaceHighlight`, `neutral-interactive`, `neutral-surface` and `neutral-surfaceHighlight`. ([#110](https://github.com/TiendaNube/nimbus-design-system/pull/110) by [@juniorconquista](https://github.com/juniorconquista))
39
+
40
+ ## 2023-02-23 `2.7.0`
41
+
42
+ ### 🎉 New features
43
+
44
+ - Added server side-rendering support to component. ([#105](https://github.com/TiendaNube/nimbus-design-system/pull/105) by [@juniorconquista](https://github.com/juniorconquista))
45
+ - Added `"border-box"` as default value for `boxSizing` property. ([#106](https://github.com/TiendaNube/nimbus-design-system/pull/106) by [@juanchigallego](https://github.com/juanchigallego))
46
+ - Added `backgroundImage`, `zIndex`, `backgroundPosition`, `backgroundBlendMode`, `backgroundRepeat`, `backgroundSize`, `color`, `minHeight`, `minWidth`, `flexGrow`, `order` and `alignSelf` properties to component sprinkles. ([#106](https://github.com/TiendaNube/nimbus-design-system/pull/106) by [@juanchigallego](https://github.com/juanchigallego))
47
+
48
+ ## 2023-02-13 `2.6.0`
49
+
50
+ ### 💡 Others
51
+
52
+ - Adjusted component typing and documentation. ([#89](https://github.com/TiendaNube/nimbus-design-system/pull/89) by [@juanchigallego](https://github.com/juanchigallego))
53
+
54
+ ## 2023-02-10 `2.5.0`
55
+
56
+ ### 🎉 New features
57
+
58
+ - Added `none` as option in `display` sprinkles type. ([#88](https://github.com/TiendaNube/nimbus-design-system/pull/88) by [@juanchigallego](https://github.com/juanchigallego))
59
+
60
+ ## 2023-02-10 `2.4.0`
61
+
62
+ ### 🎉 New features
63
+
64
+ - Added `boxShadow`, `transitionDuration`, `transitionDelay`, `transitionTimingFunction` and `transitionProperty` to component sprinkles. ([#87](https://github.com/TiendaNube/nimbus-design-system/pull/87) by [@juanchigallego](https://github.com/juanchigallego))
65
+ - Added `not-allowed` and `grab` options to `cursor` property. ([#87](https://github.com/TiendaNube/nimbus-design-system/pull/87) by [@juanchigallego](https://github.com/juanchigallego))
66
+ - Added `disabled` state to conditions. ([#87](https://github.com/TiendaNube/nimbus-design-system/pull/87) by [@juanchigallego](https://github.com/juanchigallego))
67
+ - Added `transparent` option to `backgroundColor` and `borderColor` sprinkles. ([#87](https://github.com/TiendaNube/nimbus-design-system/pull/87) by [@juanchigallego](https://github.com/juanchigallego))
68
+
69
+ ## 2023-02-09 `2.3.0`
70
+
71
+ ### 🎉 New features
72
+
73
+ - Added properties present in the `@nimbus-ds/stack` package to the component because `Stack` has been deprecated. ([#83](https://github.com/TiendaNube/nimbus-design-system/pull/83) by [@juniorconquista](https://github.com/juniorconquista))
74
+
75
+ ## 2023-02-08 `2.2.0`
76
+
77
+ ### 🎉 New features
78
+
79
+ - Added polymorphic typing support to component. ([#81](https://github.com/TiendaNube/nimbus-design-system/pull/81) by [@juniorconquista](https://github.com/juniorconquista))
80
+ - Added `as` property to the Component. ([#81](https://github.com/TiendaNube/nimbus-design-system/pull/81) by [@juniorconquista](https://github.com/juniorconquista))
81
+ - Added `auto` margin properties to the Component. ([#81](https://github.com/TiendaNube/nimbus-design-system/pull/81) by [@juniorconquista](https://github.com/juniorconquista))
82
+
83
+ ## 2023-01-31 `2.1.0`
84
+
85
+ ### 🎉 New features
86
+
87
+ - Add new sprinkles properties `overflow`, `position`, `maxHeight`, `maxWidth`, `top`, `bottom`, `left` and `right` to Component Story. ([#76](https://github.com/TiendaNube/nimbus-design-system/pull/76) by [@juanchigallego](https://github.com/juanchigallego))
88
+
89
+ ## 2022-12-22 `2.0.0`
90
+
91
+ ### 💡 Others
92
+
93
+ - 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))
94
+
95
+ ## 2022-12-07 `1.2.0`
96
+
97
+ ### 🎉 New features
98
+
99
+ - 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))
100
+
101
+ ### 📚 3rd party library updates
102
+
103
+ - Removed `terser-webpack-plugin@5.3.5`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
104
+ - Removed `ts-loader@9.3.1`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
105
+ - Removed `webpack-cli@4.10.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
106
+ - Removed `webpack@5.74.0`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
107
+ - Removed `typescript@4.7.4`. ([#63](https://github.com/TiendaNube/nimbus-design-system/pull/63) by [@juniorconquista](https://github.com/juniorconquista))
108
+
109
+ ## 2022-11-24 `1.1.0`
110
+
111
+ ### 🎉 New features
112
+
113
+ - Added `boxSizing` property to the Component. ([#58](https://github.com/TiendaNube/nimbus-design-system/pull/#58) by [@juniorconquista](https://github.com/juniorconquista))
114
+
115
+ ### 💡 Others
116
+
117
+ - Fixed component documentation and typing. ([#58](https://github.com/TiendaNube/nimbus-design-system/pull/#58) by [@juniorconquista](https://github.com/juniorconquista))
118
+
119
+ ## 2022-11-16 `1.0.2`
120
+
121
+ ### 🐛 Bug fixes
122
+
123
+ - Added `box-sizing` to component styling. ([#56](https://github.com/TiendaNube/nimbus-design-system/pull/#56) by [@juniorconquista](https://github.com/juniorconquista))
124
+
125
+ ## 2022-11-09 `1.0.1`
126
+
127
+ ### 🐛 Bug fixes
128
+
129
+ - Fixed component property typing. ([#53](https://github.com/TiendaNube/nimbus-design-system/pull/#53) by [@juniorconquista](https://github.com/juniorconquista))
130
+
131
+ ## 2022-10-11 `1.0.0`
132
+
133
+ ### 📚 3rd party library updates
134
+
135
+ - Added `@vanilla-extract/dynamic@2.0.2`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
136
+ - Added `@vanilla-extract/webpack-plugin@2.1.11`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
137
+ - Added `terser-webpack-plugin@5.3.5`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
138
+ - Added `ts-loader@9.3.1`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
139
+ - Added `typescript@4.7.4`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
140
+ - Added `webpack@5.74.0`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
141
+ - Added `webpack-cli@4.10.0`. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
142
+
143
+ ### 🎉 New features
144
+
145
+ - Added `width`, `height`, `borderRadius`, `borderWidth`, `backgroundColor`, `borderColor`, `paddings`and `margins` properties to the Component. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
146
+ - Added stories on Component. ([#38](https://github.com/TiendaNube/nimbus-design-system/pull/38) by [@juniorconquista](https://github.com/juniorconquista))
package/dist/README.md ADDED
@@ -0,0 +1,65 @@
1
+ # `@nimbus-ds/box`
2
+
3
+ [![@nimbus-ds/box](https://img.shields.io/npm/v/@nimbus-ds/box?label=%40nimbus-ds%2Fbox)](https://www.npmjs.com/package/@nimbus-ds/box)
4
+
5
+ The Box component allows us to group and space elements or other components.
6
+
7
+ ## Installation
8
+
9
+ ```sh
10
+ $ yarn add @nimbus-ds/box
11
+ # or
12
+ $ npm install @nimbus-ds/box
13
+ ```
14
+
15
+ ### Anatomia do componente
16
+
17
+ O componente é composto por uma container com múltiplas propriedades visuais e de posicionamento.
18
+
19
+ ## Guidelines
20
+
21
+ Utilizamos esse componente para agrupar outros componentes, delimitar tamanhos e posicionamentos, controlar propriedades visuais e de espaçamento.
22
+
23
+ ### Controle visual
24
+
25
+ É possível controlar os aspectos visuais do box, modificando a cor de background, espessura, radius, estilo e cor da borda. O componente também possui um controle visual responsivo, que possibilita a definição de propriedades visuais diferentes para distintas resolução.
26
+
27
+ ### Controle de posicionamento
28
+
29
+ Também é possível controlar os espaçamentos internos (paddings) e os espaçamentos externos (margens) em relação a elementos que estão ao redor.
30
+
31
+ ### Recomendações de uso
32
+
33
+ - Construir containers
34
+ - Agrupar componentes
35
+ - Personalizar fundos e bordas
36
+ - Posicionar componentes
37
+
38
+ ### Suporte polimórfico
39
+
40
+ Esse componente pode ser renderizado como qualquer elemento HTML ou componente React, usando a propriedade `as`. Essa funcção permite construir diferentes elementos aproveitando a flexibilidade do componente Box e mantendo um bom nível de semántica HTML.
41
+
42
+ ### Property abbreviations
43
+
44
+ Component properties have abbreviations to make them easier to use, they
45
+ are applicable on paddings, margins and their positioning.
46
+
47
+ - m = margin
48
+ - p = padding
49
+ - r = right
50
+ - l = left
51
+ - t = top
52
+ - b = bottom
53
+ - x = left and right
54
+ - y = top and bottom
55
+
56
+ ### Examples of use:
57
+
58
+ - ml = marginLeft
59
+ - pb = paddingBottom
60
+ - py = paddingY
61
+ - mx = marginX
62
+
63
+ ## Usage
64
+
65
+ View docs [here](https://nimbus.nuvemshop.com.br/documentation/atomic-components/box).
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nimbus-ds/box",
3
- "version": "4.2.0-rc.2",
3
+ "version": "4.2.0-rc.5",
4
4
  "license": "MIT",
5
5
  "main": "dist/index.js",
6
6
  "files": [
@@ -26,7 +26,7 @@
26
26
  "url": "https://github.com/TiendaNube/nimbus-design-system/issues"
27
27
  },
28
28
  "devDependencies": {
29
- "@nimbus-ds/webpack": "^1.4.0",
29
+ "@nimbus-ds/webpack": "^1.5.0-rc.1",
30
30
  "@vanilla-extract/dynamic": "^2.0.3"
31
31
  },
32
32
  "stableVersion": "4.1.0"