@team-plain/ui-components 0.1.0 → 2.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Not Just Tickets Ltd.
+
+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,58 @@
+# @team-plain/ui-components
+
+Helper functions for building Plain [UI components](https://plain.com/docs). Provides a typed, concise API for constructing `ComponentInput` objects.
+
+## Installation
+
+```bash
+npm install @team-plain/ui-components @team-plain/sdk
+```
+
+Requires `@team-plain/sdk` as a peer dependency.
+
+## Usage
+
+```ts
+import { uiComponent } from "@team-plain/ui-components";
+```
+
+### Available Components
+
+| Builder | Description |
+|---------|-------------|
+| `uiComponent.text({ text, size?, color? })` | Rich text with optional size and color |
+| `uiComponent.plainText({ text })` | Plain unformatted text |
+| `uiComponent.badge({ label, color? })` | Colored badge |
+| `uiComponent.divider()` | Horizontal divider |
+| `uiComponent.spacer({ size })` | Vertical spacing |
+| `uiComponent.linkButton({ label, url })` | Button that opens a URL |
+| `uiComponent.copyButton({ value, tooltip? })` | Button that copies a value to clipboard |
+| `uiComponent.workflowButton({ label, workflowId })` | Button that triggers a workflow |
+| `uiComponent.container({ content })` | Groups components together |
+| `uiComponent.row({ mainContent, asideContent })` | Two-column layout |
+
+### Example
+
+```ts
+import { uiComponent } from "@team-plain/ui-components";
+
+const components = [
+  uiComponent.row({
+    mainContent: [uiComponent.text({ text: "Customer Plan", size: "L" })],
+    asideContent: [uiComponent.badge({ label: "Pro", color: "GREEN" })],
+  }),
+  uiComponent.divider(),
+  uiComponent.text({ text: "Signed up 3 days ago", color: "MUTED" }),
+  uiComponent.spacer({ size: "M" }),
+  uiComponent.container({
+    content: [
+      uiComponent.linkButton({ label: "View in Stripe", url: "https://dashboard.stripe.com/..." }),
+      uiComponent.copyButton({ value: "cus_abc123", tooltip: "Copy Stripe ID" }),
+    ],
+  }),
+];
+```
+
+## License
+
+[MIT](../../LICENSE)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@team-plain/ui-components",
-  "version": "0.1.0",
+  "version": "2.0.0",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -16,15 +16,15 @@
   "files": [
     "dist"
   ],
-  "scripts": {
-    "build": "tsc",
-    "test": "vitest run"
-  },
   "peerDependencies": {
-    "@team-plain/sdk": "workspace:*"
+    "@team-plain/sdk": "1.0.0"
   },
   "devDependencies": {
-    "@team-plain/sdk": "workspace:*",
-    "typescript": "^5.7.0"
+    "typescript": "^5.7.0",
+    "@team-plain/sdk": "1.0.0"
+  },
+  "scripts": {
+    "build": "tsc",
+    "test": "vitest run"
   }
-}
+}