MultinaireIconButton

Icon-only button for compact actions with theme-aware styling.

Basic Usage

import { MultinaireIconButton } from '@multinaire/multinaire-design';

<MultinaireIconButton icon="Settings" onPress={() => {}} />

Props

Prop	Type	Default	Description
icon	MultinaireIcons	-	Icon name from the icon set
type	'primary' | 'surface' | 'destructive'	'surface'	Button style variant
margin	SpacingProps	-	Margin spacing
isLoading	boolean	false	Show loading state
onPress	() => void	-	Press handler

Examples

Button Types

<MultinaireIconButton type="primary" icon="Add" onPress={() => {}} />
<MultinaireIconButton type="surface" icon="Edit" onPress={() => {}} />
<MultinaireIconButton type="destructive" icon="Delete" onPress={() => {}} />

In a Header

<MultinaireContainer horizontal justifyContent="space-between">
  <MultinaireIconButton icon="Back" onPress={() => navigation.goBack()} />
  <MultinaireIconButton icon="More" onPress={() => showMenu()} />
</MultinaireContainer>

Loading State

<MultinaireIconButton icon="Save" isLoading onPress={() => {}} />

With Margin

<MultinaireIconButton
  icon="Share"
  margin={{ left: 8 }}
  onPress={() => share()}
/>