@vuu-ui/vuu-layout 2.1.19-beta.1 → 2.1.19-beta.2

package/src/utils/pathUtils.js

@@ -0,0 +1,212 @@
+import { isContainer } from "@vuu-ui/vuu-utils";
+import react, { isValidElement } from "react";
+import { getProp, getProps } from "./propUtils.js";
+import { typeOf } from "./typeOf.js";
+const removeFinalPathSegment = (path)=>{
+    const pos = path.lastIndexOf(".");
+    if (-1 === pos) return path;
+    return path.slice(0, pos);
+};
+const getChildren = (c)=>react.isValidElement(c.props.children) ? [
+        c.props.children
+    ] : c.props.children;
+const resolvePath = (source, path = "")=>{
+    const [step1, ...steps] = path.split(".");
+    if (step1?.startsWith("#")) {
+        const node = findTargetById(source, step1.slice(1), true);
+        if (node && steps.length) return resolvePath(node, steps.join("."));
+    } else if ("ACTIVE_CHILD" === step1) {
+        const { active } = getProps(source);
+        const children = getChildren(source);
+        const { path } = getProps(children[active]);
+        return path;
+    }
+    return "";
+};
+const resolveJSONPath = (source, path = "")=>{
+    const [step1, ...steps] = path.split(".");
+    if (step1?.startsWith("#")) {
+        const node = findTargetJSONById(source, step1.slice(1), true);
+        if (node && steps.length) return resolveJSONPath(node, steps.join("."));
+    } else if ("ACTIVE_CHILD" === step1) {
+        const { children, props } = source;
+        const { active } = props;
+        if ("number" == typeof active && children?.[active]) return children[active];
+    }
+};
+function followPathToParent(source, path) {
+    const { "data-path": dataPath, path: sourcePath = dataPath } = getProps(source);
+    if ("0" === path) return null;
+    if (path === sourcePath) return null;
+    return followPath(source, removeFinalPathSegment(path), true);
+}
+function findTarget(source, test) {
+    if (source) {
+        const { children, ...props } = getProps(source);
+        if (test(props)) return source;
+        if (react.Children.count(children) > 0) {
+            const array = react.isValidElement(children) ? [
+                children
+            ] : children;
+            for (const child of array){
+                const target = findTarget(child, test);
+                if (target) return target;
+            }
+        }
+    }
+}
+function containerOf(source, target) {
+    if (target === source) return null;
+    const { path: sourcePath, children } = getProps(source);
+    const { idx, finalStep } = pathUtils_nextStep(sourcePath, getProp(target, "path"));
+    if (finalStep) return source;
+    if (void 0 === children || void 0 === children[idx]) return null;
+    return containerOf(children[idx], target);
+}
+const getChild = (children, idx)=>{
+    if (react.isValidElement(children) && 0 == idx) return children;
+    if (Array.isArray(children)) return children[idx];
+};
+function followPathToComponent(component, path) {
+    const paths = path.split(".");
+    let children = [
+        component
+    ];
+    for(let i = 0; i < paths.length; i++){
+        const idx = parseInt(paths[i]);
+        const child = children[idx];
+        if (i === paths.length - 1) return child;
+        children = getChildren(child);
+    }
+}
+const findTargetById = (source, id, throwIfNotFound = true)=>{
+    const { children, id: idProp } = source.props;
+    if (idProp === id) return source;
+    if (react.Children.count(children) > 0) {
+        const childArray = isValidElement(children) ? [
+            children
+        ] : children;
+        for (const child of childArray)if (isValidElement(child)) {
+            const target = findTargetById(child, id, false);
+            if (target) return target;
+        }
+    }
+    if (true === throwIfNotFound) throw Error(`pathUtils.findTargetById id #${id} not found in source`);
+};
+const findTargetJSONById = (source, id, throwIfNotFound = true)=>{
+    const { children, id: idProp } = source;
+    if (idProp === id) return source;
+    if (Array.isArray(children) && children.length > 0) {
+        for (const child of children)if (null !== child && "object" == typeof child) {
+            const target = findTargetJSONById(child, id, false);
+            if (target) return target;
+        }
+    }
+    if (true === throwIfNotFound) throw Error(`pathUtils.findTargetJSONById id #${id} not found in source`);
+};
+function followPath(source, path, throwIfNotFound = false) {
+    if (path.startsWith("#")) return findTargetById(source, path.slice(1), throwIfNotFound);
+    const { "data-path": dataPath, path: sourcePath = dataPath } = getProps(source);
+    if (0 !== path.indexOf(sourcePath)) throw Error(`pathUtils.followPath path ${path} is not within source path ${sourcePath}`);
+    const route = path.slice(sourcePath.length + 1);
+    if ("" === route) return source;
+    let target = source;
+    const paths = route.split(".");
+    for(let i = 0; i < paths.length; i++){
+        if (0 === react.Children.count(target.props.children)) {
+            const message = `element at 0.${paths.slice(0, i).join(".")} has no children, so cannot fulfill rest of path ${paths.slice(i).join(".")}`;
+            if (!throwIfNotFound) return void console.warn(message);
+            throw Error(message);
+        }
+        target = getChild(target.props.children, parseInt(paths[i]));
+        if (void 0 === target) {
+            const message = `model at 0.${paths.slice(0, i).join(".")} has no children that fulfill next step of path ${paths.slice(i).join(".")}`;
+            if (throwIfNotFound) throw Error(message);
+            console.warn(message);
+        }
+    }
+    return target;
+}
+function nextLeaf(root, path) {
+    const parent = followPathToParent(root, path);
+    let pathIndices = path.split(".").map((idx)=>parseInt(idx, 10));
+    if (parent) {
+        const lastIdx = pathIndices.pop();
+        const { children } = parent.props;
+        if (children.length - 1 > lastIdx) return firstLeaf(children[lastIdx + 1]);
+        {
+            const parentIdx = pathIndices.pop();
+            const nextParent = followPathToParent(root, getProp(parent, "path"));
+            if (nextParent && "number" == typeof parentIdx) {
+                pathIndices = nextParent.props.path.split(".").map((idx)=>parseInt(idx, 10));
+                if (nextParent.props.children.length - 1 > parentIdx) {
+                    const nextStep = nextParent.props.children[parentIdx + 1];
+                    if (isContainer(typeOf(nextStep))) return firstLeaf(nextStep);
+                    return nextStep;
+                }
+            }
+        }
+    }
+    return firstLeaf(root);
+}
+function previousLeaf(root, path) {
+    const pathIndices = path.split(".").map((idx)=>parseInt(idx, 10));
+    let lastIdx = pathIndices.pop();
+    let parent = followPathToParent(root, path);
+    if (null != parent && "number" == typeof lastIdx) {
+        const { children } = parent.props;
+        if (lastIdx > 0) return lastLeaf(children[lastIdx - 1]);
+        while(pathIndices.length > 1){
+            lastIdx = pathIndices.pop();
+            parent = followPathToParent(root, getProp(parent, "path"));
+            if (lastIdx > 0) {
+                const nextStep = parent.props.children[lastIdx - 1];
+                if (isContainer(typeOf(nextStep))) return lastLeaf(nextStep);
+                return nextStep;
+            }
+        }
+    }
+    return lastLeaf(root);
+}
+function firstLeaf(layoutRoot) {
+    if (isContainer(typeOf(layoutRoot))) {
+        const { children } = layoutRoot.props || layoutRoot;
+        return firstLeaf(children[0]);
+    }
+    return layoutRoot;
+}
+function lastLeaf(root) {
+    if (isContainer(typeOf(root))) {
+        const { children } = root.props || root;
+        return lastLeaf(children[children.length - 1]);
+    }
+    return root;
+}
+function pathUtils_nextStep(pathSoFar, targetPath, followPathToEnd = false) {
+    if (pathSoFar === targetPath) return {
+        idx: -1,
+        finalStep: true
+    };
+    const pathVisited = `${pathSoFar}.`;
+    if (!targetPath.startsWith(pathVisited)) throw Error("pathUtils nextStep has strayed from the path");
+    const endOfTheLine = followPathToEnd ? 0 : 1;
+    const paths = targetPath.replace(pathVisited, "").split(".").map((n)=>parseInt(n, 10));
+    return {
+        idx: paths[0],
+        finalStep: paths.length === endOfTheLine
+    };
+}
+function resetPath(model, path, additionalProps) {
+    if (getProp(model, "path") === path) return model;
+    const children = [];
+    react.Children.forEach(model.props.children, (child, i)=>{
+        if (getProp(child, "path")) children.push(resetPath(child, `${path}.${i}`));
+        else children.push(child);
+    });
+    const pathPropName = model.props["data-path"] ? "data-path" : "path";
+    return react.cloneElement(model, {
+        [pathPropName]: path,
+        ...additionalProps
+    }, children);
+}
+export { containerOf, findTarget, followPath, followPathToComponent, followPathToParent, getChild, nextLeaf, pathUtils_nextStep as nextStep, previousLeaf, resetPath, resolveJSONPath, resolvePath };

