@nrivera-iimp/ui-kit-iimp 0.1.0 → 0.1.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 (7) hide show
  1. package/README.md +139 -21
  2. package/dist/preset.js +1 -0
  3. package/dist/preset.mjs +1 -0
  4. package/dist/styles.css +118 -0
  5. package/package.json +11 -5
  6. package/dist/index.d.mts +0 -44
  7. package/dist/index.d.ts +0 -44
package/README.md CHANGED
@@ -1,36 +1,154 @@
1
- This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
1
+ # @nrivera-iimp/ui-kit-iimp 🚀
2
2
 
3
- ## Getting Started
3
+ Sistema de diseño premium para las verticales de **ProExplo**, **WMC** y **Gess**. Basado en shadcn/ui y Tailwind CSS.
4
4
 
5
- First, run the development server:
5
+ Este paquete proporciona una base sólida, accesible y altamente personalizable para todas las aplicaciones web del IIMP, con un motor de theming dinámico integrado.
6
+
7
+ ---
8
+
9
+ ## 🛠️ Instalación
10
+
11
+ Abre tu terminal en la carpeta del proyecto y ejecuta:
6
12
 
7
13
  ```bash
8
- npm run dev
9
- # or
10
- yarn dev
11
- # or
12
- pnpm dev
13
- # or
14
- bun dev
14
+ npm install @nrivera-iimp/ui-kit-iimp lucide-react clsx tailwind-merge next-themes
15
+ ```
16
+
17
+ ### Requisitos Previos
18
+ - **Node.js**: 18.0 o superior
19
+ - **Next.js**: 13.0+ (App Router recomendado)
20
+ - **Tailwind CSS**: Configurado en el proyecto
21
+
22
+ ---
23
+
24
+ ## ⚙️ Configuración Paso a Paso
25
+
26
+ ### 1. Agregar el Preset de Tailwind
27
+ Modifica tu archivo `tailwind.config.ts` (o `.js`) para importar nuestro preset. Esto incluirá automáticamente todos los colores corporativos y animaciones.
28
+
29
+ ```tsx
30
+ // tailwind.config.ts
31
+ import { iimpPreset } from "@nrivera-iimp/ui-kit-iimp/preset";
32
+
33
+ export default {
34
+ // El preset añade las variables HSL y la configuración de shadcn/ui
35
+ presets: [iimpPreset],
36
+ content: [
37
+ "./src/**/*.{ts,tsx}",
38
+ "./node_modules/@nrivera-iimp/ui-kit-iimp/dist/**/*.{js,mjs}"
39
+ ],
40
+ // ... resto de tu configuración
41
+ }
42
+ ```
43
+
44
+ ### 2. Importar Estilos Globales
45
+ En tu archivo `app/globals.css`, añade la importación de nuestros estilos base de Tailwind y los del UI-Kit.
46
+
47
+ ```css
48
+ @import "tailwindcss";
49
+ @import "@nrivera-iimp/ui-kit-iimp/styles.css";
50
+ ```
51
+
52
+ ### 3. Script Anti-Flash (Crucial)
53
+ Para evitar el parpadeo blanco al cargar la página (mientras React inicializa), añade este script en el `<head>` de tu `app/layout.tsx`. Este script detecta la vertical y el tema preferido instantáneamente.
54
+
55
+ ```tsx
56
+ // app/layout.tsx
57
+ export default function RootLayout({ children }) {
58
+ return (
59
+ <html lang="es" suppressHydrationWarning>
60
+ <head>
61
+ <script
62
+ dangerouslySetInnerHTML={{
63
+ __html: `
64
+ (function() {
65
+ try {
66
+ const urlParams = new URLSearchParams(window.location.search);
67
+ const themeParam = urlParams.get('theme');
68
+ // Cambia 'proexplo' por tu vertical por defecto (proexplo, wmc, gess)
69
+ const defaultVertical = 'proexplo';
70
+
71
+ let vertical = themeParam || localStorage.getItem('iimp-vertical') || defaultVertical;
72
+
73
+ if (themeParam) {
74
+ localStorage.setItem('iimp-vertical', themeParam);
75
+ const url = new URL(window.location);
76
+ url.searchParams.delete('theme');
77
+ window.history.replaceState({}, '', url);
78
+ }
79
+
80
+ document.documentElement.setAttribute('data-vertical', vertical);
81
+ } catch (e) {}
82
+ })();
83
+ `,
84
+ }}
85
+ />
86
+ </head>
87
+ <body>{children}</body>
88
+ </html>
89
+ );
90
+ }
91
+ ```
92
+
93
+ ### 4. Configurar el VerticalProvider
94
+ Envuelve tu aplicación con el provider en el layout raíz para gestionar el estado de las verticales y el modo oscuro.
95
+
96
+ ```tsx
97
+ import { VerticalProvider } from "@nrivera-iimp/ui-kit-iimp";
98
+ import { ThemeProvider } from "next-themes";
99
+
100
+ export default function RootLayout({ children }) {
101
+ return (
102
+ <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
103
+ <VerticalProvider defaultVertical="proexplo">
104
+ {children}
105
+ </VerticalProvider>
106
+ </ThemeProvider>
107
+ );
108
+ }
15
109
  ```
