data class CharacterCounterParams(@IntRange(from = 0, to = 9223372036854775807) val characterLimit: Int, val accessibilityCharacterLimitMessage: String?)

Character limit counter values.

CheckboxGroupItem

data class CheckboxGroupItem<T>(val key: T, val label: String, val checked: Boolean = false, val enabled: Boolean = true)

Data class used for CheckboxGroup

CheckboxVariant

enum CheckboxVariant : Enum<CheckboxVariant>

Appearance of the Checkbox

ChoiceContent

data class ChoiceContent(val title: String? = null, val caption: String? = null, val addon: @Composable () -> Unit? = null, val expandingText: String? = null)

Content interface for Choice.

ChoiceContentAlignment

enum ChoiceContentAlignment : Enum<ChoiceContentAlignment>

Content alignment options for leading and trailing content for Choice component.

ChoiceGroupItem

data class ChoiceGroupItem<T>(val key: T, val content: ChoiceContent, val leadingContent: ChoiceLeadingContent = ChoiceLeadingContent.None, val trailingContent: ChoiceTrailingContent = ChoiceTrailingContent.None, val enabled: Boolean = true)

Data class used for Choice group items.

ChoiceLeadingContent

sealed class ChoiceLeadingContent

Leading content for Choice: Icon, Payment Logo, or Image

ChoiceSize

enum ChoiceSize : Enum<ChoiceSize>

Sizes for Choice. The sizes affect the minimum height of the component. Keep in mind that the small variant should ideally be used without a caption or larger add-ons. If the content is larger than the container, it will grow accordingly.

ChoiceTrailingContent

sealed class ChoiceTrailingContent

Trailing content for Choice: Icon, Image, Text, or Price.

CommercialMessageSize

enum CommercialMessageSize : Enum<CommercialMessageSize>

Sizes for Commercial message in combination with Price module.

CommercialMessageType

enum CommercialMessageType : Enum<CommercialMessageType>

Types for CommercialMessage

CommercialMessageVariant

enum CommercialMessageVariant : Enum<CommercialMessageVariant>

Variants for CommercialMessage

CompactCardAddon

sealed class CompactCardAddon

The add-on container in the media container supports CommercialMessage and Badge. Please note that only one add-on can be made visible.

CompactCardTheme

enum CompactCardTheme : Enum<CompactCardTheme>

Regular Compact Card is available in two themes: Default and Inverse. Default theme is used on white/black (neutral-1) backgrounds, while the Inverse theme is used on top of coloured and neutral surfaces.

CompactCardVariant

enum CompactCardVariant : Enum<CompactCardVariant>

Regular Compact Card with a content container background surface that provides a stronger visual contrast and creates a more contained expression. Simple Compact Card with a content container lacking background surface colour and padding.

CompactMediaContainer

sealed class CompactMediaContainer

Provides required choice between Image and Video content.

CurrencyPosition

enum CurrencyPosition : Enum<CurrencyPosition>

Placement of currency symbol/label. This can change depending on the market.

CurrencySpacing

enum CurrencySpacing : Enum<CurrencySpacing>

Space added between the currency and price digits. Appended before or after the currency depending on CurrencyPosition.

DecimalSign

enum DecimalSign : Enum<DecimalSign>

Separator for integers and decimals

DismissParams

data class DismissParams(val onDismissRequest: () -> Unit, val dismissButtonContentDescription: String? = null)

Data class that represent the necessary data to add an close DismissParams in a component.

DualButtonOrientation

enum ~~DualButtonOrientation~~ : Enum<DualButtonOrientation>

Orientation to use with Dual button

DualButtonParams

data class DualButtonParams(@DrawableRes val iconResource: Int, val contentDescription: String, val enabled: Boolean = true, val interactionSource: MutableInteractionSource? = null)

Data class for DualButton content.

DualButtonPosition

enum DualButtonPosition : Enum<DualButtonPosition>

DualButtonPosition represents the position of the button in the layout. Use this enum to determine which button is which.

DualButtonSize

