Button

import { Button } from "@ellie-ui/core";

export const Example = () => {
  return <Button>버튼</Button>
}

import { Button } from "@ellie-ui/core";

export const Example = () => {
  return (
    <div className="flex gap-3">
      <Button variant="primary">버튼</Button>
      <Button variant="secondary">버튼</Button>
      <Button variant="outlined">버튼</Button>
      <Button variant="contained">버튼</Button>
      <Button variant="primaryLow">버튼</Button>
      <Button variant="primaryOutlined">버튼</Button>
      <Button variant="primaryLowOutlined">버튼</Button>
      <Button variant="ghost">버튼</Button>
      <Button variant="error">버튼</Button>
    </div>
  )
}

import { Button } from "@ellie-ui/core";

export const Example = () => {
  return (
    <div className="flex items-center gap-3">
      <Button size="xsmall" variant="primary">버튼</Button>
      <Button size="small" variant="primary">버튼</Button>
      <Button size="medium" variant="primary">버튼</Button>
      <Button size="large" variant="primary">버튼</Button>
    </div>
  )
}

import { Button } from "@ellie-ui/core";

export const Example = () => {
  return <Button disabled>버튼</Button>
}

import { Button } from "@ellie-ui/core";
import { PlusIcon, ArrowRightIcon } from "lucide-react";

export const Example = () => {
  return (
    <div className="flex gap-3">
      <Button>
        <PlusIcon size={14} />
        추가하기
      </Button>
      <Button>
        이동
        <ArrowRightIcon size={14} />
      </Button>
    </div>
  )
}

import { Button } from "@ellie-ui/core";

export const Example = () => {
  return (
    <Button className="bg-gradient-to-r from-sky-500 to-purple-500" size="large">
      <SparklesIcon className='fill-white' size={16} />
      AI에게 물어보기
    </Button>
  )
}