Обзор
Передайте основной значок через слот узлаicon, а наложенный элемент — через stackedIcon. Контейнер имеет ширину и высоту 16 px; наложенный элемент абсолютно позиционируется на расстоянии 8 px слева и 7 px сверху, поэтому он выходит за пределы правого нижнего угла. Квадратный аватар размером 12 px — предполагаемый размер для логотипа приложения. Оба узла являются декоративными, поэтому рядом со значком должна быть видимая подпись.
Оставьте место для переполнения элемента в стопке при размещении соседнего содержимого. В примере используется отступ 12px между контейнером значка и его меткой.
Использование
className, style и ref применяются к внешнему div. render заменяет этот целевой элемент посредством композиции Base UI, сохраняя оба узла значков.
Свойства
string
CSS class applied to the container root.
ReactNode
обязательно
Main icon content. The caller controls its dimensions and stroke.
ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, {}>
Replaces the div root while preserving the icon content and native props.
ReactNode
обязательно
Smaller content stacked on the bottom-right corner of the main icon, such as a 12px avatar.
CSSProperties
Inline styles applied to the container root.