@hitachivantara/uikit-react-core/dist/cjs/ScrollToVertical/VerticalScrollListItem/VerticalScrollListItem.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 name = "HvVerticalScrollListItem";
const { staticClasses, useClasses } = uikitReactUtils.createClasses(name, {
  root: {
    padding: "0",
    height: "32px",
    width: "32px",
    display: "flex",
    justifyContent: "center",
    alignItems: "center"
  },
  icon: {
    width: "1em",
    height: "1em",
    borderRadius: uikitStyles.theme.radii.full,
    fontSize: 6,
    color: uikitStyles.theme.colors.text,
    display: "inline-block",
    backgroundColor: "currentcolor"
  },
  notSelected: {
    fontSize: 4,
    color: uikitStyles.theme.colors.textDisabled
  },
  // TODO: remove in v6 (use classes.button)
  text: {},
  button: {
    display: "flex",
    justifyContent: "center",
    alignItems: "center",
    height: "16px",
    width: "16px",
    borderRadius: uikitStyles.theme.radii.full,
    cursor: "pointer",
    "&:hover": {
      backgroundColor: uikitStyles.theme.colors.bgHover,
      "& $notSelected": {
        fontSize: 6,
        color: uikitStyles.theme.colors.text
      }
    },
    "&:focus": {
      outline: "none"
    },
    "&:focus-visible": {
      ...focusUtils.outlineStyles
    }
  }
});
exports.staticClasses = staticClasses;
exports.useClasses = useClasses;