next-recomponents 2.0.35 → 2.0.36
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.
- package/dist/index.js +5 -15
- package/dist/index.mjs +6 -16
- package/package.json +1 -1
- package/src/container/index.tsx +19 -15
package/dist/index.js
CHANGED
|
@@ -3668,19 +3668,8 @@ function Container({
|
|
|
3668
3668
|
expandedFooter = false,
|
|
3669
3669
|
expandedMenu = false
|
|
3670
3670
|
}) {
|
|
3671
|
-
const [isSidebarOpen, setIsSidebarOpen] = (0, import_react2.useState)(
|
|
3671
|
+
const [isSidebarOpen, setIsSidebarOpen] = (0, import_react2.useState)(false);
|
|
3672
3672
|
const [isFooterOpen, setIsFooterOpen] = (0, import_react2.useState)(expandedFooter);
|
|
3673
|
-
const handleClick = (state) => {
|
|
3674
|
-
window.localStorage.setItem("isSidebarOpen", JSON.stringify(state));
|
|
3675
|
-
};
|
|
3676
|
-
(0, import_react2.useEffect)(() => {
|
|
3677
|
-
if (typeof window !== "undefined") {
|
|
3678
|
-
const storedSidebarState = window.localStorage.getItem("isSidebarOpen");
|
|
3679
|
-
if (storedSidebarState && window.innerWidth >= 768) {
|
|
3680
|
-
setIsSidebarOpen(JSON.parse(storedSidebarState));
|
|
3681
|
-
}
|
|
3682
|
-
}
|
|
3683
|
-
}, []);
|
|
3684
3673
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex flex-col h-screen", children: [
|
|
3685
3674
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("header", { className: "", children: [
|
|
3686
3675
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "bg-blue-600 text-white p-4 flex justify-between items-center shadow-md", children: [
|
|
@@ -3689,7 +3678,6 @@ function Container({
|
|
|
3689
3678
|
{
|
|
3690
3679
|
onClick: () => {
|
|
3691
3680
|
setIsSidebarOpen(!isSidebarOpen);
|
|
3692
|
-
handleClick(!isSidebarOpen);
|
|
3693
3681
|
},
|
|
3694
3682
|
className: "bg-blue-600 text-white px-2 py-1 rounded-r",
|
|
3695
3683
|
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MenuIcon, {})
|
|
@@ -3728,6 +3716,10 @@ function Container({
|
|
|
3728
3716
|
className: `bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
|
|
3729
3717
|
${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
|
|
3730
3718
|
`,
|
|
3719
|
+
onMouseEnter: (e) => {
|
|
3720
|
+
setIsSidebarOpen(true);
|
|
3721
|
+
},
|
|
3722
|
+
onMouseLeave: (e) => setIsSidebarOpen(false),
|
|
3731
3723
|
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "p-4 ", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("ul", { className: "space-y-3", children: [
|
|
3732
3724
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
3733
3725
|
"li",
|
|
@@ -3735,7 +3727,6 @@ function Container({
|
|
|
3735
3727
|
className: "p-2 md:hidden flex items-center justify-between font-bold",
|
|
3736
3728
|
onClick: (e) => {
|
|
3737
3729
|
setIsSidebarOpen(false);
|
|
3738
|
-
handleClick(false);
|
|
3739
3730
|
},
|
|
3740
3731
|
children: [
|
|
3741
3732
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(MenuIcon, {}),
|
|
@@ -3771,7 +3762,6 @@ function Container({
|
|
|
3771
3762
|
className: "fixed inset-0 bg-black bg-opacity-40 z-40",
|
|
3772
3763
|
onClick: () => {
|
|
3773
3764
|
setIsSidebarOpen(false);
|
|
3774
|
-
handleClick(false);
|
|
3775
3765
|
}
|
|
3776
3766
|
}
|
|
3777
3767
|
),
|
package/dist/index.mjs
CHANGED
|
@@ -3561,7 +3561,7 @@ function Button({
|
|
|
3561
3561
|
}
|
|
3562
3562
|
|
|
3563
3563
|
// src/container/index.tsx
|
|
3564
|
-
import {
|
|
3564
|
+
import { useState as useState2 } from "react";
|
|
3565
3565
|
|
|
3566
3566
|
// src/container/icons.tsx
|
|
3567
3567
|
import { jsx as jsx2 } from "react/jsx-runtime";
|
|
@@ -3643,19 +3643,8 @@ function Container({
|
|
|
3643
3643
|
expandedFooter = false,
|
|
3644
3644
|
expandedMenu = false
|
|
3645
3645
|
}) {
|
|
3646
|
-
const [isSidebarOpen, setIsSidebarOpen] = useState2(
|
|
3646
|
+
const [isSidebarOpen, setIsSidebarOpen] = useState2(false);
|
|
3647
3647
|
const [isFooterOpen, setIsFooterOpen] = useState2(expandedFooter);
|
|
3648
|
-
const handleClick = (state) => {
|
|
3649
|
-
window.localStorage.setItem("isSidebarOpen", JSON.stringify(state));
|
|
3650
|
-
};
|
|
3651
|
-
useEffect(() => {
|
|
3652
|
-
if (typeof window !== "undefined") {
|
|
3653
|
-
const storedSidebarState = window.localStorage.getItem("isSidebarOpen");
|
|
3654
|
-
if (storedSidebarState && window.innerWidth >= 768) {
|
|
3655
|
-
setIsSidebarOpen(JSON.parse(storedSidebarState));
|
|
3656
|
-
}
|
|
3657
|
-
}
|
|
3658
|
-
}, []);
|
|
3659
3648
|
return /* @__PURE__ */ jsxs2("div", { className: "flex flex-col h-screen", children: [
|
|
3660
3649
|
/* @__PURE__ */ jsxs2("header", { className: "", children: [
|
|
3661
3650
|
/* @__PURE__ */ jsxs2("div", { className: "bg-blue-600 text-white p-4 flex justify-between items-center shadow-md", children: [
|
|
@@ -3664,7 +3653,6 @@ function Container({
|
|
|
3664
3653
|
{
|
|
3665
3654
|
onClick: () => {
|
|
3666
3655
|
setIsSidebarOpen(!isSidebarOpen);
|
|
3667
|
-
handleClick(!isSidebarOpen);
|
|
3668
3656
|
},
|
|
3669
3657
|
className: "bg-blue-600 text-white px-2 py-1 rounded-r",
|
|
3670
3658
|
children: /* @__PURE__ */ jsx3(MenuIcon, {})
|
|
@@ -3703,6 +3691,10 @@ function Container({
|
|
|
3703
3691
|
className: `bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
|
|
3704
3692
|
${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
|
|
3705
3693
|
`,
|
|
3694
|
+
onMouseEnter: (e) => {
|
|
3695
|
+
setIsSidebarOpen(true);
|
|
3696
|
+
},
|
|
3697
|
+
onMouseLeave: (e) => setIsSidebarOpen(false),
|
|
3706
3698
|
children: /* @__PURE__ */ jsx3("div", { className: "p-4 ", children: /* @__PURE__ */ jsxs2("ul", { className: "space-y-3", children: [
|
|
3707
3699
|
/* @__PURE__ */ jsxs2(
|
|
3708
3700
|
"li",
|
|
@@ -3710,7 +3702,6 @@ function Container({
|
|
|
3710
3702
|
className: "p-2 md:hidden flex items-center justify-between font-bold",
|
|
3711
3703
|
onClick: (e) => {
|
|
3712
3704
|
setIsSidebarOpen(false);
|
|
3713
|
-
handleClick(false);
|
|
3714
3705
|
},
|
|
3715
3706
|
children: [
|
|
3716
3707
|
/* @__PURE__ */ jsx3(MenuIcon, {}),
|
|
@@ -3746,7 +3737,6 @@ function Container({
|
|
|
3746
3737
|
className: "fixed inset-0 bg-black bg-opacity-40 z-40",
|
|
3747
3738
|
onClick: () => {
|
|
3748
3739
|
setIsSidebarOpen(false);
|
|
3749
|
-
handleClick(false);
|
|
3750
3740
|
}
|
|
3751
3741
|
}
|
|
3752
3742
|
),
|
package/package.json
CHANGED
package/src/container/index.tsx
CHANGED
|
@@ -26,19 +26,19 @@ export default function Container({
|
|
|
26
26
|
expandedMenu?: boolean;
|
|
27
27
|
expandedFooter?: boolean;
|
|
28
28
|
}) {
|
|
29
|
-
const [isSidebarOpen, setIsSidebarOpen] = useState(
|
|
29
|
+
const [isSidebarOpen, setIsSidebarOpen] = useState(false);
|
|
30
30
|
const [isFooterOpen, setIsFooterOpen] = useState(expandedFooter);
|
|
31
|
-
const handleClick = (state: boolean) => {
|
|
32
|
-
|
|
33
|
-
};
|
|
34
|
-
useEffect(() => {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
}, []);
|
|
31
|
+
// const handleClick = (state: boolean) => {
|
|
32
|
+
// window.localStorage.setItem("isSidebarOpen", JSON.stringify(state));
|
|
33
|
+
// };
|
|
34
|
+
// useEffect(() => {
|
|
35
|
+
// if (typeof window !== "undefined") {
|
|
36
|
+
// const storedSidebarState = window.localStorage.getItem("isSidebarOpen");
|
|
37
|
+
// if (storedSidebarState && window.innerWidth >= 768) {
|
|
38
|
+
// setIsSidebarOpen(JSON.parse(storedSidebarState));
|
|
39
|
+
// }
|
|
40
|
+
// }
|
|
41
|
+
// }, []);
|
|
42
42
|
return (
|
|
43
43
|
<div className="flex flex-col h-screen">
|
|
44
44
|
{/* Header */}
|
|
@@ -47,7 +47,7 @@ export default function Container({
|
|
|
47
47
|
<button
|
|
48
48
|
onClick={() => {
|
|
49
49
|
setIsSidebarOpen(!isSidebarOpen);
|
|
50
|
-
handleClick(!isSidebarOpen);
|
|
50
|
+
// handleClick(!isSidebarOpen);
|
|
51
51
|
}}
|
|
52
52
|
className="bg-blue-600 text-white px-2 py-1 rounded-r"
|
|
53
53
|
>
|
|
@@ -90,6 +90,10 @@ export default function Container({
|
|
|
90
90
|
className={`bg-blue-500 text-white overflow-y-auto fixed md:static top-0 left-0 h-full z-50 md:z-auto transition-all duration-300 ease-in-out
|
|
91
91
|
${isSidebarOpen ? "w-full md:w-[250px]" : "w-0 md:w-[60px]"}
|
|
92
92
|
`}
|
|
93
|
+
onMouseEnter={(e) => {
|
|
94
|
+
setIsSidebarOpen(true);
|
|
95
|
+
}}
|
|
96
|
+
onMouseLeave={(e) => setIsSidebarOpen(false)}
|
|
93
97
|
>
|
|
94
98
|
<div className="p-4 ">
|
|
95
99
|
{
|
|
@@ -101,7 +105,7 @@ export default function Container({
|
|
|
101
105
|
}
|
|
102
106
|
onClick={(e) => {
|
|
103
107
|
setIsSidebarOpen(false);
|
|
104
|
-
handleClick(false);
|
|
108
|
+
// handleClick(false);
|
|
105
109
|
}}
|
|
106
110
|
>
|
|
107
111
|
<MenuIcon /> {appName}
|
|
@@ -152,7 +156,7 @@ export default function Container({
|
|
|
152
156
|
className="fixed inset-0 bg-black bg-opacity-40 z-40"
|
|
153
157
|
onClick={() => {
|
|
154
158
|
setIsSidebarOpen(false);
|
|
155
|
-
handleClick(false);
|
|
159
|
+
// handleClick(false);
|
|
156
160
|
}}
|
|
157
161
|
/>
|
|
158
162
|
)}
|