Function iconBox

  • iconBox(props): Element

  • Creates an icon box component for displaying icons within a colored container box.

    Parameters

    • props: UiIconBoxProps

      Configuration object

    Returns Element

    A JSX element representing the icon box component

    Example

    Basic usage with static values

    iconBox({
      icon: 'user',
      size: 32,
      boxColor: '#e3f2fd',
      iconColor: '#1976d2'
    });

    Example

    Usage with dynamic values from central state

    iconBox({
      icon: (state) => state.user.isOnline ? 'user-check' : 'user-x',
      size: 40,
      boxColor: (state) => state.user.isOnline ? '#e8f5e8' : '#ffeaea',
      iconColor: (state) => state.user.isOnline ? '#4caf50' : '#f44336'
    });

    Example

    Usage with large size and margins

    iconBox({
      icon: 'settings',
      size: 48,
      boxColor: '#f5f5f5',
      margin: [16, 8],
      className: 'custom-icon-box'
    });

Settings