Split Button

주 동작과 보조 메뉴 캐럿을 한 알약에 담은 버튼입니다.

@horon-ai/react 입력과 선택

Preview

Usage

tsx

import { MenuItem, MenuSeparator, SplitButton } from "@horon-ai/react";
import { Plus } from "@phosphor-icons/react";

export default function SplitButtonDemo() {
  return (
    <>
      <SplitButton
        icon={<Plus />}
        menu={
          <>
            <MenuItem>Add from template</MenuItem>
            <MenuItem>Import from file</MenuItem>
            <MenuSeparator />
            <MenuItem>Add manually</MenuItem>
          </>
        }
      >
        Add
      </SplitButton>
      <SplitButton disabled icon={<Plus />}>
        Disabled
      </SplitButton>
    </>
  );
}