{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "dialog",
	"title": "Dialog",
	"type": "registry:ui",
	"description": "Kura Dialog component source.",
	"devDependencies": [
		"bits-ui@^2.18.1",
		"@internationalized/date@^3.12.2",
		"phosphor-svelte@^3.1.0"
	],
	"registryDependencies": [
		"button",
		"utils"
	],
	"files": [
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    type = 'button',\n    class: className,\n    ...restProps\n  }: DialogPrimitive.CloseProps = $props();\n</script>\n\n<DialogPrimitive.Close\n  bind:ref\n  data-slot=\"dialog-close\"\n  class={cn(\n    'outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/30',\n    className\n  )}\n  {type}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "dialog/dialog-close.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import DialogPortal from './dialog-portal.svelte';\n  import type { Snippet } from 'svelte';\n  import * as Dialog from './index.js';\n  import { cn, type WithoutChildrenOrChild } from '$UTILS$.js';\n  import type { ComponentProps } from 'svelte';\n  import { Button } from '$UI$/button/index.js';\n  import XIcon from 'phosphor-svelte/lib/X';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    portalProps,\n    children,\n    showCloseButton = true,\n    ...restProps\n  }: WithoutChildrenOrChild<DialogPrimitive.ContentProps> & {\n    portalProps?: WithoutChildrenOrChild<ComponentProps<typeof DialogPortal>>;\n    children: Snippet;\n    showCloseButton?: boolean;\n  } = $props();\n</script>\n\n<DialogPortal {...portalProps}>\n  <Dialog.Overlay />\n  <DialogPrimitive.Content\n    bind:ref\n    data-slot=\"dialog-content\"\n    class={cn(\n      'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 fixed top-1/2 left-1/2 z-50 grid w-full max-w-[calc(100%-2rem)] -translate-x-1/2 -translate-y-1/2 gap-6 border border-[#222225] bg-[#09090b] p-6 text-sm text-zinc-50 shadow-none outline-none duration-100 sm:max-w-md',\n      className\n    )}\n    {...restProps}\n  >\n    {@render children?.()}\n    {#if showCloseButton}\n      <DialogPrimitive.Close data-slot=\"dialog-close\">\n        {#snippet child({ props })}\n          <Button\n            variant=\"ghost\"\n            class=\"absolute top-5 right-5 rounded-full border border-[#27272a] bg-[#18181b] text-zinc-300 hover:bg-zinc-50 hover:text-zinc-950\"\n            size=\"icon-sm\"\n            {...props}\n          >\n            <XIcon />\n            <span class=\"sr-only\">Close</span>\n          </Button>\n        {/snippet}\n      </DialogPrimitive.Close>\n    {/if}\n  </DialogPrimitive.Content>\n</DialogPortal>\n",
			"type": "registry:file",
			"target": "dialog/dialog-content.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: DialogPrimitive.DescriptionProps = $props();\n</script>\n\n<DialogPrimitive.Description\n  bind:ref\n  data-slot=\"dialog-description\"\n  class={cn(\n    'mt-0.5 text-sm leading-relaxed text-zinc-400 *:[a]:text-[#d0e891] *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-zinc-50',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "dialog/dialog-description.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { cn, type WithElementRef } from '$UTILS$.js';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { Button } from '$UI$/button/index.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    showCloseButton = false,\n    ...restProps\n  }: WithElementRef<HTMLAttributes<HTMLDivElement>> & {\n    showCloseButton?: boolean;\n  } = $props();\n</script>\n\n<div\n  bind:this={ref}\n  data-slot=\"dialog-footer\"\n  class={cn(\n    'flex flex-col-reverse gap-2 border-t border-[#222225] pt-4 sm:flex-row sm:justify-end',\n    className\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n  {#if showCloseButton}\n    <DialogPrimitive.Close>\n      {#snippet child({ props })}\n        <Button variant=\"outline\" {...props}>Close</Button>\n      {/snippet}\n    </DialogPrimitive.Close>\n  {/if}\n</div>\n",
			"type": "registry:file",
			"target": "dialog/dialog-footer.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<HTMLDivElement>> = $props();\n</script>\n\n<div\n  bind:this={ref}\n  data-slot=\"dialog-header\"\n  class={cn('flex flex-col gap-2 border-b border-[#222225] pb-4', className)}\n  {...restProps}\n>\n  {@render children?.()}\n</div>\n",
			"type": "registry:file",
			"target": "dialog/dialog-header.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: DialogPrimitive.OverlayProps = $props();\n</script>\n\n<DialogPrimitive.Overlay\n  bind:ref\n  data-slot=\"dialog-overlay\"\n  class={cn(\n    'data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 fixed inset-0 isolate z-50 bg-background/80 duration-100 supports-backdrop-filter:backdrop-blur-[2px]',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "dialog/dialog-overlay.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n\n  let { ...restProps }: DialogPrimitive.PortalProps = $props();\n</script>\n\n<DialogPrimitive.Portal {...restProps} />\n",
			"type": "registry:file",
			"target": "dialog/dialog-portal.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: DialogPrimitive.TitleProps = $props();\n</script>\n\n<DialogPrimitive.Title\n  bind:ref\n  data-slot=\"dialog-title\"\n  class={cn(\n    'font-mono text-sm leading-none font-semibold uppercase tracking-[0.08em] text-zinc-50',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "dialog/dialog-title.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    type = 'button',\n    class: className,\n    ...restProps\n  }: DialogPrimitive.TriggerProps = $props();\n</script>\n\n<DialogPrimitive.Trigger\n  bind:ref\n  data-slot=\"dialog-trigger\"\n  class={cn(\n    'outline-none transition-colors focus-visible:ring-2 focus-visible:ring-ring/30',\n    className\n  )}\n  {type}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "dialog/dialog-trigger.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n\n  let { open = $bindable(false), ...restProps }: DialogPrimitive.RootProps = $props();\n</script>\n\n<DialogPrimitive.Root bind:open {...restProps} />\n",
			"type": "registry:file",
			"target": "dialog/dialog.svelte"
		},
		{
			"content": "import Root from './dialog.svelte';\nimport Portal from './dialog-portal.svelte';\nimport Title from './dialog-title.svelte';\nimport Footer from './dialog-footer.svelte';\nimport Header from './dialog-header.svelte';\nimport Overlay from './dialog-overlay.svelte';\nimport Content from './dialog-content.svelte';\nimport Description from './dialog-description.svelte';\nimport Trigger from './dialog-trigger.svelte';\nimport Close from './dialog-close.svelte';\n\nexport {\n  Root,\n  Title,\n  Portal,\n  Footer,\n  Header,\n  Trigger,\n  Overlay,\n  Content,\n  Description,\n  Close,\n  //\n  Root as Dialog,\n  Title as DialogTitle,\n  Portal as DialogPortal,\n  Footer as DialogFooter,\n  Header as DialogHeader,\n  Trigger as DialogTrigger,\n  Overlay as DialogOverlay,\n  Content as DialogContent,\n  Description as DialogDescription,\n  Close as DialogClose\n};\n",
			"type": "registry:file",
			"target": "dialog/index.ts"
		}
	]
}