responsive-system 1.2.5 → 1.2.7

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.
@@ -1,5 +1,5 @@
1
1
  import { jsx as e, Fragment as B, jsxs as s } from "react/jsx-runtime";
2
- import { useState as w, useCallback as m, useMemo as D, useEffect as oe, createContext as M, useContext as R } from "react";
2
+ import { useState as w, useCallback as m, useMemo as D, useEffect as oe, createContext as R, useContext as M } from "react";
3
3
  const le = ({
4
4
  children: t,
5
5
  debug: n = !1
@@ -42,10 +42,10 @@ const me = () => {
42
42
  window.removeEventListener("resize", l);
43
43
  };
44
44
  }, [l]);
45
- const { width: r, height: o } = t, a = D(() => ce(r), [r]), c = D(() => ue(r, o), [r, o]), d = a === "xs", k = a === "sm", y = a === "md", p = a === "lg", C = a === "xl", S = a === "2xl", L = a === "3xl", f = a === "4xl", g = a === "5xl", W = d || k, I = y, X = p || C || S || L || f || g, _ = d || k || y, V = p || C || S || L || f || g, K = L || f || g, Y = f || g, G = g, q = c === "portrait", J = c === "landscape", Q = m((u) => x(a) >= x(u), [a]), Z = m((u) => x(a) <= x(u), [a]), ee = m((u, v) => {
45
+ const { width: r, height: o } = t, a = D(() => ce(r), [r]), c = D(() => ue(r, o), [r, o]), d = a === "xs", k = a === "sm", y = a === "md", p = a === "lg", C = a === "xl", S = a === "2xl", L = a === "3xl", f = a === "4xl", g = a === "5xl", W = d || k, I = y, X = p || C || S || L || f || g, _ = d || k || y, K = p || C || S || L || f || g, V = L || f || g, Y = f || g, q = g, G = c === "portrait", J = c === "landscape", Q = m((u) => x(a) >= x(u), [a]), Z = m((u) => x(a) <= x(u), [a]), ee = m((u, v) => {
46
46
  const O = x(a);
47
47
  return O >= x(u) && O <= x(v);
48
- }, [a]), te = m((u) => r >= u, [r]), ae = m((u) => r <= u, [r]), se = m((u, v) => r >= u && r <= v, [r]), ne = m((u) => o >= u, [o]), re = m((u) => o <= u, [o]), ie = m((u, v) => o >= u && o <= v, [o]);
48
+ }, [a]), te = m((u) => r >= u, [r]), ae = m((u) => r <= u, [r]), ne = m((u, v) => r >= u && r <= v, [r]), se = m((u) => o >= u, [o]), re = m((u) => o <= u, [o]), ie = m((u, v) => o >= u && o <= v, [o]);
49
49
  return {
50
50
  // Estado básico
51
51
  breakpoint: a,
@@ -67,12 +67,12 @@ const me = () => {
67
67
  isTablet: I,
68
68
  isDesktop: X,
69
69
  isSmall: _,
70
- isLarge: V,
71
- isUltraWide: K,
70
+ isLarge: K,
71
+ isUltraWide: V,
72
72
  is4K: Y,
73
- is5K: G,
73
+ is5K: q,
74
74
  // Helpers de orientación
75
- isPortrait: q,
75
+ isPortrait: G,
76
76
  isLandscape: J,
77
77
  // Funciones de comparación
78
78
  isBreakpointUp: Q,
@@ -80,36 +80,36 @@ const me = () => {
80
80
  isBreakpointBetween: ee,
81
81
  isWidthUp: te,
82
82
  isWidthDown: ae,
83
- isWidthBetween: se,
84
- isHeightUp: ne,
83
+ isWidthBetween: ne,
84
+ isHeightUp: se,
85
85
  isHeightDown: re,
86
86
  isHeightBetween: ie,
87
87
  // Debug
88
88
  debug: !1
89
89
  };
90
- }, T = M(void 0), be = () => {
91
- const t = R(T);
90
+ }, T = R(void 0), be = () => {
91
+ const t = M(T);
92
92
  if (!t)
93
93
  throw new Error("useResponsiveLayoutContext must be used within a ResponsiveLayoutProvider");
94
94
  return t;
95
- }, $ = M(void 0), A = ({ children: t }) => {
95
+ }, $ = R(void 0), A = ({ children: t }) => {
96
96
  const [n, i] = w(!1);
97
97
  return /* @__PURE__ */ e($.Provider, { value: { sidebarOpen: n, setSidebarOpen: i }, children: t });
98
- }, j = () => {
99
- const t = R($);
98
+ }, U = () => {
99
+ const t = M($);
100
100
  if (!t)
101
101
  throw new Error("useSidebar must be used within a SidebarProvider");
102
102
  return t;
103
- }, z = M({
103
+ }, E = R({
104
104
  currentPage: "test",
105
105
  setCurrentPage: () => {
106
106
  }
107
- }), U = () => R(z), Se = ({
107
+ }), j = () => M(E), Se = ({
108
108
  children: t,
109
109
  defaultPage: n = "test"
110
110
  }) => {
111
111
  const [i, l] = w(n);
112
- return /* @__PURE__ */ e(z.Provider, { value: { currentPage: i, setCurrentPage: l }, children: t });
112
+ return /* @__PURE__ */ e(E.Provider, { value: { currentPage: i, setCurrentPage: l }, children: t });
113
113
  }, b = () => {
114
114
  const t = be();
115
115
  return {
@@ -236,7 +236,7 @@ const me = () => {
236
236
  }
237
237
  };
238
238
  return /* @__PURE__ */ e(T.Provider, { value: y, children: t });
239
- }, Me = ({
239
+ }, Re = ({
240
240
  children: t,
241
241
  defaultLayout: n = F,
242
242
  useResponsiveHook: i
@@ -247,7 +247,7 @@ const me = () => {
247
247
  useResponsiveHook: i,
248
248
  children: t
249
249
  }
250
- ) }), Re = ({ children: t, layout: n }) => {
250
+ ) }), Me = ({ children: t, layout: n }) => {
251
251
  const { layout: i } = b(), l = n || i.current, o = {
252
252
  default: P,
253
253
  sidebar: ye,
@@ -255,8 +255,8 @@ const me = () => {
255
255
  minimal: Ne
256
256
  }[l] || P;
257
257
  return /* @__PURE__ */ e(o, { children: t });
258
- }, je = () => {
259
- const { isMobile: t } = b(), { currentPage: n, setCurrentPage: i } = U(), { sidebarOpen: l, setSidebarOpen: r } = j(), o = [
258
+ }, Ue = () => {
259
+ const { isMobile: t } = b(), { currentPage: n, setCurrentPage: i } = j(), { sidebarOpen: l, setSidebarOpen: r } = U(), o = [
260
260
  { id: "test", label: "Suite de Test" },
261
261
  { id: "demo", label: "Demo" }
262
262
  ];
@@ -306,7 +306,7 @@ const me = () => {
306
306
  ] }) }) })
