@adamosuiteservices/ui 2.13.2 → 2.13.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.
Files changed (35) hide show
  1. package/dist/components/ui/slider/slider.d.ts +5 -2
  2. package/dist/slider.cjs +7 -8
  3. package/dist/slider.js +192 -178
  4. package/dist/styles.css +1 -1
  5. package/docs/AI-GUIDE.md +321 -321
  6. package/docs/components/layout/sidebar.md +399 -399
  7. package/docs/components/layout/toaster.md +436 -436
  8. package/docs/components/ui/accordion-rounded.md +584 -584
  9. package/docs/components/ui/accordion.md +269 -269
  10. package/docs/components/ui/calendar.md +1159 -1159
  11. package/docs/components/ui/card.md +1455 -1455
  12. package/docs/components/ui/checkbox.md +292 -292
  13. package/docs/components/ui/collapsible.md +323 -323
  14. package/docs/components/ui/dialog.md +628 -628
  15. package/docs/components/ui/field.md +706 -706
  16. package/docs/components/ui/hover-card.md +446 -446
  17. package/docs/components/ui/kbd.md +434 -434
  18. package/docs/components/ui/label.md +359 -359
  19. package/docs/components/ui/pagination.md +650 -650
  20. package/docs/components/ui/popover.md +536 -536
  21. package/docs/components/ui/progress.md +182 -182
  22. package/docs/components/ui/radio-group.md +311 -311
  23. package/docs/components/ui/separator.md +214 -214
  24. package/docs/components/ui/sheet.md +174 -174
  25. package/docs/components/ui/skeleton.md +140 -140
  26. package/docs/components/ui/slider.md +460 -341
  27. package/docs/components/ui/spinner.md +170 -170
  28. package/docs/components/ui/switch.md +408 -408
  29. package/docs/components/ui/tabs-underline.md +106 -106
  30. package/docs/components/ui/tabs.md +122 -122
  31. package/docs/components/ui/textarea.md +243 -243
  32. package/docs/components/ui/toggle.md +237 -237
  33. package/docs/components/ui/tooltip.md +317 -317
  34. package/docs/components/ui/typography.md +320 -320
  35. package/package.json +1 -1
package/docs/components/ui/tabs-underline.md CHANGED
@@ -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>
package/docs/components/ui/tabs.md CHANGED
@@ -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>