const buttonGroup = [
  "horizontal",
  "vertical"
] as const

const color = [
  "default",
  "danger",
  "success",
  "warning",
  "primary",
  "secondary",
  "collab",
  "ai"
] as const

const depth = [
  "light",
  "normal",
  "dark"
] as const

const size = [
  "xs",
  "sm",
  "md",
  "lg",
  "xl"
] as const

export default {
  "slots": {
    "base": "select-none font-b24-secondary font-normal inline-flex items-center transition-all duration-200 ease-linear px-2 leading-normal rounded-md",
    "wrapper": "inline-flex items-center",
    "label": "max-w-full whitespace-nowrap text-ellipsis decoration-from-font",
    "leadingIcon": "shrink-0",
    "leadingAvatar": "shrink-0",
    "leadingAvatarSize": "",
    "trailingIcon": "shrink-0 cursor-pointer hover:rounded-full hover:bg-current/20 dark:hover:bg-current/35"
  },
  "variants": {
    "buttonGroup": {
      "horizontal": "focus-visible:outline-none ring ring-inset ring-0 focus-visible:ring-2 group-[.is-button-group]/items:not-only:first:rounded-e-none group-[.is-button-group]/items:not-only:last:rounded-s-none group-[.is-button-group]/items:not-last:not-first:rounded-none group-[.is-button-group]/items:not-only:first:border-e-0 group-[.is-button-group]/items:not-only:not-first:border-s-0",
      "vertical": "focus-visible:outline-none ring ring-inset ring-0 focus-visible:ring-2 not-only:first:rounded-b-none not-only:last:rounded-t-none not-last:not-first:rounded-none"
    },
    "noSplit": {
      "false": "group-[.is-button-group]/items:not-only:not-first:after:content-[''] group-[.is-button-group]/items:not-only:not-first:after:absolute group-[.is-button-group]/items:not-only:not-first:after:top-[7px] group-[.is-button-group]/items:not-only:not-first:after:bottom-[6px] group-[.is-button-group]/items:not-only:not-first:after:left-0 group-[.is-button-group]/items:not-only:not-first:after:w-px group-[.is-button-group]/items:not-only:not-first:after:bg-current/30"
    },
    "useLink": {
      "true": {
        "base": "cursor-pointer",
        "wrapper": "group",
        "label": "group-hover:underline group-hover:decoration-dashed"
      }
    },
    "useClose": {
      "true": "pe-2xs"
    },
    "useFill": {
      "true": "",
      "false": "bg-transparent"
    },
    "leading": {
      "true": "ps-2xs"
    },
    "color": {
      "default": "",
      "danger": "",
      "success": "",
      "warning": "",
      "primary": "",
      "secondary": "",
      "collab": "",
      "ai": ""
    },
    "depth": {
      "light": "font-normal",
      "normal": "font-bold",
      "dark": "font-bold"
    },
    "size": {
      "xs": {
        "base": "text-5xs gap-0.5",
        "wrapper": "h-[14px] gap-0.5",
        "label": "underline-offset-1",
        "leadingIcon": "size-sm",
        "leadingAvatarSize": "3xs",
        "trailingIcon": "size-sm "
      },
      "sm": {
        "base": "text-4xs gap-1",
        "wrapper": "h-[16px] gap-1",
        "label": "underline-offset-1",
        "leadingIcon": "size-sm2",
        "leadingAvatarSize": "3xs",
        "trailingIcon": "size-sm2"
      },
      "md": {
        "base": "text-3xs gap-1",
        "wrapper": "h-[17px] gap-1",
        "label": "underline-offset-1",
        "leadingIcon": "size-[15px]",
        "leadingAvatarSize": "3xs",
        "trailingIcon": "size-[15px]"
      },
      "lg": {
        "base": "text-xs gap-1 rounded-lg",
        "wrapper": "h-[24px] gap-1",
        "leadingIcon": "size-[22px]",
        "leadingAvatarSize": "2xs",
        "trailingIcon": "size-[22px]"
      },
      "xl": {
        "base": "text-md gap-1 rounded-xl",
        "wrapper": "h-[31px] gap-1",
        "leadingIcon": "size-[26px]",
        "leadingAvatarSize": "xs",
        "trailingIcon": "size-[26px]"
      }
    }
  },
  "compoundVariants": [
    {
      "color": "default" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-base-900 bg-base-100 ring-base-100 dark:text-base-900 dark:bg-base-150 dark:ring-base-150"
    },
    {
      "color": "default" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-base-800 bg-base-150 ring-base-300 dark:text-base-950 dark:bg-base-200 dark:ring-base-800"
    },
    {
      "color": "default" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-base-500 ring-base-500 dark:text-base-50 dark:bg-base-600 dark:ring-base-600"
    },
    {
      "color": "danger" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-red-800 bg-red-500/17 ring-red-500/17 dark:text-red-900 dark:bg-red-300 dark:ring-red-300"
    },
    {
      "color": "danger" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-red-800 bg-red-250 ring-red-250 dark:text-red-800 dark:bg-red-350 dark:ring-red-350"
    },
    {
      "color": "danger" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-red-500 ring-red-500 dark:text-red-250 dark:bg-red-600 dark:ring-red-600"
    },
    {
      "color": "success" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-green-800 bg-green-500/17 ring-green-500/17 dark:text-green-900 dark:bg-green-300 dark:ring-green-300"
    },
    {
      "color": "success" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-green-800 bg-green-300 ring-green-300 dark:text-green-800 dark:bg-green-330 dark:ring-green-330"
    },
    {
      "color": "success" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-green-500 ring-green-500 dark:text-green-250 dark:bg-green-600 dark:ring-green-600"
    },
    {
      "color": "warning" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-orange-800 bg-orange-250 ring-orange-300 dark:text-orange-900 dark:bg-orange-300 dark:ring-orange-300"
    },
    {
      "color": "warning" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-orange-800 bg-orange-300 ring-orange-300 dark:text-orange-800 dark:bg-orange-400 dark:ring-orange-400"
    },
    {
      "color": "warning" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-orange-500 ring-orange-500 dark:text-orange-250 dark:bg-orange-600 dark:ring-orange-600"
    },
    {
      "color": "primary" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-blue-800 bg-blue-500/17 ring-blue-500/17 dark:text-blue-900 dark:bg-blue-300 dark:ring-blue-300"
    },
    {
      "color": "primary" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-blue-700 bg-blue-250 ring-blue-250 dark:text-blue-700 dark:bg-blue-300 dark:ring-blue-300"
    },
    {
      "color": "primary" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-blue-500 ring-blue-500 dark:text-blue-250 dark:bg-blue-600 dark:ring-blue-600"
    },
    {
      "color": "secondary" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-base-master bg-blue-320 ring-blue-320 dark:text-base-master dark:bg-blue-400 dark:ring-blue-400"
    },
    {
      "color": "secondary" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-white bg-cyan-350 ring-cyan-350 dark:text-cyan-100 dark:bg-cyan-400 dark:ring-cyan-400"
    },
    {
      "color": "secondary" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-cyan-500 ring-cyan-500 dark:text-cyan-250 dark:bg-cyan-600 dark:ring-cyan-600"
    },
    {
      "color": "collab" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-collab-800 bg-collab-500/17 ring-collab-500/17 dark:text-collab-900 dark:bg-collab-300 dark:ring-collab-300"
    },
    {
      "color": "collab" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-collab-800 bg-collab-300 ring-collab-300 dark:text-collab-800 dark:bg-collab-300 dark:ring-collab-300"
    },
    {
      "color": "collab" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-collab-500 ring-collab-500 dark:text-collab-250 dark:bg-collab-600 dark:ring-collab-600"
    },
    {
      "color": "ai" as typeof color[number],
      "depth": "light" as typeof depth[number],
      "class": "ring ring-inset text-ai-500 bg-white ring-ai-10 dark:text-ai-500 dark:bg-ai-50 dark:ring-ai-50"
    },
    {
      "color": "ai" as typeof color[number],
      "depth": "normal" as typeof depth[number],
      "class": "ring ring-inset text-ai-500 bg-ai-150 ring-ai-150 dark:text-ai-600 dark:bg-ai-200 dark:ring-ai-200"
    },
    {
      "color": "ai" as typeof color[number],
      "depth": "dark" as typeof depth[number],
      "class": "ring ring-inset text-white bg-ai-330 ring-ai-330 dark:text-ai-100 dark:bg-ai-400 dark:ring-ai-400"
    },
    {
      "useLink": true,
      "useFill": false,
      "class": ""
    },
    {
      "useFill": false,
      "class": "text-base-800 dark:text-base-250 bg-transparent dark:bg-transparent"
    },
    {
      "useClose": true,
      "class": ""
    },
    {
      "buttonGroup": [
        "horizontal" as typeof buttonGroup[number],
        "vertical" as typeof buttonGroup[number]
      ],
      "class": "rounded-2xs"
    }
  ],
  "defaultVariants": {
    "color": "default" as typeof color[number],
    "depth": "normal" as typeof depth[number],
    "size": "md" as typeof size[number],
    "useFill": false
  }
}