enum DualButtonSize : Enum<DualButtonSize>

DualButtonSize represents the height and width of the individual buttons.

DualButtonVariant

enum DualButtonVariant : Enum<DualButtonVariant>

The variant of the DualButton. The variant determines the color scheme of the button.

EnabledState

enum EnabledState : Enum<EnabledState>

States primarily used for Input field and Text areas, but also other components that need both Enabled, Disabled and ReadOnly. The state is used to block input and change the UI when used with ReadOnly and Disabled. Default state is Enabled.

ExpanderVariant

enum ExpanderVariant : Enum<ExpanderVariant>

Variants for Expander

FooterButtonAlignment

enum FooterButtonAlignment : Enum<FooterButtonAlignment>

Enum class used for Prompt footer alignment when two buttons are used.

FooterButtonVariant

enum FooterButtonVariant : Enum<FooterButtonVariant>

Represents choice between Primary and Secondary button variant for CardFooterContent.

HelperTextParams

data class HelperTextParams(val state: HelperTextState, val label: String? = null)

Helper class for Helper text parameters

HelperTextProps

object HelperTextProps

HelperTextState

enum HelperTextState : Enum<HelperTextState>

Helper text states. There are 4 variants that emphasise the state trying to be conveyed.

HyperlinkColor

enum HyperlinkColor : Enum<HyperlinkColor>

Pre-defined colours for Hyperlink component.

IconButtonSize

@Stable

enum IconButtonSize : Enum<IconButtonSize>

Pre-defined sizes for IconButton There are 3 sizes available: Medium, Small and XSmall. The default size is Medium.

IconButtonVariant

@Immutable

sealed class IconButtonVariant

Pre-defined styles for the IconButton component

IconParams

data class IconParams(val position: IconPosition.Horizontal, @DrawableRes val iconId: Int?, val contentDescription: String?, val onClick: () -> Unit? = null)

Icon parameters for clickable icons used in eg. Input field related components.

IconPillSize

enum IconPillSize : Enum<IconPillSize>

Pre-defined sizes for IconPill There are 2 sizes available: Medium and Small

ImageParams

data class ImageParams(val painter: Painter, val contentDescription: String?, val aspectRatio: SkapaAspectRatio = SkapaAspectRatio.Ratio16by9)

Data class to be used for header images in Card component.

InlineMessageActionParams

data class InlineMessageActionParams(val label: String, val onClick: () -> Unit)

InlineMessageActions

data class InlineMessageActions(val first: InlineMessageActionParams, val second: InlineMessageActionParams? = null)

InlineMessageStyle

enum InlineMessageStyle : Enum<InlineMessageStyle>

Pre-defined accentuation for Inline message styling. Chose between Emphasised which has a title and drop shadow or Subtle which is flat.

InlineMessageVariant

enum InlineMessageVariant : Enum<InlineMessageVariant>

Pre-defined Inline message variants. There are 4 variants available: Informative, Positive, Cautionary and Negative. Each variant has a different semantic meaning.

InlineMessageVisibility

enum InlineMessageVisibility : Enum<InlineMessageVisibility>

Enum class to handle InlineMessage visibility state, changing the state will trigger AnimatedVisibility effect on the component.

JumboButtonVariant

enum JumboButtonVariant : Enum<JumboButtonVariant>

Variants for Jumbo buttons

ListBoxItemHeader

interface ListBoxItemHeader

Interface used to determine if item in list is header

ListBoxItemsParams

data class ListBoxItemsParams<T : ListBoxItemHeader>(val items: List<T>, val itemContent: @Composable (T) -> Unit, val contentPadding: PaddingValues = MenuDefaults.DropdownMenuItemContentPadding, val onItemClick: (T) -> Unit?)

Data class that represents a list of items that Implement ListBoxItemHeader interface and is used to separate the items by headers

ListBoxProps

object ListBoxProps

ListViewItemControls

sealed class ListViewItemControls

Trailing controls are used to distinguish between Navigation and Action behaviour.

ListViewItemImage

sealed class ListViewItemImage

