{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "@doublecheap/open-ui",
  "homepage": "https://opensource-ui.vercel.app/",
  "items": [
    {
      "name": "ascii-art",
      "type": "registry:ui",
      "title": "Ascii Art",
      "description": "Renders an image as ASCII art with configurable resolution, charset, and colors. Supports fade, typewriter, and matrix animations. | 画像をASCIIアートで描画。解像度・文字セット・色を設定可能。",
      "dependencies": ["motion"],
      "files": [
        { "path": "components/media/ascii-art.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "webcam",
      "type": "registry:ui",
      "title": "Webcam",
      "description": "A browser webcam streaming component with error handling and ref forwarding. | ブラウザのウェブカメラストリーミング用コンポーネント。エラー処理とref転送機能付き。",
      "files": [
        { "path": "components/media/webcam.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "pixelated-canvas",
      "type": "registry:ui",
      "title": "Pixelated Canvas",
      "description": "Renders an image as a grid of dots with optional interactive pointer distortion (repel, attract, swirl) and jitter. Supports grayscale, tint, and object-fit. Use variant=\"static\" for non-interactive mode. | 画像をドットグリッドで描画。オプションでポインター変形・ジッター対応。",
      "files": [
        { "path": "components/media/pixelated-canvas.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "heatmap-canvas",
      "type": "registry:ui",
      "title": "Heatmap Canvas",
      "description": "Renders a source image with a heatmap visual effect by mapping pixel intensity to a color gradient (thermal, viridis, jet, grayscale). | ソース画像をピクセル強度に応じた色グラデーションでヒートマップ表示。",
      "files": [
        { "path": "components/media/heatmap-canvas.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "glass-surface",
      "type": "registry:ui",
      "title": "Glass Surface",
      "description": "Liquid glass surface component with SVG displacement and optional backdrop blur fallback. | 液体ガラス表面コンポーネント。SVGディスプレイスメントとオプションのバックドロップブラーのフォールバック。",
      "files": [
        {
          "path": "components/ui-elements/glass-surface.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "pop-up-item",
      "type": "registry:ui",
      "title": "Pop Up Item",
      "description": "Animated container that reveals content with pop-up spring animation. Supports whileInView, hover, or click triggers.",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/ui-elements/pop-up-item.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "floating-circles",
      "type": "registry:ui",
      "title": "Floating Circles",
      "description": "Animated gradient background with configurable colors and optional pointer-follow interaction. | 設定可能な色とオプションのポインター追従インタラクションを備えたアニメーショングラデーション背景。",
      "files": [
        {
          "path": "components/background/floating-circles.tsx",
          "type": "registry:ui"
        }
      ],
      "cssVars": {
        "theme": {
          "--animate-first": "moveVertical 30s ease infinite",
          "--animate-second": "moveInCircle 20s reverse infinite",
          "--animate-third": "moveInCircle 40s linear infinite",
          "--animate-fourth": "moveHorizontal 40s ease infinite",
          "--animate-fifth": "moveInCircle 20s ease infinite"
        }
      },
      "css": {
        "@keyframes moveHorizontal": {
          "0%": { "transform": "translateX(-50%) translateY(-10%)" },
          "50%": { "transform": "translateX(50%) translateY(10%)" },
          "100%": { "transform": "translateX(-50%) translateY(-10%)" }
        },
        "@keyframes moveInCircle": {
          "0%": { "transform": "rotate(0deg)" },
          "50%": { "transform": "rotate(180deg)" },
          "100%": { "transform": "rotate(360deg)" }
        },
        "@keyframes moveVertical": {
          "0%": { "transform": "translateY(-50%)" },
          "50%": { "transform": "translateY(50%)" },
          "100%": { "transform": "translateY(-50%)" }
        }
      }
    },
    {
      "name": "code-block",
      "type": "registry:ui",
      "title": "Code Block",
      "description": "Code block component with syntax highlighting and line numbers. | シンタックスハイライトと行番号を備えたコードブロックコンポーネント。",
      "dependencies": ["shiki", "lucide-react"],
      "registryDependencies": ["select", "button"],
      "files": [
        {
          "path": "components/ai-elements/code-block.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "timer",
      "type": "registry:ui",
      "title": "Timer",
      "description": "Reusable elapsed-time display. Control with isStarted (start/pause); remount to restart from zero. Supports formats like hh:mm:ss or milliseconds. | 経過時間を表示するタイマー。isStarted で開始・一時停止、remount でゼロから再開。表示形式（hh:mm:ss やミリ秒など）を選択可能。",
      "files": [
        {
          "path": "components/text/timer.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "slide-up-letters",
      "type": "registry:ui",
      "title": "Slide Up Letters",
      "description": "Slide up letters component with customizable animation. | カスタマイズ可能なアニメーションを備えたスライドアップ文字コンポーネント。",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/text/slide-up-letters.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "glyph-katakana",
      "type": "registry:ui",
      "title": "Glyph Katakana",
      "description": "Glyph katakana component with customizable animation. | カスタマイズ可能なアニメーションを備えたグリフ片仮名コンポーネント。",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/text/glyph-katakana.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "theme-switch",
      "type": "registry:ui",
      "title": "Theme Switch",
      "description": "Theme switch component with dark/light mode toggle. | ダーク/ライトモード切り替えコンポーネント。",
      "dependencies": ["next-themes", "motion"],
      "files": [
        {
          "path": "components/button/theme-switch.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "matrix-code",
      "type": "registry:ui",
      "title": "Matrix Code",
      "description": "Matrix code component with glitch effect and optional vignette effect. | グリッチ効果とオプションのビネット効果を備えたマトリックスコードコンポーネント。",
      "files": [
        {
          "path": "components/background/matrix-code.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "perlin-noise",
      "type": "registry:ui",
      "title": "Perlin Noise",
      "description": "Canvas-based Perlin noise wave grid background with configurable line color, wave speed and amplitude; mouse and touch interaction. | パーリンノイズの波状グリッド背景。線色・波速・振幅を設定可能。マウス・タッチでグリッド変形。",
      "files": [
        {
          "path": "components/background/perlin-noise.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "star-background",
      "type": "registry:ui",
      "title": "Star Background",
      "description": "Canvas 2D starfield background. Configurable star count, twinkle speed, and color. Suited for hero sections or page backgrounds with optional overlay content. | Canvas 2D の星空背景。星の数・きらめきの速さ・色を設定可能。",
      "files": [
        {
          "path": "components/background/star-background.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "radar-chart",
      "type": "registry:ui",
      "title": "Radar Chart",
      "description": "Radar chart component with customizable data and optional title and description. | カスタマイズ可能なデータとオプションのタイトルと説明を備えたラダーチャートコンポーネント。",
      "dependencies": ["recharts"],
      "registryDependencies": ["recharts", "card"],
      "files": [
        {
          "path": "components/chart/radar-chart.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "three-flip-card",
      "type": "registry:ui",
      "title": "3D Flip Card",
      "description": "A compound flip card with 3D tilt on hover and click-to-flip front/back. | 3D傾き効果とクリックで裏表が入れ替わる、マウス追従の3D傾き効果付きフリップカードコンポーネント。",
      "dependencies": [],
      "registryDependencies": ["three-card"],
      "files": [
        {
          "path": "components/card/3d-flip-card.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "motion-wheel",
      "type": "registry:ui",
      "title": "Motion Wheel",
      "description": "A compound carousel wheel with rotation animation, navigation, and optional center info. | 回転アニメーション、ナビゲーション、オプションの中央情報を備えた複合カルーセルホイールコンポーネント。",
      "dependencies": ["motion", "lucide-react"],
      "registryDependencies": ["card", "button", "use-mobile"],
      "files": [
        {
          "path": "components/carousel/motion-wheel.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "animated-counter",
      "type": "registry:ui",
      "title": "Animated Counter",
      "description": "An animated counter component with customizable starting number, target number, speed, and trigger. | カスタマイズ可能な開始数、目標数、速度、トリガーを備えたアニメーションカウンターコンポーネント。",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/text/animated-counter.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "decrypted-text",
      "type": "registry:ui",
      "title": "Decrypted Text",
      "description": "A text component with decoding animation—random katakana glyphs gradually resolve to reveal the target text. | 片仮名グリフが徐々に目標テキストへ解碼するアニメーション付きテキストコンポーネント。遅延設定・動きの軽減対応。",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/text/decrypted-text.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "text-hover-effect",
      "type": "registry:ui",
      "title": "Text Hover Effect",
      "description": "Text that reveals a cursor-following gradient and stroke animation on hover. | ホバー時にカーソル追従のグラデーションとストロークアニメーションで表示されるテキスト。",
      "dependencies": ["motion"],
      "files": [
        {
          "path": "components/text/text-hover-effect.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "three-card",
      "type": "registry:ui",
      "title": "3D Card",
      "description": "A 3D card component with customizable data and optional title and description. | カスタマイズ可能なデータとオプションのタイトルと説明を備えた3Dカードコンポーネント。",
      "files": [
        {
          "path": "components/card/3d-card.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "copy-button",
      "type": "registry:ui",
      "title": "Copy Button",
      "description": "A button that copies text to the clipboard. Shows a check icon after copying. Use it next to code blocks, quotes, or any text you want users to copy in one click. | テキストをクリップボードにコピーするボタン。コピー後にチェックアイコンを表示。コードブロックや引用文など、ワンクリックでコピーしたいテキストの横に配置できます。",
      "dependencies": ["lucide-react"],
      "registryDependencies": ["button", "tooltip"],
      "files": [
        { "path": "components/button/copy-button.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "scroll-button",
      "type": "registry:ui",
      "title": "Scroll Button",
      "description": "Buttons that scroll the window . Use for quick page navigation. | ウィンドウを上下左右にスクロールするボタン。ページ内ナビゲーションに。",
      "dependencies": ["lucide-react"],
      "registryDependencies": ["button", "tooltip"],
      "files": [
        { "path": "components/button/scroll-button.tsx", "type": "registry:ui" }
      ]
    },
    {
      "name": "draggable-grid",
      "type": "registry:ui",
      "title": "Draggable Grid",
      "description": "A draggable 2D grid with parallax icon cells. Inspired by Apple WatchOS. | 視差付きアイコンセルのドラッグ可能な2Dグリッド。Apple WatchOS にインスパイア。",
      "dependencies": ["motion"],
      "registryDependencies": ["tooltip"],
      "files": [
        {
          "path": "components/grid/draggable-grid.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "timeline",
      "type": "registry:ui",
      "title": "Timeline",
      "description": "Vertical timeline with sticky year and optional scroll-driven axis fill. | 左にスティッキーな年表示、オプションでスクロール連動の軸線。",
      "dependencies": ["motion"],
      "registryDependencies": ["card"],
      "files": [
        {
          "path": "components/layout/timeline.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "speed-dial",
      "type": "registry:ui",
      "title": "Speed Dial",
      "description": "FAB that expands into a radial menu of actions. Compound component: Root, Trigger, Item. Supports spread angle and direction. | FABを押すと放射状にアクションボタンが広がるメニュー。Root/Trigger/Itemの複合コンポーネント。",
      "dependencies": ["motion", "lucide-react"],
      "files": [
        {
          "path": "components/navigation/speed-dial.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "radial-cluster",
      "type": "registry:ui",
      "title": "Radial Cluster",
      "description": "Radial cluster chart for hierarchical data. Supports data prop or Item/SubItem composition. | 階層データの円環階層図。data プロップまたは Item/SubItem 構成に対応。",
      "dependencies": ["d3"],
      "registryDependencies": ["use-mobile"],
      "files": [
        {
          "path": "components/chart/radial-cluster.tsx",
          "type": "registry:ui"
        }
      ]
    },
    {
      "name": "floating-dock",
      "type": "registry:ui",
      "title": "Floating Dock",
      "description": "A floating dock component with a list of items. | アイテムリストを備えたフローティングドックコンポーネント。",
      "dependencies": ["lucide-react", "motion", "tabler-icons"],
      "files": [
        {
          "path": "components/navigation/floating-dock.tsx",
          "type": "registry:ui"
        }
      ]
    }
  ]
}