@narmi/design_system 1.3.1-beta.4 → 1.3.2

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
@@ -44,7 +44,7 @@ Please check the following chart to see the minimum browser versions supported b
44
44
 
45
45
  # Developing
46
46
 
47
- We need to set up your copy of `design_system` for local development.
47
+ We need to set up your copy of `design_system` for local development.
48
48
 
49
49
  The following command will install design_system as a local dependency and start your Storybook.
50
50
 
@@ -65,7 +65,7 @@ Results:
65
65
 
66
66
  - Storybook will now run on :6006.
67
67
  - Your local `design_system` will be [symlinked](https://docs.npmjs.com/cli/v7/commands/npm-link) into <your-repo>/design_system for local dev.
68
- - On each change to files in design_system, the `dist/index.js` file will be rebuilt -
68
+ - On each change to files in design_system, the `dist/index.js` file will be rebuilt -
69
69
  - This allows local changes to design_system to be live-updated in your consuming repo.
70
70
 
71
71
  ## Releases
@@ -97,12 +97,12 @@ fix: update global `text-rendering` value
97
97
 
98
98
  Adding a feature within the scope of the Button component:
99
99
  ```
100
- feat(Button): Add secondary button variant
100
+ feat(Button): add secondary button variant
101
101
  ```
102
102
 
103
103
  Breaking change within the Button component scope:
104
104
  ```
105
- refactor(Button)!: Remove variant `disabled`. The `disabled` boolean prop is now used to disable a button.
105
+ refactor(Button)!: remove variant `disabled`. The `disabled` boolean prop is now used to disable a button.
106
106
  ```
107
107
 
108
108
  #### What is a "Breaking Change?"
@@ -125,7 +125,7 @@ If you'd like to live-edit HTML in your components (i.e., passing custom `props.
125
125
 
126
126
  ## Contributing
127
127
 
128
- We accept PRs! We strive to make the design_system simple as well as powerful, which usually means being [open for extension](https://en.wikipedia.org/wiki/Open%E2%80%93closed_principle#:~:text=In%20object%2Doriented%20programming%2C%20the,without%20modifying%20its%20source%20code.), [but closed for modification](https://blog.cleancoder.com/uncle-bob/2014/05/12/TheOpenClosedPrinciple.html).
128
+ We accept PRs! We strive to make the design_system simple as well as powerful, which usually means being [open for extension](https://en.wikipedia.org/wiki/Open%E2%80%93closed_principle#:~:text=In%20object%2Doriented%20programming%2C%20the,without%20modifying%20its%20source%20code.), [but closed for modification](https://blog.cleancoder.com/uncle-bob/2014/05/12/TheOpenClosedPrinciple.html).
129
129
 
130
130
  We try to uphold these principles in our code review. Below please find some helpful guidelines for getting your PRs accepted:
131
131
 
@@ -133,7 +133,7 @@ We try to uphold these principles in our code review. Below please find some hel
133
133
 
134
134
  #### 1. Maintain the HTML interface
135
135
 
136
- Native HTML provides most of the attributes we want to customize in the design_system. For this reason, we've allowed passing `{...props}` through to almost any component.
136
+ Native HTML provides most of the attributes we want to customize in the design_system. For this reason, we've allowed passing `{...props}` through to almost any component.
137
137
 
138
138
  This allows you, the user, to achieve any desired behavior, by simply treating the design_system component as if it was native HTML.
139
139
 
@@ -141,7 +141,7 @@ This allows for the design_system to be opinionated about behavior specific to t
141
141
 
142
142
  ##### Example - Button:
143
143
  ```
144
- # Say you want to customize the border of your <Button> -
144
+ # Say you want to customize the border of your <Button> -
145
145
  # simply pass a `style` into the button as you would in HTML:
146
146
 
147
147
  <Button style={{borderRadius: "8px"}}>
@@ -197,9 +197,9 @@ This gives the user full control over the appearance of the Modal, while still a
197
197
 
198
198
  #### 3. Prefer native CSS over custom Javascript props
199
199
 
200
- Using CSS to solve problems allows us to provide control back to you, the user.
200
+ Using CSS to solve problems allows us to provide control back to you, the user.
201
201
 
202
- For instance, when designing a `<Card>` component, one might be tempted to add a `padding` prop.
202
+ For instance, when designing a `<Card>` component, one might be tempted to add a `padding` prop.
203
203
 
204
204
  Instead, we prefer the already-existing `style` prop, since this allows the user full control over the style.
205
205
 
@@ -219,7 +219,7 @@ return props.children // assume the user will reverse the children when s/he wa
219
219
  # One could add a `padding` prop to allow the user to customize a `<Card>`
220
220
  <Card padding={8}>...</Card>
221
221
 
222
- # Instead, rely on the native `style` prop.
222
+ # Instead, rely on the native `style` prop.
223
223
  # This lets us keep the interface small, while allowing maximum control to the user.
224
224
  <Card style={{padding: "8px"}}...</Card>
225
225
  ```
@@ -244,14 +244,14 @@ We can also [wrap components using `styled-components`](https://styled-component
244
244
  ```
245
245
  const MyCustomButton = styled(Button)`
246
246
  backgroundColor: var(--my-background-color);
247
-
247
+
248
248
  &:hover {
249
249
  backgroundColor: var(--my-custom-hover-color);
250
250
  }
251
251
  `;
252
252
  ```
253
253
 
254
- We default to using CSS to solve problems where some might reach for Javascript.
254
+ We default to using CSS to solve problems where some might reach for Javascript.
255
255
 
256
256
  Other useful links:
257
257
 
@@ -265,11 +265,10 @@ Other useful links:
265
265
  - Ask, "Can this prop be removed?"
266
266
  - Prefer CSS to JS
267
267
 
268
- We'd love for this library to be as usable as possible for all our partners.
268
+ We'd love for this library to be as usable as possible for all our partners.
269
269
 
270
270
  Feel free to ask us for suggestions or feedback - we're happy to help!
271
271
 
272
272
  ## License
273
273
 
274
274
  Source code is under a custom license based on MIT. The license restricts design_system usage to applications that integrate or interoperate with Narmi software or services, with additional restrictions for external, stand-alone applications. Please see LICENSE.md for full details.
275
-