import { Checkbox, RulerSvg } from "@defgov/ui";
import { InnerWrap } from "../common/InnerWrap";
import { OuterWrap } from "../common/OuterWrap";

export const CheckboxGallery = () => {
  return (
    <OuterWrap>
      <InnerWrap>
        <Checkbox size="xs" icon={<RulerSvg />}>
          Ruler
        </Checkbox>
        <Checkbox size="sm" icon={<RulerSvg />}>
          Ruler
        </Checkbox>
        <Checkbox
          size="md"
          icon={<RulerSvg />}
          hideIcon={true}
          iconPlaceholder={true}
        >
          Ruler
        </Checkbox>
      </InnerWrap>
    </OuterWrap>
  );
};