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