@onpe/ui 1.2.32 → 1.2.33

package/dist/components/BrowserRecommended/BrowserRecommended.d.ts

@@ -1,3 +1,4 @@
+import "./BrowserRecommended.css";
 export declare const BrowserRecommended: () => import("react/jsx-runtime").JSX.Element;
 export default BrowserRecommended;
 //# sourceMappingURL=BrowserRecommended.d.ts.map

package/dist/components/Footer/Footer.d.ts

@@ -1,4 +1,5 @@
 import React, { ReactNode } from "react";
+import "./Footer.css";
 export interface FooterProps extends React.HTMLAttributes<HTMLDivElement> {
     showBrowserInfo?: boolean;
     showContactInfo?: boolean;

package/dist/components.esm.js

@@ -272,13 +272,46 @@ var IconSafari = function (props) { return (jsxs("svg", __assign({ width: 24, he
 
 var IconEdge = function (props) { return (jsxs("svg", __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [jsx("g", { clipPath: "url(#clip0_8211_8231)", children: jsx("path", { d: "M9.86748 11.7697C9.90253 13.051 10.5964 14.591 12.2319 15.9545C13.6546 17.1391 16.1157 18.0916 18.1066 18.0916C18.7863 18.0923 19.4637 18.0112 20.124 17.8498C20.3714 17.7895 20.6314 17.8089 20.8671 17.905C21.1027 18.0012 21.302 18.1693 21.4366 18.3854C21.5711 18.6015 21.6339 18.8546 21.6162 19.1085C21.5984 19.3624 21.5009 19.6043 21.3377 19.7996C19.4012 22.1173 16.6672 23.6261 13.674 24.029C13.5491 24.0479 13.4218 24.0422 13.2992 24.0121C10.7136 23.3739 7.83188 20.132 7.83188 16.8828C7.83188 14.0132 8.84726 12.4769 9.86748 11.7697ZM9.01407 7.25984C10.0434 7.42348 10.9791 7.95314 11.6492 8.75146C11.0422 8.77677 10.442 8.88996 9.86748 9.08749C7.44144 9.89737 5.4143 12.5168 5.4143 16.8828C5.4143 19.9495 6.86364 22.0394 8.76385 23.6797C3.94442 22.315 0.34827 18.0384 0.00255686 12.8685C-0.0167921 12.5867 0.0742415 12.3084 0.256402 12.0925L0.461897 11.8556L0.853544 11.4228L1.17629 11.0832L1.3564 10.897L1.75772 10.4945L2.21464 10.0485L2.46607 9.81034C4.77485 7.63093 7.18034 6.94798 9.01407 7.25984ZM12.0626 -0.0398865C17.8165 -0.0398865 22.6299 3.97926 23.8507 9.36309C24.2859 11.279 23.7141 12.7779 22.8511 13.821C22.1768 14.6235 21.3065 15.2381 20.3247 15.6052C19.1582 16.0173 17.8467 16.0004 16.8047 15.8179C15.8739 15.6547 14.7135 15.3404 14.1418 14.5221C13.9795 14.2901 13.9038 14.0085 13.9278 13.7264C13.9519 13.4443 14.0743 13.1796 14.2735 12.9785C14.8598 12.3862 15.1305 11.7758 15.1704 11.2294C15.182 11.0104 15.1637 10.7908 15.116 10.5767C14.4125 7.40973 12.2319 5.35362 9.41902 4.87616C6.08276 4.30925 2.91695 6.03295 0.576731 8.27037C2.16266 3.44498 6.70529 -0.0398865 12.0626 -0.0398865Z", fill: "currentColor" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_8211_8231", children: jsx("rect", { width: 24, height: 24, fill: "white" }) }) })] }))); };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$1 = "/* BrowserRecommended Component Styles */\r\n.onpe-ui-container .onpe-browser-recommended {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 1.5rem;\r\n  padding: 0.75rem 0 1.5rem 0;\r\n  font-size: 0.75rem;\r\n  text-align: center;\r\n  color: var(--onpe-ui-blue);\r\n  background-color: rgba(105, 178, 232, 0.15); /* onpe-ui-skyblue-light/15 */\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n  display: flex;\r\n  gap: 1.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n  display: none;\r\n  text-align: left;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    padding: 0.5rem 0;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n    gap: 2rem;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n    display: block;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    flex-direction: row;\r\n  }\r\n}\r\n";
+styleInject(css_248z$1);
+
 var BrowserRecommended = function () {
-    return (jsxs("div", { className: "flex flex-col items-center justify-center gap-6 pt-3 pb-6 text-xs text-center text-onpe-ui-blue bg-onpe-ui-skyblue-light/15 lg:flex-row md:py-2", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "flex gap-6 md:gap-8", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconChrome, {}), jsx("p", { className: "hidden text-left md:block", children: "Google Chrome" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconSafari, {}), jsx("p", { className: "hidden text-left md:block", children: "Safari" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconEdge, {}), jsx("p", { className: "hidden text-left md:block", children: "Microsoft Edge" })] })] })] }));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("div", { className: "onpe-browser-recommended", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "onpe-browser-list", children: [jsxs("div", { className: "onpe-browser-item", children: [jsx(IconChrome, {}), jsx("p", { className: "onpe-browser-name", children: "Google Chrome" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconSafari, {}), jsx("p", { className: "onpe-browser-name", children: "Safari" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconEdge, {}), jsx("p", { className: "onpe-browser-name", children: "Microsoft Edge" })] })] })] }) }));
 };
 
+var css_248z = "/* Footer Component Styles */\r\n.onpe-ui-container .onpe-footer {\r\n  /* Footer base styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-content {\r\n  /* Content wrapper styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact {\r\n  position: relative;\r\n  z-index: 10;\r\n  display: flex;\r\n  width: 100%;\r\n  min-height: 100px;\r\n  background-color: var(--onpe-ui-blue);\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-list {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  width: 100%;\r\n  flex-direction: column;\r\n  gap: 1.5rem;\r\n  margin: 0 auto;\r\n  padding: 3.5rem 1rem;\r\n  max-width: 1456px;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-item {\r\n  /* List item styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-title {\r\n  font-weight: 600;\r\n  color: var(--onpe-ui-yellow);\r\n  margin-bottom: 0.25rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  color: white;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development {\r\n  height: 93px;\r\n  width: 100%;\r\n  text-align: center;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background-color: rgba(255, 241, 210, 0.75); /* onpe-ui-yellow-light/75 */\r\n  position: fixed;\r\n  z-index: 10;\r\n  right: 0;\r\n  bottom: 0;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-text {\r\n  padding: 0.5rem 0.5rem;\r\n  font-size: 1.5rem;\r\n  color: var(--onpe-ui-blue);\r\n  font-family: 'Consolas', monospace;\r\n  font-weight: 900;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-break {\r\n  display: block;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    padding: 1.75rem 1rem;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    flex-direction: row;\r\n    align-items: center;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development {\r\n    height: 46px;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development-break {\r\n    display: none;\r\n  }\r\n}\r\n";
+styleInject(css_248z);
+
 var Footer = function (_a) {
     var _b = _a.showBrowserInfo, showBrowserInfo = _b === void 0 ? true : _b, _c = _a.showContactInfo, showContactInfo = _c === void 0 ? true : _c, children = _a.children, _d = _a.showFooterContent, showFooterContent = _d === void 0 ? true : _d, _e = _a.isDevelopment, isDevelopment = _e === void 0 ? true : _e, props = __rest(_a, ["showBrowserInfo", "showContactInfo", "children", "showFooterContent", "isDevelopment"]);
-    return (jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "relative z-10 flex w-full min-h-[100px] bg-onpe-ui-blue ", children: jsxs("ul", { className: "flex justify-between items-start lg:items-center w-full flex-col gap-6 mx-auto lg:flex-row py-14 px-4 max-w-[1456px] md:py-7", children: [jsxs("li", { children: [jsx("p", { className: "font-semibold pb text-onpe-ui-yellow", children: "Oficina central" }), jsx("p", { className: "text-sm font-medium text-white", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Escr\u00EDbenos" }), jsx("p", { className: "text-sm font-medium text-white", children: "informes@onpe.gob.pe" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Central telef\u00F3nica" }), jsx("p", { className: "text-sm font-medium text-white", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "h-[93px] lg:h-[46px] w-full text-center flex items-center justify-center bg-onpe-ui-yellow-light/75 fixed z-10 right-0 bottom-0", children: jsxs("p", { className: "px-2 py-1 text-2xl text-onpe-ui-blue font-consolas", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "lg:hidden" }), " - No Oficial"] }) }))] })));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "onpe-footer-contact", children: jsxs("ul", { className: "onpe-footer-contact-list", children: [jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Oficina central" }), jsx("p", { className: "onpe-footer-contact-text", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Escr\u00EDbenos" }), jsx("p", { className: "onpe-footer-contact-text", children: "informes@onpe.gob.pe" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Central telef\u00F3nica" }), jsx("p", { className: "onpe-footer-contact-text", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "onpe-footer-development", children: jsxs("p", { className: "onpe-footer-development-text", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "onpe-footer-development-break" }), " - No Oficial"] }) }))] })) }));
 };
 
 export { BrowserRecommended, Button, Footer, Modal, ModalBrowserIncompatible, ModalConfirm, ModalLoading, ModalSystemIncompatible, Overlay, Portal, Show };

package/dist/components.js

@@ -272,13 +272,46 @@ var IconSafari = function (props) { return (jsxs("svg", __assign({ width: 24, he
 
 var IconEdge = function (props) { return (jsxs("svg", __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [jsx("g", { clipPath: "url(#clip0_8211_8231)", children: jsx("path", { d: "M9.86748 11.7697C9.90253 13.051 10.5964 14.591 12.2319 15.9545C13.6546 17.1391 16.1157 18.0916 18.1066 18.0916C18.7863 18.0923 19.4637 18.0112 20.124 17.8498C20.3714 17.7895 20.6314 17.8089 20.8671 17.905C21.1027 18.0012 21.302 18.1693 21.4366 18.3854C21.5711 18.6015 21.6339 18.8546 21.6162 19.1085C21.5984 19.3624 21.5009 19.6043 21.3377 19.7996C19.4012 22.1173 16.6672 23.6261 13.674 24.029C13.5491 24.0479 13.4218 24.0422 13.2992 24.0121C10.7136 23.3739 7.83188 20.132 7.83188 16.8828C7.83188 14.0132 8.84726 12.4769 9.86748 11.7697ZM9.01407 7.25984C10.0434 7.42348 10.9791 7.95314 11.6492 8.75146C11.0422 8.77677 10.442 8.88996 9.86748 9.08749C7.44144 9.89737 5.4143 12.5168 5.4143 16.8828C5.4143 19.9495 6.86364 22.0394 8.76385 23.6797C3.94442 22.315 0.34827 18.0384 0.00255686 12.8685C-0.0167921 12.5867 0.0742415 12.3084 0.256402 12.0925L0.461897 11.8556L0.853544 11.4228L1.17629 11.0832L1.3564 10.897L1.75772 10.4945L2.21464 10.0485L2.46607 9.81034C4.77485 7.63093 7.18034 6.94798 9.01407 7.25984ZM12.0626 -0.0398865C17.8165 -0.0398865 22.6299 3.97926 23.8507 9.36309C24.2859 11.279 23.7141 12.7779 22.8511 13.821C22.1768 14.6235 21.3065 15.2381 20.3247 15.6052C19.1582 16.0173 17.8467 16.0004 16.8047 15.8179C15.8739 15.6547 14.7135 15.3404 14.1418 14.5221C13.9795 14.2901 13.9038 14.0085 13.9278 13.7264C13.9519 13.4443 14.0743 13.1796 14.2735 12.9785C14.8598 12.3862 15.1305 11.7758 15.1704 11.2294C15.182 11.0104 15.1637 10.7908 15.116 10.5767C14.4125 7.40973 12.2319 5.35362 9.41902 4.87616C6.08276 4.30925 2.91695 6.03295 0.576731 8.27037C2.16266 3.44498 6.70529 -0.0398865 12.0626 -0.0398865Z", fill: "currentColor" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_8211_8231", children: jsx("rect", { width: 24, height: 24, fill: "white" }) }) })] }))); };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$1 = "/* BrowserRecommended Component Styles */\r\n.onpe-ui-container .onpe-browser-recommended {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 1.5rem;\r\n  padding: 0.75rem 0 1.5rem 0;\r\n  font-size: 0.75rem;\r\n  text-align: center;\r\n  color: var(--onpe-ui-blue);\r\n  background-color: rgba(105, 178, 232, 0.15); /* onpe-ui-skyblue-light/15 */\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n  display: flex;\r\n  gap: 1.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n  display: none;\r\n  text-align: left;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    padding: 0.5rem 0;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n    gap: 2rem;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n    display: block;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    flex-direction: row;\r\n  }\r\n}\r\n";
+styleInject(css_248z$1);
+
 var BrowserRecommended = function () {
-    return (jsxs("div", { className: "flex flex-col items-center justify-center gap-6 pt-3 pb-6 text-xs text-center text-onpe-ui-blue bg-onpe-ui-skyblue-light/15 lg:flex-row md:py-2", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "flex gap-6 md:gap-8", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconChrome, {}), jsx("p", { className: "hidden text-left md:block", children: "Google Chrome" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconSafari, {}), jsx("p", { className: "hidden text-left md:block", children: "Safari" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconEdge, {}), jsx("p", { className: "hidden text-left md:block", children: "Microsoft Edge" })] })] })] }));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("div", { className: "onpe-browser-recommended", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "onpe-browser-list", children: [jsxs("div", { className: "onpe-browser-item", children: [jsx(IconChrome, {}), jsx("p", { className: "onpe-browser-name", children: "Google Chrome" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconSafari, {}), jsx("p", { className: "onpe-browser-name", children: "Safari" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconEdge, {}), jsx("p", { className: "onpe-browser-name", children: "Microsoft Edge" })] })] })] }) }));
 };
 
+var css_248z = "/* Footer Component Styles */\r\n.onpe-ui-container .onpe-footer {\r\n  /* Footer base styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-content {\r\n  /* Content wrapper styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact {\r\n  position: relative;\r\n  z-index: 10;\r\n  display: flex;\r\n  width: 100%;\r\n  min-height: 100px;\r\n  background-color: var(--onpe-ui-blue);\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-list {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  width: 100%;\r\n  flex-direction: column;\r\n  gap: 1.5rem;\r\n  margin: 0 auto;\r\n  padding: 3.5rem 1rem;\r\n  max-width: 1456px;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-item {\r\n  /* List item styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-title {\r\n  font-weight: 600;\r\n  color: var(--onpe-ui-yellow);\r\n  margin-bottom: 0.25rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  color: white;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development {\r\n  height: 93px;\r\n  width: 100%;\r\n  text-align: center;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background-color: rgba(255, 241, 210, 0.75); /* onpe-ui-yellow-light/75 */\r\n  position: fixed;\r\n  z-index: 10;\r\n  right: 0;\r\n  bottom: 0;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-text {\r\n  padding: 0.5rem 0.5rem;\r\n  font-size: 1.5rem;\r\n  color: var(--onpe-ui-blue);\r\n  font-family: 'Consolas', monospace;\r\n  font-weight: 900;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-break {\r\n  display: block;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    padding: 1.75rem 1rem;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    flex-direction: row;\r\n    align-items: center;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development {\r\n    height: 46px;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development-break {\r\n    display: none;\r\n  }\r\n}\r\n";
+styleInject(css_248z);
+
 var Footer = function (_a) {
     var _b = _a.showBrowserInfo, showBrowserInfo = _b === void 0 ? true : _b, _c = _a.showContactInfo, showContactInfo = _c === void 0 ? true : _c, children = _a.children, _d = _a.showFooterContent, showFooterContent = _d === void 0 ? true : _d, _e = _a.isDevelopment, isDevelopment = _e === void 0 ? true : _e, props = __rest(_a, ["showBrowserInfo", "showContactInfo", "children", "showFooterContent", "isDevelopment"]);
-    return (jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "relative z-10 flex w-full min-h-[100px] bg-onpe-ui-blue ", children: jsxs("ul", { className: "flex justify-between items-start lg:items-center w-full flex-col gap-6 mx-auto lg:flex-row py-14 px-4 max-w-[1456px] md:py-7", children: [jsxs("li", { children: [jsx("p", { className: "font-semibold pb text-onpe-ui-yellow", children: "Oficina central" }), jsx("p", { className: "text-sm font-medium text-white", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Escr\u00EDbenos" }), jsx("p", { className: "text-sm font-medium text-white", children: "informes@onpe.gob.pe" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Central telef\u00F3nica" }), jsx("p", { className: "text-sm font-medium text-white", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "h-[93px] lg:h-[46px] w-full text-center flex items-center justify-center bg-onpe-ui-yellow-light/75 fixed z-10 right-0 bottom-0", children: jsxs("p", { className: "px-2 py-1 text-2xl text-onpe-ui-blue font-consolas", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "lg:hidden" }), " - No Oficial"] }) }))] })));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "onpe-footer-contact", children: jsxs("ul", { className: "onpe-footer-contact-list", children: [jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Oficina central" }), jsx("p", { className: "onpe-footer-contact-text", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Escr\u00EDbenos" }), jsx("p", { className: "onpe-footer-contact-text", children: "informes@onpe.gob.pe" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Central telef\u00F3nica" }), jsx("p", { className: "onpe-footer-contact-text", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "onpe-footer-development", children: jsxs("p", { className: "onpe-footer-development-text", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "onpe-footer-development-break" }), " - No Oficial"] }) }))] })) }));
 };
 
 export { BrowserRecommended, Button, Footer, Modal, ModalBrowserIncompatible, ModalConfirm, ModalLoading, ModalSystemIncompatible, Overlay, Portal, Show };

package/dist/index.css

@@ -278,15 +278,9 @@
   .top-4 {
     top: calc(var(--spacing) * 4);
   }
-  .right-0 {
-    right: calc(var(--spacing) * 0);
-  }
   .right-4 {
     right: calc(var(--spacing) * 4);
   }
-  .bottom-0 {
-    bottom: calc(var(--spacing) * 0);
-  }
   .-z-10 {
     z-index: calc(10 * -1);
   }
@@ -455,9 +449,6 @@
   .h-\[32px\] {
     height: 32px;
   }
-  .h-\[93px\] {
-    height: 93px;
-  }
   .h-auto {
     height: auto;
   }
@@ -473,9 +464,6 @@
   .max-h-\[90vh\] {
     max-height: 90vh;
   }
-  .min-h-\[100px\] {
-    min-height: 100px;
-  }
   .min-h-screen {
     min-height: 100vh;
   }
@@ -533,9 +521,6 @@
   .max-w-\[680px\] {
     max-width: 680px;
   }
-  .max-w-\[1456px\] {
-    max-width: 1456px;
-  }
   .max-w-full {
     max-width: 100%;
   }
@@ -915,12 +900,6 @@
   .bg-onpe-ui-skyblue-light {
     background-color: var(--color-onpe-ui-skyblue-light);
   }
-  .bg-onpe-ui-skyblue-light\/15 {
-    background-color: color-mix(in srgb, #69b2e8 15%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-onpe-ui-skyblue-light) 15%, transparent);
-    }
-  }
   .bg-onpe-ui-skyblue-light\/80 {
     background-color: color-mix(in srgb, #69b2e8 80%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -939,12 +918,6 @@
   .bg-onpe-ui-yellow-light {
     background-color: var(--color-onpe-ui-yellow-light);
   }
-  .bg-onpe-ui-yellow-light\/75 {
-    background-color: color-mix(in srgb, #FFF1D2 75%, transparent);
-    @supports (color: color-mix(in lab, red, red)) {
-      background-color: color-mix(in oklab, var(--color-onpe-ui-yellow-light) 75%, transparent);
-    }
-  }
   .bg-onpe-ui-yellow-light\/80 {
     background-color: color-mix(in srgb, #FFF1D2 80%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -1053,12 +1026,6 @@
   .py-10 {
     padding-block: calc(var(--spacing) * 10);
   }
-  .py-14 {
-    padding-block: calc(var(--spacing) * 14);
-  }
-  .pt-3 {
-    padding-top: calc(var(--spacing) * 3);
-  }
   .pt-4 {
     padding-top: calc(var(--spacing) * 4);
   }
@@ -1068,9 +1035,6 @@
   .pt-10 {
     padding-top: calc(var(--spacing) * 10);
   }
-  .pb-6 {
-    padding-bottom: calc(var(--spacing) * 6);
-  }
   .pb-8 {
     padding-bottom: calc(var(--spacing) * 8);
   }
@@ -1648,26 +1612,11 @@
       grid-template-columns: repeat(4, minmax(0, 1fr));
     }
   }
-  .md\:gap-8 {
-    @media (width >= 48rem) {
-      gap: calc(var(--spacing) * 8);
-    }
-  }
   .md\:gap-12 {
     @media (width >= 48rem) {
       gap: calc(var(--spacing) * 12);
     }
   }
-  .md\:py-2 {
-    @media (width >= 48rem) {
-      padding-block: calc(var(--spacing) * 2);
-    }
-  }
-  .md\:py-7 {
-    @media (width >= 48rem) {
-      padding-block: calc(var(--spacing) * 7);
-    }
-  }
   .md\:text-2xl {
     @media (width >= 48rem) {
       font-size: var(--text-2xl);
@@ -1700,16 +1649,6 @@
       margin-top: calc(var(--spacing) * 20);
     }
   }
-  .lg\:hidden {
-    @media (width >= 64rem) {
-      display: none;
-    }
-  }
-  .lg\:h-\[46px\] {
-    @media (width >= 64rem) {
-      height: 46px;
-    }
-  }
   .lg\:w-\[200px\] {
     @media (width >= 64rem) {
       width: 200px;
@@ -1740,11 +1679,6 @@
       flex-direction: row;
     }
   }
-  .lg\:items-center {
-    @media (width >= 64rem) {
-      align-items: center;
-    }
-  }
   .lg\:px-5 {
     @media (width >= 64rem) {
       padding-inline: calc(var(--spacing) * 5);
@@ -1795,8 +1729,8 @@
 .onpe-ui-container {
   box-sizing: border-box;
 }
-.onpe-ui-container *,
-.onpe-ui-container *::before,
+.onpe-ui-container *,
+.onpe-ui-container *::before,
 .onpe-ui-container *::after {
   box-sizing: border-box;
 }
@@ -1996,5 +1930,5 @@
       --tw-ease: initial;
     }
   }
-}
-
+}
+

package/dist/index.esm.js

@@ -272,13 +272,46 @@ var IconSafari = function (props) { return (jsxs("svg", __assign({ width: 24, he
 
 var IconEdge = function (props) { return (jsxs("svg", __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [jsx("g", { clipPath: "url(#clip0_8211_8231)", children: jsx("path", { d: "M9.86748 11.7697C9.90253 13.051 10.5964 14.591 12.2319 15.9545C13.6546 17.1391 16.1157 18.0916 18.1066 18.0916C18.7863 18.0923 19.4637 18.0112 20.124 17.8498C20.3714 17.7895 20.6314 17.8089 20.8671 17.905C21.1027 18.0012 21.302 18.1693 21.4366 18.3854C21.5711 18.6015 21.6339 18.8546 21.6162 19.1085C21.5984 19.3624 21.5009 19.6043 21.3377 19.7996C19.4012 22.1173 16.6672 23.6261 13.674 24.029C13.5491 24.0479 13.4218 24.0422 13.2992 24.0121C10.7136 23.3739 7.83188 20.132 7.83188 16.8828C7.83188 14.0132 8.84726 12.4769 9.86748 11.7697ZM9.01407 7.25984C10.0434 7.42348 10.9791 7.95314 11.6492 8.75146C11.0422 8.77677 10.442 8.88996 9.86748 9.08749C7.44144 9.89737 5.4143 12.5168 5.4143 16.8828C5.4143 19.9495 6.86364 22.0394 8.76385 23.6797C3.94442 22.315 0.34827 18.0384 0.00255686 12.8685C-0.0167921 12.5867 0.0742415 12.3084 0.256402 12.0925L0.461897 11.8556L0.853544 11.4228L1.17629 11.0832L1.3564 10.897L1.75772 10.4945L2.21464 10.0485L2.46607 9.81034C4.77485 7.63093 7.18034 6.94798 9.01407 7.25984ZM12.0626 -0.0398865C17.8165 -0.0398865 22.6299 3.97926 23.8507 9.36309C24.2859 11.279 23.7141 12.7779 22.8511 13.821C22.1768 14.6235 21.3065 15.2381 20.3247 15.6052C19.1582 16.0173 17.8467 16.0004 16.8047 15.8179C15.8739 15.6547 14.7135 15.3404 14.1418 14.5221C13.9795 14.2901 13.9038 14.0085 13.9278 13.7264C13.9519 13.4443 14.0743 13.1796 14.2735 12.9785C14.8598 12.3862 15.1305 11.7758 15.1704 11.2294C15.182 11.0104 15.1637 10.7908 15.116 10.5767C14.4125 7.40973 12.2319 5.35362 9.41902 4.87616C6.08276 4.30925 2.91695 6.03295 0.576731 8.27037C2.16266 3.44498 6.70529 -0.0398865 12.0626 -0.0398865Z", fill: "currentColor" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_8211_8231", children: jsx("rect", { width: 24, height: 24, fill: "white" }) }) })] }))); };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$1 = "/* BrowserRecommended Component Styles */\r\n.onpe-ui-container .onpe-browser-recommended {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 1.5rem;\r\n  padding: 0.75rem 0 1.5rem 0;\r\n  font-size: 0.75rem;\r\n  text-align: center;\r\n  color: var(--onpe-ui-blue);\r\n  background-color: rgba(105, 178, 232, 0.15); /* onpe-ui-skyblue-light/15 */\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n  display: flex;\r\n  gap: 1.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n  display: none;\r\n  text-align: left;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    padding: 0.5rem 0;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n    gap: 2rem;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n    display: block;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    flex-direction: row;\r\n  }\r\n}\r\n";
+styleInject(css_248z$1);
+
 var BrowserRecommended = function () {
-    return (jsxs("div", { className: "flex flex-col items-center justify-center gap-6 pt-3 pb-6 text-xs text-center text-onpe-ui-blue bg-onpe-ui-skyblue-light/15 lg:flex-row md:py-2", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "flex gap-6 md:gap-8", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconChrome, {}), jsx("p", { className: "hidden text-left md:block", children: "Google Chrome" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconSafari, {}), jsx("p", { className: "hidden text-left md:block", children: "Safari" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconEdge, {}), jsx("p", { className: "hidden text-left md:block", children: "Microsoft Edge" })] })] })] }));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("div", { className: "onpe-browser-recommended", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "onpe-browser-list", children: [jsxs("div", { className: "onpe-browser-item", children: [jsx(IconChrome, {}), jsx("p", { className: "onpe-browser-name", children: "Google Chrome" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconSafari, {}), jsx("p", { className: "onpe-browser-name", children: "Safari" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconEdge, {}), jsx("p", { className: "onpe-browser-name", children: "Microsoft Edge" })] })] })] }) }));
 };
 
+var css_248z = "/* Footer Component Styles */\r\n.onpe-ui-container .onpe-footer {\r\n  /* Footer base styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-content {\r\n  /* Content wrapper styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact {\r\n  position: relative;\r\n  z-index: 10;\r\n  display: flex;\r\n  width: 100%;\r\n  min-height: 100px;\r\n  background-color: var(--onpe-ui-blue);\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-list {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  width: 100%;\r\n  flex-direction: column;\r\n  gap: 1.5rem;\r\n  margin: 0 auto;\r\n  padding: 3.5rem 1rem;\r\n  max-width: 1456px;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-item {\r\n  /* List item styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-title {\r\n  font-weight: 600;\r\n  color: var(--onpe-ui-yellow);\r\n  margin-bottom: 0.25rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  color: white;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development {\r\n  height: 93px;\r\n  width: 100%;\r\n  text-align: center;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background-color: rgba(255, 241, 210, 0.75); /* onpe-ui-yellow-light/75 */\r\n  position: fixed;\r\n  z-index: 10;\r\n  right: 0;\r\n  bottom: 0;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-text {\r\n  padding: 0.5rem 0.5rem;\r\n  font-size: 1.5rem;\r\n  color: var(--onpe-ui-blue);\r\n  font-family: 'Consolas', monospace;\r\n  font-weight: 900;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-break {\r\n  display: block;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    padding: 1.75rem 1rem;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    flex-direction: row;\r\n    align-items: center;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development {\r\n    height: 46px;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development-break {\r\n    display: none;\r\n  }\r\n}\r\n";
+styleInject(css_248z);
+
 var Footer = function (_a) {
     var _b = _a.showBrowserInfo, showBrowserInfo = _b === void 0 ? true : _b, _c = _a.showContactInfo, showContactInfo = _c === void 0 ? true : _c, children = _a.children, _d = _a.showFooterContent, showFooterContent = _d === void 0 ? true : _d, _e = _a.isDevelopment, isDevelopment = _e === void 0 ? true : _e, props = __rest(_a, ["showBrowserInfo", "showContactInfo", "children", "showFooterContent", "isDevelopment"]);
-    return (jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "relative z-10 flex w-full min-h-[100px] bg-onpe-ui-blue ", children: jsxs("ul", { className: "flex justify-between items-start lg:items-center w-full flex-col gap-6 mx-auto lg:flex-row py-14 px-4 max-w-[1456px] md:py-7", children: [jsxs("li", { children: [jsx("p", { className: "font-semibold pb text-onpe-ui-yellow", children: "Oficina central" }), jsx("p", { className: "text-sm font-medium text-white", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Escr\u00EDbenos" }), jsx("p", { className: "text-sm font-medium text-white", children: "informes@onpe.gob.pe" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Central telef\u00F3nica" }), jsx("p", { className: "text-sm font-medium text-white", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "h-[93px] lg:h-[46px] w-full text-center flex items-center justify-center bg-onpe-ui-yellow-light/75 fixed z-10 right-0 bottom-0", children: jsxs("p", { className: "px-2 py-1 text-2xl text-onpe-ui-blue font-consolas", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "lg:hidden" }), " - No Oficial"] }) }))] })));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "onpe-footer-contact", children: jsxs("ul", { className: "onpe-footer-contact-list", children: [jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Oficina central" }), jsx("p", { className: "onpe-footer-contact-text", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Escr\u00EDbenos" }), jsx("p", { className: "onpe-footer-contact-text", children: "informes@onpe.gob.pe" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Central telef\u00F3nica" }), jsx("p", { className: "onpe-footer-contact-text", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "onpe-footer-development", children: jsxs("p", { className: "onpe-footer-development-text", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "onpe-footer-development-break" }), " - No Oficial"] }) }))] })) }));
 };
 
 /**

package/dist/index.js

@@ -272,13 +272,46 @@ var IconSafari = function (props) { return (jsxs("svg", __assign({ width: 24, he
 
 var IconEdge = function (props) { return (jsxs("svg", __assign({ width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { children: [jsx("g", { clipPath: "url(#clip0_8211_8231)", children: jsx("path", { d: "M9.86748 11.7697C9.90253 13.051 10.5964 14.591 12.2319 15.9545C13.6546 17.1391 16.1157 18.0916 18.1066 18.0916C18.7863 18.0923 19.4637 18.0112 20.124 17.8498C20.3714 17.7895 20.6314 17.8089 20.8671 17.905C21.1027 18.0012 21.302 18.1693 21.4366 18.3854C21.5711 18.6015 21.6339 18.8546 21.6162 19.1085C21.5984 19.3624 21.5009 19.6043 21.3377 19.7996C19.4012 22.1173 16.6672 23.6261 13.674 24.029C13.5491 24.0479 13.4218 24.0422 13.2992 24.0121C10.7136 23.3739 7.83188 20.132 7.83188 16.8828C7.83188 14.0132 8.84726 12.4769 9.86748 11.7697ZM9.01407 7.25984C10.0434 7.42348 10.9791 7.95314 11.6492 8.75146C11.0422 8.77677 10.442 8.88996 9.86748 9.08749C7.44144 9.89737 5.4143 12.5168 5.4143 16.8828C5.4143 19.9495 6.86364 22.0394 8.76385 23.6797C3.94442 22.315 0.34827 18.0384 0.00255686 12.8685C-0.0167921 12.5867 0.0742415 12.3084 0.256402 12.0925L0.461897 11.8556L0.853544 11.4228L1.17629 11.0832L1.3564 10.897L1.75772 10.4945L2.21464 10.0485L2.46607 9.81034C4.77485 7.63093 7.18034 6.94798 9.01407 7.25984ZM12.0626 -0.0398865C17.8165 -0.0398865 22.6299 3.97926 23.8507 9.36309C24.2859 11.279 23.7141 12.7779 22.8511 13.821C22.1768 14.6235 21.3065 15.2381 20.3247 15.6052C19.1582 16.0173 17.8467 16.0004 16.8047 15.8179C15.8739 15.6547 14.7135 15.3404 14.1418 14.5221C13.9795 14.2901 13.9038 14.0085 13.9278 13.7264C13.9519 13.4443 14.0743 13.1796 14.2735 12.9785C14.8598 12.3862 15.1305 11.7758 15.1704 11.2294C15.182 11.0104 15.1637 10.7908 15.116 10.5767C14.4125 7.40973 12.2319 5.35362 9.41902 4.87616C6.08276 4.30925 2.91695 6.03295 0.576731 8.27037C2.16266 3.44498 6.70529 -0.0398865 12.0626 -0.0398865Z", fill: "currentColor" }) }), jsx("defs", { children: jsx("clipPath", { id: "clip0_8211_8231", children: jsx("rect", { width: 24, height: 24, fill: "white" }) }) })] }))); };
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z$1 = "/* BrowserRecommended Component Styles */\r\n.onpe-ui-container .onpe-browser-recommended {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 1.5rem;\r\n  padding: 0.75rem 0 1.5rem 0;\r\n  font-size: 0.75rem;\r\n  text-align: center;\r\n  color: var(--onpe-ui-blue);\r\n  background-color: rgba(105, 178, 232, 0.15); /* onpe-ui-skyblue-light/15 */\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n  display: flex;\r\n  gap: 1.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.5rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n  display: none;\r\n  text-align: left;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    padding: 0.5rem 0;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-list {\r\n    gap: 2rem;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-browser-recommended .onpe-browser-name {\r\n    display: block;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-browser-recommended {\r\n    flex-direction: row;\r\n  }\r\n}\r\n";
+styleInject(css_248z$1);
+
 var BrowserRecommended = function () {
-    return (jsxs("div", { className: "flex flex-col items-center justify-center gap-6 pt-3 pb-6 text-xs text-center text-onpe-ui-blue bg-onpe-ui-skyblue-light/15 lg:flex-row md:py-2", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "flex gap-6 md:gap-8", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconChrome, {}), jsx("p", { className: "hidden text-left md:block", children: "Google Chrome" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconSafari, {}), jsx("p", { className: "hidden text-left md:block", children: "Safari" })] }), jsxs("div", { className: "flex items-center gap-2", children: [jsx(IconEdge, {}), jsx("p", { className: "hidden text-left md:block", children: "Microsoft Edge" })] })] })] }));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("div", { className: "onpe-browser-recommended", children: [jsx("p", { children: "Navegadores recomendados:" }), jsxs("div", { className: "onpe-browser-list", children: [jsxs("div", { className: "onpe-browser-item", children: [jsx(IconChrome, {}), jsx("p", { className: "onpe-browser-name", children: "Google Chrome" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconSafari, {}), jsx("p", { className: "onpe-browser-name", children: "Safari" })] }), jsxs("div", { className: "onpe-browser-item", children: [jsx(IconEdge, {}), jsx("p", { className: "onpe-browser-name", children: "Microsoft Edge" })] })] })] }) }));
 };
 
+var css_248z = "/* Footer Component Styles */\r\n.onpe-ui-container .onpe-footer {\r\n  /* Footer base styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-content {\r\n  /* Content wrapper styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact {\r\n  position: relative;\r\n  z-index: 10;\r\n  display: flex;\r\n  width: 100%;\r\n  min-height: 100px;\r\n  background-color: var(--onpe-ui-blue);\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-list {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: flex-start;\r\n  width: 100%;\r\n  flex-direction: column;\r\n  gap: 1.5rem;\r\n  margin: 0 auto;\r\n  padding: 3.5rem 1rem;\r\n  max-width: 1456px;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-item {\r\n  /* List item styles */\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-title {\r\n  font-weight: 600;\r\n  color: var(--onpe-ui-yellow);\r\n  margin-bottom: 0.25rem;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-contact-text {\r\n  font-size: 0.875rem;\r\n  font-weight: 500;\r\n  color: white;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development {\r\n  height: 93px;\r\n  width: 100%;\r\n  text-align: center;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background-color: rgba(255, 241, 210, 0.75); /* onpe-ui-yellow-light/75 */\r\n  position: fixed;\r\n  z-index: 10;\r\n  right: 0;\r\n  bottom: 0;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-text {\r\n  padding: 0.5rem 0.5rem;\r\n  font-size: 1.5rem;\r\n  color: var(--onpe-ui-blue);\r\n  font-family: 'Consolas', monospace;\r\n  font-weight: 900;\r\n}\r\n\r\n.onpe-ui-container .onpe-footer-development-break {\r\n  display: block;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (min-width: 768px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    padding: 1.75rem 1rem;\r\n  }\r\n}\r\n\r\n@media (min-width: 1024px) {\r\n  .onpe-ui-container .onpe-footer-contact-list {\r\n    flex-direction: row;\r\n    align-items: center;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development {\r\n    height: 46px;\r\n  }\r\n  \r\n  .onpe-ui-container .onpe-footer-development-break {\r\n    display: none;\r\n  }\r\n}\r\n";
+styleInject(css_248z);
+
 var Footer = function (_a) {
     var _b = _a.showBrowserInfo, showBrowserInfo = _b === void 0 ? true : _b, _c = _a.showContactInfo, showContactInfo = _c === void 0 ? true : _c, children = _a.children, _d = _a.showFooterContent, showFooterContent = _d === void 0 ? true : _d, _e = _a.isDevelopment, isDevelopment = _e === void 0 ? true : _e, props = __rest(_a, ["showBrowserInfo", "showContactInfo", "children", "showFooterContent", "isDevelopment"]);
-    return (jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "relative z-10 flex w-full min-h-[100px] bg-onpe-ui-blue ", children: jsxs("ul", { className: "flex justify-between items-start lg:items-center w-full flex-col gap-6 mx-auto lg:flex-row py-14 px-4 max-w-[1456px] md:py-7", children: [jsxs("li", { children: [jsx("p", { className: "font-semibold pb text-onpe-ui-yellow", children: "Oficina central" }), jsx("p", { className: "text-sm font-medium text-white", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Escr\u00EDbenos" }), jsx("p", { className: "text-sm font-medium text-white", children: "informes@onpe.gob.pe" })] }), jsxs("li", { children: [jsx("p", { className: "font-semibold text-onpe-ui-yellow", children: "Central telef\u00F3nica" }), jsx("p", { className: "text-sm font-medium text-white", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "h-[93px] lg:h-[46px] w-full text-center flex items-center justify-center bg-onpe-ui-yellow-light/75 fixed z-10 right-0 bottom-0", children: jsxs("p", { className: "px-2 py-1 text-2xl text-onpe-ui-blue font-consolas", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "lg:hidden" }), " - No Oficial"] }) }))] })));
+    return (jsx("div", { className: "onpe-ui-container", children: jsxs("footer", __assign({}, props, { children: [showFooterContent && (jsxs(Fragment, { children: [children && children, showBrowserInfo && jsx(BrowserRecommended, {}), showContactInfo && (jsx("div", { className: "onpe-footer-contact", children: jsxs("ul", { className: "onpe-footer-contact-list", children: [jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Oficina central" }), jsx("p", { className: "onpe-footer-contact-text", children: "Jr. Washington 1894 - Cercado de Lima" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Escr\u00EDbenos" }), jsx("p", { className: "onpe-footer-contact-text", children: "informes@onpe.gob.pe" })] }), jsxs("li", { className: "onpe-footer-contact-item", children: [jsx("p", { className: "onpe-footer-contact-title", children: "Central telef\u00F3nica" }), jsx("p", { className: "onpe-footer-contact-text", children: "(01) 4170630 | Lunes a viernes de 8:30 a.m. a 4:30 p.m." })] })] }) }))] })), isDevelopment && (jsx("div", { className: "onpe-footer-development", children: jsxs("p", { className: "onpe-footer-development-text", children: ["Versi\u00F3n en Desarrollo ", jsx("br", { className: "onpe-footer-development-break" }), " - No Oficial"] }) }))] })) }));
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onpe/ui",
-  "version": "1.2.32",
+  "version": "1.2.33",
   "type": "module",
   "description": "Librería de componentes UI para ONPE - Componentes, Hooks, Utils y Librerías",
   "main": "dist/index.js",