"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const tslib_es6 = require("../../../../../../tslib@2.6.2/node_modules/tslib/tslib.es6.js");
const React = require("react");
const useFeatures = require("./features/use-features.js");
const MotionConfigContext = require("../context/MotionConfigContext.js");
const index = require("../context/MotionContext/index.js");
const useVisualElement = require("./utils/use-visual-element.js");
const useMotionRef = require("./utils/use-motion-ref.js");
const create = require("../context/MotionContext/create.js");
const definitions = require("./features/definitions.js");
const isBrowser = require("../utils/is-browser.js");
const id = require("../projection/node/id.js");
const LayoutGroupContext = require("../context/LayoutGroupContext.js");
const useProjection = require("./features/use-projection.js");
const VisualElementHandler = require("./utils/VisualElementHandler.js");
function _interopNamespaceDefault(e) {
  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
  if (e) {
    for (const k in e) {
      if (k !== "default") {
        const d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: () => e[k]
        });
      }
    }
  }
  n.default = e;
  return Object.freeze(n);
}
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
function createMotionComponent(_a) {
  var preloadedFeatures = _a.preloadedFeatures, createVisualElement = _a.createVisualElement, projectionNodeConstructor = _a.projectionNodeConstructor, useRender = _a.useRender, useVisualState = _a.useVisualState, Component = _a.Component;
  preloadedFeatures && definitions.loadFeatures(preloadedFeatures);
  function MotionComponent(props, externalRef) {
    var layoutId = useLayoutId(props);
    props = tslib_es6.__assign(tslib_es6.__assign({}, props), { layoutId });
    var config = React.useContext(MotionConfigContext.MotionConfigContext);
    var features = null;
    var context = create.useCreateMotionContext(props);
    var projectionId = config.isStatic ? void 0 : id.useProjectionId();
    var visualState = useVisualState(props, config.isStatic);
    if (!config.isStatic && isBrowser.isBrowser) {
      context.visualElement = useVisualElement.useVisualElement(Component, visualState, tslib_es6.__assign(tslib_es6.__assign({}, config), props), createVisualElement);
      useProjection.useProjection(projectionId, props, context.visualElement, projectionNodeConstructor || definitions.featureDefinitions.projectionNodeConstructor);
      features = useFeatures.useFeatures(props, context.visualElement, preloadedFeatures);
    }
    return React__namespace.createElement(
      VisualElementHandler.VisualElementHandler,
      { visualElement: context.visualElement, props: tslib_es6.__assign(tslib_es6.__assign({}, config), props) },
      features,
      React__namespace.createElement(index.MotionContext.Provider, { value: context }, useRender(Component, props, projectionId, useMotionRef.useMotionRef(visualState, context.visualElement, externalRef), visualState, config.isStatic, context.visualElement))
    );
  }
  return React.forwardRef(MotionComponent);
}
function useLayoutId(_a) {
  var _b;
  var layoutId = _a.layoutId;
  var layoutGroupId = (_b = React.useContext(LayoutGroupContext.LayoutGroupContext)) === null || _b === void 0 ? void 0 : _b.id;
  return layoutGroupId && layoutId !== void 0 ? layoutGroupId + "-" + layoutId : layoutId;
}
exports.createMotionComponent = createMotionComponent;
//# sourceMappingURL=index.js.map
