@beweco/aurora-ui 0.0.2 → 0.0.4

package/README.md

@@ -1,15 +1,15 @@
-# @beweco/aura-ui
+# @beweco/aurora-ui
 
-Bewe Aura UI Component Library - A modern, lightweight, and customizable React component library.
+Bewe Aurora UI Component Library - A modern, lightweight, and customizable React component library.
 
 ## Overview
 
-@beweco/aura-ui is a React component library designed to provide a consistent and beautiful user interface for Bewe applications. Built with TypeScript for type safety and modern development practices, it uses Storybook as its primary development and visualization environment.
+@beweco/aurora-ui is a React component library designed to provide a consistent and beautiful user interface for Bewe applications. Built with TypeScript for type safety and modern development practices, it uses Storybook as its primary development and visualization environment.
 
 ## Installation
 
 ```bash
-bun install @beweco/aura-ui
+bun install @beweco/aurora-ui
 ```
 
 ## Quick Start
@@ -17,14 +17,14 @@ bun install @beweco/aura-ui
 To use the components, you need to wrap your application with the `ThemeProvider` .
 
 ```tsx
-import { ThemeProvider } from '@beweco/aura-ui';
-import { Button } from '@beweco/aura-ui';
+import { ThemeProvider } from '@beweco/aurora-ui';
+import { Button } from '@beweco/aurora-ui';
 
 function App() {
   return (
     <ThemeProvider>
       <Button color="primary">
-        Hello Aura UI!
+        Hello Aurora UI!
       </Button>
     </ThemeProvider>
   );
@@ -113,7 +113,7 @@ For testing purposes, you can publish a beta version:
 
 Users can then install the beta version using:
 ```bash
