@nullpixel/ui/.nuxt/ui/breadcrumb.ts

A UI Library for Modern Web Apps, powered by Vue & Tailwind CSS.

export default {
  "slots": {
    "root": "relative min-w-0",
    "list": "flex items-center gap-1.5",
    "item": "flex min-w-0",
    "link": "group relative flex items-center gap-1.5 text-sm min-w-0 focus-visible:outline-(--ui-primary)",
    "linkLeadingIcon": "shrink-0 size-5",
    "linkLeadingAvatar": "shrink-0",
    "linkLeadingAvatarSize": "2xs",
    "linkLabel": "truncate",
    "separator": "flex",
    "separatorIcon": "shrink-0 size-5 text-(--ui-text-muted)"
  },
  "variants": {
    "active": {
      "true": {
        "link": "text-(--ui-primary) font-semibold"
      },
      "false": {
        "link": "text-(--ui-text-muted) font-medium"
      }
    },
    "disabled": {
      "true": {
        "link": "cursor-not-allowed opacity-75"
      }
    },
    "to": {
      "true": ""
    }
  },
  "compoundVariants": [
    {
      "disabled": false,
      "active": false,
      "to": true,
      "class": {
        "link": [
          "hover:text-(--ui-text)",
          "transition-colors"
        ]
      }
    }
  ]
}