@snacky/ui 0.3.2 → 0.3.3

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
@@ -15,7 +15,8 @@ npm install @snacky/ui
15
15
  ```
16
16
 
17
17
  Published at [npmjs.com/package/@snacky/ui](https://www.npmjs.com/package/@snacky/ui).
18
- To build from source instead (e.g. to work on the components themselves):
18
+ To build from source instead (e.g. to work on the components themselves), clone
19
+ [the repo](https://github.com/rezatresnas/snacky-design-system) and, from its root:
19
20
 
20
21
  ```bash
21
22
  cd packages/react-ui
@@ -26,7 +27,7 @@ npm run build
26
27
  ## Usage
27
28
 
28
29
  ```tsx
29
- import '@snacky/ui'; // pulls in theme/tokens.css as a side effect
30
+ import '@snacky/ui/styles.css'; // required - the compiled bundle does not inject this for you
30
31
  import { Button, TextField, Checkbox } from '@snacky/ui';
31
32
 
32
33
  function SignupForm() {
@@ -133,7 +134,31 @@ what is already in the bundle.
133
134
  shape, there is no `strokeWidth` to set), and the set is **not uniform** -
134
135
  icons are authored at 16, 20 or 24px depending on use, so each carries its
135
136
  own viewBox and defaults to that natural size.
136
- - **Illustration** ships no artwork - pass your own hosted `src`.
137
+ - **Illustration** ships no artwork - you supply the image. This is
138
+ deliberate and normal (Material, Radix and Chakra ship none either); the
139
+ component owns the documented canvas size for each variant, which is the
140
+ part that belongs in a design system. The Snacky artwork itself is modified
141
+ stock and is not ours to redistribute.
142
+
143
+ ```tsx
144
+ import { Illustration } from '@snacky/ui';
145
+
146
+ <Illustration variant="empty" src="/img/empty.svg" alt="No products found" />
147
+ ```
148
+
149
+ Variant sizes are fixed: `empty` 268x200, `createAccount` 360x240,
150
+ `welcome` 200x200, `success` 200x200, `discountReferral` 268x200. Export
151
+ your artwork at those ratios (SVG preferred) and host it wherever your app
152
+ already serves static assets.
153
+
154
+ **Where to get artwork that fits:** [Open Peeps](https://www.openpeeps.com/)
155
+ is CC0 (public domain - no attribution, no restrictions), so it is the
156
+ easiest drop-in. [unDraw](https://undraw.co/) needs no attribution and
157
+ allows commercial use, but its licence forbids redistributing the assets
158
+ "in packs", so use it in your own app rather than re-publishing it inside a
159
+ library of your own. Either way, check the licence yourself before shipping
160
+ - it is the one part of this that a component library cannot decide for you.
161
+
137
162
  - **Modal/Section**: the design system documents ~9 Modal "variants" and ~13
138
163
  Section "variants", but each is really the *same* shell component
139
164
  (`BottomSheet` / `Section`) with different `children` - so that's what's