-bun install @beweco/aura-ui@beta
+bun install @beweco/aurora-ui@beta
 ```
 
 ## Contributing

package/dist/index.cjs.js

@@ -0,0 +1,291 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react$1 = require('@heroui/react');
+var react = require('react');
+var react$2 = require('@iconify/react');
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+/**
+ * Button component with HeroUI styling
+ * Provides a consistent interface for button interactions across the application
+ */
+var ButtonPrueba = function (_a) {
+    var children = _a.children, startIcon = _a.startIcon, endIcon = _a.endIcon, _b = _a.loading, loading = _b === void 0 ? false : _b, disabled = _a.disabled, _c = _a.variant, variant = _c === void 0 ? "solid" : _c, _d = _a.color, color = _d === void 0 ? "primary" : _d, _e = _a.size, size = _e === void 0 ? "md" : _e, radius = _a.radius, _f = _a.fullWidth, fullWidth = _f === void 0 ? false : _f, _g = _a.className, className = _g === void 0 ? "" : _g, props = __rest(_a, ["children", "startIcon", "endIcon", "loading", "disabled", "variant", "color", "size", "radius", "fullWidth", "className"]);
+    react.useEffect(function () {
+        // console.log("estamos dentro del botnon");
+    }, []);
+    return (jsxRuntime.jsx(react$1.Button, __assign({ variant: variant, color: color, size: size, radius: radius, fullWidth: fullWidth, isLoading: loading, isDisabled: disabled, startContent: startIcon, endContent: endIcon, className: className }, props, { children: children })));
+};
+
+var sizeMap = {
+    sm: "16px",
+    md: "20px",
+    lg: "24px",
+    xl: "32px",
+};
+var IconComponent = function (_a) {
+    var _b;
+    var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
+    var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
+    return (jsxRuntime.jsx("span", __assign({}, nativeProps, { children: jsxRuntime.jsx(react$2.Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
+};
+
+var MenuPrueba = function (_a) {
+    var logo = _a.logo, company = _a.company, user = _a.user, items = _a.items, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, onCollapse = _a.onCollapse;
+    return (jsxRuntime.jsxs("aside", { className: "h-screen flex flex-col bg-gray-900 border-r border-gray-800 transition-all duration-300 ".concat(collapsed ? "w-20" : "w-64"), style: { minWidth: collapsed ? 80 : 256, maxWidth: collapsed ? 80 : 256 }, children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-6 py-5 border-b border-gray-800", children: [jsxRuntime.jsx("img", { src: logo, alt: company, className: "rounded-full bg-white", style: { width: 40, height: 40 } }), !collapsed && (jsxRuntime.jsx("span", { className: "font-bold uppercase text-base tracking-widest text-white", children: company })), jsxRuntime.jsx("button", { type: "button", className: "ml-auto text-white opacity-60 hover:opacity-100", onClick: onCollapse, "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar", children: collapsed ? "»" : "«" })] }), jsxRuntime.jsxs("div", { className: "flex items-center gap-3 px-6 py-4 border-b border-gray-800", children: [jsxRuntime.jsx("img", { src: user.avatar, alt: user.name, className: "rounded-full", style: { width: 36, height: 36 } }), !collapsed && (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx("div", { className: "font-semibold text-white text-sm", children: user.name }), jsxRuntime.jsx("div", { className: "text-xs text-gray-400", children: user.email })] }))] }), jsxRuntime.jsx("nav", { className: "flex-1 mt-4", children: jsxRuntime.jsx("ul", { className: "flex flex-col gap-1", children: items.map(function (item, _idx) { return (jsxRuntime.jsx("li", { className: "list-none", children: jsxRuntime.jsxs("button", { type: "button", className: "flex items-center w-full gap-3 px-6 py-3 rounded-lg cursor-pointer transition-colors ".concat(item.selected
+                                ? "bg-gray-800 text-white font-semibold"
+                                : "hover:bg-gray-800 text-gray-300"), onClick: item.onClick, children: [jsxRuntime.jsx("span", { className: "text-lg", children: item.icon }), !collapsed && jsxRuntime.jsx("span", { className: "text-base", children: item.label })] }) }, item.label)); }) }) }), jsxRuntime.jsx("div", { className: "px-6 py-4 text-xs text-gray-500 border-t border-gray-800", children: !collapsed && "© BeweOS" })] }));
+};
+MenuPrueba.displayName = "MenuPrueba";
+
+var themeColors = {
+    "purple-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#eee4f8",
+                100: "#d7bfef",
+                200: "#bf99e5",
+                300: "#a773db",
+                400: "#904ed2",
+                500: "#7828c8",
+                600: "#6321a5",
+                700: "#4e1a82",
+                800: "#39135f",
+                900: "#240c3c",
+                DEFAULT: "#7828c8",
+                foreground: "#ffffff",
+            },
+            focus: "#904ed2",
+        },
+    },
+    "purple-dark": {
+        extend: "dark",
+        colors: {
+            background: "#1A1023",
+            foreground: "#ffffff",
+            primary: {
+                50: "#2c193f",
+                100: "#462764",
+                200: "#603689",
+                300: "#7944ae",
+                400: "#9353d3",
+                500: "#a671db",
+                600: "#b98fe2",
+                700: "#ccadee",
+                800: "#dfcbf2",
+                900: "#f2eafa",
+                DEFAULT: "#9353d3",
+                foreground: "#ffffff",
+            },
+            focus: "#a671db",
+        },
+    },
+    "green-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#ecf9f0",
+                100: "#d1f0dc",
+                200: "#b6e7c7",
+                300: "#9cdeb3",
+                400: "#81d59e",
+                500: "#66cc8a",
+                600: "#54a872",
+                700: "#42855a",
+                800: "#306142",
+                900: "#1f3d29",
+                DEFAULT: "#66cc8a",
+                foreground: "#000000",
+            },
+            focus: "#81d59e",
+        },
+    },
+    "green-dark": {
+        extend: "dark",
+        colors: {
+            background: "#0F1D15",
+            foreground: "#ffffff",
+            primary: {
+                50: "#1f3d29",
+                100: "#306142",
+                200: "#42855a",
+                300: "#54a872",
+                400: "#66cc8a",
+                500: "#81d59e",
+                600: "#9cdeb3",
+                700: "#b6e7c7",
+                800: "#d1f0dc",
+                900: "#ecf9f0",
+                DEFAULT: "#66cc8a",
+                foreground: "#000000",
+            },
+            focus: "#81d59e",
+        },
+    },
+    "blue-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#eff6ff",
+                100: "#dbeafe",
+                200: "#bfdbfe",
+                300: "#93c5fd",
+                400: "#60a5fa",
+                500: "#3b82f6",
+                600: "#2563eb",
+                700: "#1d4ed8",
+                800: "#1e40af",
+                900: "#1e3a8a",
+                DEFAULT: "#3b82f6",
+                foreground: "#ffffff",
+            },
+            focus: "#60a5fa",
+        },
+    },
+    "blue-dark": {
+        extend: "dark",
+        colors: {
+            background: "#101d3a",
+            foreground: "#ffffff",
+            primary: {
+                50: "#1e3a8a",
+                100: "#1e40af",
+                200: "#1d4ed8",
+                300: "#2563eb",
+                400: "#3b82f6",
+                500: "#60a5fa",
+                600: "#93c5fd",
+                700: "#bfdbfe",
+                800: "#dbeafe",
+                900: "#eff6ff",
+                DEFAULT: "#3b82f6",
+                foreground: "#ffffff",
+            },
+            focus: "#60a5fa",
+        },
+    },
+    "yellow-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#fefce8",
+                100: "#fef9c3",
+                200: "#fef08a",
+                300: "#fde047",
+                400: "#facc15",
+                500: "#eab308",
+                600: "#ca8a04",
+                700: "#a16207",
+                800: "#854d0e",
+                900: "#713f12",
+                DEFAULT: "#eab308",
+                foreground: "#111827",
+            },
+            focus: "#facc15",
+        },
+    },
+    "yellow-dark": {
+        extend: "dark",
+        colors: {
+            background: "#18181b",
+            foreground: "#ffffff",
+            primary: {
+                50: "#713f12",
+                100: "#854d0e",
+                200: "#a16207",
+                300: "#ca8a04",
+                400: "#eab308",
+                500: "#facc15",
+                600: "#fde047",
+                700: "#fef08a",
+                800: "#fef9c3",
+                900: "#fefce8",
+                DEFAULT: "#facc15",
+                foreground: "#18181b",
+            },
+            focus: "#eab308",
+        },
+    },
+};
+
+var ThemeContext = react.createContext({
+    theme: "light",
+    // biome-ignore lint/suspicious/noEmptyBlockStatements: <explanation>
+    setTheme: function () { },
+});
+var useThemeContext = function () {
+    var context = react.useContext(ThemeContext);
+    if (!context) {
+        throw new Error("useThemeContext debe ser usado dentro de un ThemeProvider");
+    }
+    return context;
+};
+
+var ThemeProvider = function (_a) {
+    var children = _a.children;
+    var _b = useThemeContext(), theme = _b.theme, setTheme = _b.setTheme;
+    return (jsxRuntime.jsx(ThemeContext.Provider, { value: { theme: theme, setTheme: setTheme }, children: jsxRuntime.jsx("main", { className: "".concat(theme, " bg-background text-foreground "), children: children }) }));
+};
+
+exports.ButtonPrueba = ButtonPrueba;
+exports.IconComponent = IconComponent;
+exports.MenuPrueba = MenuPrueba;
+exports.ThemeContext = ThemeContext;
+exports.ThemeProvider = ThemeProvider;
+exports.sizeMap = sizeMap;
+exports.themeColors = themeColors;
+exports.useThemeContext = useThemeContext;

package/dist/index.esm.js

@@ -0,0 +1,282 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { Button } from '@heroui/react';
+import { useEffect, createContext, useContext } from 'react';
+import { Icon } from '@iconify/react';
+
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
+
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+};
+
+/**
+ * Button component with HeroUI styling
+ * Provides a consistent interface for button interactions across the application
+ */
+var ButtonPrueba = function (_a) {
+    var children = _a.children, startIcon = _a.startIcon, endIcon = _a.endIcon, _b = _a.loading, loading = _b === void 0 ? false : _b, disabled = _a.disabled, _c = _a.variant, variant = _c === void 0 ? "solid" : _c, _d = _a.color, color = _d === void 0 ? "primary" : _d, _e = _a.size, size = _e === void 0 ? "md" : _e, radius = _a.radius, _f = _a.fullWidth, fullWidth = _f === void 0 ? false : _f, _g = _a.className, className = _g === void 0 ? "" : _g, props = __rest(_a, ["children", "startIcon", "endIcon", "loading", "disabled", "variant", "color", "size", "radius", "fullWidth", "className"]);
+    useEffect(function () {
+        // console.log("estamos dentro del botnon");
+    }, []);
+    return (jsx(Button, __assign({ variant: variant, color: color, size: size, radius: radius, fullWidth: fullWidth, isLoading: loading, isDisabled: disabled, startContent: startIcon, endContent: endIcon, className: className }, props, { children: children })));
+};
+
+var sizeMap = {
+    sm: "16px",
+    md: "20px",
+    lg: "24px",
+    xl: "32px",
+};
+var IconComponent = function (_a) {
+    var _b;
+    var icon = _a.icon, _c = _a.size, size = _c === void 0 ? "md" : _c, className = _a.className, style = _a.style, color = _a.color, hFlip = _a.hFlip, vFlip = _a.vFlip, flip = _a.flip, rotate = _a.rotate, nativeProps = __rest(_a, ["icon", "size", "className", "style", "color", "hFlip", "vFlip", "flip", "rotate"]);
+    var iconSize = (_b = sizeMap[size]) !== null && _b !== void 0 ? _b : sizeMap.md;
+    return (jsx("span", __assign({}, nativeProps, { children: jsx(Icon, { icon: icon, width: iconSize, height: iconSize, className: className, style: style, color: color, hFlip: hFlip, vFlip: vFlip, flip: flip, rotate: rotate }) })));
+};
+
+var MenuPrueba = function (_a) {
+    var logo = _a.logo, company = _a.company, user = _a.user, items = _a.items, _b = _a.collapsed, collapsed = _b === void 0 ? false : _b, onCollapse = _a.onCollapse;
+    return (jsxs("aside", { className: "h-screen flex flex-col bg-gray-900 border-r border-gray-800 transition-all duration-300 ".concat(collapsed ? "w-20" : "w-64"), style: { minWidth: collapsed ? 80 : 256, maxWidth: collapsed ? 80 : 256 }, children: [jsxs("div", { className: "flex items-center gap-3 px-6 py-5 border-b border-gray-800", children: [jsx("img", { src: logo, alt: company, className: "rounded-full bg-white", style: { width: 40, height: 40 } }), !collapsed && (jsx("span", { className: "font-bold uppercase text-base tracking-widest text-white", children: company })), jsx("button", { type: "button", className: "ml-auto text-white opacity-60 hover:opacity-100", onClick: onCollapse, "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar", children: collapsed ? "»" : "«" })] }), jsxs("div", { className: "flex items-center gap-3 px-6 py-4 border-b border-gray-800", children: [jsx("img", { src: user.avatar, alt: user.name, className: "rounded-full", style: { width: 36, height: 36 } }), !collapsed && (jsxs("div", { children: [jsx("div", { className: "font-semibold text-white text-sm", children: user.name }), jsx("div", { className: "text-xs text-gray-400", children: user.email })] }))] }), jsx("nav", { className: "flex-1 mt-4", children: jsx("ul", { className: "flex flex-col gap-1", children: items.map(function (item, _idx) { return (jsx("li", { className: "list-none", children: jsxs("button", { type: "button", className: "flex items-center w-full gap-3 px-6 py-3 rounded-lg cursor-pointer transition-colors ".concat(item.selected
+                                ? "bg-gray-800 text-white font-semibold"
+                                : "hover:bg-gray-800 text-gray-300"), onClick: item.onClick, children: [jsx("span", { className: "text-lg", children: item.icon }), !collapsed && jsx("span", { className: "text-base", children: item.label })] }) }, item.label)); }) }) }), jsx("div", { className: "px-6 py-4 text-xs text-gray-500 border-t border-gray-800", children: !collapsed && "© BeweOS" })] }));
+};
+MenuPrueba.displayName = "MenuPrueba";
+
+var themeColors = {
+    "purple-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#eee4f8",
+                100: "#d7bfef",
+                200: "#bf99e5",
+                300: "#a773db",
+                400: "#904ed2",
+                500: "#7828c8",
+                600: "#6321a5",
+                700: "#4e1a82",
+                800: "#39135f",
+                900: "#240c3c",
+                DEFAULT: "#7828c8",
+                foreground: "#ffffff",
+            },
+            focus: "#904ed2",
+        },
+    },
+    "purple-dark": {
+        extend: "dark",
+        colors: {
+            background: "#1A1023",
+            foreground: "#ffffff",
+            primary: {
+                50: "#2c193f",
+                100: "#462764",
+                200: "#603689",
+                300: "#7944ae",
+                400: "#9353d3",
+                500: "#a671db",
+                600: "#b98fe2",
+                700: "#ccadee",
+                800: "#dfcbf2",
+                900: "#f2eafa",
+                DEFAULT: "#9353d3",
+                foreground: "#ffffff",
+            },
+            focus: "#a671db",
+        },
+    },
+    "green-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#ecf9f0",
+                100: "#d1f0dc",
+                200: "#b6e7c7",
+                300: "#9cdeb3",
+                400: "#81d59e",
+                500: "#66cc8a",
+                600: "#54a872",
+                700: "#42855a",
+                800: "#306142",
+                900: "#1f3d29",
+                DEFAULT: "#66cc8a",
+                foreground: "#000000",
+            },
+            focus: "#81d59e",
+        },
+    },
+    "green-dark": {
+        extend: "dark",
+        colors: {
+            background: "#0F1D15",
+            foreground: "#ffffff",
+            primary: {
+                50: "#1f3d29",
+                100: "#306142",
+                200: "#42855a",
+                300: "#54a872",
+                400: "#66cc8a",
+                500: "#81d59e",
+                600: "#9cdeb3",
+                700: "#b6e7c7",
+                800: "#d1f0dc",
+                900: "#ecf9f0",
+                DEFAULT: "#66cc8a",
+                foreground: "#000000",
+            },
+            focus: "#81d59e",
+        },
+    },
+    "blue-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#eff6ff",
+                100: "#dbeafe",
+                200: "#bfdbfe",
+                300: "#93c5fd",
+                400: "#60a5fa",
+                500: "#3b82f6",
+                600: "#2563eb",
+                700: "#1d4ed8",
+                800: "#1e40af",
+                900: "#1e3a8a",
+                DEFAULT: "#3b82f6",
+                foreground: "#ffffff",
+            },
+            focus: "#60a5fa",
+        },
+    },
+    "blue-dark": {
+        extend: "dark",
+        colors: {
+            background: "#101d3a",
+            foreground: "#ffffff",
+            primary: {
+                50: "#1e3a8a",
+                100: "#1e40af",
+                200: "#1d4ed8",
+                300: "#2563eb",
+                400: "#3b82f6",
+                500: "#60a5fa",
+                600: "#93c5fd",
+                700: "#bfdbfe",
+                800: "#dbeafe",
+                900: "#eff6ff",
+                DEFAULT: "#3b82f6",
+                foreground: "#ffffff",
+            },
+            focus: "#60a5fa",
+        },
+    },
+    "yellow-light": {
+        extend: "light",
+        colors: {
+            background: "#ffffff",
+            foreground: "#111827",
+            primary: {
+                50: "#fefce8",
+                100: "#fef9c3",
+                200: "#fef08a",
+                300: "#fde047",
+                400: "#facc15",
+                500: "#eab308",
+                600: "#ca8a04",
+                700: "#a16207",
+                800: "#854d0e",
+                900: "#713f12",
+                DEFAULT: "#eab308",
+                foreground: "#111827",
+            },
+            focus: "#facc15",
+        },
+    },
+    "yellow-dark": {
+        extend: "dark",
+        colors: {
+            background: "#18181b",
+            foreground: "#ffffff",
+            primary: {
+                50: "#713f12",
+                100: "#854d0e",
+                200: "#a16207",
+                300: "#ca8a04",
+                400: "#eab308",
+                500: "#facc15",
+                600: "#fde047",
+                700: "#fef08a",
+                800: "#fef9c3",
+                900: "#fefce8",
+                DEFAULT: "#facc15",
+                foreground: "#18181b",
+            },
+            focus: "#eab308",
+        },
+    },
+};
+
+var ThemeContext = createContext({
+    theme: "light",
+    // biome-ignore lint/suspicious/noEmptyBlockStatements: <explanation>
+    setTheme: function () { },
+});
+var useThemeContext = function () {
+    var context = useContext(ThemeContext);
+    if (!context) {
+        throw new Error("useThemeContext debe ser usado dentro de un ThemeProvider");
+    }
+    return context;
+};
+
+var ThemeProvider = function (_a) {
+    var children = _a.children;
+    var _b = useThemeContext(), theme = _b.theme, setTheme = _b.setTheme;
+    return (jsx(ThemeContext.Provider, { value: { theme: theme, setTheme: setTheme }, children: jsx("main", { className: "".concat(theme, " bg-background text-foreground "), children: children }) }));
+};
+
+export { ButtonPrueba, IconComponent, MenuPrueba, ThemeContext, ThemeProvider, sizeMap, themeColors, useThemeContext };

package/dist/types/components/Menu/Menu.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import "./Menu.scss";
+import type { MenuComponentProps } from "./Menu.types";
+/**
+ * Sidebar menu component for navigation and user actions.
+ * @param commerceInfo - Object with logo and name of the company.
+ * @param userInfo - Object with user avatar, name, and email.
+ * @param helpButton - Help button configuration.
+ * @param upgradeCard - Optional upgrade card configuration.
+ * @param isOpenSidebar - Controls sidebar visibility.
+ * @param onOpenSidebarChange - Callback to open/close sidebar.
+ */
+export declare const Menu: React.NamedExoticComponent<MenuComponentProps>;
+//# sourceMappingURL=Menu.d.ts.map

package/dist/types/components/Menu/Menu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/Menu.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,aAAa,CAAC;AAGrB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAEvD;;;;;;;;GAQG;AACH,eAAO,MAAM,IAAI,gDAiLf,CAAC"}

package/dist/types/components/Menu/Menu.types.d.ts

@@ -0,0 +1,29 @@
+import type { MenuNavListItem } from "../menu-nav-list/MenuNavList.types";
+export interface MenuComponentProps {
+    commerceInfo: {
+        logo: string;
+        name: string;
+    };
+    userInfo: {
+        avatar: string;
+        name: string;
+        email: string;
+    };
+    helpButton: {
+        title: string;
+        redirect: string;
+    };
+    upgradeCard?: {
+        title: string;
+        description: string;
+        buttonText: string;
+        buttonLink: string;
+    };
+    menuItems: {
+        items: MenuNavListItem[];
+        selectedKey: string;
+    };
+    isOpenSidebar?: boolean;
+    onOpenSidebarChange?: (open: boolean) => void;
+}
+//# sourceMappingURL=Menu.types.d.ts.map

package/dist/types/components/Menu/Menu.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menu.types.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/Menu.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oCAAoC,CAAC;AAE1E,MAAM,WAAW,kBAAkB;IAClC,YAAY,EAAE;QACb,IAAI,EAAE,MAAM,CAAC;QACb,IAAI,EAAE,MAAM,CAAC;KACb,CAAC;IACF,QAAQ,EAAE;QACT,MAAM,EAAE,MAAM,CAAC;QACf,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,EAAE,MAAM,CAAC;KACd,CAAC;IACF,UAAU,EAAE;QACX,KAAK,EAAE,MAAM,CAAC;QACd,QAAQ,EAAE,MAAM,CAAC;KACjB,CAAC;IACF,WAAW,CAAC,EAAE;QACb,KAAK,EAAE,MAAM,CAAC;QACd,WAAW,EAAE,MAAM,CAAC;QACpB,UAAU,EAAE,MAAM,CAAC;QACnB,UAAU,EAAE,MAAM,CAAC;KACnB,CAAC;IACF,SAAS,EAAE;QACV,KAAK,EAAE,eAAe,EAAE,CAAC;QACzB,WAAW,EAAE,MAAM,CAAC;KACpB,CAAC;IACF,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C"}

package/dist/types/components/Menu/index.d.ts

@@ -0,0 +1,2 @@
+export { Menu } from "./Menu";
+//# sourceMappingURL=index.d.ts.map