@luzmo/lucero 1.0.1-alpha.44 → 1.0.1-alpha.46
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 +73 -9
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,10 @@
|
|
|
1
|
-
|
|
1
|
+
# Lucero
|
|
2
|
+
|
|
3
|
+
**Luzmo's Design System** — A collection of reusable web components built with [Lit](https://lit.dev/) for creating consistent, accessible, and beautiful user interfaces.
|
|
4
|
+
|
|
5
|
+
## Alpha
|
|
6
|
+
|
|
7
|
+
> ⚠️ This package is in alpha state. Do not use in production. Expect breaking changes.
|
|
2
8
|
|
|
3
9
|
## Installation
|
|
4
10
|
|
|
@@ -6,24 +12,82 @@ Luzmo Design system - Lucero
|
|
|
6
12
|
npm install @luzmo/lucero
|
|
7
13
|
```
|
|
8
14
|
|
|
9
|
-
|
|
15
|
+
## Usage
|
|
16
|
+
|
|
17
|
+
Import individual components:
|
|
18
|
+
|
|
19
|
+
```typescript
|
|
10
20
|
import '@luzmo/lucero/button';
|
|
21
|
+
import '@luzmo/lucero/text-field';
|
|
22
|
+
import '@luzmo/lucero/menu';
|
|
11
23
|
```
|
|
12
24
|
|
|
25
|
+
Use in your HTML:
|
|
26
|
+
|
|
13
27
|
```html
|
|
14
|
-
<luzmo-button>Click me</luzmo-button>
|
|
28
|
+
<luzmo-button variant="primary">Click me</luzmo-button>
|
|
29
|
+
<luzmo-text-field
|
|
30
|
+
label="Email"
|
|
31
|
+
placeholder="Enter your email"
|
|
32
|
+
></luzmo-text-field>
|
|
15
33
|
```
|
|
16
34
|
|
|
17
|
-
##
|
|
18
|
-
|
|
19
|
-
This repository is in alpha state. Do not use the web components in production.
|
|
20
|
-
Expect breaking changes.
|
|
35
|
+
## Available Components
|
|
21
36
|
|
|
22
|
-
|
|
37
|
+
| Component | Import |
|
|
38
|
+
| -------------------- | ------------------------------------ |
|
|
39
|
+
| Accordion | `@luzmo/lucero/accordion` |
|
|
40
|
+
| Action Bar | `@luzmo/lucero/action-bar` |
|
|
41
|
+
| Action Button | `@luzmo/lucero/action-button` |
|
|
42
|
+
| Action Group | `@luzmo/lucero/action-group` |
|
|
43
|
+
| Action Menu | `@luzmo/lucero/action-menu` |
|
|
44
|
+
| Avatar | `@luzmo/lucero/avatar` |
|
|
45
|
+
| Button | `@luzmo/lucero/button` |
|
|
46
|
+
| Button Group | `@luzmo/lucero/button-group` |
|
|
47
|
+
| Calendar | `@luzmo/lucero/calendar` |
|
|
48
|
+
| Chat Message | `@luzmo/lucero/chat-message` |
|
|
49
|
+
| Chat Message Group | `@luzmo/lucero/chat-message-group` |
|
|
50
|
+
| Checkbox | `@luzmo/lucero/checkbox` |
|
|
51
|
+
| Color Area | `@luzmo/lucero/color-area` |
|
|
52
|
+
| Color Field | `@luzmo/lucero/color-field` |
|
|
53
|
+
| Color Menu | `@luzmo/lucero/color-menu` |
|
|
54
|
+
| Color Palette | `@luzmo/lucero/color-palette` |
|
|
55
|
+
| Color Picker | `@luzmo/lucero/color-picker` |
|
|
56
|
+
| Color Slider | `@luzmo/lucero/color-slider` |
|
|
57
|
+
| Date Time Picker | `@luzmo/lucero/date-time-picker` |
|
|
58
|
+
| Divider | `@luzmo/lucero/divider` |
|
|
59
|
+
| Field Group | `@luzmo/lucero/field-group` |
|
|
60
|
+
| Field Label | `@luzmo/lucero/field-label` |
|
|
61
|
+
| Icon | `@luzmo/lucero/icon` |
|
|
62
|
+
| Menu | `@luzmo/lucero/menu` |
|
|
63
|
+
| Multi Language Field | `@luzmo/lucero/multi-language-field` |
|
|
64
|
+
| Number Field | `@luzmo/lucero/number-field` |
|
|
65
|
+
| Options | `@luzmo/lucero/options` |
|
|
66
|
+
| Picker | `@luzmo/lucero/picker` |
|
|
67
|
+
| Picker Button | `@luzmo/lucero/picker-button` |
|
|
68
|
+
| Progress Circle | `@luzmo/lucero/progress-circle` |
|
|
69
|
+
| Prompt Box | `@luzmo/lucero/prompt-box` |
|
|
70
|
+
| Radio | `@luzmo/lucero/radio` |
|
|
71
|
+
| Search | `@luzmo/lucero/search` |
|
|
72
|
+
| Select | `@luzmo/lucero/select` |
|
|
73
|
+
| Slider | `@luzmo/lucero/slider` |
|
|
74
|
+
| Swatch | `@luzmo/lucero/swatch` |
|
|
75
|
+
| Switch | `@luzmo/lucero/switch` |
|
|
76
|
+
| Tabs | `@luzmo/lucero/tabs` |
|
|
77
|
+
| Tags | `@luzmo/lucero/tags` |
|
|
78
|
+
| Text Field | `@luzmo/lucero/text-field` |
|
|
79
|
+
| Toast | `@luzmo/lucero/toast` |
|
|
80
|
+
| Tooltip | `@luzmo/lucero/tooltip` |
|
|
23
81
|
|
|
24
|
-
|
|
82
|
+
## Browser Support
|
|
25
83
|
|
|
26
84
|
- Last 2 versions of Chrome
|
|
27
85
|
- Last 2 versions of Firefox
|
|
28
86
|
- Last 2 versions of Safari
|
|
29
87
|
- Last 2 versions of Edge
|
|
88
|
+
|
|
89
|
+
## License
|
|
90
|
+
|
|
91
|
+
Copyright © 2025 Luzmo. All rights reserved.
|
|
92
|
+
|
|
93
|
+
Lucero must be used according to the [Luzmo Terms of Service](https://www.luzmo.com/information-pages/terms-of-use). This license allows users with a current active Luzmo account to use Lucero.
|