Leading content: Text, Icon, Image, PaymentLogo or Avatar All list view item sizes supports leading content. Please note that Leading image and Medium Payment logos are only supported in Medium and Large list view items. Small list view items also supports a small version of the payment logo container.

ListViewItemSize

enum ListViewItemSize : Enum<ListViewItemSize>

ListViewItemSize defines the minimum height of the List View Item container. All list view item variants are available in three different sizes. The height of the container will expand if the text size is increased. Use medium and large list view items for images and double lines of text.

ListViewItemTextStyle

enum ListViewItemTextStyle : Enum<ListViewItemTextStyle>

Controls the title text style of the ListViewItem component.

LoadingBallSize

enum LoadingBallSize : Enum<LoadingBallSize>

Sizes for LoadingBall component

LoadingBallVariant

enum LoadingBallVariant : Enum<LoadingBallVariant>

Color variants for LoadingBall component

MediaContainer

sealed class MediaContainer

Represents the content of the Card.

MemberCardActionParams

data class MemberCardActionParams(val actionIcon: ActionIcon, val contentDescription: String, val clickableItems: MemberCardClickableItems = MemberCardClickableItems.Icon, val onClick: () -> Unit)

Data class for handling the action available in MemberCard.

MemberCardClickableItems

enum MemberCardClickableItems : Enum<MemberCardClickableItems>

MemberCardClickableItems defines which part of the card is clickable by the user. Default value is MemberCardClickableItems.Icon.

MemberCardCodeType

enum MemberCardCodeType : Enum<MemberCardCodeType>

MemberCardCodeType defines which type of code system is to be used and sizes the code container accordingly.

MemberCardOrientation

enum MemberCardOrientation : Enum<MemberCardOrientation>

MemberCardOrientation sets the desired orientation variant of the component.

MemberCardProgram

enum MemberCardProgram : Enum<MemberCardProgram>

MemberCardProgram defines the visual style, or program to be applied to the IKEA Member Card.

MemberCardStyleParams

data class MemberCardStyleParams(val program: MemberCardProgram = MemberCardProgram.Family, val orientation: MemberCardOrientation = MemberCardOrientation.Horizontal, val codeType: MemberCardCodeType = MemberCardCodeType.QR)

Data class for the styling of the MemberCard.

MenuItemImage

sealed class MenuItemImage

Leading content: Only Icon for now All menu item sizes supports leading content.

MergeDescendantsStrategy

enum MergeDescendantsStrategy : Enum<MergeDescendantsStrategy>

Strategy for merging descendants of the PriceModule. This is used to control how the PriceModule is merged into a single node for accessibility purposes.

ModalFooterButtonAlignment

enum ModalFooterButtonAlignment : Enum<ModalFooterButtonAlignment>

Enum class used for Modals footer alignment when two buttons are used.

ModalHeader

sealed class ModalHeader

The different types of headers that can be used in a modal.

ModalHeaderAction

data class ModalHeaderAction(@DrawableRes val iconResource: Int, val contentDescription: String? = null, val action: () -> Unit)

A ModalHeaderAction is represented as an IconButton added to the header component

ModalHeaderParams

data class ~~ModalHeaderParams~~(val variant: ModalsHeaderVariant, val title: String? = null, val trailingAction: ModalHeaderAction? = null, val leadingAction: ModalHeaderAction? = null)

Class that represents the necessary data to build a ModalHeader

ModalsActionFooterParams

data class ModalsActionFooterParams(val buttonAlignment: ModalFooterButtonAlignment = ModalFooterButtonAlignment.SideBySide, val primaryButton: @Composable () -> Unit, val secondaryButton: @Composable () -> Unit?)

Class that represents the necessary data to build a ModalsActionFooter

ModalsHeaderVariant

enum ModalsHeaderVariant : Enum<ModalsHeaderVariant>

The different types of headers that can be used in a modal.

NavButtonParams

data class NavButtonParams(val forwardButtonContentDescription: String, val backButtonContentDescription: String, val variant: NavButtonVariant = NavButtonVariant.Primary)

