release(content-suggestions): v0.2.0

packages/content-suggestions/README.md

@@ -9,7 +9,10 @@ Cross-framework content text/title renderer with support for mentions, tags and
   - `ContentText`
   - `ContentTextWithSuggestions`
   - `ContentTitleWithSuggestions`
-- Angular adapter in `angular` for rendering/tokenization integration.
+- Angular UI components in `angular` (based on `@hublib-web/tach-typography/angular`):
+  - `ContentTextComponent`
+  - `ContentTextWithSuggestionsComponent`
+  - `ContentTitleWithSuggestionsComponent`
 - Depends on `@hublib-web/tach-typography` for visual consistency.
 - Business logic (API requests for mentions/tags) stays in consumer application.
 
@@ -19,7 +22,7 @@ Cross-framework content text/title renderer with support for mentions, tags and
 yarn add "@hublib-web/content-suggestions@git+ssh://git@github.com/ORG/REPO.git#workspace=@hublib-web/content-suggestions&tag=content-suggestions-v0.1.0"
 ```
 
-`@hublib-web/tach-typography` is a peer dependency, so install a compatible tag for it as well.
+`@hublib-web/tach-typography@0.3.0` is a peer dependency.
 
 ## Install inside this monorepo
 
@@ -77,6 +80,41 @@ By default, tags are rendered as plain styled text (not links).
 
 ## Angular usage
 
+Standalone component usage:
+
+```ts
+import { Component } from "@angular/core";
+import { ContentTextWithSuggestionsComponent } from "@hublib-web/content-suggestions/angular";
+
+@Component({
+  standalone: true,
+  imports: [ContentTextWithSuggestionsComponent],
+  template: `
+    <content-text-with-suggestions
+      [text]="text"
+      [ellipsis]="{ count: 180, expandable: true }"
+      [onView]="onView"
+    />
+  `,
+})
+export class FeedPostComponent {
+  text = "@[John Doe](d290f1ee-6c54-4b01-90e6-d701748f0851) hello #tag";
+
+  onView = () => {
+    // analytics
+  };
+}
+```
+
+Title variant with defaults (`weight: "bold"`, `ellipsis: { rows: 2 }`):
+
+```ts
+import { ContentTitleWithSuggestionsComponent } from "@hublib-web/content-suggestions/angular";
+
+// template
+// <content-title-with-suggestions [text]="title" />
+```
+
 Tokenization helper:
 
 ```ts
@@ -85,32 +123,6 @@ import { createAngularContentTokens } from "@hublib-web/content-suggestions/angu
 const tokens = createAngularContentTokens(text);
 ```
 
-Ready-to-use UI renderer (React-like props API):
-
-```ts
-import { AngularContentTextWithSuggestionsRenderer } from "@hublib-web/content-suggestions/angular";
-
-const renderer = new AngularContentTextWithSuggestionsRenderer();
-renderer.attach(containerElement, {
-  text,
-  weight: "normal",
-  ellipsis: { count: 180, expandable: true },
-  blur: false,
-  onView: () => {
-    // analytics
-  },
-});
-```
-
-Title variant with defaults (`weight: "bold"`, `ellipsis: { rows: 2 }`):
-
-```ts
-import { AngularContentTitleWithSuggestionsRenderer } from "@hublib-web/content-suggestions/angular";
-
-const titleRenderer = new AngularContentTitleWithSuggestionsRenderer();
-titleRenderer.attach(titleContainer, { text: title });
-```
-
 ## Storybook (dev/design system)
 
 Run from repository root: