@plurid/plurid-react 0.0.0-28 → 0.0.0-30

package/distribution/components/structural/Roots/index.d.ts

@@ -8,11 +8,12 @@ export interface PluridRootsStateProperties {
     stateConfiguration: PluridConfiguration;
     spaceTransformMatrix: string;
     spaceAnimatedTransform: boolean;
+    stateResolvedLayout: boolean;
     spaceTransformTime: number;
     stateTree: TreePlane[];
 }
 export interface PluridRootsDispatchProperties {
 }
 export declare type PluridRootsProperties = PluridRootsOwnProperties & PluridRootsStateProperties & PluridRootsDispatchProperties;
-declare const ConnectedPluridRoots: import("react-redux").ConnectedComponent<React.FC<PluridRootsProperties>, Omit<PluridRootsProperties, "stateConfiguration" | "stateTree" | "spaceTransformMatrix" | "spaceAnimatedTransform" | "spaceTransformTime"> & import("react-redux").ConnectProps>;
+declare const ConnectedPluridRoots: import("react-redux").ConnectedComponent<React.FC<PluridRootsProperties>, Omit<PluridRootsProperties, "stateConfiguration" | "stateTree" | "spaceTransformMatrix" | "spaceAnimatedTransform" | "stateResolvedLayout" | "spaceTransformTime"> & import("react-redux").ConnectProps>;
 export default ConnectedPluridRoots;

package/distribution/containers/RouterBrowser/FadeIn/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export interface FadeInProperties {
+    time: number;
+}
+declare const FadeIn: React.FC<FadeInProperties>;
+export default FadeIn;

package/distribution/containers/RouterBrowser/FadeIn/styled.d.ts

@@ -0,0 +1,3 @@
+export interface IStyledFadeIn {
+}
+export declare const StyledFadeIn: import("styled-components").StyledComponent<"div", any, IStyledFadeIn, never>;