Data class that represents the necessary data to add navigation buttons in the component.

NavButtonVariant

enum NavButtonVariant : Enum<NavButtonVariant>

Button variant for the navigation buttons in the carousel.

OfferMessageItem

data class OfferMessageItem(val label: String, val variant: OfferMessageVariant = OfferMessageVariant.Subtle, val showBullet: Boolean = true)

Offer message to highlight an offer for the product.

OfferMessageVariant

enum OfferMessageVariant : Enum<OfferMessageVariant>

Variants for Offer message to use different colors.

PaymentLogoParams

data class PaymentLogoParams(val painter: Painter, val contentDescription: String?)

Payment Logo parameters for trailing payment logo used in Input field component.

PaymentLogoSize

enum PaymentLogoSize : Enum<PaymentLogoSize>

PaymentLogoSize defines the overall size of the Payment Logo container.

PillGroupItem

data class PillGroupItem(val key: Any?, val label: String, val selected: Boolean = false)

Data class used for PillGroup

PillGroupState

enum PillGroupState : Enum<PillGroupState>

State of the PillGroup component. It determines if the group is either PillGroupState.Expanded or PillGroupState.Collapsed

PillLeadingItem

sealed class PillLeadingItem

LeadingItem for Pill component

PillSize

enum PillSize : Enum<PillSize>

Sizes for Pill component

PriceModule

object PriceModule

PriceModuleSizeList

enum PriceModuleSizeList : Enum<PriceModuleSizeList>

Set of sizes for PriceModule component in the PriceModuleVariant.List variant.

PriceModuleSizeRegular

enum PriceModuleSizeRegular : Enum<PriceModuleSizeRegular>

Set of sizes for PriceModule component in the PriceModuleVariant.Regular variant.

PriceModuleVariant

sealed class PriceModuleVariant

PriceOfferType

sealed class PriceOfferType

Represents the Price offer type for the product.

PriceParams

data class PriceParams(val integerValue: String, val decimalValue: String? = null, val currencyLabel: String, val decimalSign: DecimalSign, val currencyPosition: CurrencyPosition = CurrencyPosition.Leading, val subscriptLabel: String? = null, val decimalVerticalAlignment: AffixVerticalAlignment = AffixVerticalAlignment.Top, val currencyVerticalAlignment: AffixVerticalAlignment = AffixVerticalAlignment.Top, val captionSuffix: String? = null, val captionPrefix: String? = null, val currencySpacing: CurrencySpacing = CurrencySpacing.None)

Price params used to match Price

PriceSize

enum PriceSize : Enum<PriceSize>

The price size is a simplified version of the Price scaling.

PriceSizeStyle

enum PriceSizeStyle : Enum<PriceSizeStyle>

The price display has two size variant called MixedSize and SingleSize. There are two options for the price size styling: SingleSize and MixedSize.

PriceVariant

sealed class PriceVariant

Pre-defined styles for the Button component. There are three styles available: Regular, Comparison and BTI. Each style has its own unique characteristics.

ProductIdentifierVariant

enum ProductIdentifierVariant : Enum<ProductIdentifierVariant>

Styles for ProductIdentifier

PromptAction

data class PromptAction(val label: String, val action: () -> Unit)

Data class used for Prompt primaryAction & secondaryAction

QuantityStepperActions

@Stable

class QuantityStepperActions(val onDecrease: (Int) -> Unit? = null, val onIncrease: (Int) -> Unit? = null, val onInputValueChange: (Int) -> Unit? = null)

The QuantityStepperActions class actions that will be triggered in response to users triggering an input action on the QuantityStepper component. This can be used together with the default onValueChange param.

QuantityStepperSize

enum QuantityStepperSize : Enum<QuantityStepperSize>

QuantityStepperSize defines the overall size of the Quantity Stepper component.

RadioButtonVariant

enum RadioButtonVariant : Enum<RadioButtonVariant>

Styles for RadioButton

RadioGroupItem

