@homlista-devs/ui 1.6.5 → 1.6.6
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 +25 -8
- package/dist/base.css +1373 -0
- package/dist/index.css +9 -30
- package/dist/precompiled.css +3644 -0
- package/dist/styles.css +1373 -0
- package/dist/tokens.css +387 -0
- package/package.json +15 -5
package/README.md
CHANGED
|
@@ -4,14 +4,14 @@
|
|
|
4
4
|
|
|
5
5
|
**A world-class, production-ready design system for modern React applications**
|
|
6
6
|
|
|
7
|
-
[](https://www.npmjs.com/package/@homlista/ui)
|
|
7
|
+
[](https://www.npmjs.com/package/@homlista-devs/ui)
|
|
8
8
|
[](https://opensource.org/licenses/MIT)
|
|
9
9
|
[](https://www.typescriptlang.org/)
|
|
10
10
|
[](https://github.com/team-homlista/ui)
|
|
11
11
|
[](https://github.com/team-homlista/ui)
|
|
12
12
|
[](https://github.com/team-homlista/ui)
|
|
13
13
|
|
|
14
|
-
[Documentation](https://team-homlista.github.io/ui) • [Storybook](https://team-homlista.github.io/ui/storybook) • [NPM](https://www.npmjs.com/package/@homlista/ui) • [GitHub](https://github.com/team-homlista/ui)
|
|
14
|
+
[Documentation](https://team-homlista.github.io/ui) • [Storybook](https://team-homlista.github.io/ui/storybook) • [NPM](https://www.npmjs.com/package/@homlista-devs/ui) • [GitHub](https://github.com/team-homlista/ui)
|
|
15
15
|
|
|
16
16
|
</div>
|
|
17
17
|
|
|
@@ -57,11 +57,11 @@
|
|
|
57
57
|
## Installation
|
|
58
58
|
|
|
59
59
|
```bash
|
|
60
|
-
npm install @homlista/ui
|
|
60
|
+
npm install @homlista-devs/ui
|
|
61
61
|
# or
|
|
62
|
-
yarn add @homlista/ui
|
|
62
|
+
yarn add @homlista-devs/ui
|
|
63
63
|
# or
|
|
64
|
-
pnpm add @homlista/ui
|
|
64
|
+
pnpm add @homlista-devs/ui
|
|
65
65
|
```
|
|
66
66
|
|
|
67
67
|
## Quick Start
|
|
@@ -72,13 +72,21 @@ First, import the design system styles in your application entry point:
|
|
|
72
72
|
|
|
73
73
|
```tsx
|
|
74
74
|
// In your main.tsx or App.tsx
|
|
75
|
-
import '@homlista/ui/styles.css';
|
|
75
|
+
import '@homlista-devs/ui/styles.css';
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
For Tailwind v4 consumers, also add a source path so app-side Tailwind generates utilities used by DS components:
|
|
79
|
+
|
|
80
|
+
```css
|
|
81
|
+
@import "@homlista-devs/ui/styles.css";
|
|
82
|
+
@import "tailwindcss";
|
|
83
|
+
@source "../../node_modules/@homlista-devs/ui/dist";
|
|
76
84
|
```
|
|
77
85
|
|
|
78
86
|
### 2. Use Components
|
|
79
87
|
|
|
80
88
|
```tsx
|
|
81
|
-
import { Button, ThemeProvider } from '@homlista/ui';
|
|
89
|
+
import { Button, ThemeProvider } from '@homlista-devs/ui';
|
|
82
90
|
|
|
83
91
|
function App() {
|
|
84
92
|
return (
|
|
@@ -89,6 +97,15 @@ function App() {
|
|
|
89
97
|
}
|
|
90
98
|
```
|
|
91
99
|
|
|
100
|
+
### CSS Entrypoints
|
|
101
|
+
|
|
102
|
+
- `@homlista-devs/ui/styles.css`: Minimal default bundle (tokens + base + DS component classes)
|
|
103
|
+
- `@homlista-devs/ui/base.css`: Alias of minimal bundle
|
|
104
|
+
- `@homlista-devs/ui/tokens.css`: Tokens and theme variables only
|
|
105
|
+
- `@homlista-devs/ui/precompiled.css`: Legacy full precompiled Tailwind bundle (deprecated)
|
|
106
|
+
|
|
107
|
+
Migration guide: `docs/CSS_PACKAGING_MIGRATION.md`.
|
|
108
|
+
|
|
92
109
|
**Note**: The `ThemeProvider` is optional. If you don't need dynamic theme switching, you can use components directly.
|
|
93
110
|
|
|
94
111
|
## Theme Customization
|
|
@@ -148,7 +165,7 @@ import { Button } from '@homlista:ui/design-system';
|
|
|
148
165
|
### PropertyCard
|
|
149
166
|
|
|
150
167
|
```tsx
|
|
151
|
-
import { PropertyCard } from '@homlista/ui';
|
|
168
|
+
import { PropertyCard } from '@homlista-devs/ui';
|
|
152
169
|
|
|
153
170
|
const property = {
|
|
154
171
|
id: '1',
|