vuestic-ui/dist/esm-node/src/composables/usePlacementAliases.mjs

Vue 3 UI Framework

import { computed } from "vue";
const verticalPlacement = ["top", "bottom"];
const horizontalPlacement = ["left", "right"];
const placementPosition = [...verticalPlacement, ...horizontalPlacement];
const placementAlignment = ["start", "end", "center"];
const placementsPositions = placementPosition.reduce((acc, position) => {
  acc.push(position);
  placementAlignment.forEach((alignment) => acc.push(`${position}-${alignment}`));
  return acc;
}, ["auto"]);
const placementAliasesPositions = verticalPlacement.reduce((acc, yPosition) => {
  horizontalPlacement.forEach((xPosition) => {
    acc.push(`${yPosition}-${xPosition}`);
    acc.push(`${xPosition}-${yPosition}`);
  });
  return acc;
}, []);
const placementsPositionsWithAliases = [...placementsPositions, ...placementAliasesPositions];
const aliasToPlacement = {
  "top-left": "top-start",
  "left-top": "top-start",
  "top-right": "top-end",
  "right-top": "top-end",
  "bottom-left": "bottom-start",
  "left-bottom": "bottom-start",
  "bottom-right": "bottom-end",
  "right-bottom": "bottom-end"
};
const usePlacementAliasesProps = {
  placement: {
    type: String,
    default: "auto",
    validator: (position) => placementsPositionsWithAliases.includes(position)
  }
};
const usePlacementAliases = (props) => {
  const placementArray = computed(() => {
    const placement = aliasToPlacement[props.placement] || props.placement;
    return placement.split("-");
  });
  const position = computed(() => {
    const position2 = placementArray.value[0];
    return position2 === "auto" ? "bottom" : position2;
  });
  const align = computed(() => {
    return placementArray.value[1] || "center";
  });
  return { position, align };
};
export {
  usePlacementAliasesProps as a,
  placementsPositionsWithAliases as p,
  usePlacementAliases as u
};
//# sourceMappingURL=usePlacementAliases.mjs.map