Icon Button

An icon-only action is Button from @prepared911/ui/button with icon and label and no children. The label is visually hidden and is the accessible name. tooltip is optional hover copy. There is no separate icon-button component, no pill prop, and no ButtonType. Use for important icon actions that change significant product state, allowing one critical button per page. Use for the most important icon action on a page or within a specific section. Use for standard icon actions throughout the interface. Pass the pill prop to opt in to a fully rounded (pill / circular) border radius. Intended for floating toolbars and FAB-style controls such as the staff panel toggle. pill works with any ButtonType; combine with cornerStyle={ComponentCornerStyle.Sharp} to override back to square corners when a brand or layout requires it. Use for icon actions of lesser importance when differentiating from primary actions. Use for icon buttons that function as navigation links or subtle actions. Semantic icon buttons give users visual cues about their purpose through color. Use to indicate constructive icon actions or confirmations of positive states. Use to indicate destructive icon actions such as deleting or removing content. Button shares the same three sizes as Button for consistent density. Use for unavailable actions, ensuring the tooltip explains why the action is unavailable. Use appropriate icons for standard actions to maintain consistency. Use to group related icon actions together for logical organization. Use in table rows to provide contextual actions for each item. Use to show different icons or states based on application logic.