{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "breadcrumb",
	"title": "Breadcrumb",
	"type": "registry:ui",
	"description": "Kura Breadcrumb component source.",
	"devDependencies": [
		"phosphor-svelte@^3.1.0"
	],
	"registryDependencies": [
		"utils"
	],
	"files": [
		{
			"content": "<script lang=\"ts\">\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { cn, type WithElementRef, type WithoutChildren } from '$UTILS$.js';\n  import DotsThreeIcon from 'phosphor-svelte/lib/DotsThree';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: WithoutChildren<WithElementRef<HTMLAttributes<HTMLSpanElement>>> = $props();\n</script>\n\n<span\n  bind:this={ref}\n  data-slot=\"breadcrumb-ellipsis\"\n  role=\"presentation\"\n  aria-hidden=\"true\"\n  class={cn('flex size-5 items-center justify-center text-zinc-500 [&>svg]:size-4', className)}\n  {...restProps}\n>\n  <DotsThreeIcon />\n  <span class=\"sr-only\">More</span>\n</span>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-ellipsis.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import type { HTMLLiAttributes } from 'svelte/elements';\n  import { cn, type WithElementRef } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLLiAttributes> = $props();\n</script>\n\n<li\n  bind:this={ref}\n  data-slot=\"breadcrumb-item\"\n  class={cn('inline-flex items-center gap-1.5', className)}\n  {...restProps}\n>\n  {@render children?.()}\n</li>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-item.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import type { HTMLAnchorAttributes } from 'svelte/elements';\n  import type { Snippet } from 'svelte';\n  import { cn, type WithElementRef } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    href = undefined,\n    child,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLAnchorAttributes> & {\n    child?: Snippet<[{ props: HTMLAnchorAttributes }]>;\n  } = $props();\n\n  const attrs = $derived({\n    'data-slot': 'breadcrumb-link',\n    class: cn('text-zinc-500 transition-colors hover:text-[#d0e891]', className),\n    href,\n    ...restProps\n  });\n</script>\n\n{#if child}\n  {@render child({ props: attrs })}\n{:else}\n  <a bind:this={ref} {...attrs}>\n    {@render children?.()}\n  </a>\n{/if}\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-link.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import type { HTMLOlAttributes } from 'svelte/elements';\n  import { cn, type WithElementRef } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLOlAttributes> = $props();\n</script>\n\n<ol\n  bind:this={ref}\n  data-slot=\"breadcrumb-list\"\n  class={cn(\n    'flex flex-wrap items-center gap-1.5 text-xs text-zinc-500 uppercase wrap-break-word sm:gap-2.5',\n    className\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n</ol>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-list.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { cn, type WithElementRef } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLAttributes<HTMLSpanElement>> = $props();\n</script>\n\n<span\n  bind:this={ref}\n  data-slot=\"breadcrumb-page\"\n  role=\"link\"\n  aria-disabled=\"true\"\n  aria-current=\"page\"\n  class={cn('font-semibold text-zinc-100', className)}\n  {...restProps}\n>\n  {@render children?.()}\n</span>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-page.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { cn, type WithElementRef } from '$UTILS$.js';\n  import type { HTMLLiAttributes } from 'svelte/elements';\n  import CaretRightIcon from 'phosphor-svelte/lib/CaretRight';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLLiAttributes> = $props();\n</script>\n\n<li\n  bind:this={ref}\n  data-slot=\"breadcrumb-separator\"\n  role=\"presentation\"\n  aria-hidden=\"true\"\n  class={cn('text-zinc-700 [&>svg]:size-3.5', className)}\n  {...restProps}\n>\n  {#if children}\n    {@render children?.()}\n  {:else}\n    <CaretRightIcon />\n  {/if}\n</li>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb-separator.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import type { WithElementRef } from '$UTILS$.js';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLAttributes<HTMLElement>> = $props();\n</script>\n\n<nav\n  bind:this={ref}\n  data-slot=\"breadcrumb\"\n  aria-label=\"breadcrumb\"\n  class={cn('cn-breadcrumb font-mono text-[0.7rem] tracking-[0.14em]', className)}\n  {...restProps}\n>\n  {@render children?.()}\n</nav>\n",
			"type": "registry:file",
			"target": "breadcrumb/breadcrumb.svelte"
		},
		{
			"content": "import Root from './breadcrumb.svelte';\nimport Ellipsis from './breadcrumb-ellipsis.svelte';\nimport Item from './breadcrumb-item.svelte';\nimport Separator from './breadcrumb-separator.svelte';\nimport Link from './breadcrumb-link.svelte';\nimport List from './breadcrumb-list.svelte';\nimport Page from './breadcrumb-page.svelte';\n\nexport {\n  Root,\n  Ellipsis,\n  Item,\n  Separator,\n  Link,\n  List,\n  Page,\n  //\n  Root as Breadcrumb,\n  Ellipsis as BreadcrumbEllipsis,\n  Item as BreadcrumbItem,\n  Separator as BreadcrumbSeparator,\n  Link as BreadcrumbLink,\n  List as BreadcrumbList,\n  Page as BreadcrumbPage\n};\n",
			"type": "registry:file",
			"target": "breadcrumb/index.ts"
		}
	]
}