{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "glass-dock",
  "title": "Glass Dock",
  "description": "A row of app icons on a glass shelf that name themselves on hover.",
  "dependencies": [
    "@radix-ui/react-slot",
    "clsx"
  ],
  "registryDependencies": [
    "@glassyui/glass-surface"
  ],
  "files": [
    {
      "path": "registry/glassyui/glass-dock.tsx",
      "content": "'use client';\n\nimport { Slot, Slottable } from '@radix-ui/react-slot';\nimport clsx from 'clsx';\nimport { forwardRef } from 'react';\nimport type { ButtonHTMLAttributes, HTMLAttributes } from 'react';\nimport { GlassSurface } from './glass-surface';\n\nexport type GlassDockProps = HTMLAttributes<HTMLDivElement>;\n\n/**\n * A row of app icons on a glass shelf. Hovering or focusing an icon shows its label; icons\n * keep their size wherever the pointer is.\n */\nexport const GlassDock = forwardRef<HTMLDivElement, GlassDockProps>(\n  ({ children, className, ...props }, forwardedRef) => (\n    <div ref={forwardedRef} className={clsx('lg-dock', className)} {...props}>\n      <GlassSurface aria-hidden className=\"lg-dock-shelf\" lens={false} preset=\"standard\" />\n      {children}\n    </div>\n  )\n);\n\nGlassDock.displayName = 'GlassDock';\n\nexport type GlassDockItemProps = ButtonHTMLAttributes<HTMLButtonElement> & {\n  /** Shows the running indicator under the icon. */\n  active?: boolean;\n  /** Renders the single child element, such as a link, as the item. */\n  asChild?: boolean;\n  /** Accessible name and hover label. */\n  label: string;\n};\n\nexport const GlassDockItem = forwardRef<HTMLButtonElement, GlassDockItemProps>(\n  ({ active = false, asChild = false, children, className, label, type, ...props }, forwardedRef) => {\n    const Component = asChild ? Slot : 'button';\n\n    return (\n      <Component\n        ref={forwardedRef}\n        aria-label={label}\n        className={clsx('lg-dock-item', className)}\n        data-active={active}\n        type={asChild ? type : (type ?? 'button')}\n        {...props}\n      >\n        <Slottable>{children}</Slottable>\n        <span aria-hidden className=\"lg-dock-label\">\n          {label}\n        </span>\n        <span aria-hidden className=\"lg-dock-dot\" />\n      </Component>\n    );\n  }\n);\n\nGlassDockItem.displayName = 'GlassDockItem';\n\nexport const GlassDockSeparator = forwardRef<HTMLDivElement, HTMLAttributes<HTMLDivElement>>(\n  ({ className, ...props }, forwardedRef) => (\n    <div\n      ref={forwardedRef}\n      aria-orientation=\"vertical\"\n      className={clsx('lg-dock-separator', className)}\n      role=\"separator\"\n      {...props}\n    />\n  )\n);\n\nGlassDockSeparator.displayName = 'GlassDockSeparator';\n",
      "type": "registry:ui",
      "target": "components/glassyui/glass-dock.tsx"
    }
  ],
  "meta": {
    "sourceModules": [
      "dock"
    ]
  },
  "type": "registry:ui"
}