ywana-core8 0.1.59 → 0.1.60

package/dist/index.cjs

@@ -3723,6 +3723,12 @@ var SitePage = function SitePage(_ref8) {
     init = _ref8.init;
   var context = React.useContext(SiteContext);
   var page = context.page;
+  var _useState12 = React.useState(page),
+    renderedPage = _useState12[0],
+    setRenderedPage = _useState12[1];
+  var _useState13 = React.useState(''),
+    transitionClass = _useState13[0],
+    setTransitionClass = _useState13[1];
   React.useEffect(function () {
     if (init) {
       context["goto"](init);
@@ -3730,9 +3736,25 @@ var SitePage = function SitePage(_ref8) {
       context["goto"]("EMPTY");
     }
   }, []);
-  return /*#__PURE__*/React__default["default"].createElement("main", null, React__default["default"].Children.toArray(children).filter(function (child) {
-    return child.props ? child.props.id === page : false;
-  }));
+  React.useEffect(function () {
+    if (page !== renderedPage) {
+      setTransitionClass("page-out-" + context.direction);
+      setTimeout(function () {
+        setTransitionClass("page-in-" + context.direction);
+        setRenderedPage(page);
+        setTimeout(function () {
+          setTransitionClass('');
+        }, 300);
+      }, 300);
+      setRenderedPage(page);
+    }
+  }, [page]);
+  var currentPage = React.Children.toArray(children).filter(function (child) {
+    return child.props ? child.props.id === renderedPage : false;
+  });
+  return /*#__PURE__*/React__default["default"].createElement("main", {
+    className: "site-page-container " + transitionClass
+  }, currentPage);
 };
 
 /**