@breadcoop/ui 1.0.0 → 1.0.1
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 +9 -9
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@ A React TypeScript component library for implementing Bread Coop branding in JS/
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
7
7
|
```bash
|
|
8
|
-
npm install
|
|
8
|
+
npm install @breadcoop/ui
|
|
9
9
|
```
|
|
10
10
|
|
|
11
11
|
## Usage Options
|
|
@@ -16,9 +16,9 @@ Perfect for projects that want to use pre-built components without configuration
|
|
|
16
16
|
|
|
17
17
|
```tsx
|
|
18
18
|
import React from "react";
|
|
19
|
-
import { LiftedButton, Heading1, Body } from "
|
|
19
|
+
import { LiftedButton, Heading1, Body } from "@breadcoop/ui";
|
|
20
20
|
// Import the complete theme CSS
|
|
21
|
-
import "
|
|
21
|
+
import "@breadcoop/ui/theme";
|
|
22
22
|
|
|
23
23
|
function App() {
|
|
24
24
|
return (
|
|
@@ -42,17 +42,17 @@ For projects that want full Tailwind integration with custom utilities and your
|
|
|
42
42
|
```js
|
|
43
43
|
// tailwind.config.js
|
|
44
44
|
module.exports = {
|
|
45
|
-
presets: [require("
|
|
45
|
+
presets: [require("@breadcoop/ui/tailwind-preset")],
|
|
46
46
|
content: [
|
|
47
47
|
"./src/**/*.{js,ts,jsx,tsx}",
|
|
48
|
-
"./node_modules/
|
|
48
|
+
"./node_modules/@breadcoop/ui/dist/**/*.{js,ts,jsx,tsx}",
|
|
49
49
|
],
|
|
50
50
|
};
|
|
51
51
|
```
|
|
52
52
|
|
|
53
53
|
```tsx
|
|
54
54
|
import React from "react";
|
|
55
|
-
import { LiftedButton, Heading1, Typography } from "
|
|
55
|
+
import { LiftedButton, Heading1, Typography } from "@breadcoop/ui";
|
|
56
56
|
|
|
57
57
|
function App() {
|
|
58
58
|
return (
|
|
@@ -78,12 +78,12 @@ function App() {
|
|
|
78
78
|
```css
|
|
79
79
|
/* globals.css */
|
|
80
80
|
@import "tailwindcss";
|
|
81
|
-
@import "
|
|
81
|
+
@import "@breadcoop/ui/tailwind-preset";
|
|
82
82
|
```
|
|
83
83
|
|
|
84
84
|
```tsx
|
|
85
85
|
import React from "react";
|
|
86
|
-
import { LiftedButton, Heading1, Body } from "
|
|
86
|
+
import { LiftedButton, Heading1, Body } from "@breadcoop/ui";
|
|
87
87
|
import "./globals.css";
|
|
88
88
|
|
|
89
89
|
function App() {
|
|
@@ -197,7 +197,7 @@ A unique button component with a "lifted" design that creates a 3D effect with a
|
|
|
197
197
|
#### Examples
|
|
198
198
|
|
|
199
199
|
```tsx
|
|
200
|
-
import { LiftedButton } from "
|
|
200
|
+
import { LiftedButton } from "@breadcoop/ui";
|
|
201
201
|
import { ArrowUpRight, SignOut } from "@phosphor-icons/react";
|
|
202
202
|
|
|
203
203
|
// Basic usage
|