const n = (t) => {
  const { get: o } = t;
  return {
    ".dropdown": {
      position: "relative",
      display: "inline-block"
    },
    ".dropdown-content": {
      zIndex: o("zIndex.dropdown")
    },
    // We only control those that are children of dropdown. Otherwise, we
    // only style, but do not control position or animation
    ".dropdown .dropdown-content": {
      position: "absolute",
      opacity: "0",
      visibility: "hidden",
      origin: "top",
      transform: "scale(95%)",
      transitionProperty: "transform, opacity",
      transitionDuration: o("transitionDuration.popover"),
      transitionTimingFunction: o("transitionTimingFunction.popover")
    },
    ".dropdown-bottom .dropdown-content": {
      top: "100%",
      bottom: "auto",
      transformOrigin: "top"
    },
    ".dropdown-top .dropdown-content": {
      top: "auto",
      bottom: "100%",
      transformOrigin: "bottom"
    },
    ".dropdown-left .dropdown-content": {
      bottom: "auto",
      end: "100%",
      top: "0",
      transformOrigin: "right"
    },
    ".dropdown-right .dropdown-content": {
      bottom: "auto",
      start: "100%",
      top: "0",
      transformOrigin: "left"
    },
    ".dropdown.dropdown-open .dropdown-content": {
      visibility: "visible",
      opacity: 100,
      transform: "scale(100%)"
    }
  };
}, i = {
  getComponents: n
};
export {
  i as TailwindDropdown
};
