@adamosuiteservices/ui 2.13.1 → 2.13.3

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 (46) hide show
  1. package/dist/components/ui/file-upload/file-upload.d.ts +11 -3
  2. package/dist/components/ui/slider/slider.d.ts +5 -2
  3. package/dist/components/ui/typography/typography.d.ts +1 -1
  4. package/dist/file-upload.cjs +6 -18
  5. package/dist/file-upload.js +264 -134
  6. package/dist/slider.cjs +6 -7
  7. package/dist/slider.js +191 -177
  8. package/dist/styles.css +1 -1
  9. package/dist/typography-Bj8oEDuE.cjs +1 -0
  10. package/dist/typography-MnY0LQoZ.js +50 -0
  11. package/dist/typography.cjs +1 -1
  12. package/dist/typography.js +1 -1
  13. package/docs/AI-GUIDE.md +321 -321
  14. package/docs/components/layout/sidebar.md +399 -399
  15. package/docs/components/layout/toaster.md +436 -436
  16. package/docs/components/ui/accordion-rounded.md +584 -584
  17. package/docs/components/ui/accordion.md +269 -269
  18. package/docs/components/ui/calendar.md +1159 -1159
  19. package/docs/components/ui/card.md +1455 -1455
  20. package/docs/components/ui/checkbox.md +292 -292
  21. package/docs/components/ui/collapsible.md +323 -323
  22. package/docs/components/ui/dialog.md +628 -628
  23. package/docs/components/ui/field.md +706 -706
  24. package/docs/components/ui/file-upload.md +475 -66
  25. package/docs/components/ui/hover-card.md +446 -446
  26. package/docs/components/ui/kbd.md +434 -434
  27. package/docs/components/ui/label.md +359 -359
  28. package/docs/components/ui/pagination.md +650 -650
  29. package/docs/components/ui/popover.md +536 -536
  30. package/docs/components/ui/progress.md +182 -182
  31. package/docs/components/ui/radio-group.md +311 -311
  32. package/docs/components/ui/separator.md +214 -214
  33. package/docs/components/ui/sheet.md +174 -174
  34. package/docs/components/ui/skeleton.md +140 -140
  35. package/docs/components/ui/slider.md +460 -341
  36. package/docs/components/ui/spinner.md +170 -170
  37. package/docs/components/ui/switch.md +408 -408
  38. package/docs/components/ui/tabs-underline.md +106 -106
  39. package/docs/components/ui/tabs.md +122 -122
  40. package/docs/components/ui/textarea.md +243 -243
  41. package/docs/components/ui/toggle.md +237 -237
  42. package/docs/components/ui/tooltip.md +317 -317
  43. package/docs/components/ui/typography.md +320 -280
  44. package/package.json +1 -1
  45. package/dist/typography-9EoV0kcN.js +0 -44
  46. package/dist/typography-DqQZZpkD.cjs +0 -1
