Badges
Text Chip

Text Chip

Text chip to show short text and single emoji

🚀LK🎉

Anatomy

import { TextChip } from "@lualtek/react-components";
 
export default () => {
  return <TextChip text="🚀" />;
};

API Reference

export type TextChipProps = {
  /**
   * Set the dimension of the component.
   * @defaultValue "regular"
   */
  dimension?: 'small' | 'regular' | 'big';
  /**
   * Set a color from one of the provided values.
   * @defaultValue "primary"
   */
  color?: TokensTypes['colors'];
  /**
   * Set the text content. Max 2 characters or 1 emoji.
   */
  text?: string;
  /**
   * Match the emoji color with the chip color.
   * @defaultValue true
   */
  tinted?: boolean;
  /**
   * The emoji unified code to display.
   */
  emoji?: EmojiClickData['unified'];
};