307
307
  ] });
308
308
  }, H = () => {
309
- const { isMobile: t, isTablet: n, breakpoint: i } = b(), { currentPage: l, setCurrentPage: r } = U(), { sidebarOpen: o, setSidebarOpen: a } = j(), c = [
309
+ const { isMobile: t, isTablet: n, breakpoint: i } = b(), { currentPage: l, setCurrentPage: r } = j(), { sidebarOpen: o, setSidebarOpen: a } = U(), c = [
310
310
  { id: "test", label: "Suite de Test" },
311
311
  { id: "demo", label: "Demo" }
312
312
  ];
@@ -359,20 +359,20 @@ const me = () => {
359
359
  )) })
360
360
  ] }) }) })
361
361
  ] });
362
- }, E = () => {
362
+ }, z = () => {
363
363
  const { layout: t, breakpoint: n, width: i, height: l } = b();
364
364
  return /* @__PURE__ */ e("footer", { className: "bg-gradient-to-r from-gray-900 to-black border-t border-cyan-500/20", children: /* @__PURE__ */ s("div", { className: `${t.config.spacing} py-6`, children: [
365
- /* @__PURE__ */ s("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", children: [
365
+ /* @__PURE__ */ s("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", children: [
366
366
  /* @__PURE__ */ s("div", { children: [
367
- /* @__PURE__ */ s("div", { className: "flex items-center space-x-2 mb-3", children: [
368
- /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-cyan-500 rounded flex items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-white font-bold text-xs", children: "RS" }) }),
367
+ /* @__PURE__ */ s("div", { className: "flex items-center space-x-2 mb-2", children: [
368
+ /* @__PURE__ */ e("div", { className: "w-5 h-5 bg-cyan-500 rounded flex items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-white font-bold text-xs", children: "RS" }) }),
369
369
  /* @__PURE__ */ e("span", { className: "text-white font-semibold text-sm", children: "Responsive System" })
370
370
  ] }),
371
371
  /* @__PURE__ */ e("p", { className: "text-gray-400 text-xs leading-relaxed", children: "Sistema completo de auto-escalado para aplicaciones React + Tailwind CSS" })
372
372
  ] }),
373
373
  /* @__PURE__ */ s("div", { children: [
374
- /* @__PURE__ */ e("h3", { className: "text-white font-semibold text-sm mb-3", children: "Estado del Sistema" }),
375
- /* @__PURE__ */ s("div", { className: "space-y-1.5", children: [
374
+ /* @__PURE__ */ e("h3", { className: "text-white font-semibold text-sm mb-2", children: "Estado del Sistema" }),
375
+ /* @__PURE__ */ s("div", { className: "space-y-1", children: [
376
376
  /* @__PURE__ */ s("div", { className: "flex items-center justify-between text-xs", children: [
377
377
  /* @__PURE__ */ e("span", { className: "text-gray-400", children: "Breakpoint:" }),
378
378
  /* @__PURE__ */ e("span", { className: "text-cyan-400 font-medium", children: n.toUpperCase() })
@@ -392,41 +392,17 @@ const me = () => {
392
392
  ] })
393
393
  ] }),
394
394
  /* @__PURE__ */ s("div", { children: [
395
- /* @__PURE__ */ e("h3", { className: "text-white font-semibold text-sm mb-3", children: "Desarrollador" }),
396
- /* @__PURE__ */ s("div", { className: "space-y-2", children: [
397
- /* @__PURE__ */ s("div", { className: "flex items-center space-x-2", children: [
398
- /* @__PURE__ */ e("div", { className: "w-6 h-6 bg-gray-700 rounded-full flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ e("svg", { className: "w-3 h-3 text-gray-300", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e("path", { d: "M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" }) }) }),
399
- /* @__PURE__ */ s("div", { children: [
400
- /* @__PURE__ */ e("p", { className: "text-white font-medium text-xs", children: "Felipe Caroca" }),
401
- /* @__PURE__ */ e("p", { className: "text-gray-400 text-xs", children: "Frontend Developer" })
402
- ] })
403
- ] }),
404
- /* @__PURE__ */ s(
405
- "a",
406
- {
407
- href: "https://github.com/FelipeCaroca1",
408
- target: "_blank",
409
- rel: "noopener noreferrer",
410
- className: "flex items-center space-x-1.5 text-gray-400 hover:text-cyan-400 transition-colors text-xs group",
411
- children: [
412
- /* @__PURE__ */ e("svg", { className: "w-3 h-3 group-hover:text-cyan-400", fill: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e("path", { d: "M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z" }) }),
413
- /* @__PURE__ */ e("span", { children: "Ver en GitHub" })
414
- ]
415
- }
416
- )
395
+ /* @__PURE__ */ e("h3", { className: "text-white font-semibold text-sm mb-2", children: "Desarrollador" }),
396
+ /* @__PURE__ */ s("div", { className: "space-y-1", children: [
397
+ /* @__PURE__ */ e("p", { className: "text-white font-medium text-xs", children: "Felipe Caroca" }),
398
+ /* @__PURE__ */ e("p", { className: "text-gray-400 text-xs", children: "Frontend Developer" })
417
399
  ] })
418
400
  ] })
419
401
  ] }),
420
- /* @__PURE__ */ s("div", { className: "border-t border-gray-800 mt-6 pt-4 flex flex-col items-center text-center", children: [
421
- /* @__PURE__ */ e("p", { className: "text-gray-500 text-xs mb-2", children: "© 2025 Responsive System. Todos los derechos reservados." }),
422
- /* @__PURE__ */ s("div", { className: "flex items-center space-x-2", children: [
423
- /* @__PURE__ */ e("span", { className: "text-gray-500 text-xs", children: "Auto-escalado activo" }),
424
- /* @__PURE__ */ e("div", { className: "w-1.5 h-1.5 bg-cyan-400 rounded-full animate-pulse" })
425
- ] })
426
- ] })
402
+ /* @__PURE__ */ e("div", { className: "border-t border-gray-800 mt-4 pt-4 flex flex-col items-center text-center", children: /* @__PURE__ */ e("p", { className: "text-gray-500 text-xs", children: "© 2025 Responsive System. Todos los derechos reservados." }) })
427
403
  ] }) });
428
404
  }, pe = () => {
429
- const { isMobile: t, breakpoint: n } = b(), { currentPage: i, setCurrentPage: l } = U(), [r, o] = w(!1), a = [
405
+ const { isMobile: t, breakpoint: n } = b(), { currentPage: i, setCurrentPage: l } = j(), [r, o] = w(!1), a = [
430
406
  { id: "demo", name: "Demo" },
431
407
  { id: "test", name: "Suite de Test" }
432
408
  ];
@@ -476,7 +452,7 @@ const me = () => {
476
452
  return /* @__PURE__ */ s("div", { className: "min-h-screen bg-black flex flex-col", children: [
477
453
  /* @__PURE__ */ e(pe, {}),
478
454
  /* @__PURE__ */ e("main", { className: "flex-1", children: /* @__PURE__ */ e("div", { className: n.getContainerClass(), children: t }) }),
479
- /* @__PURE__ */ e(E, {})
455
+ /* @__PURE__ */ e(z, {})
480
456
  ] });
481
457
  }, ge = ({ children: t }) => {
482
458
  const { layoutUtils: n } = b();
@@ -485,7 +461,7 @@ const me = () => {
485
461
  /* @__PURE__ */ e("main", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ e("div", { className: n.getContainerClass(), children: t }) })
486
462
  ] });
487
463
  }, ye = ({ children: t }) => /* @__PURE__ */ e(A, { children: /* @__PURE__ */ e(ge, { children: t }) }), fe = ({ children: t }) => {
488
- const { layoutUtils: n } = b(), { setSidebarOpen: i } = j();
464
+ const { layoutUtils: n } = b(), { setSidebarOpen: i } = U();
489
465
  return /* @__PURE__ */ s("div", { className: "min-h-screen bg-black flex flex-col", children: [
490
466
  /* @__PURE__ */ e("div", { className: "sticky top-0 z-50", children: /* @__PURE__ */ e("nav", { className: "bg-gradient-to-r from-gray-900 via-black to-gray-900 border-b border-cyan-500/20 shadow-2xl relative", children: /* @__PURE__ */ e("div", { className: "w-full", children: /* @__PURE__ */ e("div", { className: "px-4 py-4", children: /* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ s("div", { className: "flex items-center space-x-2", children: [
491
467
  /* @__PURE__ */ e(
@@ -506,12 +482,12 @@ const me = () => {
506
482
  /* @__PURE__ */ e(H, {}),
507
483
  /* @__PURE__ */ e("main", { className: "flex-1 overflow-auto", children: /* @__PURE__ */ e("div", { className: n.getContainerClass(), children: t }) })
508
484
  ] }),
509
- /* @__PURE__ */ e(E, {})
485
+ /* @__PURE__ */ e(z, {})
510
486
  ] });
511
487
  }, ve = ({ children: t }) => /* @__PURE__ */ e(A, { children: /* @__PURE__ */ e(fe, { children: t }) }), Ne = ({ children: t }) => {
512
488
  const { layoutUtils: n } = b();
513
489
  return /* @__PURE__ */ e("div", { className: "min-h-screen bg-black", children: /* @__PURE__ */ e("main", { className: n.getContainerClass(), children: t }) });
514
- }, Ue = ({ compact: t = !1 }) => {
490
+ }, je = ({ compact: t = !1 }) => {
515
491
  const { current: n, setLayout: i, config: l } = he();
516
492
  return t ? /* @__PURE__ */ s("div", { className: "bg-black/50 rounded-lg p-3 border border-gray-700", children: [
517
493
  /* @__PURE__ */ e("div", { className: "text-xs text-gray-500 mb-2", children: "Layout:" }),
@@ -554,15 +530,15 @@ export {
554
530
  F as DEFAULT_LAYOUT,
555
531
  ve as DashboardLayout,
556
532
  P as DefaultLayout,
557
- E as Footer,
558
- je as Header,
533
+ z as Footer,
534
+ Ue as Header,
559
535
  N as LAYOUT_CONFIG,
560
- Ue as LayoutSwitcher,
561
- Re as MainLayout,
536
+ je as LayoutSwitcher,
537
+ Me as MainLayout,
562
538
  Ne as MinimalLayout,
563
539
  pe as Navigation,
564
540
  Se as NavigationProvider,
565
- Me as ResponsiveLayoutProvider,
541
+ Re as ResponsiveLayoutProvider,
566
542
  le as ResponsiveProvider,
567
543
  H as Sidebar,
568
544
  ye as SidebarLayout,
@@ -571,10 +547,10 @@ export {
571
547
  Ce as getBreakpointValue,
572
548
  ce as getCurrentBreakpoint,
573
549
  he as useLayout,
574
- U as useNavigation,
550
+ j as useNavigation,
575
551
  me as useResponsive,
576
552
  b as useResponsiveLayout,
577
553
  be as useResponsiveLayoutContext,
578
- j as useSidebar
554
+ U as useSidebar
579
555
  };
580
556
  //# sourceMappingURL=responsive-system.mjs.map