@jegdev/sema-ui 0.0.2 → 0.0.4
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 +63 -63
- package/package.json +50 -42
- package/src/index.d.ts +31 -0
- package/dist/sema-ui.es.js +0 -4
- package/dist/sema-ui.umd.js +0 -1
package/README.md
CHANGED
|
@@ -1,63 +1,63 @@
|
|
|
1
|
-
# Sema UI
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
[Español](#español) | [English](#english)
|
|
8
|
-
|
|
9
|
-
---
|
|
10
|
-
|
|
11
|
-
## Español
|
|
12
|
-
|
|
13
|
-
**La librería de componentes SEO-First.**
|
|
14
|
-
Web components ligeros y accesibles que automatizan la visibilidad de tu sitio.
|
|
15
|
-
|
|
16
|
-
Sema UI es un sistema de diseño minimalista construido con [Lit](https://lit.dev/). Proporciona componentes de interfaz de usuario hermosos y fáciles de copiar y pegar que inyectan automáticamente datos estructurados de **Schema.org** (JSON-LD) y manejan los estándares de accesibilidad por ti.
|
|
17
|
-
|
|
18
|
-
### Contenido
|
|
19
|
-
|
|
20
|
-
- [Características](#características)
|
|
21
|
-
- [Instalación](#instalación)
|
|
22
|
-
|
|
23
|
-
### Características
|
|
24
|
-
|
|
25
|
-
- **🚀 Extremadamente Rápido:** Construido sobre Web Components nativos. Cero sobrecarga de framework.
|
|
26
|
-
- **🔍 Automatización SEO:** Componentes como `<sema-brand>` o `<sema-breadcrumb>` generan automáticamente JSON-LD compatible con Google.
|
|
27
|
-
- **♿ Accesible:** Cumple con WAI-ARIA desde el primer momento.
|
|
28
|
-
- **🎨 Diseño Minimalista:** Inspirado en estéticas modernas (Shadcn/Vercel), listo para ser personalizado.
|
|
29
|
-
- **⚛️ Agnóstico al Framework:** Funciona en React, Vue, Angular, Svelte o HTML puro.
|
|
30
|
-
|
|
31
|
-
### Instalación
|
|
32
|
-
|
|
33
|
-
```bash
|
|
34
|
-
npm install @jegdev/sema-ui
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
---
|
|
38
|
-
|
|
39
|
-
## English
|
|
40
|
-
|
|
41
|
-
**The SEO-First Component Library.**
|
|
42
|
-
Lightweight, accessible web components that automate your site's visibility.
|
|
43
|
-
|
|
44
|
-
Sema UI is a minimalist design system built with [Lit](https://lit.dev/). It provides beautiful, copy-paste friendly UI components that automatically inject **Schema.org** structured data (JSON-LD) and handle accessibility standards for you.
|
|
45
|
-
|
|
46
|
-
### Contents
|
|
47
|
-
|
|
48
|
-
- Features
|
|
49
|
-
- Installation
|
|
50
|
-
|
|
51
|
-
### Features
|
|
52
|
-
|
|
53
|
-
- **🚀 Blazing Fast:** Built on native Web Components. Zero framework overhead.
|
|
54
|
-
- **🔍 SEO Automations:** Components like `<sema-brand>` or `<sema-breadcrumb>` automatically generate Google-compliant JSON-LD.
|
|
55
|
-
- **♿ Accessible:** WAI-ARIA compliant out of the box.
|
|
56
|
-
- **🎨 Minimalist Design:** Inspired by modern aesthetics (Shadcn/Vercel), ready to be customized.
|
|
57
|
-
- **⚛️ Framework Agnostic:** Works in React, Vue, Angular, Svelte, or vanilla HTML.
|
|
58
|
-
|
|
59
|
-
### Installation
|
|
60
|
-
|
|
61
|
-
```bash
|
|
62
|
-
npm install @jegdev/sema-ui
|
|
63
|
-
```
|
|
1
|
+
# Sema UI
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
|
|
7
|
+
[Español](#español) | [English](#english)
|
|
8
|
+
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
## Español
|
|
12
|
+
|
|
13
|
+
**La librería de componentes SEO-First.**
|
|
14
|
+
Web components ligeros y accesibles que automatizan la visibilidad de tu sitio.
|
|
15
|
+
|
|
16
|
+
Sema UI es un sistema de diseño minimalista construido con [Lit](https://lit.dev/). Proporciona componentes de interfaz de usuario hermosos y fáciles de copiar y pegar que inyectan automáticamente datos estructurados de **Schema.org** (JSON-LD) y manejan los estándares de accesibilidad por ti.
|
|
17
|
+
|
|
18
|
+
### Contenido
|
|
19
|
+
|
|
20
|
+
- [Características](#características)
|
|
21
|
+
- [Instalación](#instalación)
|
|
22
|
+
|
|
23
|
+
### Características
|
|
24
|
+
|
|
25
|
+
- **🚀 Extremadamente Rápido:** Construido sobre Web Components nativos. Cero sobrecarga de framework.
|
|
26
|
+
- **🔍 Automatización SEO:** Componentes como `<sema-brand>` o `<sema-breadcrumb>` generan automáticamente JSON-LD compatible con Google.
|
|
27
|
+
- **♿ Accesible:** Cumple con WAI-ARIA desde el primer momento.
|
|
28
|
+
- **🎨 Diseño Minimalista:** Inspirado en estéticas modernas (Shadcn/Vercel), listo para ser personalizado.
|
|
29
|
+
- **⚛️ Agnóstico al Framework:** Funciona en React, Vue, Angular, Svelte o HTML puro.
|
|
30
|
+
|
|
31
|
+
### Instalación
|
|
32
|
+
|
|
33
|
+
```bash
|
|
34
|
+
npm install @jegdev/sema-ui
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
---
|
|
38
|
+
|
|
39
|
+
## English
|
|
40
|
+
|
|
41
|
+
**The SEO-First Component Library.**
|
|
42
|
+
Lightweight, accessible web components that automate your site's visibility.
|
|
43
|
+
|
|
44
|
+
Sema UI is a minimalist design system built with [Lit](https://lit.dev/). It provides beautiful, copy-paste friendly UI components that automatically inject **Schema.org** structured data (JSON-LD) and handle accessibility standards for you.
|
|
45
|
+
|
|
46
|
+
### Contents
|
|
47
|
+
|
|
48
|
+
- Features
|
|
49
|
+
- Installation
|
|
50
|
+
|
|
51
|
+
### Features
|
|
52
|
+
|
|
53
|
+
- **🚀 Blazing Fast:** Built on native Web Components. Zero framework overhead.
|
|
54
|
+
- **🔍 SEO Automations:** Components like `<sema-brand>` or `<sema-breadcrumb>` automatically generate Google-compliant JSON-LD.
|
|
55
|
+
- **♿ Accessible:** WAI-ARIA compliant out of the box.
|
|
56
|
+
- **🎨 Minimalist Design:** Inspired by modern aesthetics (Shadcn/Vercel), ready to be customized.
|
|
57
|
+
- **⚛️ Framework Agnostic:** Works in React, Vue, Angular, Svelte, or vanilla HTML.
|
|
58
|
+
|
|
59
|
+
### Installation
|
|
60
|
+
|
|
61
|
+
```bash
|
|
62
|
+
npm install @jegdev/sema-ui
|
|
63
|
+
```
|
package/package.json
CHANGED
|
@@ -1,42 +1,50 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@jegdev/sema-ui",
|
|
3
|
-
"private": false,
|
|
4
|
-
"version": "0.0.
|
|
5
|
-
"description": "Una colección de componentes Lit minimalistas estilo Swiss Design",
|
|
6
|
-
"keywords": ["Next", "React", "Angular", "Vue", "Astro", "Lit"],
|
|
7
|
-
"type": "module",
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
},
|
|
27
|
-
|
|
28
|
-
"
|
|
29
|
-
"
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
},
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "@jegdev/sema-ui",
|
|
3
|
+
"private": false,
|
|
4
|
+
"version": "0.0.4",
|
|
5
|
+
"description": "Una colección de componentes Lit minimalistas estilo Swiss Design",
|
|
6
|
+
"keywords": ["Next", "React", "Angular", "Vue", "Astro", "Lit"],
|
|
7
|
+
"type": "module",
|
|
8
|
+
|
|
9
|
+
"files": [
|
|
10
|
+
"dist",
|
|
11
|
+
"src/index.d.ts"
|
|
12
|
+
],
|
|
13
|
+
|
|
14
|
+
"license": "MIT",
|
|
15
|
+
"author": "JEG Dev Studios",
|
|
16
|
+
"contributors": ["JhonnDevJS", "JasubiPL"],
|
|
17
|
+
|
|
18
|
+
"main": "./dist/sema-ui.umd.js",
|
|
19
|
+
"module": "./dist/sema-ui.es.js",
|
|
20
|
+
"types": "./src/index.d.ts",
|
|
21
|
+
|
|
22
|
+
"homepage": "https://github.com/JEGDevStudios/Sema-UI",
|
|
23
|
+
"repository": {
|
|
24
|
+
"type": "git",
|
|
25
|
+
"url": "https://github.com/JEGDevStudios/Sema-UI"
|
|
26
|
+
},
|
|
27
|
+
|
|
28
|
+
"exports": {
|
|
29
|
+
".": {
|
|
30
|
+
"types": "./src/index.d.ts",
|
|
31
|
+
"import": "./dist/sema-ui.es.js",
|
|
32
|
+
"require": "./dist/sema-ui.umd.js"
|
|
33
|
+
}
|
|
34
|
+
},
|
|
35
|
+
|
|
36
|
+
"publishConfig": {
|
|
37
|
+
"access": "public"
|
|
38
|
+
},
|
|
39
|
+
|
|
40
|
+
"scripts": {
|
|
41
|
+
"dev": "vite",
|
|
42
|
+
"build": "vite build"
|
|
43
|
+
},
|
|
44
|
+
"dependencies": {
|
|
45
|
+
"lit": "^3.0.0"
|
|
46
|
+
},
|
|
47
|
+
"devDependencies": {
|
|
48
|
+
"vite": "^5.0.0"
|
|
49
|
+
}
|
|
50
|
+
}
|
package/src/index.d.ts
ADDED
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
declare module '@jegdev/sema-ui' {
|
|
2
|
+
import { LitElement } from 'lit';
|
|
3
|
+
|
|
4
|
+
export class SemaButton extends LitElement {
|
|
5
|
+
// Coincide con 'mode' en tu JS.
|
|
6
|
+
// Agregamos '' porque es tu default para el botón primario.
|
|
7
|
+
mode: 'outline' | 'ghost' | '' | string;
|
|
8
|
+
|
|
9
|
+
// Coincide con 'kind' (link o button)
|
|
10
|
+
kind: 'link' | 'button' | string;
|
|
11
|
+
|
|
12
|
+
// Coincide con 'custom' ('on' | 'off')
|
|
13
|
+
custom: 'on' | 'off' | string;
|
|
14
|
+
|
|
15
|
+
// Colores personalizados
|
|
16
|
+
firstColor: string;
|
|
17
|
+
secondaryColor: string;
|
|
18
|
+
|
|
19
|
+
// Tamaños exactos según tu lógica JS
|
|
20
|
+
size: 'sm' | 'md' | 'lg' | 'full' | string;
|
|
21
|
+
|
|
22
|
+
// Tamaños de fuente exactos según tu lógica JS
|
|
23
|
+
fontSize: 'sm' | 'md' | 'lg' | 'xl' | string;
|
|
24
|
+
|
|
25
|
+
// Contenido y enlaces
|
|
26
|
+
textLabel: string;
|
|
27
|
+
url: string;
|
|
28
|
+
target: '_blank' | '_self' | '_parent' | '_top' | string;
|
|
29
|
+
altText: string;
|
|
30
|
+
}
|
|
31
|
+
}
|
package/dist/sema-ui.es.js
DELETED
package/dist/sema-ui.umd.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
(function(e,n){typeof exports=="object"&&typeof module<"u"?n(exports):typeof define=="function"&&define.amd?define(["exports"],n):(e=typeof globalThis<"u"?globalThis:e||self,n(e.SemaUI={}))})(this,(function(e){"use strict";const n="0.0.1";e.version=n,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}));
|