{
  "name": "dialog",
  "title": "Dialog",
  "description": "Kura Dialog component source.",
  "type": "ui",
  "add": "when-added",
  "files": [
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$lib/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-1 focus-visible:ring-ring/50',\n    className\n  )}\n  {type}\n  {...restProps}\n/>\n",
      "path": "dialog/dialog-close.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "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 '$lib/utils.js';\n  import type { ComponentProps } from 'svelte';\n  import { Button } from '$lib/components/ui/button/index.js';\n  import XIcon from 'phosphor-svelte/lib/XIcon';\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-4 bg-popover p-4 text-xs/relaxed text-popover-foreground outline-none duration-100 sm:max-w-sm rounded-overlay hairline-frame',\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 variant=\"ghost\" class=\"absolute top-2 right-2\" size=\"icon-sm\" {...props}>\n            <XIcon />\n            <span class=\"sr-only\">Close</span>\n          </Button>\n        {/snippet}\n      </DialogPrimitive.Close>\n    {/if}\n  </DialogPrimitive.Content>\n</DialogPortal>\n",
      "path": "dialog/dialog-content.svelte",
      "_imports_": [
        {
          "import": "./dialog-portal.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-portal.svelte"
          },
          "meta": {}
        },
        {
          "import": "./index.js",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/index.ts"
          },
          "meta": {}
        },
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        },
        {
          "import": "$lib/components/ui/button/index.js",
          "item": "button",
          "file": {
            "type": "ui",
            "path": "button/index.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$lib/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    'text-muted-foreground text-xs/relaxed *:[a]:text-link *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground',\n    className\n  )}\n  {...restProps}\n/>\n",
      "path": "dialog/dialog-description.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { cn, type WithElementRef } from '$lib/utils.js';\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { Button } from '$lib/components/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('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\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",
      "path": "dialog/dialog-footer.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        },
        {
          "import": "$lib/components/ui/button/index.js",
          "item": "button",
          "file": {
            "type": "ui",
            "path": "button/index.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import type { HTMLAttributes } from 'svelte/elements';\n  import { cn, type WithElementRef } from '$lib/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-1 text-left', className)}\n  {...restProps}\n>\n  {@render children?.()}\n</div>\n",
      "path": "dialog/dialog-header.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$lib/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-black/10 duration-100 supports-backdrop-filter:backdrop-blur-xs',\n    className\n  )}\n  {...restProps}\n/>\n",
      "path": "dialog/dialog-overlay.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "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",
      "path": "dialog/dialog-portal.svelte",
      "_imports_": [],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$lib/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('text-sm font-medium text-popover-foreground', className)}\n  {...restProps}\n/>\n",
      "path": "dialog/dialog-title.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "content": "<script lang=\"ts\">\n  import { Dialog as DialogPrimitive } from 'bits-ui';\n  import { cn } from '$lib/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-1 focus-visible:ring-ring/50',\n    className\n  )}\n  {type}\n  {...restProps}\n/>\n",
      "path": "dialog/dialog-trigger.svelte",
      "_imports_": [
        {
          "import": "$lib/utils.js",
          "item": "utils",
          "file": {
            "type": "lib",
            "path": "utils.ts"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "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",
      "path": "dialog/dialog.svelte",
      "_imports_": [],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    },
    {
      "type": "ui",
      "role": "file",
      "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",
      "path": "dialog/index.ts",
      "_imports_": [
        {
          "import": "./dialog.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-portal.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-portal.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-title.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-title.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-footer.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-footer.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-header.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-header.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-overlay.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-overlay.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-content.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-content.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-description.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-description.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-trigger.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-trigger.svelte"
          },
          "meta": {}
        },
        {
          "import": "./dialog-close.svelte",
          "item": "dialog",
          "file": {
            "type": "ui",
            "path": "dialog/dialog-close.svelte"
          },
          "meta": {}
        }
      ],
      "registryDependencies": [],
      "dependencies": [],
      "devDependencies": []
    }
  ],
  "registryDependencies": [
    "styles",
    "utils",
    "button"
  ],
  "dependencies": [
    {
      "ecosystem": "js",
      "name": "bits-ui",
      "version": "^2.18.1"
    },
    {
      "ecosystem": "js",
      "name": "phosphor-svelte",
      "version": "^3.1.0"
    }
  ],
  "devDependencies": []
}