@hitachivantara/uikit-react-core/dist/cjs/TreeView/TreeItem/TreeItem.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");
const focusUtils = require("../../utils/focusUtils.cjs");
const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvTreeItem", {
  /** Applied to the root element */
  root: {
    listStyle: "none",
    margin: 0,
    padding: 0,
    outline: 0
  },
  group: {
    margin: 0,
    padding: 0,
    marginLeft: uikitStyles.theme.space.sm
  },
  content: {
    padding: uikitStyles.theme.spacing(0, 1),
    minHeight: 32,
    // TODO: review
    width: "100%",
    boxSizing: "border-box",
    // prevent width + padding to overflow
    display: "flex",
    alignItems: "center",
    cursor: "pointer",
    WebkitTapHighlightColor: "transparent",
    "&:hover:not($disabled)": {
      backgroundColor: uikitStyles.theme.colors.bgHover
    }
  },
  expanded: {},
  selected: {
    backgroundColor: uikitStyles.theme.colors.bgPageSecondary
  },
  focused: {
    backgroundColor: uikitStyles.theme.colors.bgHover,
    "&:focus-visible": {
      ...focusUtils.outlineStyles
    }
  },
  disabled: {
    cursor: "not-allowed",
    color: uikitStyles.theme.colors.textDisabled,
    "& $label": {
      color: uikitStyles.theme.colors.textDisabled
    }
  },
  label: {
    paddingLeft: 4,
    width: "100%",
    boxSizing: "border-box",
    // fixes overflow
    minWidth: 0,
    position: "relative",
    ...uikitStyles.theme.typography.body
  },
  iconContainer: {
    display: "flex",
    flexShrink: 0,
    justifyContent: "center",
    marginRight: 4,
    width: uikitStyles.theme.space.sm,
    ":empty": {
      width: uikitStyles.theme.space.xs
    }
  }
});
exports.staticClasses = staticClasses;
exports.useClasses = useClasses;