data class RadioGroupItem<T>(val key: T, val label: String, val enabled: Boolean = true, val caption: String? = null)

Data class used for RadioButtonGroup

RatingSize

enum RatingSize : Enum<RatingSize>

Rating size enum class.

SearchActionItem

data class SearchActionItem(@DrawableRes val iconResource: Int, val contentDescription: String, val onClick: () -> Unit)

Search component trailing action items which are rendered as icon buttons. Use a max of 2 action items.

SecondCurrencyPriceParams

data class SecondCurrencyPriceParams(val priceParams: PriceParams, val comparisonPriceParams: PriceParams? = null)

Second currency price for Dual currencies. This option is provide due some legal requirements in some markets.

SegmentedControlIconItemSize

enum SegmentedControlIconItemSize : Enum<SegmentedControlIconItemSize>

The size of the segmented control items using icons. There are two sizes available: Medium and Large. Medium is the default size.

SegmentedControlItem

sealed class SegmentedControlItem<T>

The items that can be displayed in a segmented control. There are two types of items: Text and Icon. You can either do all text or all icons in a segmented control, but not a mix of both.

SegmentedControlStyle

enum SegmentedControlStyle : Enum<SegmentedControlStyle>

The visual styling of the Segmented Control. Allow users to switch between two visualisation modes without changing content.

SegmentedControlTextItemSize

enum SegmentedControlTextItemSize : Enum<SegmentedControlTextItemSize>

The size of the segmented control items using text labels. There are three sizes available: Small, Medium, and Large. Medium is the default size.

SelectInteractionParams

data class SelectInteractionParams(val onClick: (Boolean) -> Unit, val onClickContentDescription: String?, val enabled: Boolean = true)

Select interaction params

SelectionEmphasis

enum SelectionEmphasis : Enum<SelectionEmphasis>

Style for Choice Two different selection styles allow fine grained control of visual hierarchy: Emphasised and Subtle.

SelectItemsParams

data class SelectItemsParams<T>(val items: List<T>, val itemContent: @Composable (T) -> Unit, val onItemSelected: (T) -> Unit, val onDismissRequest: () -> Unit, val itemContentPadding: PaddingValues = MenuDefaults.DropdownMenuItemContentPadding, val fluidMenu: Boolean = false, val selectedItem: T? = null)

Class that controls the aspects related with the Select items

SheetState

class ~~SheetState~~(initialValue: SheetValue, animationSpec: AnimationSpec<Float> = SwipeableDefaults.AnimationSpec, val confirmStateChange: (SheetValue) -> Boolean = { true }) : SwipeableState<SheetValue>

State of the SheetState composable.

SheetValue

enum ~~SheetValue~~ : Enum<SheetValue>

Possible values of SheetState.

ShopAllButtonParams

data class ShopAllButtonParams(val label: String, val visible: Boolean = true, val onClick: () -> Unit)

Params for Shop all button. Uses a ButtonVariant.ImageOverlay when rendered.

ShoppableImageBackgroundParams

data class ShoppableImageBackgroundParams(val painter: Painter, val contentDescription: String?, val aspectRatio: SkapaAspectRatio = SkapaAspectRatio.Ratio3by4, val onClick: () -> Unit)

Data class to be used for the background image used together with ShoppableImage.

ShoppableImageItem

data class ShoppableImageItem<T>(val key: T, @FloatRange(from = 0.0, to = 1.0) val xCoordinate: Float, @FloatRange(from = 0.0, to = 1.0) val yCoordinate: Float, val content: @Composable () -> Unit, val contentDescription: String? = null, val onClick: () -> Unit? = null)

Shoppable image item data class. This is is used together with the ShoppableImage component to display products or other information on top of an image.

SkapaAspectRatio

enum SkapaAspectRatio : Enum<SkapaAspectRatio>

Set of aspect ratios defined by Skapa.

SkapaIconsProductRange

enum SkapaIconsProductRange : Enum<SkapaIconsProductRange>

SkapaImage

object SkapaImage

This Object provides the necessary properties to build an Skapa Image component