@plasmicpkgs/plasmic-rich-components 1.0.160 → 1.0.161

package/dist/index.js

@@ -1037,14 +1037,36 @@ function RichLayout(_a) {
     "logoElement"
   ]);
   var _a2, _b2, _c, _d, _e;
+  const $ctx = host.useDataEnv();
+  const ref = React.useRef(null);
   const isClient = useIsClient();
   const [pathname, setPathname] = React.useState(void 0);
+  const [openKeys, setOpenKeys] = React.useState([]);
+  const [ready, setReady] = React.useState(false);
   React.useEffect(() => {
+    setTimeout(() => {
+      setReady(true);
+    }, 500);
     if (typeof location !== "undefined") {
       setPathname(location.pathname);
     }
   }, []);
-  const Link = (_b2 = (_a2 = host.usePlasmicLink) == null ? void 0 : _a2()) != null ? _b2 : AnchorLink;
+  React.useEffect(() => {
+    if (!ready)
+      return;
+    if (!ref.current)
+      return;
+    const selectedSubmenus = Array.from(
+      ref.current.querySelectorAll(
+        "ul > li.ant-menu-submenu.ant-menu-submenu-selected > div"
+      )
+    ).map((el) => {
+      var _a3;
+      return (_a3 = el.getAttribute("data-menu-id")) == null ? void 0 : _a3.split("/").pop();
+    }).filter((i) => i).map((i) => `/${i}`) || [];
+    setOpenKeys(selectedSubmenus);
+  }, [ready]);
+  const PlasmicLink = (_b2 = (_a2 = host.usePlasmicLink) == null ? void 0 : _a2()) != null ? _b2 : AnchorLink;
   const { token } = antd.theme.useToken();
   const origTextColor = token.colorTextBase;
   function getNavBgColor() {
@@ -1089,7 +1111,7 @@ function RichLayout(_a) {
     colorTextMenuActive: "rgba(255,255,255,0.95)",
     colorTextSubMenuSelected: "#fff"
   };
-  return /* @__PURE__ */ React__default.default.createElement("div", { className, style: { display: "flex" } }, /* @__PURE__ */ React__default.default.createElement("style", null, baseStyles), /* @__PURE__ */ React__default.default.createElement(
+  return /* @__PURE__ */ React__default.default.createElement("div", { ref, className, style: { display: "flex" } }, /* @__PURE__ */ React__default.default.createElement("style", null, baseStyles), /* @__PURE__ */ React__default.default.createElement(
     proComponents.ProLayout,
     __spreadProps$5(__spreadValues$8({}, layoutProps), {
       pageTitleRender: () => "",
@@ -1131,7 +1153,7 @@ function RichLayout(_a) {
       },
       menu: {
         // collapsedShowGroupTitle: true,
-        defaultOpenAll: true
+        defaultOpenAll: false
         // hideMenuWhenCollapsed: true,
       },
       avatarProps: showAvatarMenu ? {
@@ -1165,9 +1187,12 @@ function RichLayout(_a) {
         return footerChildren;
       },
       onMenuHeaderClick: (e) => console.log(e),
-      menuItemRender: (item, dom) => /* @__PURE__ */ React__default.default.createElement(Link, { href: item.path }, dom),
-      headerTitleRender: (logo2, title, _) => {
-        return /* @__PURE__ */ React__default.default.createElement(Link, { href: rootUrl }, logo2, title);
+      openKeys,
+      onOpenChange: (keys) => keys === false || !ready ? [] : setOpenKeys(keys),
+      selectedKeys: [$ctx == null ? void 0 : $ctx.pagePath],
+      menuItemRender: (item, dom) => /* @__PURE__ */ React__default.default.createElement(PlasmicLink, { href: item.path }, dom),
+      headerTitleRender: (logoEl, title, _) => {
+        return /* @__PURE__ */ React__default.default.createElement(PlasmicLink, { href: rootUrl }, logoEl, title);
       }
     }),
     children