import { ref, computed, onDeactivated, onActivated, onBeforeUnmount } from "vue";
import { useLayout } from "./layout.mjs";
import { propsFactory, getUid, getCurrentInstance } from "../../utils/dist/index.mjs";
const makeLayoutItemProps = propsFactory({
  modelValue: {
    type: Boolean,
    default: true
  },
  name: String,
  position: {
    type: String,
    default: "absolute"
  },
  anchor: {
    type: String,
    default: "left"
  },
  priority: {
    type: [String, Number],
    default: 0
  }
}, "layout-item");
function useLayoutItem(props) {
  var _a;
  const layout = useLayout();
  const id = (_a = props.value.name) != null ? _a : `layout-item-${getUid()}`;
  const vm = getCurrentInstance("useLayoutItem");
  const isKeptAlive = ref(false);
  const {
    layoutItemStyles,
    layoutItemScrimStyles
  } = layout.register(vm, id, computed(() => ({
    ...props.value,
    active: !isKeptAlive.value && props.value.active
  })));
  onDeactivated(() => isKeptAlive.value = true);
  onActivated(() => isKeptAlive.value = false);
  onBeforeUnmount(() => layout.unregister(id));
  return {
    layoutItemStyles,
    layoutRect: layout.layoutRect,
    layoutItemScrimStyles
  };
}
export {
  makeLayoutItemProps,
  useLayoutItem
};
//# sourceMappingURL=layout-item.mjs.map
