Icon Button

import { IconButton } from "@ellie-ui/core";
import { SearchIcon } from "lucide-react";

export const Example = () => {
  return (
    <IconButton aria-label="검색">
      <SearchIcon size={16} />
    </IconButton>
  )
}

import { IconButton } from "@ellie-ui/core";
import { SearchIcon } from "lucide-react";

export const Example = () => {
  return (
    <div className='flex gap-3'>
      <IconButton variant="primary" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="secondary" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="outlined" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="contained" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="primaryLow" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="primaryOutlined" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="primaryLowOutlined" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="ghost" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton variant="error" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
    </div>
  )
}

import { IconButton } from "@ellie-ui/core";
import { SearchIcon } from "lucide-react";

export const Example = () => {
  return (
    <div className='flex items-center gap-3'>
      <IconButton size="small" aria-label="검색">
        <SearchIcon size={14} />
      </IconButton>
      <IconButton size="medium" aria-label="검색">
        <SearchIcon size={16} />
      </IconButton>
      <IconButton size="large" aria-label="검색">
        <SearchIcon size={18} />
      </IconButton>
    </div>
  )
}

import { IconButton } from "@ellie-ui/core";
import { SearchIcon } from "lucide-react";

export const Example = () => {
  return (
    <IconButton disabled aria-label="검색">
      <SearchIcon size={16} />
    </IconButton>
  )
}