@crossed/ui/lib/commonjs/scroll/utils/useLogic.js

A universal & performant styling library for React Native, Next.js & React

var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
var useLogic_exports = {};
__export(useLogic_exports, {
  useLogic: () => useLogic
});
module.exports = __toCommonJS(useLogic_exports);
var import_jsx_runtime = require("react/jsx-runtime");
var import_react = require("react");
var import_react_native_reanimated = require("react-native-reanimated");
var import_Box = require("../../layout/Box");
var import_styled = require("@crossed/styled");
var import_Title = require("./Title");
var import_Footer = require("./Footer");
var import_Body = require("./Body");
const useLogic = ({
  children,
  stickyFooter,
  ...props
}) => {
  const layoutShared = (0, import_react_native_reanimated.useSharedValue)(0);
  const contentLayoutShared = (0, import_react_native_reanimated.useSharedValue)(0);
  const [showFooter, setShowFooter] = (0, import_react.useState)(false);
  const [paddingRight, setPaddingRight] = (0, import_react.useState)(0);
  (0, import_react_native_reanimated.useAnimatedReaction)(
    () => layoutShared.value - contentLayoutShared.value,
    (current, previous) => {
      if (current !== previous) {
        (0, import_react_native_reanimated.runOnJS)(setPaddingRight)(current);
      }
    },
    [layoutShared, contentLayoutShared, setPaddingRight]
  );
  const title = (0, import_react.useMemo)(() => {
    if (!children)
      return null;
    return import_react.Children.toArray(children).find(
      (e) => typeof e === "object" && "type" in e && e.type === import_Title.Title
    );
  }, [children]);
  const footer = (0, import_react.useMemo)(() => {
    if (!children || typeof children === "number")
      return null;
    return import_react.Children.toArray(children).find(
      (e) => typeof e === "object" && "type" in e && e.type === import_Footer.Footer
    );
  }, [children]);
  const body = (0, import_react.useMemo)(() => {
    if (!children || typeof children === "number")
      return null;
    return import_react.Children.toArray(children).find(
      (e) => typeof e === "object" && "type" in e && e.type === import_Body.Body
    );
  }, [children]);
  (0, import_react.useEffect)(() => {
    if (stickyFooter && !showFooter && footer) {
      const time = setTimeout(() => setShowFooter(true), 0);
      return () => clearTimeout(time);
    }
    return () => {
    };
  }, [stickyFooter, setShowFooter, showFooter, footer]);
  const renderFooter = (0, import_react.useCallback)(
    () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
      import_Box.Box,
      {
        style: (0, import_styled.composeStyles)(
          stickyFooter && (0, import_styled.inlineStyle)(() => ({
            base: {
              opacity: 0
            }
          }))
        ),
        children: footer
      }
    ),
    [stickyFooter, footer]
  );
  const onLayout = (0, import_react.useCallback)(
    (e) => {
      var _a;
      const {
        nativeEvent: { layout }
      } = e;
      layoutShared.value = layout.width;
      if (typeof props.onLayout === "function")
        props.onLayout(e);
      else
        (_a = props.onLayout) == null ? void 0 : _a.value(e);
    },
    [layoutShared, props.onLayout]
  );
  const onContentSizeChange = (0, import_react.useCallback)(
    (w, h) => {
      var _a;
      contentLayoutShared.value = w;
      if (typeof props.onContentSizeChange === "function")
        props.onContentSizeChange(w, h);
      else
        (_a = props.onContentSizeChange) == null ? void 0 : _a.value(w, h);
    },
    [contentLayoutShared, props.onContentSizeChange]
  );
  return {
    paddingRight,
    title,
    body,
    renderFooter,
    onLayout,
    onContentSizeChange,
    footer,
    showFooter
  };
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  useLogic
});
//# sourceMappingURL=useLogic.js.map