reshow-return/build/es/usePartialRender.mjs

reshow-return (simple connect component with reshow-flux)

// @ts-check

import * as React from "react";
import { useMemo, useState } from "react";
import { useReduceStore, Map, mergeMap } from "reshow-flux";
import build from "reshow-build";
import callfunc from "call-func";
import Return from "./ui/organisms/Return.mjs";

/**
 * @template StateType
 * @template ActionType
 * @typedef {import('reshow-flux-base').DispatchFunction<StateType, ActionType>} DispatchType
 */

/**
 * @typedef {string[]|Immutable.Seq} RenderKeysType
 */

/**
 * @template ChildrenType
 * @param {RenderKeysType} [initRenderKeys]
 * @param {{[key: string]: React.ReactElement}|Immutable.Map<string,React.ReactElement>} [initChildren]
 * @returns {[React.ReactElement[], DispatchType<any, ChildrenType>, DispatchType<any, RenderKeysType>]}
 */
var usePartialRender = function usePartialRender(initRenderKeys, initChildren) {
  var [renderStore, setPartialRender] = useReduceStore(function (state, action) {
    return mergeMap(state, action);
  }, function () {
    return Map(callfunc(initChildren));
  });
  var [renderKeys, setRenderKeys] = useState(function () {
    return callfunc(initRenderKeys);
  });
  var renderItems = useMemo(function () {
    var buildReturn = build(build(Return)({
      store: renderStore
    }));

    /**
     * renderKeys could use array like data structure.
     * such as immutable.js
     */
    return (renderKeys || []).map(
    /**
     * @param {string} name
     */
    function (name) {
      return buildReturn({
        key: name,
        name,
        initStates: [name]
      },
      /**
       * @param {any} props
       */
      function (props) {
        return props[props.name] || null;
      });
    });
  }, [renderKeys]);
  return [renderItems, setPartialRender, setRenderKeys];
};
export default usePartialRender;