UIKit
7.41.0
• SpinКомпоненты
UIKit
7.41.0
AccordionActionTooltipActionsPanelAlertArrowToggleAvatarBreadcrumbsButtonCardCheckboxClipboardButtonDefinitionListDialogDisclosureDividerDrawerDropdownMenuFilePreviewHelpMarkHotkeyIconLabelLinkListLoaderMenuModalNumberInputOverlayPaginationPalettePasswordInputPinInputPlaceholderContainerPopoverPopupPortalProgressRadioRadioGroupSegmentedRadioGroupSelectSheetSkeletonSliderSpinStepperSwitchTableTabsTextTextAreaTextInputToasterTocTooltipUserUserLabel
Date Components
3.4.2
Navigation
4.0.17
size
import {Spin} from '@gravity-ui/uikit';
Spin — это компонент, который отображает состояние загрузки (вращающийся полукруг) в инлайн-сценариях. В отличие от Loader, этот компонент применяется для отображения состояния загрузки в инлайн-контексте — например, в Button или Label.
§Размер
import {Spin} from '@gravity-ui/uikit'; export default function () { return ( <> <Spin size="xs" /> <Spin size="s" /> <Spin size="m" /> <Spin size="l" /> <Spin size="xl" /> </> ); }
XS — очень маленький.
S — маленький, применяется, когда спин среднего размера слишком велик.
M — средний (базовый), используется в большинстве случаев.
L — большой, применяется, когда спин среднего размера слишком мал.
XL — очень большой.
§Свойства
| Имя | Описание | Тип | Значение по умолчанию |
|---|---|---|---|
| size | Размер спина. | "xs" "s" "m" "l" "xl" | "m" |
| style | Пользовательские CSS-стили корневого элемента. | React.CSSProperties | |
| className | Пользовательский CSS-класс корневого элемента. | string | |
| qa | Атрибут тестирования (data-qa). | string |