package/distribution/containers/RouterStatic/index.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PluridRoute, PluridRoutePlane } from '@plurid/plurid-data';
+import { PluridRoute, PluridRoutePlane, PluridRouterProperties } from '@plurid/plurid-data';
 import { PluridReactComponent } from "../../data/interfaces";
 export interface PluridRouterStaticOwnProperties {
     path: string;
@@ -13,6 +13,7 @@ export interface PluridRouterStaticOwnProperties {
     gateway?: boolean;
     gatewayQuery?: string;
     gatewayEndpoint?: string;
+    routerProperties?: Partial<PluridRouterProperties<PluridReactComponent>>;
 }
 declare const PluridRouterStatic: (properties: PluridRouterStaticOwnProperties) => JSX.Element;
 export default PluridRouterStatic;

package/distribution/index.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { Theme } from '@plurid/plurid-themes';
-import { PLURID_PUBSUB_TOPIC, PluridPlane, PluridView, PluridUniverse, PluridConfiguration, PluridPartialConfiguration, RecursivePartial, PluridRoute, PluridRouteSpace, PluridRouteUniverse, PluridRoutePlane, ComponentWithPlurid, PluridPlaneComponentProperty, PluridRouteComponentProperty, PluridPreserve, PluridPreserveTransmission, PluridPubSubPublishMessage, PluridPubSubSubscribeMessage, LAYOUT_TYPES as SPACE_LAYOUT, SIZES, TRANSFORM_MODES, TRANSFORM_TOUCHES, PLURID_ROUTER_LOCATION_CHANGED, PLURID_ROUTER_LOCATION_STORED } from '@plurid/plurid-data';
+import { PLURID_PUBSUB_TOPIC, PluridPlane, PluridView, PluridUniverse, PluridConfiguration, PluridPartialConfiguration, PluridRouterProperties, RecursivePartial, PluridRoute, PluridRouteSpace, PluridRouteUniverse, PluridRoutePlane, ComponentWithPlurid, PluridPlaneComponentProperty, PluridRouteComponentProperty, PluridPreserve, PluridPreserveTransmission, PluridPubSubPublishMessage, PluridPubSubSubscribeMessage, LAYOUT_TYPES as SPACE_LAYOUT, SIZES, TRANSFORM_MODES, TRANSFORM_TOUCHES, PLURID_ROUTER_LOCATION_CHANGED, PLURID_ROUTER_LOCATION_STORED } from '@plurid/plurid-data';
 import { routing, pluridRouterNavigate } from '@plurid/plurid-engine';
 import PluridPubSub from '@plurid/plurid-pubsub';
 import { PluridReactComponent, PluridReactPlaneComponent, PluridReactRouteComponent, PluridReactPlane, PluridReactRoute, PluridReactRoutePlane, PluridRouteMatch } from './data/interfaces';
@@ -33,7 +33,7 @@ declare const internals: {
 declare const Plurid: {
     Application: typeof PluridApplication;
     RouterStatic: (properties: import("./containers/RouterStatic").PluridRouterStaticOwnProperties) => JSX.Element;
-    RouterBrowser: (properties: import("@plurid/plurid-data").PluridRouterProperties<PluridReactComponent<any, PluridPlaneComponentProperty | PluridRouteComponentProperty>>) => JSX.Element;
+    RouterBrowser: (properties: PluridRouterProperties<PluridReactComponent<any, PluridPlaneComponentProperty | PluridRouteComponentProperty>>) => JSX.Element;
     Provider: typeof PluridProvider;
     Link: import("react-redux").ConnectedComponent<import("react").FC<import("react").PropsWithChildren<import("./components/links/Link").PluridLinkProperties>>, Omit<import("react").PropsWithChildren<import("./components/links/Link").PluridLinkProperties>, "dispatch" | "stateGeneralTheme" | "stateConfiguration" | "stateTree" | "stateViewSize" | "dispatchSetSpaceField" | "dispatchSetTree" | "stateLastClosedPlane" | "dispatchUpdateSpaceLinkCoordinates"> & import("react-redux").ConnectProps>;
     RouterLink: import("react").FC<import("./components/links/RouterLink").PluridRouterLinkOwnProperties>;
@@ -99,9 +99,10 @@ declare const Plurid: {
         PluridSpaceDebugger: import("react-redux").ConnectedComponent<import("react").FC<import("./components/structural/Space/components/SpaceDebugger").PluridSpaceDebuggerProperties>, Omit<import("./components/structural/Space/components/SpaceDebugger").PluridSpaceDebuggerProperties, "stateGeneralTheme" | "stateInteractionTheme"> & import("react-redux").ConnectProps>;
     };
 };
+declare type PluridRouterPartialProperties = Partial<PluridRouterProperties<PluridReactComponent>>;
 export { PluridApplication, PluridRouterBrowser, PluridRouterStatic, PluridProvider, PluridLink, PluridRouterLink, PluridApplicationConfigurator, PluridPlaneConfigurator, PluridExternalPlane, PluridIframePlane, PluridVirtualList, 
 /** Interfaces */
-Theme, PluridPlane, PluridView, PluridUniverse, PluridRoute, PluridRouteSpace, PluridRouteUniverse, PluridRoutePlane, ComponentWithPlurid, PluridPlaneComponentProperty, PluridRouteComponentProperty, PluridReactComponent, PluridReactPlane, PluridReactPlaneComponent, PluridReactRouteComponent, PluridReactRoute, PluridReactRoutePlane, PluridRouteMatch, PluridPreserve, PluridPreserveTransmission, PluridPubSubPublishMessage, PluridPubSubSubscribeMessage, PluridConfiguration, PluridPartialConfiguration, RecursivePartial, 
+Theme, PluridPlane, PluridView, PluridUniverse, PluridRouterProperties, PluridRouterPartialProperties, PluridRoute, PluridRouteSpace, PluridRouteUniverse, PluridRoutePlane, ComponentWithPlurid, PluridPlaneComponentProperty, PluridRouteComponentProperty, PluridReactComponent, PluridReactPlane, PluridReactPlaneComponent, PluridReactRouteComponent, PluridReactRoute, PluridReactRoutePlane, PluridRouteMatch, PluridPreserve, PluridPreserveTransmission, PluridPubSubPublishMessage, PluridPubSubSubscribeMessage, PluridConfiguration, PluridPartialConfiguration, RecursivePartial, 
 /** Enumerations */
 SPACE_LAYOUT, SIZES, TRANSFORM_MODES, TRANSFORM_TOUCHES, PLURID_ROUTER_LOCATION_CHANGED, PLURID_ROUTER_LOCATION_STORED, 
 /** Engine */

package/distribution/index.es.js

@@ -2062,13 +2062,16 @@ const StyledPluridRoots = styled.div`
 `;
 
 const PluridRoots = properties => {
-    const {spaceTransformMatrix: spaceTransformMatrix, spaceAnimatedTransform: spaceAnimatedTransform, spaceTransformTime: spaceTransformTime, stateTree: stateTree} = properties;
+    const {spaceTransformMatrix: spaceTransformMatrix, spaceAnimatedTransform: spaceAnimatedTransform, spaceTransformTime: spaceTransformTime, stateTree: stateTree, stateResolvedLayout: stateResolvedLayout} = properties;
+    const width = "100%";
+    const height = stateResolvedLayout ? window.innerHeight + "px" : 0;
+    const transition = spaceAnimatedTransform ? `transform ${spaceTransformTime}ms ease-in-out` : "initial";
     return React.createElement(StyledPluridRoots, {
         style: {
-            width: "100%",
-            height: typeof window !== "undefined" ? window.innerHeight + "px" : "821px",
-            transform: spaceTransformMatrix,
-            transition: spaceAnimatedTransform ? `transform ${spaceTransformTime}ms ease-in-out` : "initial"
+            width: width,
+            height: height,
+            transition: transition,
+            transform: spaceTransformMatrix
         },
         "data-plurid-entity": PLURID_ENTITY_ROOTS
     }, stateTree.map((plane => React.createElement(ConnectedPluridRoot, {
@@ -2082,7 +2085,8 @@ const mapStateToProperties$g = state => ({
     spaceTransformMatrix: selectors.space.getTransformMatrix(state),
     spaceAnimatedTransform: selectors.space.getAnimatedTransform(state),
     spaceTransformTime: selectors.space.getTransformTime(state),
-    stateTree: selectors.space.getTree(state)
+    stateTree: selectors.space.getTree(state),
+    stateResolvedLayout: selectors.space.getResolvedLayout(state)
 });
 
 const mapDispatchToProperties$g = dispatch => ({});
@@ -5414,9 +5418,37 @@ const PluridScrollTop = styled.div`
     width: 0;
 `;
 
+const StyledFadeIn = styled.div`
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: black;
+    pointer-events: none;
+    z-index: 999999;
+`;
+
+const FadeIn = properties => {
+    const {time: time} = properties;
+    const [fadedIn, setFadedIn] = useState(false);
+    useEffect((() => {
+        if (time > 0) {
+            setTimeout((() => {
+                setFadedIn(true);
+            }), time);
+        }
+    }), []);
+    if (fadedIn || time === 0) {
+        return React.createElement(React.Fragment, null);
+    }
+    return React.createElement(StyledFadeIn, null);
+};
+
 const PluridRouterBrowser = properties => {
-    const {routes: routes, planes: planes, exterior: exterior, shell: shell, hostname: hostname, scrollToTop: scrollToTop, static: staticContext, view: cleanNavigationView, cleanNavigation: cleanNavigation, notFoundPath: notFoundPathProperty} = properties;
+    const {routes: routes, planes: planes, exterior: exterior, shell: shell, hostname: hostname, scrollToTop: scrollToTop, fadeIn: fadeInProperty, static: staticContext, view: cleanNavigationView, cleanNavigation: cleanNavigation, notFoundPath: notFoundPathProperty} = properties;
     const notFoundPath = notFoundPathProperty || "/not-found";
+    const fadeIn = fadeInProperty !== null && fadeInProperty !== void 0 ? fadeInProperty : 10;
     const pluridPlanes = gatherPluridPlanes(routes, planes);
     const topContainer = useRef(null);
     const pluridPlanesRegistrar = useRef(new PluridPlanesRegistrar(pluridPlanes, hostname));
@@ -5512,7 +5544,9 @@ const PluridRouterBrowser = properties => {
             PluridRouterShell.displayName = "PluridRouterShell";
         }
     }
-    return React.createElement(React.Fragment, null, React.createElement(PluridScrollTop, {
+    return React.createElement(React.Fragment, null, React.createElement(FadeIn, {
+        time: fadeIn
+    }), React.createElement(PluridScrollTop, {
         ref: topContainer
     }), PluridRouterExterior && React.createElement(PluridRouterExterior, {
         matchedRoute: matchedRoute
@@ -5522,10 +5556,10 @@ const PluridRouterBrowser = properties => {
 };
 
 const PluridRouterStatic = properties => {
-    const {path: path, directPlane: directPlane, routes: routes, planes: planes, exterior: exterior, shell: shell, protocol: protocolProperty, hostname: hostnameProperty, gateway: gateway, gatewayQuery: gatewayQueryProperty, gatewayEndpoint: gatewayEndpointProperty} = properties;
+    const {path: path, directPlane: directPlane, routes: routes, planes: planes, exterior: exterior, shell: shell, protocol: protocolProperty, hostname: hostnameProperty, gateway: gateway, gatewayQuery: gatewayQueryProperty, gatewayEndpoint: gatewayEndpointProperty, routerProperties: routerProperties} = properties;
     const protocol = protocolProperty || "http";
     const hostname = hostnameProperty || "origin";
-    return React.createElement(PluridRouterBrowser, {
+    return React.createElement(PluridRouterBrowser, Object.assign({
         routes: routes,
         planes: planes,
         exterior: exterior,
@@ -5536,7 +5570,7 @@ const PluridRouterStatic = properties => {
         },
         protocol: protocol,
         hostname: hostname
-    });
+    }, routerProperties));
 };
 
 class PluridProvider extends Component {