@zohodesk/components/es/TextBoxIcon/TextBoxIcon.module.css

Dot UI is a customizable React component library built to deliver a clean, accessible, and developer-friendly UI experience. It offers a growing set of reusable components designed to align with modern design systems and streamline application development

.varClass {
  /* textboxicon icon default variables */
  --textboxicon_icon_margin: 0 var(--zd_size5);
  --textboxicon_icon_cursor: pointer;
  --textboxicon_icon_color: var(--zdt_textboxicon_default_icon);
}
.container {
  composes: varClass;
  position: relative;
}
.disabled,.readonly {
  --textboxicon_icon_cursor: not-allowed;
}
.icon {
  composes: offSelection from '../common/common.module.css';
  margin: var(--textboxicon_icon_margin);
  cursor: var(--textboxicon_icon_cursor);
}
.iconContainer {
  color: var(--textboxicon_icon_color);
}
.effect:hover .iconContainer,
.effect:focus-within .iconContainer {
  --textboxicon_icon_color: var(--zdt_textboxicon_hover_icon);
}
.rotated {
  transform: rotateX(180deg);
}
.iconOnHoverStyle .icon,
.iconOnHoverReadonly .icon,
.iconOnHoverReadonly:hover .icon {
  opacity: 0;
  visibility: hidden;
}
.iconOnHoverStyle:hover .icon {
  opacity: 1;
  visibility: visible;
}