@blurrow/ui 0.0.0-stage → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 manyports
+
+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

@@ -1,3 +1,66 @@
-# Temporary Holding Version
+# @blurrow/ui
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+buttons you want to press, fields you want to fill in.
+
+48 react components that share the same materials and the same light. made with care by [@manyports](https://manyports.com).
+
+## install
+
+```bash
+npm install @blurrow/ui
+```
+
+you'll need react 19 and tailwind css v4.
+
+## set up
+
+**1. styles.** add the tokens to your global stylesheet, after tailwind, and point tailwind at the package so it picks up the classes the components use:
+
+```css
+/* app/globals.css */
+@import "tailwindcss";
+@import "@blurrow/ui/styles.css";
+
+@source "../node_modules/@blurrow/ui";
+```
+
+the `@source` path is relative to the css file, so adjust it if your stylesheet lives somewhere else.
+
+**2. font.** everything is set in archivo. load it as the `--font-archivo` variable. with next.js:
+
+```tsx
+// app/layout.tsx
+import { Archivo } from "next/font/google";
+import { ToastProvider } from "@blurrow/ui";
+import "./globals.css";
+
+const archivo = Archivo({ subsets: ["latin"], variable: "--font-archivo" });
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en" className={archivo.variable}>
+      <body className="bg-[#EBEBEB] font-sans text-neutral-900 antialiased">
+        <ToastProvider>{children}</ToastProvider>
+      </body>
+    </html>
+  );
+}
+```
+
+`ToastProvider` is only needed if you use toasts.
+
+## use
+
+```tsx
+import { Button } from "@blurrow/ui";
+
+export default function Page() {
+  return <Button variant="primary">say hi</Button>;
+}
+```
+
+every component is marked `"use client"`, so you can import them straight into server components.
+
+## license
+
+MIT