16
110
 
17
- Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
111
+ ---
112
+
113
+ ## 🎨 Theming y Verticales
18
114
 
19
- You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
115
+ El sistema utiliza un **HSL Engine** que inyecta variables dinámicamente.
20
116
 
21
- This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
117
+ ### Verticales Disponibles:
118
+ - `proexplo`: Naranja IIMP (Enfoque en eventos y minería).
119
+ - `wmc`: Azul Corporativo (World Mining Congress).
120
+ - `gess`: Verde Sostenibilidad (Gestión Social).
22
121
 
23
- ## Learn More
122
+ ### URL Theming (Dinámico)
123
+ Puedes forzar el cambio de tema para un cliente específico enviando un parámetro en la URL. El sistema lo detectará, lo guardará en `localStorage` y limpiará la URL automáticamente.
24
124
 
25
- To learn more about Next.js, take a look at the following resources:
125
+ **Ejemplo:** `www.tu-sitio.com?theme=wmc`
26
126
 
27
- - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28
- - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
127
+ ---
29
128
 
30
- You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
129
+ ## 🌓 Dark Mode
130
+ El kit tiene soporte nativo para modo oscuro utilizando la clase `.dark` en el HTML.
131
+ - Utiliza los prefijos `dark:` de Tailwind para estilos específicos.
132
+ - El `VerticalProvider` ya maneja las variables de contraste optimizadas para fondos oscuros.
31
133
 
32
- ## Deploy on Vercel
134
+ ---
33
135
 
34
- The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
136
+ ## 📦 Uso de Componentes
137
+
138
+ ```tsx
139
+ import { Button, Card, CardHeader, CardTitle } from "@nrivera-iimp/ui-kit-iimp";
140
+
141
+ export default function MiPagina() {
142
+ return (
143
+ <Card>
144
+ <CardHeader>
145
+ <CardTitle>Hola IIMP</CardTitle>
146
+ </CardHeader>
147
+ <Button variant="default">Click aquí</Button>
148
+ </Card>
149
+ );
150
+ }
151
+ ```
35
152
 
