@eagami/ui 0.4.0 → 0.4.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 +15 -15
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<p align="center">
|
|
2
|
-
<img src="docs/images/header.png" alt="eagami design system — elegant web design." width="800" />
|
|
2
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/eagami-header.png" alt="eagami design system — elegant web design." width="800" />
|
|
3
3
|
</p>
|
|
4
4
|
|
|
5
5
|
A lightweight, accessible Angular component library built on CSS custom properties. Ready to use out of the box — install, import, and start building.
|
|
@@ -91,7 +91,7 @@ Variants: `primary` | `secondary` | `ghost` | `danger`. Sizes: `sm` | `md` | `lg
|
|
|
91
91
|
</ea-button>
|
|
92
92
|
```
|
|
93
93
|
|
|
94
|
-
<img src="docs/images/button.png" alt="Button component" width="560" />
|
|
94
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/button.png" alt="Button component" width="560" />
|
|
95
95
|
|
|
96
96
|
---
|
|
97
97
|
|
|
@@ -108,7 +108,7 @@ Full `ControlValueAccessor` support. Types: `text` | `email` | `password` | `num
|
|
|
108
108
|
[(value)]="email" />
|
|
109
109
|
```
|
|
110
110
|
|
|
111
|
-
<img src="docs/images/input.png" alt="Input component" width="560" />
|
|
111
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/input.png" alt="Input component" width="560" />
|
|
112
112
|
|
|
113
113
|
---
|
|
114
114
|
|
|
@@ -125,7 +125,7 @@ Mirrors the Input API with `ControlValueAccessor`. Configurable `rows`, `resize`
|
|
|
125
125
|
[(value)]="message" />
|
|
126
126
|
```
|
|
127
127
|
|
|
128
|
-
<img src="docs/images/textarea.png" alt="Textarea component" width="560" />
|
|
128
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/textarea.png" alt="Textarea component" width="560" />
|
|
129
129
|
|
|
130
130
|
---
|
|
131
131
|
|
|
@@ -137,7 +137,7 @@ Mirrors the Input API with `ControlValueAccessor`. Configurable `rows`, `resize`
|
|
|
137
137
|
<ea-checkbox label="Accept terms and conditions" [(checked)]="accepted" />
|
|
138
138
|
```
|
|
139
139
|
|
|
140
|
-
<img src="docs/images/checkbox.png" alt="Checkbox component" width="560" />
|
|
140
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/checkbox.png" alt="Checkbox component" width="560" />
|
|
141
141
|
|
|
142
142
|
---
|
|
143
143
|
|
|
@@ -149,7 +149,7 @@ Toggle switch with `ControlValueAccessor`. Sizes: `sm` | `md` | `lg`.
|
|
|
149
149
|
<ea-switch label="Enable notifications" [(checked)]="notificationsOn" />
|
|
150
150
|
```
|
|
151
151
|
|
|
152
|
-
<img src="docs/images/switch.png" alt="Switch component" width="560" />
|
|
152
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/switch.png" alt="Switch component" width="560" />
|
|
153
153
|
|
|
154
154
|
---
|
|
155
155
|
|
|
@@ -165,7 +165,7 @@ Composite pattern with `ControlValueAccessor`. Supports `vertical` and `horizont
|
|
|
165
165
|
</ea-radio-group>
|
|
166
166
|
```
|
|
167
167
|
|
|
168
|
-
<img src="docs/images/radio.png" alt="Radio group component" width="560" />
|
|
168
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/radio.png" alt="Radio group component" width="560" />
|
|
169
169
|
|
|
170
170
|
---
|
|
171
171
|
|
|
@@ -181,7 +181,7 @@ Select dropdown with `ControlValueAccessor` and keyboard navigation (Arrow keys,
|
|
|
181
181
|
[(value)]="selectedCountry" />
|
|
182
182
|
```
|
|
183
183
|
|
|
184
|
-
<img src="docs/images/dropdown.png" alt="Dropdown component" width="560" />
|
|
184
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/dropdown.png" alt="Dropdown component" width="560" />
|
|
185
185
|
|
|
186
186
|
---
|
|
187
187
|
|
|
@@ -200,7 +200,7 @@ Content container with variants: `elevated` | `outlined` | `filled`. Padding: `n
|
|
|
200
200
|
</ea-card>
|
|
201
201
|
```
|
|
202
202
|
|
|
203
|
-
<img src="docs/images/card.png" alt="Card component" width="560" />
|
|
203
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/card.png" alt="Card component" width="560" />
|
|
204
204
|
|
|
205
205
|
---
|
|
206
206
|
|
|
@@ -214,7 +214,7 @@ Image with initials or icon fallback. Sizes: `xs` | `sm` | `md` | `lg` | `xl`. S
|
|
|
214
214
|
<ea-avatar /> <!-- shows fallback user icon -->
|
|
215
215
|
```
|
|
216
216
|
|
|
217
|
-
<img src="docs/images/avatar.png" alt="Avatar component" width="560" />
|
|
217
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/avatar.png" alt="Avatar component" width="560" />
|
|
218
218
|
|
|
219
219
|
---
|
|
220
220
|
|
|
@@ -229,7 +229,7 @@ Canvas-based image editor with drag-and-drop upload, pan, zoom (slider + scroll
|
|
|
229
229
|
(cropped)="onCropped($event)" />
|
|
230
230
|
```
|
|
231
231
|
|
|
232
|
-
<img src="docs/images/avatar-editor.png" alt="Avatar editor component" width="560" />
|
|
232
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/avatar-editor.png" alt="Avatar editor component" width="560" />
|
|
233
233
|
|
|
234
234
|
---
|
|
235
235
|
|
|
@@ -242,7 +242,7 @@ Semantic status indicators. Variants: `default` | `success` | `warning` | `error
|
|
|
242
242
|
<ea-badge variant="error">Failed</ea-badge>
|
|
243
243
|
```
|
|
244
244
|
|
|
245
|
-
<img src="docs/images/badge.png" alt="Badge component" width="560" />
|
|
245
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/badge.png" alt="Badge component" width="560" />
|
|
246
246
|
|
|
247
247
|
---
|
|
248
248
|
|
|
@@ -254,7 +254,7 @@ SVG loading indicator with `role="status"` for accessibility. Sizes: `sm` | `md`
|
|
|
254
254
|
<ea-spinner size="md" label="Loading data" />
|
|
255
255
|
```
|
|
256
256
|
|
|
257
|
-
<img src="docs/images/spinner.png" alt="Spinner component" width="560" />
|
|
257
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/spinner.png" alt="Spinner component" width="560" />
|
|
258
258
|
|
|
259
259
|
---
|
|
260
260
|
|
|
@@ -268,7 +268,7 @@ Visual separator with optional label. Orientation: `horizontal` | `vertical`.
|
|
|
268
268
|
<ea-divider orientation="vertical" />
|
|
269
269
|
```
|
|
270
270
|
|
|
271
|
-
<img src="docs/images/divider.png" alt="Divider component" width="560" />
|
|
271
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/divider.png" alt="Divider component" width="560" />
|
|
272
272
|
|
|
273
273
|
---
|
|
274
274
|
|
|
@@ -327,7 +327,7 @@ Add the toast outlet once in your root template:
|
|
|
327
327
|
<ea-toast />
|
|
328
328
|
```
|
|
329
329
|
|
|
330
|
-
<img src="docs/images/toast.png" alt="Toast component" width="560" />
|
|
330
|
+
<img src="https://raw.githubusercontent.com/mwiraszka/eagami-design-system/main/docs/images/toast.png" alt="Toast component" width="560" />
|
|
331
331
|
|
|
332
332
|
## Icons
|
|
333
333
|
|
package/package.json
CHANGED