Icon Selector
BetaIcon Selector is a field type that allows users to choose an icon from a predefined list
install | yarn add @clayui/core |
---|
version |  |
---|
use | import {IconSelector} from '@clayui/core'; |
---|
Introduction
Icon Selector is a field type that allows users to choose an icon from a predefined list. When clicking the button, a dropdown menu appears displaying available icons, enabling selection with a single click. The chosen icon is then visually represented within the field.
Example
import {IconSelector} from '@clayui/core';
import React from 'react';
import '@clayui/css/lib/css/atlas.css';
export default function App() {
return (
<div className="p-4">
<IconSelector />
</div>
);
}
API Reference
IconSelector
({ active: externalActive, defaultActive, direction, messages, onActiveChange, spritemap, }: Props) => JSX.Element
Parameters
active
boolean | undefined
Flag to indicate if menu is showing or not (controlled).
defaultActive
boolean | undefined
The initial value of the active state (uncontrolled).
direction
"top" | "bottom" | undefined
Direction the menu will render relative to the trigger.
messages
{ changeIconButton: string; clearInput?: string; notFound: string; placeholder?: string; removeIcon: string; selectIcon: string; selectIconButton?: string; } | undefined
Messages for icon selector.
onActiveChange
InternalDispatch<boolean> | undefined
Callback for when the active state changes (controlled).
Returns
ElementEdit this page on GitHubContributors
Matuzalém Teles, Ilza Medeiros
Last edited March 12, 2025 at 5:21:21 PM