36
- Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
153
+ ---
154
+ © 2026 Instituto de Ingenieros de Minas del Perú. Excelencia en Minería.
package/dist/preset.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var _tailwindcssanimate = require('tailwindcss-animate'); var _tailwindcssanimate2 = _interopRequireDefault(_tailwindcssanimate);var e={darkMode:["class"],content:[],theme:{container:{center:!0,padding:"2rem",screens:{"2xl":"1400px"}},extend:{colors:{border:"var(--border)",input:"var(--input)",ring:"var(--ring)",background:"var(--background)",foreground:"var(--foreground)",primary:{DEFAULT:"var(--primary)",foreground:"var(--primary-foreground)"},secondary:{DEFAULT:"var(--secondary)",foreground:"var(--secondary-foreground)"},destructive:{DEFAULT:"var(--destructive)",foreground:"var(--destructive-foreground)"},muted:{DEFAULT:"var(--muted)",foreground:"var(--muted-foreground)"},accent:{DEFAULT:"var(--accent)",foreground:"var(--accent-foreground)"},popover:{DEFAULT:"var(--popover)",foreground:"var(--popover-foreground)"},card:{DEFAULT:"var(--card)",foreground:"var(--card-foreground)"}},borderRadius:{lg:"var(--radius)",md:"calc(var(--radius) - 2px)",sm:"calc(var(--radius) - 4px)"},keyframes:{"accordion-down":{from:{height:"0"},to:{height:"var(--radix-accordion-content-height)"}},"accordion-up":{from:{height:"var(--radix-accordion-content-height)"},to:{height:"0"}}},animation:{"accordion-down":"accordion-down 0.2s ease-out","accordion-up":"accordion-up 0.2s ease-out"}}},plugins:[_tailwindcssanimate2.default]};exports.iimpPreset = e;
package/dist/preset.mjs ADDED
@@ -0,0 +1 @@
1
+ import r from"tailwindcss-animate";var e={darkMode:["class"],content:[],theme:{container:{center:!0,padding:"2rem",screens:{"2xl":"1400px"}},extend:{colors:{border:"var(--border)",input:"var(--input)",ring:"var(--ring)",background:"var(--background)",foreground:"var(--foreground)",primary:{DEFAULT:"var(--primary)",foreground:"var(--primary-foreground)"},secondary:{DEFAULT:"var(--secondary)",foreground:"var(--secondary-foreground)"},destructive:{DEFAULT:"var(--destructive)",foreground:"var(--destructive-foreground)"},muted:{DEFAULT:"var(--muted)",foreground:"var(--muted-foreground)"},accent:{DEFAULT:"var(--accent)",foreground:"var(--accent-foreground)"},popover:{DEFAULT:"var(--popover)",foreground:"var(--popover-foreground)"},card:{DEFAULT:"var(--card)",foreground:"var(--card-foreground)"}},borderRadius:{lg:"var(--radius)",md:"calc(var(--radius) - 2px)",sm:"calc(var(--radius) - 4px)"},keyframes:{"accordion-down":{from:{height:"0"},to:{height:"var(--radix-accordion-content-height)"}},"accordion-up":{from:{height:"var(--radix-accordion-content-height)"},to:{height:"0"}}},animation:{"accordion-down":"accordion-down 0.2s ease-out","accordion-up":"accordion-up 0.2s ease-out"}}},plugins:[r]};export{e as iimpPreset};
package/dist/styles.css ADDED
@@ -0,0 +1,118 @@
1
+ @import "tailwindcss";
2
+
3
+ @plugin "tailwindcss-animate";
4
+
5
+ @custom-variant dark (&:is(.dark *));
6
+
7
+ @theme {
8
+ --font-sans: var(--font-geist-sans);
9
+ --font-mono: var(--font-geist-mono);
10
+
11
+ --color-background: var(--background);
12
+ --color-foreground: var(--foreground);
13
+ --color-primary: var(--primary);
14
+ --color-primary-foreground: var(--primary-foreground);
15
+ --color-secondary: var(--secondary);
16
+ --color-secondary-foreground: var(--secondary-foreground);
17
+ --color-muted: var(--muted);
18
+ --color-muted-foreground: var(--muted-foreground);
19
+ --color-accent: var(--accent);
20
+ --color-accent-foreground: var(--accent-foreground);
21
+ --color-destructive: var(--destructive);
22
+ --color-destructive-foreground: var(--destructive-foreground);
23
+ --color-border: var(--border);
24
+ --color-input: var(--input);
25
+ --color-ring: var(--ring);
26
+ --radius: var(--radius);
27
+ }
28
+
29
+ :root {
30
+ --background: hsl(0 0% 100%);
31
+ --foreground: hsl(0 0% 3.9%);
32
+ --card: hsl(0 0% 100%);
33
+ --card-foreground: hsl(0 0% 3.9%);
34
+ --popover: hsl(0 0% 100%);
35
+ --popover-foreground: hsl(0 0% 3.9%);
36
+ --primary: hsl(0 0% 9%);
37
+ --primary-foreground: hsl(0 0% 98%);
38
+ --secondary: hsl(0 0% 96.1%);
39
+ --secondary-foreground: hsl(0 0% 9%);
40
+ --muted: hsl(0 0% 96.1%);
41
+ --muted-foreground: hsl(0 0% 45.1%);
42
+ --accent: hsl(0 0% 96.1%);
43
+ --accent-foreground: hsl(0 0% 9%);
44
+ --destructive: hsl(0 84.2% 60.2%);
45
+ --destructive-foreground: hsl(0 0% 98%);
46
+ --border: hsl(0 0% 89.8%);
47
+ --input: hsl(0 0% 89.8%);
48
+ --ring: hsl(0 0% 3.9%);
49
+ --radius: 0.5rem;
50
+ }
51
+
52
+ .dark {
53
+ --background: hsl(0 0% 3.9%);
54
+ --foreground: hsl(0 0% 98%);
55
+ --card: hsl(0 0% 3.9%);
56
+ --card-foreground: hsl(0 0% 98%);
57
+ --popover: hsl(0 0% 3.9%);
58
+ --popover-foreground: hsl(0 0% 98%);
59
+ --primary: hsl(0 0% 98%);
60
+ --primary-foreground: hsl(0 0% 9%);
61
+ --secondary: hsl(0 0% 14.9%);
62
+ --secondary-foreground: hsl(0 0% 98%);
63
+ --muted: hsl(0 0% 14.9%);
64
+ --muted-foreground: hsl(0 0% 63.9%);
65
+ --accent: hsl(0 0% 14.9%);
66
+ --accent-foreground: hsl(0 0% 98%);
67
+ --destructive: hsl(0 62.8% 30.6%);
68
+ --destructive-foreground: hsl(0 0% 98%);
69
+ --border: hsl(0 0% 14.9%);
70
+ --input: hsl(0 0% 14.9%);
71
+ --ring: hsl(0 0% 83.1%);
72
+ }
73
+
74
+ /* --- Verticales IIMP --- */
75
+
76
+ .vert-proexplo {
77
+ --primary: hsl(24 83% 50%);
78
+ --primary-foreground: hsl(0 0% 100%);
79
+ --ring: hsl(24 83% 50%);
80
+ --radius: 0.75rem;
81
+ }
82
+
83
+ .vert-wmc {
84
+ --primary: hsl(191 100% 43%);
85
+ --primary-foreground: hsl(0 0% 100%);
86
+ --secondary: hsl(238 100% 12%);
87
+ --secondary-foreground: hsl(0 0% 100%);
88
+ --ring: hsl(191 100% 43%);
89
+ --radius: 0.3rem;
90
+ }
91
+
92
+ .vert-gess {
93
+ --primary: hsl(140 66% 32%);
94
+ --primary-foreground: hsl(0 0% 100%);
95
+ --secondary: hsl(80 56% 55%);
96
+ --secondary-foreground: hsl(0 0% 0%);
97
+ --ring: hsl(140 66% 32%);
98
+ --radius: 1rem;
99
+ }
100
+
101
+ /* Force dark mode specific vertical variables if needed */
102
+ .dark.vert-proexplo {
103
+ --primary: hsl(24 83% 60%); /* SLIGHTLY lighter for better contrast in dark */
104
+ }
105
+
106
+ .dark .bg-muted\/50 {
107
+ background-color: hsl(0 0% 15% / 0.5);
108
+ }
109
+
110
+ @layer base {
111
+ * {
112
+ @apply border-border;
113
+ }
114
+ body {
115
+ @apply bg-background text-foreground;
116
+ font-feature-settings: "rlig" 1, "calt" 1;
117
+ }
118
+ }
package/package.json CHANGED
@@ -1,21 +1,27 @@
1
1
  {
2
2
  "name": "@nrivera-iimp/ui-kit-iimp",
3
- "version": "0.1.0",
3
+ "version": "0.1.3",
4
4
  "private": false,
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.mjs",
7
7
  "types": "./dist/index.d.ts",
8
8
  "exports": {
9
9
  ".": {
10
+ "types": "./dist/index.d.ts",
10
11
  "import": "./dist/index.mjs",
11
- "require": "./dist/index.js",
12
- "types": "./dist/index.d.ts"
13
- }
12
+ "require": "./dist/index.js"
13
+ },
14
+ "./preset": {
15
+ "types": "./dist/preset.d.ts",
16
+ "import": "./dist/preset.mjs",
17
+ "require": "./dist/preset.js"
18
+ },
19
+ "./styles.css": "./dist/styles.css"
14
20
  },
