import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
import { Component, useMutationState, useSortedEntities, Entity, SugaredField } from "@contember/react-binding";
import { useCallback, Fragment } from "react";
import { useMessageFormatter } from "@contember/react-i18n";
import { RepeaterFieldContainer } from "./RepeaterFieldContainer.js";
import { RepeaterItem } from "./RepeaterItem.js";
import { SortableRepeaterContainer } from "./SortableRepeaterContainer.js";
import { SortableRepeaterItem } from "./SortableRepeaterItem.js";
import { SortableRepeaterItemHandle } from "./SortableRepeaterItemHandle.js";
import { repeaterDictionary } from "./repeaterDictionary.js";
import { shouldCancelStart } from "@contember/utilities";
const RepeaterInner = Component(
  (props) => {
    const isMutating = useMutationState();
    const { entities, moveEntity, addNewAtIndex } = useSortedEntities(props.accessor, props.sortableBy);
    const createNewEntity = useCallback((initialize, index) => {
      addNewAtIndex(index, initialize);
    }, [addNewAtIndex]);
    const onSortEnd = useCallback(
      ({ oldIndex, newIndex }) => {
        moveEntity(oldIndex, newIndex);
      },
      [moveEntity]
    );
    const formatMessage = useMessageFormatter(repeaterDictionary);
    const Handle = props.dragHandleComponent || Fragment;
    const Item = props.itemComponent || RepeaterItem;
    const Container = props.containerComponent || RepeaterFieldContainer;
    const isEmpty = entities.length === 0;
    const itemRemovingEnabled = props.enableRemoving !== false;
    const sortableHandle = useCallback(
      ({ children }) => /* @__PURE__ */ jsx(SortableRepeaterItemHandle, { children: /* @__PURE__ */ jsx(Handle, { children }) }),
      [Handle]
    );
    const removalType = props.removalType ?? "delete";
    const label = props.label;
    if (props.sortableBy === void 0) {
      return /* @__PURE__ */ jsx(
        Container,
        {
          ...props.containerComponentExtraProps,
          ...props,
          removalType,
          isEmpty,
          createNewEntity,
          entities,
          formatMessage,
          children: entities.map((entity, i) => /* @__PURE__ */ jsx(Entity, { accessor: entity, children: /* @__PURE__ */ jsx(
            Item,
            {
              ...props.itemComponentExtraProps,
              label,
              index: i,
              createNewEntity,
              removalType,
              canBeRemoved: itemRemovingEnabled,
              dragHandleComponent: void 0,
              children: props.children
            }
          ) }, entity.key))
        }
      );
    }
    const axis = props.unstable__sortAxis || "y";
    const useDragHandle = props.useDragHandle ?? true;
    return /* @__PURE__ */ jsx(
      SortableRepeaterContainer,
      {
        axis,
        lockAxis: axis,
        helperClass: "is-dragged",
        lockToContainerEdges: true,
        useWindowAsScrollContainer: true,
        useDragHandle,
        onSortEnd,
        shouldCancelStart,
        children: /* @__PURE__ */ jsx(
          Container,
          {
            ...props.containerComponentExtraProps,
            ...props,
            removalType,
            isEmpty,
            createNewEntity,
            entities,
            formatMessage,
            children: entities.map((entity, i) => /* @__PURE__ */ jsx(SortableRepeaterItem, { index: i, disabled: isMutating, children: /* @__PURE__ */ jsx(Entity, { accessor: entity, children: /* @__PURE__ */ jsx(
              Item,
              {
                ...props.itemComponentExtraProps,
                label,
                index: i,
                createNewEntity,
                removalType,
                canBeRemoved: itemRemovingEnabled,
                dragHandleComponent: useDragHandle ? sortableHandle : void 0,
                children: props.children
              }
            ) }) }, entity.key))
          }
        )
      }
    );
  },
  (props) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
    props.sortableBy && /* @__PURE__ */ jsx(SugaredField, { field: props.sortableBy, defaultValue: 0, isNonbearing: true }),
    props.children
  ] }),
  "RepeaterInner"
);
export {
  RepeaterInner
};
//# sourceMappingURL=RepeaterInner.js.map
