@smart-coder-labs/apple-design-system 1.0.13 → 1.0.15

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 +39 -21
  2. package/package.json +4 -8
package/README.md CHANGED
@@ -4,21 +4,21 @@
4
4
 
5
5
  **Un design system completo inspirado en macOS, iOS y VisionOS**
6
6
 
7
- *Construido con Framer Motion + Radix UI + Tailwind CSS*
7
+ *Construido con Framer Motion + Tailwind CSS*
8
8
  <br>
9
9
  *✨ Creado con Inteligencia Artificial ✨*
10
10
 
11
11
  [![TypeScript](https://img.shields.io/badge/TypeScript-5.3-blue)](https://www.typescriptlang.org/)
12
12
  [![React](https://img.shields.io/badge/React-18+-61dafb)](https://reactjs.org/)
13
- [![Framer Motion](https://img.shields.io/badge/Framer%20Motion-10+-ff69b4)](https://www.framer.com/motion/)
14
- [![Radix UI](https://img.shields.io/badge/Radix%20UI-Latest-purple)](https://www.radix-ui.com/)
15
- [![Tailwind CSS](https://img.shields.io/badge/Tailwind%20CSS-3.4-38bdf8)](https://tailwindcss.com/)
13
+ [![Framer Motion](https://img.shields.io/badge/Framer%20Motion-12+-ff69b4)](https://www.framer.com/motion/)
14
+ [![Tailwind CSS](https://img.shields.io/badge/Tailwind%20CSS-4.0-38bdf8)](https://tailwindcss.com/)
16
15
  [![npm](https://img.shields.io/npm/v/@smart-coder-labs/apple-design-system)](https://www.npmjs.com/package/@smart-coder-labs/apple-design-system)
17
16
 
18
17
  [📦 Instalación](#-inicio-rápido) •
19
18
  [📖 Documentación](#-documentación) •
20
19
  [🧩 Componentes](#-componentes) •
21
- [🎨 Demo](#-demo)
20
+ [🎨 Demo](#-demo) •
21
+ [📚 Storybook](#-storybook)
22
22
 
23
23
  </div>
24
24
 
@@ -62,8 +62,8 @@ Esto:
62
62
 
63
63
  - 🎨 **Estilo Apple Premium** - Minimalista, elegante y aireado
64
64
  - 🌓 **Dark Mode Completo** - Soporte automático para modo oscuro
65
- - ⚡ **Animaciones Fluidas** - Springs suaves y transiciones elegantes
66
- - ♿ **Accesibilidad AA/AAA** - Componentes accesibles con Radix UI
65
+ - ⚡ **Animaciones Fluidas** - Springs suaves y transiciones elegantes con Framer Motion
66
+ - ♿ **Accesibilidad** - Componentes accesibles y semánticos
67
67
  - 🎯 **TypeScript** - Completamente tipado
68
68
  - 📱 **Responsive** - Diseñado para todos los dispositivos
69
69
  - 🎭 **Personalizable** - Tokens configurables fácilmente
@@ -72,20 +72,32 @@ Esto:
72
72
 
73
73
  ## 📦 Contenido
74
74
 
75
- ### 🧩 10 Componentes Completos
75
+ ### 🧩 Componentes
76
76
 
77
77
  | Componente | Descripción | Tecnología |
78
78
  |------------|-------------|------------|
79
79
  | **Button** | Botones con animaciones suaves | Framer Motion |
80
80
  | **Card** | Tarjetas con efectos glass | Framer Motion |
81
81
  | **Input** | Inputs con focus elegante | Framer Motion |
82
- | **Modal** | Modales con animación VisionOS | Radix UI + Framer Motion |
83
- | **Dropdown** | Menús desplegables | Radix UI + Framer Motion |
84
- | **Tooltip** | Tooltips pequeños y elegantes | Radix UI + Framer Motion |
85
- | **Tabs** | Segmented control iOS/macOS | Radix UI + Framer Motion |
86
- | **Switch** | Toggle iOS con spring | Radix UI + Framer Motion |
82
+ | **Modal** | Modales con animación VisionOS | Framer Motion |
83
+ | **Dropdown** | Menús desplegables | Framer Motion |
84
+ | **Tooltip** | Tooltips pequeños y elegantes | Framer Motion |
85
+ | **Tabs** | Segmented control iOS/macOS | Framer Motion |
86
+ | **Switch** | Toggle iOS con spring | Framer Motion |
87
87
  | **Badge** | Indicadores de estado | Framer Motion |
88
+ | **NumberInput** | Input numérico con controles | Framer Motion |
89
+ | **Select** | Select nativo estilizado | Framer Motion |
90
+ | **Checkbox** | Checkbox animado | Framer Motion |
91
+ | **Textarea** | Area de texto expandible | Framer Motion |
92
+ | **Label** | Etiquetas accesibles | HTML/CSS |
88
93
  | **NavBar** | Navegación minimal | Framer Motion |
94
+ | **Calendar** | Calendario completo | React Day Picker |
95
+ | **DataGrid** | Tabla avanzada con filtros | TanStack Table |
96
+ | **Kanban** | Tablero Trello-like | Dnd Kit |
97
+ | **Sheet** | Panel lateral deslizante | Framer Motion |
98
+ | **Command** | Menú de comandos (CMD+K) | CMDK |
99
+ | **Popover** | Contenido flotante | Framer Motion |
100
+ | **Toast** | Notificaciones tostada | Sonner |
89
101
 
90
102
  ### 🎨 Tokens Completos
91
103
 
@@ -189,7 +201,15 @@ function App() {
189
201
 
190
202
  ![Apple Design System Demo](https://via.placeholder.com/800x400/007AFF/FFFFFF?text=Apple+Design+System+Demo)
191
203
 
192
- **[🎬 Ver demo completa →](./DemoPage.tsx)**
204
+ **[🎬 Ver demo completa →](https://smart-coder-labs.github.io/design-system/?path=/story/pages-landing-page--business-landing)**
205
+
206
+ ---
207
+
208
+ ## 📚 Storybook
209
+
210
+ Explora y prueba nuestros componentes de forma interactiva en nuestro Storybook oficial:
211
+
212
+ 👉 **[https://smart-coder-labs.github.io/design-system/](https://smart-coder-labs.github.io/design-system/)**
193
213
 
194
214
  ---
195
215
 
@@ -276,9 +296,9 @@ const customTokens = {
276
296
  ## 📊 Estadísticas
277
297
 
278
298
  ```
279
- 📁 Archivos: 25
280
- 📝 Líneas de código: 3,178
281
- 🧩 Componentes: 10
299
+ 📁 Archivos: 150+
300
+ 📝 Líneas de código: 10,000+
301
+ 🧩 Componentes: 50+
282
302
  🎨 Tokens: 100+
283
303
  📖 Documentación: 7 archivos
284
304
  ```
@@ -289,9 +309,8 @@ const customTokens = {
289
309
 
290
310
  - **React** 18+ - UI Library
291
311
  - **TypeScript** 5+ - Type Safety
292
- - **Framer Motion** 10+ - Animaciones
293
- - **Radix UI** - Componentes accesibles
294
- - **Tailwind CSS** 3+ - Estilos
312
+ - **Framer Motion** 12+ - Animaciones
313
+ - **Tailwind CSS** 4+ - Estilos
295
314
  - **PostCSS** - Procesamiento CSS
296
315
 
297
316
  ---
@@ -405,7 +424,6 @@ MIT © 2025
405
424
 
406
425
  Construido con:
407
426
  - [Framer Motion](https://www.framer.com/motion/)
408
- - [Radix UI](https://www.radix-ui.com/)
409
427
  - [Tailwind CSS](https://tailwindcss.com/)
410
428
  - [Apple Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/)
411
429
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@smart-coder-labs/apple-design-system",
3
- "version": "1.0.13",
3
+ "version": "1.0.15",
4
4
  "description": "Design system completo estilo Apple (macOS/iOS/VisionOS) con Framer Motion",
5
5
  "keywords": [
6
6
  "apple-design-system",
@@ -28,8 +28,6 @@
28
28
  "publishConfig": {
29
29
  "access": "public"
30
30
  },
31
-
32
-
33
31
  "bin": {
34
32
  "apple-design-system": "dist/cli/index.js"
35
33
  },
@@ -49,7 +47,6 @@
49
47
  "type-check": "tsc --noEmit",
50
48
  "build": "npm run clean && tsc -p tsconfig.build.json",
51
49
  "build:registry": "ts-node scripts/build-registry.ts",
52
-
53
50
  "prepublishOnly": "npm run build",
54
51
  "storybook": "storybook dev -p 6006",
55
52
  "build-storybook": "storybook build"
@@ -58,16 +55,15 @@
58
55
  "chalk": "^4.1.2",
59
56
  "commander": "^11.1.0",
60
57
  "fs-extra": "^11.2.0",
58
+ "html2canvas": "^1.4.1",
59
+ "jspdf": "^4.0.0",
60
+ "markdown-it": "^14.1.0",
61
61
  "ora": "^5.4.1",
62
62
  "prompts": "^2.4.2",
63
63
  "tailwind-merge": "^3.4.0",
64
64
  "zod": "^3.22.4"
65
65
  },
66
66
  "devDependencies": {
67
- "@radix-ui/react-dialog": "^1.0.5",
68
- "@radix-ui/react-dropdown-menu": "^2.0.6",
69
-
70
-
71
67
  "@storybook/addon-docs": "^10.0.8",
72
68
  "@storybook/addon-onboarding": "^10.0.8",
73
69
  "@storybook/react-vite": "^10.0.8",