15
21
  "scripts": {
16
22
  "dev": "next dev",
17
23
  "build": "next build",
18
- "build:lib": "tsup src/lib/index.ts --format cjs,esm --dts --minify --clean --minify-identifiers --minify-syntax --minify-whitespace --splitting --target es2020",
24
+ "build:lib": "tsup src/lib/index.ts src/lib/preset.ts --format cjs,esm --dts --minify --clean --minify-identifiers --minify-syntax --minify-whitespace --splitting --target es2020",
19
25
  "start": "next start",
20
26
  "lint": "eslint"
21
27
  },
package/dist/index.d.mts DELETED
@@ -1,44 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as class_variance_authority_types from 'class-variance-authority/types';
4
- import { VariantProps } from 'class-variance-authority';
5
- import * as SeparatorPrimitive from '@radix-ui/react-separator';
6
- import * as TabsPrimitive from '@radix-ui/react-tabs';
7
-
8
- type Vertical = "proexplo" | "wmc" | "gess";
9
- interface VerticalContextType {
10
- vertical: Vertical;
11
- setVertical: (vertical: Vertical) => void;
12
- }
13
- declare function VerticalProvider({ children, defaultVertical }: {
14
- children: React.ReactNode;
15
- defaultVertical?: Vertical;
16
- }): react_jsx_runtime.JSX.Element;
17
- declare const useVertical: () => VerticalContextType;
18
-
19
- declare const buttonVariants: (props?: ({
20
- variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
21
- size?: "default" | "sm" | "lg" | "icon" | null | undefined;
22
- } & class_variance_authority_types.ClassProp) | undefined) => string;
23
- interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
24
- asChild?: boolean;
25
- }
26
- declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
27
-
28
- declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
29
- declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
30
- declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
31
- declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
32
- declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
33
- declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
34
-
35
- declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
36
-
37
- declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
38
- declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
39
- declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
40
- declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
41
-
42
- declare function IIMPLogo(): react_jsx_runtime.JSX.Element;
43
-
44
- export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, IIMPLogo, Separator, Tabs, TabsContent, TabsList, TabsTrigger, type Vertical, VerticalProvider, buttonVariants, useVertical };
package/dist/index.d.ts DELETED
@@ -1,44 +0,0 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import * as React from 'react';
3
- import * as class_variance_authority_types from 'class-variance-authority/types';
4
- import { VariantProps } from 'class-variance-authority';
5
- import * as SeparatorPrimitive from '@radix-ui/react-separator';
6
- import * as TabsPrimitive from '@radix-ui/react-tabs';
7
-
8
- type Vertical = "proexplo" | "wmc" | "gess";
9
- interface VerticalContextType {
10
- vertical: Vertical;
11
- setVertical: (vertical: Vertical) => void;
12
- }
13
- declare function VerticalProvider({ children, defaultVertical }: {
14
- children: React.ReactNode;
15
- defaultVertical?: Vertical;
16
- }): react_jsx_runtime.JSX.Element;
17
- declare const useVertical: () => VerticalContextType;
18
-
19
- declare const buttonVariants: (props?: ({
20
- variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
21
- size?: "default" | "sm" | "lg" | "icon" | null | undefined;
22
- } & class_variance_authority_types.ClassProp) | undefined) => string;
23
- interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
24
- asChild?: boolean;
25
- }
26
- declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
27
-
28
- declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
29
- declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
30
- declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
31
- declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
32
- declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
33
- declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
34
-
35
- declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
36
-
37
- declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
38
- declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
39
- declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
40
- declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
41
-
42
- declare function IIMPLogo(): react_jsx_runtime.JSX.Element;
43
-
44
- export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, IIMPLogo, Separator, Tabs, TabsContent, TabsList, TabsTrigger, type Vertical, VerticalProvider, buttonVariants, useVertical };