@primer/react-brand 0.4.0-rc.a78717a → 0.4.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/lib/css/main.css +16 -16
- package/lib/design-tokens/css/tokens/base/colors/color-scales-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/base/colors/color-scales.css +1 -1
- package/lib/design-tokens/css/tokens/base/size/size.css +1 -1
- package/lib/design-tokens/css/tokens/base/typography/typography.css +1 -1
- package/lib/design-tokens/css/tokens/functional/colors/global-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/colors/global.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/accordion/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/button/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/control/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/control/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/faq/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/hero/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors-with-modes.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/inline-link/colors.css +1 -1
- package/lib/design-tokens/css/tokens/functional/components/river/base.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/border.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/breakpoints.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-coarse.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size-fine.css +1 -1
- package/lib/design-tokens/css/tokens/functional/size/size.css +1 -1
- package/lib/design-tokens/css/tokens/functional/typography/typography-responsive.css +1 -1
- package/lib/design-tokens/css/tokens/functional/typography/typography.css +1 -1
- package/lib/design-tokens/js/module/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/module/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/module/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/js/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/js/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/js/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/js/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/js/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/js/tokens/functional/typography/typography.js +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/color-scales.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/colors/color-scales.js +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/size/size.js +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/base/typography/typography.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/colors/global.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/control/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/control/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/faq/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/hero/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/inline-link/colors.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/components/river/base.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/border.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/border.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/breakpoints.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-coarse.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size-fine.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/size.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/viewport.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/size/viewport.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography-responsive.js +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.d.ts +1 -1
- package/lib/design-tokens/ts/tokens/functional/typography/typography.js +1 -1
- package/lib/forms/Checkbox/Checkbox.d.ts +1 -1
- package/lib/forms/Select/Select.d.ts +1 -1
- package/lib/forms/TextInput/TextInput.d.ts +2 -2
- package/package.json +1 -1
- package/CHANGELOG.md +0 -211
package/CHANGELOG.md
DELETED
|
@@ -1,211 +0,0 @@
|
|
|
1
|
-
# @primer/react-brand
|
|
2
|
-
|
|
3
|
-
## 0.4.0
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- [#78](https://github.com/primer/brand/pull/78) [`487a9e7`](https://github.com/primer/brand/commit/487a9e7b03b6c196358e1f1146fd87e8c4fe44d4) Thanks [@JoshBowdenConcepts](https://github.com/JoshBowdenConcepts)! - Added a new `size` prop to `Button` and a `medium` sized variant, making the previous `large` size optional.
|
|
8
|
-
|
|
9
|
-
⚠️ This update should be considered a breaking change, despite being issued in a `minor` release.
|
|
10
|
-
|
|
11
|
-
Selectable values: `medium` (default) and `large`.
|
|
12
|
-
|
|
13
|
-
**Upgrade steps:**
|
|
14
|
-
|
|
15
|
-
```diff
|
|
16
|
-
- <Button>before</Button>
|
|
17
|
-
+ <Button size="large">after</Button>
|
|
18
|
-
```
|
|
19
|
-
|
|
20
|
-
* [#69](https://github.com/primer/brand/pull/69) [`7838af5`](https://github.com/primer/brand/commit/7838af57ae2fdb94d07c188a142feebc0a4a605d) Thanks [@rezrah](https://github.com/rezrah)! - Added `FormControl`, `Checkbox`, `TextInput` and `Select` components.
|
|
21
|
-
|
|
22
|
-
**Read the Technical Previews for usage examples:**
|
|
23
|
-
|
|
24
|
-
[🔗 FormControl](https://primer.style/brand/components/FormControl)
|
|
25
|
-
|
|
26
|
-
[🔗 Checkbox](https://primer.style/brand/components/Checkbox)
|
|
27
|
-
|
|
28
|
-
[🔗 TextInput](https://primer.style/brand/components/TextInput)
|
|
29
|
-
|
|
30
|
-
[🔗 Select](https://primer.style/brand/components/Select)
|
|
31
|
-
|
|
32
|
-
## 0.3.1
|
|
33
|
-
|
|
34
|
-
### Patch Changes
|
|
35
|
-
|
|
36
|
-
- [#59](https://github.com/primer/brand/pull/59) [`fdc731b`](https://github.com/primer/brand/commit/fdc731bda050aaef7041aafe6aaa7857c49ea03b) Thanks [@rezrah](https://github.com/rezrah)! - Added `fillMedia` prop to River.Visual
|
|
37
|
-
|
|
38
|
-
Previously, all image and video children were automatically styled to fit the parent elements dimensions.
|
|
39
|
-
|
|
40
|
-
This isn't ideal in all situations, so the ability to toggle-off this behaviour is now available through an `fillMedia` prop.
|
|
41
|
-
|
|
42
|
-
## 0.3.0
|
|
43
|
-
|
|
44
|
-
### Minor Changes
|
|
45
|
-
|
|
46
|
-
- [`c8609a8`](https://github.com/primer/brand/commit/c8609a8d35ea80192d85e97794390207f4624e63) Thanks [@rezrah](https://github.com/rezrah)! - added an FAQ component, which displays a list of questions and answers relating to a particular subject.
|
|
47
|
-
|
|
48
|
-
[See usage examples](https://primer.style/brand/components/FAQ)
|
|
49
|
-
|
|
50
|
-
* [#45](https://github.com/primer/brand/pull/45) [`2fb6924`](https://github.com/primer/brand/commit/2fb6924a834ddcbad34cfb97ecfc1659d54f4ed5) Thanks [@rezrah](https://github.com/rezrah)! - > **Warning**
|
|
51
|
-
|
|
52
|
-
> This is a breaking change, but as the library is a pre-v1 release we are publishing this update as a `minor` change.
|
|
53
|
-
> Please read the following instructions carefully before updating:
|
|
54
|
-
|
|
55
|
-
### Updated references for "left" and "right" to "start" and "end"
|
|
56
|
-
|
|
57
|
-
For improved i18n support and closer alignment with our Figma naming conventions, we have updated the references for "left" and "right" to "start" and "end" respectively in `Hero` and `River` components.
|
|
58
|
-
|
|
59
|
-
```diff
|
|
60
|
-
- <River align="left">
|
|
61
|
-
- <River align="right">
|
|
62
|
-
+ <River align="start">
|
|
63
|
-
+ <River align="end">
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
## 0.2.1
|
|
67
|
-
|
|
68
|
-
### Patch Changes
|
|
69
|
-
|
|
70
|
-
- [#38](https://github.com/primer/brand/pull/38) [`b0c9293`](https://github.com/primer/brand/commit/b0c929389d62f184e5ae447c0b00e351cb2d1c6e) Thanks [@rezrah](https://github.com/rezrah)! - updated `css-loader` to generate valid (escaped) class names
|
|
71
|
-
|
|
72
|
-
## 0.2.0
|
|
73
|
-
|
|
74
|
-
### Minor Changes
|
|
75
|
-
|
|
76
|
-
- [#33](https://github.com/primer/brand/pull/33) [`662fcfc`](https://github.com/primer/brand/commit/662fcfc6d123460730317b7ddd3d3a4622d30dce) Thanks [@rezrah](https://github.com/rezrah)! - - Adds `River` component
|
|
77
|
-
|
|
78
|
-
- Renames `LinkButton` to `Button` :warning: (see below)
|
|
79
|
-
- Button supports polymorphism and can be used `as` either `a` or `button`
|
|
80
|
-
|
|
81
|
-
### `River`
|
|
82
|
-
|
|
83
|
-
**NEW** Component :sparkles:
|
|
84
|
-
|
|
85
|
-
<table>
|
|
86
|
-
<tr>
|
|
87
|
-
<th> Before</th> <th> After</th>
|
|
88
|
-
</tr>
|
|
89
|
-
<tr>
|
|
90
|
-
<td valign="top">❌</td>
|
|
91
|
-
<td valign="top">
|
|
92
|
-
|
|
93
|
-
```jsx
|
|
94
|
-
// import {River} from "@primer/react-brand";
|
|
95
|
-
|
|
96
|
-
<River>
|
|
97
|
-
<River.Visual>
|
|
98
|
-
<img
|
|
99
|
-
src="https://via.placeholder.com/600x400/f5f5f5/f5f5f5.png"
|
|
100
|
-
alt="placeholder, blank area with an off-white background color"
|
|
101
|
-
/>
|
|
102
|
-
</River.Visual>
|
|
103
|
-
<River.Content>
|
|
104
|
-
<Heading>Heading</Heading>
|
|
105
|
-
<Text>
|
|
106
|
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sapien sit ullamcorper id. Aliquam luctus sed turpis
|
|
107
|
-
felis nam pulvinar risus elementum.
|
|
108
|
-
</Text>
|
|
109
|
-
<Link href="#">Call to action</Link>
|
|
110
|
-
</River.Content>
|
|
111
|
-
</River>
|
|
112
|
-
```
|
|
113
|
-
|
|
114
|
-
</td>
|
|
115
|
-
</tr>
|
|
116
|
-
</table>
|
|
117
|
-
|
|
118
|
-
See more examples in our documentation.
|
|
119
|
-
https://primer.style/brand/components/River
|
|
120
|
-
|
|
121
|
-
### `LinkButton`
|
|
122
|
-
|
|
123
|
-
> **Warning**
|
|
124
|
-
> The changes below should be considered a breaking change for anyone relying on `LinkButton`, but as we are shipping a pre-v1 library, this has been marked as a `minor` release rather than `major`. Please remember to update your usage per the below example.
|
|
125
|
-
|
|
126
|
-
<table>
|
|
127
|
-
<tr>
|
|
128
|
-
<th> Before</th> <th> After</th>
|
|
129
|
-
</tr>
|
|
130
|
-
<tr>
|
|
131
|
-
<td valign="top">
|
|
132
|
-
|
|
133
|
-
```jsx
|
|
134
|
-
//import { LinkButton } from '@primer/react-brand';
|
|
135
|
-
|
|
136
|
-
<LinkButton href="#">Sign up</LinkButton>
|
|
137
|
-
```
|
|
138
|
-
|
|
139
|
-
</td>
|
|
140
|
-
<td valign="top">
|
|
141
|
-
|
|
142
|
-
```jsx
|
|
143
|
-
//import { Button } from '@primer/react-brand';
|
|
144
|
-
|
|
145
|
-
<Button as="a" href="#">
|
|
146
|
-
Sign up
|
|
147
|
-
</Button>
|
|
148
|
-
```
|
|
149
|
-
|
|
150
|
-
</td>
|
|
151
|
-
</tr>
|
|
152
|
-
<tr>
|
|
153
|
-
<td valign="top">
|
|
154
|
-
|
|
155
|
-
❌
|
|
156
|
-
|
|
157
|
-
</td>
|
|
158
|
-
<td valign="top">
|
|
159
|
-
|
|
160
|
-
```jsx
|
|
161
|
-
//import { Button } from '@primer/react-brand';
|
|
162
|
-
|
|
163
|
-
<Button onClick={handler}>Sign Up</Button>
|
|
164
|
-
```
|
|
165
|
-
|
|
166
|
-
</td>
|
|
167
|
-
</tr>
|
|
168
|
-
|
|
169
|
-
</table>
|
|
170
|
-
|
|
171
|
-
## 0.1.0
|
|
172
|
-
|
|
173
|
-
### Minor Changes
|
|
174
|
-
|
|
175
|
-
- [#19](https://github.com/primer/brand/pull/19) [`3b22e9e`](https://github.com/primer/brand/commit/3b22e9e0823401104d6e33b3c4f8664b755ea6ba) Thanks [@colebemis](https://github.com/colebemis)! - Add `size` prop to `Hero` component
|
|
176
|
-
|
|
177
|
-
### Patch Changes
|
|
178
|
-
|
|
179
|
-
- [#23](https://github.com/primer/brand/pull/23) [`77abf53`](https://github.com/primer/brand/commit/77abf535e77ef26fa29fb09d6d2dfb746f4bc383) Thanks [@rezrah](https://github.com/rezrah)! - add Text and Heading components
|
|
180
|
-
|
|
181
|
-
* [#29](https://github.com/primer/brand/pull/29) [`144c7d7`](https://github.com/primer/brand/commit/144c7d762a91cb691699e4f8923ab08385c77966) Thanks [@rezrah](https://github.com/rezrah)! - Removed `gh-variables.css` from package as Brand variables are now surfaced in main.css
|
|
182
|
-
|
|
183
|
-
**To upgrade:**
|
|
184
|
-
|
|
185
|
-
- _Remove_ `import "@primer/react-brand/lib/css/gh-variables.css"`
|
|
186
|
-
|
|
187
|
-
- _Add_ `import "@primer/react-brand/lib/css/main.css"`
|
|
188
|
-
|
|
189
|
-
- [#23](https://github.com/primer/brand/pull/23) [`77abf53`](https://github.com/primer/brand/commit/77abf535e77ef26fa29fb09d6d2dfb746f4bc383) Thanks [@rezrah](https://github.com/rezrah)! - forward className in Hero
|
|
190
|
-
|
|
191
|
-
* [#25](https://github.com/primer/brand/pull/25) [`4b00b72`](https://github.com/primer/brand/commit/4b00b72f5dbf5e578351ea77e1e74cddc69833e7) Thanks [@rezrah](https://github.com/rezrah)! - adds baseline tokens
|
|
192
|
-
|
|
193
|
-
- [#21](https://github.com/primer/brand/pull/21) [`ab06cce`](https://github.com/primer/brand/commit/ab06cceb6ed3b2eaca70f9738b9708343b4e6db9) Thanks [@rezrah](https://github.com/rezrah)! - Remove fixed background color from `Hero` to allow underlying customisation to be surfaced.
|
|
194
|
-
|
|
195
|
-
* [#27](https://github.com/primer/brand/pull/27) [`ca2d300`](https://github.com/primer/brand/commit/ca2d3002ba6f7ca9c719f80077c4d95246f33410) Thanks [@rezrah](https://github.com/rezrah)! - Updated Hero text appearance
|
|
196
|
-
|
|
197
|
-
- **updated** Hero description text size from `500` to `400`
|
|
198
|
-
- **updated** button alignment to not stretch on mobile viewports
|
|
199
|
-
- **removed** `size` prop. Now only one responsive size available.
|
|
200
|
-
|
|
201
|
-
## 0.0.3
|
|
202
|
-
|
|
203
|
-
### Patch Changes
|
|
204
|
-
|
|
205
|
-
- [#18](https://github.com/primer/brand/pull/18) [`0835830`](https://github.com/primer/brand/commit/0835830fc15c582e280ac692ff3d578d6bcf282e) Thanks [@rezrah](https://github.com/rezrah)! - Fixes for production bundles
|
|
206
|
-
|
|
207
|
-
## 0.0.2
|
|
208
|
-
|
|
209
|
-
### Patch Changes
|
|
210
|
-
|
|
211
|
-
- [#2](https://github.com/primer/brand/pull/2) [`ab01a8a`](https://github.com/primer/brand/commit/ab01a8ad1dc504f7a2865213b6f41c0b0adba131) Thanks [@colebemis](https://github.com/colebemis)! - Initialize releases with [changesets](https://github.com/changesets/changesets)
|