Testing shadcn-ui for Deno

Radix UI と Tailwind CSS を用いたコンポーネントライブラリ shadcn/ui を Deno で使うテスト

testing-shadcn-ui-in-fresh を 3rd-party module として利用できるかどうかを確認するためのテスト用レポジトリ

使用方法

import { Textarea } from "https://deno.land/x/testing_shadcn_ui_for_deno@0.0.7/components/textarea.tsx"

export default function App(){
  return (
    <div>
      <Textarea placeholder="Type your message here." class='!w-100' />
      {/* Use these css files in the "css" directory of the repo.*/}
      <link href={asset("/uno.css")} rel="stylesheet" />
      <link href={asset("/shadcn.css")} rel="stylesheet" />
    </div>
  )
}

コメントにあるように、css ディレクトリの中にある2つの css を使うことが前提になっている。

利用可能なコンポーネント (v0.0.7)

• 🆗：Accordion (…but its open/close animations do not work well)
• 🆗：Alert
• 🆗：AlertDialog
• 🆗：AspectRatio
• 🆗：Avatar
• 🆗：Badge
• 🆗：Button
• 🆗：Card
• 🆗：Checkbox
• 🆗：Collapsible
• 🆗：ComboBox
• 🆗：Command
• 🆗：ContextMenu
• 🆗：DataTable
• 🆗：Dialog
• 🆗：DropdownMenu
• 🆗：HoverCard
• 🆗：Input
• 🆗：Label
• ⛔：MenuBar
• ⛔：NavigationMenu
• 🆗：Popover
• 🆗：RadioGroup
• 🆗：Select
• 🆗：Sheet
• 🆗：Skeleton
• 🆗：Slider
• 🆗：Switch
• 🆗：Tabs
• 🆗：Table
• 🆗：TextArea
• 🆗：Toast (…if you do not close a popup manually)
• 🆗：Toggle
• 🆗：Toolip

オリジナルとの変更点

react と preact の違いによって、オリジナルのままではうまく機能しない場合があり、その対応のために変更を加えた部分がある。詳細は CHANGES.md を参照。