@hitachivantara/uikit-react-core/dist/cjs/AvatarGroup/AvatarGroup.styles.cjs

Core React components for the NEXT Design System.

"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
require("../Avatar/Avatar.cjs");
const Avatar_styles = require("../Avatar/Avatar.styles.cjs");
const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvAvatarGroup", {
  root: {
    display: "flex",
    [`& .${Avatar_styles.staticClasses.root}`]: {
      border: `2px solid ${uikitStyles.theme.colors.bgPage}`,
      boxSizing: "content-box"
    },
    [`& .${Avatar_styles.staticClasses.container}`]: {
      padding: 2
    }
  },
  row: {
    flexDirection: "row",
    justifyContent: "flex-start",
    [`& .${Avatar_styles.staticClasses.container}`]: {
      "&:not(:first-of-type)": {
        marginLeft: "var(--spacing)"
      }
    },
    "&$toBack": {
      flexDirection: "row-reverse",
      justifyContent: "flex-end",
      [`& .${Avatar_styles.staticClasses.container}`]: {
        "&:last-of-type": {
          marginLeft: 0
        },
        "&:not(:last-of-type)": {
          marginLeft: "var(--spacing)"
        }
      }
    }
  },
  column: {
    flexDirection: "column",
    [`& .${Avatar_styles.staticClasses.container}`]: {
      "&:not(:first-of-type)": {
        marginTop: "var(--spacing)"
      }
    },
    "&$toBack": {
      flexDirection: "column-reverse",
      [`& .${Avatar_styles.staticClasses.container}`]: {
        "&:last-of-type": {
          marginTop: 0
        },
        "&:not(:last-of-type)": {
          marginTop: "var(--spacing)"
        }
      }
    }
  },
  highlight: {
    [`& .${Avatar_styles.staticClasses.container}:hover`]: {
      zIndex: uikitStyles.theme.zIndices.popover
    }
  },
  toBack: {}
});
exports.staticClasses = staticClasses;
exports.useClasses = useClasses;