@seace/ui 0.0.3 → 0.0.5

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.
Files changed (2) hide show
  1. package/README.md +65 -32
  2. package/package.json +6 -3
package/README.md CHANGED
@@ -1,59 +1,92 @@
1
- # SeaceUiWorkspace
1
+ # @seace/ui
2
2
 
3
- This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.2.5.
3
+ Librería de componentes UI para proyectos SEACE, construida con Angular y Tailwind CSS.
4
4
 
5
- ## Development server
6
-
7
- To start a local development server, run:
5
+ ## Instalación
8
6
 
9
7
  ```bash
10
- ng serve
8
+ npm install @seace/ui
11
9
  ```
12
10
 
13
- Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
11
+ ## Requisitos
14
12
 
15
- ## Code scaffolding
13
+ - Angular 21+
14
+ - Tailwind CSS 3+
16
15
 
17
- Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
16
+ ## Configuración
18
17
 
19
- ```bash
20
- ng generate component component-name
18
+ ### 1. Registra los iconos en tu componente raíz
19
+
20
+ ```typescript
21
+ import { Component, inject, OnInit } from '@angular/core';
22
+ import { IconRegistry, ICONS_SYSTEM } from '@seace/ui';
23
+
24
+ @Component({ selector: 'app-root', ... })
25
+ export class AppComponent implements OnInit {
26
+ #registry = inject(IconRegistry);
27
+
28
+ ngOnInit() {
29
+ this.#registry.registerCategory(ICONS_SYSTEM);
30
+ // Agrega más categorías según necesites
31
+ }
32
+ }
21
33
  ```
22
34
 
23
- For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
35
+ ### 2. Configura Tailwind para incluir las clases de la librería
24
36
 
25
- ```bash
26
- ng generate --help
37
+ ```js
38
+ // tailwind.config.js
39
+ module.exports = {
40
+ content: [
41
+ './src/**/*.{html,ts}',
42
+ './node_modules/@seace/ui/**/*.mjs',
43
+ ],
44
+ };
27
45
  ```
28
46
 
29
- ## Building
47
+ ## Componentes
30
48
 
31
- To build the project run:
49
+ ### Badge
32
50
 
33
- ```bash
34
- ng build
51
+ ```html
52
+ <ui-badge color="primary" variant="ghost">Pendiente</ui-badge>
53
+ <ui-badge color="success" variant="filled" icon="check">Aprobado</ui-badge>
54
+ <ui-badge color="danger" variant="outlined" size="sm">Rechazado</ui-badge>
35
55
  ```
36
56
 
37
- This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
38
-
39
- ## Running unit tests
57
+ | Input | Tipo | Default | Descripción |
58
+ |-------|------|---------|-------------|
59
+ | `color` | `BadgeColor` | `primary` | Color semántico o decorativo |
60
+ | `variant` | `filled \| outlined \| ghost` | `ghost` | Estilo visual |
61
+ | `size` | `sm \| md \| lg` | `md` | Tamaño |
62
+ | `icon` | `string \| null` | `null` | Nombre del icono |
63
+ | `iconPosition` | `left \| right` | `left` | Posición del icono |
40
64
 
41
- To execute unit tests with the [Vitest](https://vitest.dev/) test runner, use the following command:
65
+ ### Icon
42
66
 
43
- ```bash
44
- ng test
67
+ ```html
68
+ <ui-icon name="check_circle" [size]="24" />
45
69
  ```
46
70
 
47
- ## Running end-to-end tests
71
+ | Input | Tipo | Default | Descripción |
72
+ |-------|------|---------|-------------|
73
+ | `name` | `string` | — | Nombre del icono (requerido) |
74
+ | `size` | `number` | `24` | Tamaño en px |
48
75
 
49
- For end-to-end (e2e) testing, run:
76
+ ## Iconos disponibles
50
77
 
51
- ```bash
52
- ng e2e
53
- ```
78
+ La librería incluye 1151 iconos organizados en categorías:
54
79
 
55
- Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
80
+ ```typescript
81
+ import {
82
+ ICONS_SYSTEM,
83
+ ICONS_ARROWS,
84
+ ICONS_CHART,
85
+ ICONS_DOCUMENTS,
86
+ // ...
87
+ } from '@seace/ui';
88
+ ```
56
89
 
57
- ## Additional Resources
90
+ ## Licencia
58
91
 
59
- For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
92
+ UNLICENSED — uso interno SEACE/OSCE.
package/package.json CHANGED
@@ -1,9 +1,12 @@
1
1
  {
2
2
  "name": "@seace/ui",
3
- "version": "0.0.3",
3
+ "version": "0.0.5",
4
+ "description": "Librería de componentes UI para proyectos SEACE, construida con Angular y Tailwind CSS.",
5
+ "license": "UNLICENSED",
4
6
  "peerDependencies": {
5
- "@angular/common": "^21.2.0",
6
- "@angular/core": "^21.2.0"
7
+ "@angular/common": ">=21.0.0",
8
+ "@angular/core": ">=21.0.0",
9
+ "@angular/platform-browser": ">=21.0.0"
7
10
  },
8
11
  "dependencies": {
9
12
  "tslib": "^2.3.0"