@@ -1,106 +1,106 @@
1
- # Tabs Underline
2
-
3
- Pestañas con underline. Variante de tabs sin background.
4
-
5
- ## Descripción
6
-
7
- Variante del componente Tabs con estilo de subrayado en lugar de fondo.
8
-
9
- ## Importación
10
-
11
- ```typescript
12
- import {
13
- TabsUnderline,
14
- TabsUnderlineList,
15
- TabsUnderlineTrigger,
16
- TabsUnderlineContent,
17
- } from "@adamosuiteservices/ui/tabs-underline";
18
- ```
19
-
20
- ## Anatomía
21
-
22
- ```tsx
23
- <TabsUnderline defaultValue="account">
24
- <TabsUnderlineList>
25
- <TabsUnderlineTrigger value="account">Account</TabsUnderlineTrigger>
26
- <TabsUnderlineTrigger value="password">Password</TabsUnderlineTrigger>
27
- </TabsUnderlineList>
28
- <TabsUnderlineContent value="account">Account content</TabsUnderlineContent>
29
- <TabsUnderlineContent value="password">Password content</TabsUnderlineContent>
30
- </TabsUnderline>
31
- ```
32
-
33
- **Componentes**: 4 (TabsUnderline, TabsUnderlineList, TabsUnderlineTrigger, TabsUnderlineContent)
34
-
35
- ## Props
36
-
37
- Idéntico a `tabs` component. Ver documentación de tabs para props completas.
38
-
39
- ## Patrones de Uso
40
-
41
- ### Básico
42
-
43
- ```tsx
44
- <TabsUnderline defaultValue="overview">
45
- <TabsUnderlineList>
46
- <TabsUnderlineTrigger value="overview">Overview</TabsUnderlineTrigger>
47
- <TabsUnderlineTrigger value="analytics">Analytics</TabsUnderlineTrigger>
48
- <TabsUnderlineTrigger value="reports">Reports</TabsUnderlineTrigger>
49
- </TabsUnderlineList>
50
- <TabsUnderlineContent value="overview">Overview content</TabsUnderlineContent>
51
- <TabsUnderlineContent value="analytics">
52
- Analytics content
53
- </TabsUnderlineContent>
54
- <TabsUnderlineContent value="reports">Reports content</TabsUnderlineContent>
55
- </TabsUnderline>
56
- ```
57
-
58
- ### Con Iconos
59
-
60
- ```tsx
61
- import { Icon } from "@adamosuiteservices/ui/icon";
62
-
63
- <TabsUnderlineList>
64
- <TabsUnderlineTrigger value="charts">
65
- <Icon symbol="bar_chart" />
66
- Charts
67
- </TabsUnderlineTrigger>
68
- <TabsUnderlineTrigger value="table">
69
- <Icon symbol="table" />
70
- Table
71
- </TabsUnderlineTrigger>
72
- <TabsUnderlineTrigger value="report">
73
- <Icon symbol="description" />
74
- Report
75
- </TabsUnderlineTrigger>
76
- </TabsUnderlineList>;
77
- ```
78
-
79
- ## Diferencias con Tabs Regular
80
-
81
- - Subrayado animado en lugar de fondo
82
- - Estilo más minimalista
83
- - API idéntica a Tabs regular
84
-
85
- ## Diferencia vs Tabs
86
-
87
- **tabs**: Background `bg-muted` con `rounded-lg`, active usa `bg-primary`
88
- **tabs-underline**: Sin background, active usa `border-b-2 border-b-primary`
89
-
90
- ## Casos de Uso
91
-
92
- **Navigation**: Navegación principal
93
- **Content sections**: Secciones de contenido
94
- **Data views**: Diferentes visualizaciones
95
-
96
- ## Estilos Base
97
-
98
- - **List**: Sin background, `h-9`
99
- - **Trigger active**: `border-b-2 border-b-primary text-primary`
100
- - **Trigger inactive**: `border-b-2 border-b-transparent`
101
-
102
- ## Referencias
103
-
104
- - Ver [Tabs](./tabs.md) para documentación completa
105
- - **Radix UI Tabs**: <https://www.radix-ui.com/primitives/docs/components/tabs>
106
- - **shadcn/ui Tabs**: <https://ui.shadcn.com/docs/components/tabs>
1
+ # Tabs Underline
2
+
3
+ Pestañas con underline. Variante de tabs sin background.
4
+
5
+ ## Descripción
6
+
7
+ Variante del componente Tabs con estilo de subrayado en lugar de fondo.
8
+
9
+ ## Importación
10
+
11
+ ```typescript
12
+ import {
13
+ TabsUnderline,
14
+ TabsUnderlineList,
15
+ TabsUnderlineTrigger,
16
+ TabsUnderlineContent,
17
+ } from "@adamosuiteservices/ui/tabs-underline";
18
+ ```
19
+
20
+ ## Anatomía
21
+
22
+ ```tsx
23
+ <TabsUnderline defaultValue="account">
24
+ <TabsUnderlineList>
25
+ <TabsUnderlineTrigger value="account">Account</TabsUnderlineTrigger>
26
+ <TabsUnderlineTrigger value="password">Password</TabsUnderlineTrigger>
27
+ </TabsUnderlineList>
28
+ <TabsUnderlineContent value="account">Account content</TabsUnderlineContent>
29
+ <TabsUnderlineContent value="password">Password content</TabsUnderlineContent>
30
+ </TabsUnderline>
31
+ ```
32
+
33
+ **Componentes**: 4 (TabsUnderline, TabsUnderlineList, TabsUnderlineTrigger, TabsUnderlineContent)
34
+
35
+ ## Props
36
+
37
+ Idéntico a `tabs` component. Ver documentación de tabs para props completas.
38
+
39
+ ## Patrones de Uso
40
+
41
+ ### Básico
42
+
43
+ ```tsx
44
+ <TabsUnderline defaultValue="overview">
45
+ <TabsUnderlineList>
46
+ <TabsUnderlineTrigger value="overview">Overview</TabsUnderlineTrigger>
47
+ <TabsUnderlineTrigger value="analytics">Analytics</TabsUnderlineTrigger>
48
+ <TabsUnderlineTrigger value="reports">Reports</TabsUnderlineTrigger>
49
+ </TabsUnderlineList>
50
+ <TabsUnderlineContent value="overview">Overview content</TabsUnderlineContent>
51
+ <TabsUnderlineContent value="analytics">
52
+ Analytics content
53
+ </TabsUnderlineContent>
54
+ <TabsUnderlineContent value="reports">Reports content</TabsUnderlineContent>
55
+ </TabsUnderline>
56
+ ```
57
+
58
+ ### Con Iconos
59
+
60
+ ```tsx
61
+ import { Icon } from "@adamosuiteservices/ui/icon";
62
+
63
+ <TabsUnderlineList>
64
+ <TabsUnderlineTrigger value="charts">
65
+ <Icon symbol="bar_chart" />
66
+ Charts
67
+ </TabsUnderlineTrigger>
68
+ <TabsUnderlineTrigger value="table">
69
+ <Icon symbol="table" />
70
+ Table
71
+ </TabsUnderlineTrigger>
72
+ <TabsUnderlineTrigger value="report">
73
+ <Icon symbol="description" />
74
+ Report
75
+ </TabsUnderlineTrigger>
76
+ </TabsUnderlineList>;
77
+ ```
78
+
79
+ ## Diferencias con Tabs Regular
80
+
81
+ - Subrayado animado en lugar de fondo
82
+ - Estilo más minimalista
83
+ - API idéntica a Tabs regular
84
+
85
+ ## Diferencia vs Tabs
86
+
87
+ **tabs**: Background `bg-muted` con `rounded-lg`, active usa `bg-primary`
88
+ **tabs-underline**: Sin background, active usa `border-b-2 border-b-primary`
89
+
90
+ ## Casos de Uso
91
+
92
+ **Navigation**: Navegación principal
93
+ **Content sections**: Secciones de contenido
94
+ **Data views**: Diferentes visualizaciones
95
+
96
+ ## Estilos Base
97
+
98
+ - **List**: Sin background, `h-9`
99
+ - **Trigger active**: `border-b-2 border-b-primary text-primary`
100
+ - **Trigger inactive**: `border-b-2 border-b-transparent`
101
+
102
+ ## Referencias
103
+
104
+ - Ver [Tabs](./tabs.md) para documentación completa
105
+ - **Radix UI Tabs**: <https://www.radix-ui.com/primitives/docs/components/tabs>
106
+ - **shadcn/ui Tabs**: <https://ui.shadcn.com/docs/components/tabs>
@@ -1,122 +1,122 @@
1
- # Tabs
2
-
3
- Pestañas con background. Basado en Radix UI.
4
-
5
- ## Descripción
6
-
7
- El componente `Tabs` permite organizar contenido en secciones que se pueden alternar.
8
-
9
- ## Importación
10
-
11
- ```typescript
12
- import {
13
- Tabs,
14
- TabsList,
15
- TabsTrigger,
16
- TabsContent,
17
- } from "@adamosuiteservices/ui/tabs";
18
- ```
19
-
20
- ## Anatomía
21
-
22
- ```tsx
23
- <Tabs defaultValue="account">
24
- <TabsList>
25
- <TabsTrigger value="account">Account</TabsTrigger>
26
- <TabsTrigger value="password">Password</TabsTrigger>
27
- </TabsList>
28
- <TabsContent value="account">Account settings content</TabsContent>
29
- <TabsContent value="password">Password settings content</TabsContent>
30
- </Tabs>
31
- ```
32
-
33
- **Componentes**: 4 (Tabs, TabsList, TabsTrigger, TabsContent)
34
-
35
- ## Props
36
-
37
- ### Tabs (Root)
38
-
39
- | Prop | Tipo | Descripción |
40
- | --------------- | ------------------------- | -------------------------- |
41
- | `defaultValue` | `string` | Tab inicial (uncontrolled) |
42
- | `value` | `string` | Tab controlado |
43
- | `onValueChange` | `(value: string) => void` | Callback al cambiar |
44
-
45
- ### TabsTrigger
46
-
47
- | Prop | Tipo | Descripción |
48
- | ---------- | --------- | ------------------- |
49
- | `value` | `string` | Valor único del tab |
50
- | `disabled` | `boolean` | Deshabilitar tab |
51
-
52
- ## Patrones de Uso
53
-
54
- ### Básico
55
-
56
- ```tsx
57
- <Tabs defaultValue="account">
58
- <TabsList>
59
- <TabsTrigger value="account">Account</TabsTrigger>
60
- <TabsTrigger value="password">Password</TabsTrigger>
61
- </TabsList>
62
- <TabsContent value="account">Account settings content</TabsContent>
63
- <TabsContent value="password">Password settings content</TabsContent>
64
- </Tabs>
65
- ```
66
-
67
- ### Controlado
68
-
69
- ```tsx
70
- const [activeTab, setActiveTab] = useState("overview");
71
-
72
- <Tabs value={activeTab} onValueChange={setActiveTab}>
73
- <TabsList>
74
- <TabsTrigger value="overview">Overview</TabsTrigger>
75
- <TabsTrigger value="analytics">Analytics</TabsTrigger>
76
- </TabsList>
77
- <TabsContent value="overview">Overview content</TabsContent>
78
- <TabsContent value="analytics">Analytics content</TabsContent>
79
- </Tabs>;
80
- ```
81
-
82
- ### Con Iconos
83
-
84
- ```tsx
85
- import { Icon } from "@adamosuiteservices/ui/icon";
86
-
87
- <TabsList>
88
- <TabsTrigger value="home">
89
- <Icon symbol="home" />
90
- Home
91
- </TabsTrigger>
92
- <TabsTrigger value="settings">
93
- <Icon symbol="settings" />
94
- Settings
95
- </TabsTrigger>
96
- <TabsTrigger value="profile">
97
- <Icon symbol="person" />
98
- Profile
99
- </TabsTrigger>
100
- <TabsTrigger value="security">
101
- <Icon symbol="key" />
102
- Security
103
- </TabsTrigger>
104
- </TabsList>;
105
- ```
106
-
107
- ## Casos de Uso
108
-
109
- **Settings**: Secciones de configuración
110
- **Navigation**: Navegación por secciones
111
- **Data views**: Diferentes vistas de datos
112
-
113
- ## Estilos Base
114
-
115
- - **List**: `bg-muted rounded-lg h-9`
116
- - **Trigger active**: `bg-primary text-primary-foreground shadow-sm`
117
- - **Trigger**: `rounded-md px-2 py-1 font-semibold`
118
-
119
- ## Referencias
120
-
121
- - **Radix UI Tabs**: <https://www.radix-ui.com/primitives/docs/components/tabs>
122
- - **shadcn/ui Tabs**: <https://ui.shadcn.com/docs/components/tabs>
1
+ # Tabs
2
+
3
+ Pestañas con background. Basado en Radix UI.
4
+
5
+ ## Descripción
6
+
7
+ El componente `Tabs` permite organizar contenido en secciones que se pueden alternar.
8
+
9
+ ## Importación
10
+
11
+ ```typescript
12
+ import {
13
+ Tabs,
14
+ TabsList,
15
+ TabsTrigger,
16
+ TabsContent,
17
+ } from "@adamosuiteservices/ui/tabs";
18
+ ```
19
+
20
+ ## Anatomía
21
+
22
+ ```tsx
23
+ <Tabs defaultValue="account">
24
+ <TabsList>
25
+ <TabsTrigger value="account">Account</TabsTrigger>
26
+ <TabsTrigger value="password">Password</TabsTrigger>
27
+ </TabsList>
28
+ <TabsContent value="account">Account settings content</TabsContent>
29
+ <TabsContent value="password">Password settings content</TabsContent>
30
+ </Tabs>
31
+ ```
32
+
33
+ **Componentes**: 4 (Tabs, TabsList, TabsTrigger, TabsContent)
34
+
35
+ ## Props
36
+
37
+ ### Tabs (Root)
38
+
39
+ | Prop | Tipo | Descripción |
40
+ | --------------- | ------------------------- | -------------------------- |
41
+ | `defaultValue` | `string` | Tab inicial (uncontrolled) |
42
+ | `value` | `string` | Tab controlado |
43
+ | `onValueChange` | `(value: string) => void` | Callback al cambiar |
44
+
45
+ ### TabsTrigger
46
+
47
+ | Prop | Tipo | Descripción |
48
+ | ---------- | --------- | ------------------- |
49
+ | `value` | `string` | Valor único del tab |
50
+ | `disabled` | `boolean` | Deshabilitar tab |
51
+
52
+ ## Patrones de Uso
53
+
54
+ ### Básico
55
+
56
+ ```tsx
57
+ <Tabs defaultValue="account">
58
+ <TabsList>
59
+ <TabsTrigger value="account">Account</TabsTrigger>
60
+ <TabsTrigger value="password">Password</TabsTrigger>
61
+ </TabsList>
62
+ <TabsContent value="account">Account settings content</TabsContent>
63
+ <TabsContent value="password">Password settings content</TabsContent>
64
+ </Tabs>
65
+ ```
66
+
67
+ ### Controlado
68
+
69
+ ```tsx
70
+ const [activeTab, setActiveTab] = useState("overview");
71
+
72
+ <Tabs value={activeTab} onValueChange={setActiveTab}>
73
+ <TabsList>
74
+ <TabsTrigger value="overview">Overview</TabsTrigger>
75
+ <TabsTrigger value="analytics">Analytics</TabsTrigger>
76
+ </TabsList>
77
+ <TabsContent value="overview">Overview content</TabsContent>
78
+ <TabsContent value="analytics">Analytics content</TabsContent>
79
+ </Tabs>;
80
+ ```
81
+
82
+ ### Con Iconos
83
+
84
+ ```tsx
85
+ import { Icon } from "@adamosuiteservices/ui/icon";
86
+
87
+ <TabsList>
88
+ <TabsTrigger value="home">
89
+ <Icon symbol="home" />
90
+ Home
91
+ </TabsTrigger>
92
+ <TabsTrigger value="settings">
93
+ <Icon symbol="settings" />
94
+ Settings
95
+ </TabsTrigger>
96
+ <TabsTrigger value="profile">
97
+ <Icon symbol="person" />
98
+ Profile
99
+ </TabsTrigger>
100
+ <TabsTrigger value="security">
101
+ <Icon symbol="key" />
102
+ Security
103
+ </TabsTrigger>
104
+ </TabsList>;
105
+ ```
106
+
107
+ ## Casos de Uso
108
+
109
+ **Settings**: Secciones de configuración
110
+ **Navigation**: Navegación por secciones
111
+ **Data views**: Diferentes vistas de datos
112
+
113
+ ## Estilos Base
114
+
115
+ - **List**: `bg-muted rounded-lg h-9`
116
+ - **Trigger active**: `bg-primary text-primary-foreground shadow-sm`
117
+ - **Trigger**: `rounded-md px-2 py-1 font-semibold`
118
+
119
+ ## Referencias
120
+
121
+ - **Radix UI Tabs**: <https://www.radix-ui.com/primitives/docs/components/tabs>
122
+ - **shadcn/ui Tabs**: <https://ui.shadcn.com/docs/components/tabs>