@wavemaker-ai/react-runtime 1.0.0-rc.312 → 1.0.0-rc.317

package/components/basic/tree/hooks/useTreePartialNodeApi.js

@@ -1,157 +1,165 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useTreePartialNodeApi = useTreePartialNodeApi;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _utils = require("../utils");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-/**
- * Stable `useCallback` APIs merged onto `buildTreePartialSnapshot` data so partial `item` stays deep-equal
- * across renders when unchanged (`WmPartialContainer` / `listener.onChange`).
- */
-function useTreePartialNodeApi(_ref) {
-  var _selectedItem$nodeId;
-  var node = _ref.node,
-    selectedItem = _ref.selectedItem,
-    isCheckboxTree = _ref.isCheckboxTree,
-    isRadioTree = _ref.isRadioTree,
-    handleNodeClick = _ref.handleNodeClick,
-    toggleNodeExpansion = _ref.toggleNodeExpansion;
-  var latestRef = (0, _react.useRef)({
-    node: node,
-    selectedItem: selectedItem,
-    isCheckboxTree: isCheckboxTree,
-    isRadioTree: isRadioTree,
-    handleNodeClick: handleNodeClick,
-    toggleNodeExpansion: toggleNodeExpansion
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { useCallback, useMemo, useRef } from "react";
+import { assembleTreePartialItem, buildTreePathFromRoot, buildTreePartialSnapshot } from "../utils";
+function useTreePartialNodeApi({
+  node,
+  selectedItem,
+  isCheckboxTree,
+  isRadioTree,
+  handleNodeClick,
+  toggleNodeExpansion
+}) {
+  var _a;
+  const latestRef = useRef({
+    node,
+    selectedItem,
+    isCheckboxTree,
+    isRadioTree,
+    handleNodeClick,
+    toggleNodeExpansion
   });
   latestRef.current = {
-    node: node,
-    selectedItem: selectedItem,
-    isCheckboxTree: isCheckboxTree,
-    isRadioTree: isRadioTree,
-    handleNodeClick: handleNodeClick,
-    toggleNodeExpansion: toggleNodeExpansion
+    node,
+    selectedItem,
+    isCheckboxTree,
+    isRadioTree,
+    handleNodeClick,
+    toggleNodeExpansion
   };
-  var selectedTreeNodeId = (_selectedItem$nodeId = selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.nodeId) !== null && _selectedItem$nodeId !== void 0 ? _selectedItem$nodeId : null;
-  var treePartialSnapshot = (0, _react.useMemo)(function () {
-    return (0, _utils.buildTreePartialSnapshot)(node, selectedTreeNodeId);
-  }, [node, selectedTreeNodeId]);
-  var select = (0, _react.useCallback)(function () {
-    var ctx = latestRef.current;
-    ctx.handleNodeClick(undefined, ctx.node);
+  const selectedTreeNodeId = (_a = selectedItem == null ? void 0 : selectedItem.nodeId) != null ? _a : null;
+  const treePartialSnapshot = useMemo(
+    () => buildTreePartialSnapshot(node, selectedTreeNodeId),
+    [node, selectedTreeNodeId]
+  );
+  const select = useCallback(() => {
+    const ctx = latestRef.current;
+    ctx.handleNodeClick(void 0, ctx.node);
   }, []);
-  var toggleExpand = (0, _react.useCallback)(function (event) {
-    var _currentTreeNode$chil;
-    var ctx = latestRef.current;
-    var currentTreeNode = ctx.node;
-    ctx.handleNodeClick(undefined, currentTreeNode);
+  const toggleExpand = useCallback((event) => {
+    var _a2, _b, _c;
+    const ctx = latestRef.current;
+    const currentTreeNode = ctx.node;
+    ctx.handleNodeClick(void 0, currentTreeNode);
     if (event) {
-      var _event$preventDefault, _event$stopPropagatio;
-      (_event$preventDefault = event.preventDefault) === null || _event$preventDefault === void 0 || _event$preventDefault.call(event);
-      (_event$stopPropagatio = event.stopPropagation) === null || _event$stopPropagatio === void 0 || _event$stopPropagatio.call(event);
+      (_a2 = event.preventDefault) == null ? void 0 : _a2.call(event);
+      (_b = event.stopPropagation) == null ? void 0 : _b.call(event);
     }
-    if (!((_currentTreeNode$chil = currentTreeNode.children) !== null && _currentTreeNode$chil !== void 0 && _currentTreeNode$chil.length)) {
+    if (!((_c = currentTreeNode.children) == null ? void 0 : _c.length)) {
       return;
     }
-    var ev = event !== null && event !== void 0 ? event : {
-      preventDefault: function preventDefault() {},
-      stopPropagation: function stopPropagation() {}
+    const ev = event != null ? event : {
+      preventDefault: () => {
+      },
+      stopPropagation: () => {
+      }
     };
     ctx.toggleNodeExpansion(ev, currentTreeNode);
   }, []);
-  var getParentNode = (0, _react.useCallback)(function () {
-    var _ctx$selectedItem$nod, _ctx$selectedItem;
-    var ctx = latestRef.current;
-    var parentTreeNode = ctx.node.parent;
+  const getParentNode = useCallback(() => {
+    var _a2, _b;
+    const ctx = latestRef.current;
+    const parentTreeNode = ctx.node.parent;
     if (!parentTreeNode) return null;
-    return (0, _utils.buildTreePartialSnapshot)(parentTreeNode, (_ctx$selectedItem$nod = (_ctx$selectedItem = ctx.selectedItem) === null || _ctx$selectedItem === void 0 ? void 0 : _ctx$selectedItem.nodeId) !== null && _ctx$selectedItem$nod !== void 0 ? _ctx$selectedItem$nod : null);
-  }, []);
-  var getNextNode = (0, _react.useCallback)(function () {
-    var _currentTreeNode$pare, _ctx$selectedItem$nod2, _ctx$selectedItem2;
-    var ctx = latestRef.current;
-    var currentTreeNode = ctx.node;
-    var siblingNodesAtSameDepth = (_currentTreeNode$pare = currentTreeNode.parent) === null || _currentTreeNode$pare === void 0 ? void 0 : _currentTreeNode$pare.children;
-    if (!(siblingNodesAtSameDepth !== null && siblingNodesAtSameDepth !== void 0 && siblingNodesAtSameDepth.length)) return null;
-    var indexAmongSiblings = siblingNodesAtSameDepth.findIndex(function (sibling) {
-      return String(sibling.nodeId) === String(currentTreeNode.nodeId);
-    });
-    var nextSiblingTreeNode = indexAmongSiblings >= 0 ? siblingNodesAtSameDepth[indexAmongSiblings + 1] : undefined;
-    return nextSiblingTreeNode ? (0, _utils.buildTreePartialSnapshot)(nextSiblingTreeNode, (_ctx$selectedItem$nod2 = (_ctx$selectedItem2 = ctx.selectedItem) === null || _ctx$selectedItem2 === void 0 ? void 0 : _ctx$selectedItem2.nodeId) !== null && _ctx$selectedItem$nod2 !== void 0 ? _ctx$selectedItem$nod2 : null) : null;
+    return buildTreePartialSnapshot(parentTreeNode, (_b = (_a2 = ctx.selectedItem) == null ? void 0 : _a2.nodeId) != null ? _b : null);
   }, []);
-  var getPreNode = (0, _react.useCallback)(function () {
-    var _currentTreeNode$pare2, _ctx$selectedItem$nod3, _ctx$selectedItem3;
-    var ctx = latestRef.current;
-    var currentTreeNode = ctx.node;
-    var siblingNodesAtSameDepth = (_currentTreeNode$pare2 = currentTreeNode.parent) === null || _currentTreeNode$pare2 === void 0 ? void 0 : _currentTreeNode$pare2.children;
-    if (!(siblingNodesAtSameDepth !== null && siblingNodesAtSameDepth !== void 0 && siblingNodesAtSameDepth.length)) return null;
-    var indexAmongSiblings = siblingNodesAtSameDepth.findIndex(function (sibling) {
-      return String(sibling.nodeId) === String(currentTreeNode.nodeId);
-    });
-    var previousSiblingTreeNode = indexAmongSiblings > 0 ? siblingNodesAtSameDepth[indexAmongSiblings - 1] : undefined;
-    return previousSiblingTreeNode ? (0, _utils.buildTreePartialSnapshot)(previousSiblingTreeNode, (_ctx$selectedItem$nod3 = (_ctx$selectedItem3 = ctx.selectedItem) === null || _ctx$selectedItem3 === void 0 ? void 0 : _ctx$selectedItem3.nodeId) !== null && _ctx$selectedItem$nod3 !== void 0 ? _ctx$selectedItem$nod3 : null) : null;
+  const getNextNode = useCallback(() => {
+    var _a2, _b, _c;
+    const ctx = latestRef.current;
+    const currentTreeNode = ctx.node;
+    const siblingNodesAtSameDepth = (_a2 = currentTreeNode.parent) == null ? void 0 : _a2.children;
+    if (!(siblingNodesAtSameDepth == null ? void 0 : siblingNodesAtSameDepth.length)) return null;
+    const indexAmongSiblings = siblingNodesAtSameDepth.findIndex(
+      (sibling) => String(sibling.nodeId) === String(currentTreeNode.nodeId)
+    );
+    const nextSiblingTreeNode = indexAmongSiblings >= 0 ? siblingNodesAtSameDepth[indexAmongSiblings + 1] : void 0;
+    return nextSiblingTreeNode ? buildTreePartialSnapshot(nextSiblingTreeNode, (_c = (_b = ctx.selectedItem) == null ? void 0 : _b.nodeId) != null ? _c : null) : null;
   }, []);
-  var getPath = (0, _react.useCallback)(function () {
-    return (0, _utils.buildTreePathFromRoot)(latestRef.current.node);
+  const getPreNode = useCallback(() => {
+    var _a2, _b, _c;
+    const ctx = latestRef.current;
+    const currentTreeNode = ctx.node;
+    const siblingNodesAtSameDepth = (_a2 = currentTreeNode.parent) == null ? void 0 : _a2.children;
+    if (!(siblingNodesAtSameDepth == null ? void 0 : siblingNodesAtSameDepth.length)) return null;
+    const indexAmongSiblings = siblingNodesAtSameDepth.findIndex(
+      (sibling) => String(sibling.nodeId) === String(currentTreeNode.nodeId)
+    );
+    const previousSiblingTreeNode = indexAmongSiblings > 0 ? siblingNodesAtSameDepth[indexAmongSiblings - 1] : void 0;
+    return previousSiblingTreeNode ? buildTreePartialSnapshot(previousSiblingTreeNode, (_c = (_b = ctx.selectedItem) == null ? void 0 : _b.nodeId) != null ? _c : null) : null;
   }, []);
-  var getIndex = (0, _react.useCallback)(function () {
-    var _currentTreeNode$pare3;
-    var ctx = latestRef.current;
-    var currentTreeNode = ctx.node;
-    var siblingNodesAtSameDepth = (_currentTreeNode$pare3 = currentTreeNode.parent) === null || _currentTreeNode$pare3 === void 0 ? void 0 : _currentTreeNode$pare3.children;
-    if (!(siblingNodesAtSameDepth !== null && siblingNodesAtSameDepth !== void 0 && siblingNodesAtSameDepth.length)) return 0;
-    var indexAmongSiblings = siblingNodesAtSameDepth.findIndex(function (sibling) {
-      return String(sibling.nodeId) === String(currentTreeNode.nodeId);
-    });
+  const getPath = useCallback(() => buildTreePathFromRoot(latestRef.current.node), []);
+  const getIndex = useCallback(() => {
+    var _a2;
+    const ctx = latestRef.current;
+    const currentTreeNode = ctx.node;
+    const siblingNodesAtSameDepth = (_a2 = currentTreeNode.parent) == null ? void 0 : _a2.children;
+    if (!(siblingNodesAtSameDepth == null ? void 0 : siblingNodesAtSameDepth.length)) return 0;
+    const indexAmongSiblings = siblingNodesAtSameDepth.findIndex(
+      (sibling) => String(sibling.nodeId) === String(currentTreeNode.nodeId)
+    );
     return indexAmongSiblings < 0 ? 0 : indexAmongSiblings;
   }, []);
-  var getCheckStatus = (0, _react.useCallback)(function () {
-    var _currentTreeNode$chil2;
-    var ctx = latestRef.current;
-    var currentTreeNode = ctx.node;
+  const getCheckStatus = useCallback(() => {
+    var _a2;
+    const ctx = latestRef.current;
+    const currentTreeNode = ctx.node;
     if (!ctx.isCheckboxTree && !ctx.isRadioTree) return -1;
-    if (!((_currentTreeNode$chil2 = currentTreeNode.children) !== null && _currentTreeNode$chil2 !== void 0 && _currentTreeNode$chil2.length)) return currentTreeNode.checked ? 1 : 0;
-    var checkedDescendantCount = 0;
-    var _iterator = _createForOfIteratorHelper(currentTreeNode.children),
-      _step;
-    try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var childTreeNode = _step.value;
-        if (childTreeNode.checked) checkedDescendantCount++;
-      }
-    } catch (err) {
-      _iterator.e(err);
-    } finally {
-      _iterator.f();
+    if (!((_a2 = currentTreeNode.children) == null ? void 0 : _a2.length)) return currentTreeNode.checked ? 1 : 0;
+    let checkedDescendantCount = 0;
+    for (const childTreeNode of currentTreeNode.children) {
+      if (childTreeNode.checked) checkedDescendantCount++;
     }
     if (checkedDescendantCount === 0) return currentTreeNode.checked ? 1 : 0;
-    if (checkedDescendantCount === currentTreeNode.children.length && currentTreeNode.checked) return 1;
+    if (checkedDescendantCount === currentTreeNode.children.length && currentTreeNode.checked)
+      return 1;
     return 2;
   }, []);
-  var partialNodeApi = (0, _react.useMemo)(function () {
-    return _objectSpread(_objectSpread({}, treePartialSnapshot), {}, {
-      select: select,
-      toggleExpand: toggleExpand,
-      getParentNode: getParentNode,
-      getNextNode: getNextNode,
-      getPreNode: getPreNode,
-      getPath: getPath,
-      getIndex: getIndex,
-      getCheckStatus: getCheckStatus
-    });
-  }, [treePartialSnapshot, select, toggleExpand, getParentNode, getNextNode, getPreNode, getPath, getIndex, getCheckStatus]);
-  var partialItem = (0, _react.useMemo)(function () {
-    return (0, _utils.assembleTreePartialItem)(node, partialNodeApi);
-  }, [node, partialNodeApi]);
-  return {
-    partialItem: partialItem
-  };
-}
+  const partialNodeApi = useMemo(
+    () => __spreadProps(__spreadValues({}, treePartialSnapshot), {
+      select,
+      toggleExpand,
+      getParentNode,
+      getNextNode,
+      getPreNode,
+      getPath,
+      getIndex,
+      getCheckStatus
+    }),
+    [
+      treePartialSnapshot,
+      select,
+      toggleExpand,
+      getParentNode,
+      getNextNode,
+      getPreNode,
+      getPath,
+      getIndex,
+      getCheckStatus
+    ]
+  );
+  const partialItem = useMemo(
+    () => assembleTreePartialItem(node, partialNodeApi),
+    [node, partialNodeApi]
+  );
+  return { partialItem };
+}
+export {
+  useTreePartialNodeApi
+};

package/components/basic/tree/hooks/useTreePersistedState.d.ts

@@ -0,0 +1,3 @@
+import { type Dispatch, type SetStateAction } from "react";
+import type { TreeUrlState } from "../props";
+export declare function useTreePersistedState(name: string, statehandler: string | undefined): readonly [TreeUrlState | null, Dispatch<SetStateAction<TreeUrlState | null>>];

package/components/basic/tree/hooks/useTreePersistedState.js

@@ -0,0 +1,38 @@
+import { useCallback, useEffect, useState } from "react";
+import { getTreeState, saveTreeState } from "../utils";
+const storageType = (statehandler) => {
+  if (statehandler === "localStorage" || statehandler === "sessionStorage" || statehandler === "URL") {
+    return statehandler;
+  }
+  return null;
+};
+function useTreePersistedState(name, statehandler) {
+  const storage = storageType(statehandler);
+  const [persisted, setPersisted] = useState(null);
+  useEffect(() => {
+    if (!storage || typeof window === "undefined") {
+      setPersisted(null);
+      return;
+    }
+    try {
+      setPersisted(getTreeState(name, storage));
+    } catch (e) {
+      setPersisted(null);
+    }
+  }, [name, storage]);
+  const setPersistedState = useCallback(
+    (update) => {
+      if (!storage) return;
+      setPersisted((prev) => {
+        const next = typeof update === "function" ? update(prev) : update;
+        saveTreeState(name, storage, next);
+        return next;
+      });
+    },
+    [name, storage]
+  );
+  return [persisted, setPersistedState];
+}
+export {
+  useTreePersistedState
+};

package/components/basic/tree/index.d.ts

@@ -30,6 +30,7 @@ declare const _default: React.ComponentType<{
     onSelect?: (event: React.MouseEvent, widget: any, item: any, path: string) => void;
     onCheck?: (event: React.MouseEvent, widget: any, item: any, checked: boolean) => void;
     template?: string;
+    statehandler?: string;
     standalone?: boolean;
     ref?: React.RefObject<HTMLElement> | React.RefObject<null>;
     animation?: string;