@hypoth-ui/react 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 hypoth-org
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,74 @@
+# @hypoth-ui/react
+
+![Alpha](https://img.shields.io/badge/status-alpha-orange)
+
+React adapter components for the hypoth-ui design system. Provides type-safe React wrappers around the underlying Lit Web Components with full support for Server Components and Client Components in Next.js.
+
+## Installation
+
+```bash
+npm install @hypoth-ui/react
+```
+
+### Peer Dependencies
+
+```bash
+npm install @hypoth-ui/wc react react-dom
+```
+
+## Usage
+
+```tsx
+import { Button } from '@hypoth-ui/react';
+
+function App() {
+  return <Button variant="primary">Click me</Button>;
+}
+```
+
+### Client Components (Next.js App Router)
+
+```tsx
+"use client";
+import { Button, Dialog, Input } from "@hypoth-ui/react/client";
+
+function MyComponent() {
+  return (
+    <Dialog.Root>
+      <Dialog.Trigger asChild>
+        <Button>Open Dialog</Button>
+      </Dialog.Trigger>
+      <Dialog.Content>
+        <Dialog.Title>Edit Profile</Dialog.Title>
+        <Input placeholder="Enter name" />
+      </Dialog.Content>
+    </Dialog.Root>
+  );
+}
+```
+
+### Compound Component Pattern
+
+Most complex components use the compound pattern:
+
+```tsx
+import { Select } from "@hypoth-ui/react";
+
+<Select.Root onValueChange={(value) => console.log(value)}>
+  <Select.Trigger>
+    <Select.Value placeholder="Choose..." />
+  </Select.Trigger>
+  <Select.Content>
+    <Select.Option value="a">Option A</Select.Option>
+    <Select.Option value="b">Option B</Select.Option>
+  </Select.Content>
+</Select.Root>
+```
+
+## Documentation
+
+See the [main README](../../README.md) for full documentation and architecture overview.
+
+## License
+
+MIT