package/src/utils/propUtils.js

@@ -0,0 +1,15 @@
+const NO_PROPS = {};
+const getProp = (component, propName)=>{
+    const props = getProps(component);
+    return props[propName] ?? props[`data-${propName}`];
+};
+const getProps = (component)=>component?.props || component || NO_PROPS;
+const getChildProp = (container)=>{
+    const props = getProps(container);
+    if (props.children) {
+        const { children: [target, ...rest] } = props;
+        if (rest.length > 0) console.warn(`getChild expected a single child, found ${rest.length + 1}`);
+        return target;
+    }
+};
+export { getChildProp, getProp, getProps };

package/src/utils/refUtils.js

@@ -0,0 +1,5 @@
+function setRef(ref, value) {
+    if ("function" == typeof ref) ref(value);
+    else if (ref) ref.current = value;
+}
+export { setRef };

package/src/utils/styleUtils.js

@@ -0,0 +1,9 @@
+const expandFlex = (flex)=>{
+    if ('number' != typeof flex) throw Error(`"no support yet for flex value ${flex}`);
+    return {
+        flexBasis: 0,
+        flexGrow: 1,
+        flexShrink: 1
+    };
+};
+export { expandFlex };

package/src/utils/typeOf.js

@@ -0,0 +1,15 @@
+function typeOf(element) {
+    if (element) {
+        const type = element.type;
+        if ("function" == typeof type || "object" == typeof type) {
+            const elementName = type.displayName || type.name || type.type?.name;
+            if ("string" == typeof elementName) return elementName;
+        }
+        if ("string" == typeof element.type) return element.type;
+        if (element.constructor) return element.constructor.displayName;
+        throw Error("typeOf unable to determine type of element");
+    }
+}
+const isTypeOf = (element, type)=>typeOf(element) === type;
+const isLayoutJSON = (layout)=>void 0 !== layout && "type" in layout;
+export { isLayoutJSON, isTypeOf, typeOf };