diff --git a/docs/catalogs.md b/docs/catalogs.md
index 6790ccbc6..3ac2db6ef 100644
--- a/docs/catalogs.md
+++ b/docs/catalogs.md
@@ -195,24 +195,22 @@ This catalog imports all elements from the Basic Catalog and adds a new `Suggest
 
 #### Example: Cherry-picking Components
 
-This catalog imports only `Text` and `Icon` from the Basic Catalog to build a simple Popup surface.
+This catalog imports only `Text` from the Basic Catalog to build a simple Popup surface.
 
 ```json
 {
   "$id": "https://github.com/.../hello_world_with_some_basic/v1/catalog.json",
   "components": {
     "allOf": [
-      { "$ref": "basic_catalog_definition.json#/components/Text" },
-      { "$ref": "basic_catalog_definition.json#/components/Icon" },
+      { "$ref": "basic_catalog.json#/components/Text" },
       {
         "Popup": { 
           "type": "object",
           "description": "A modal overlay that displays an icon and text.",
           "properties": {
-            "text": { "$ref": "common_types.json#/$defs/ComponentId" },
-            "icon": { "$ref": "common_types.json#/$defs/ComponentId" }
+            "text": { "$ref": "common_types.json#/$defs/ComponentId" }
           },
-          "required": [ "text", "icon" ]
+          "required": [ "text" ]
         }
       }
     ]
@@ -226,7 +224,7 @@ This catalog imports only `Text` and `Icon` from the Basic Catalog to build a si
 
 Client renderers implement the catalog by mapping the schema definition to actual code.
 
-[Example Rizzcharts typescript renderer for the hello world catalog](../samples/client/angular/projects/rizzcharts/src/a2ui-catalog/catalog.ts).
+Example typescript renderer for the hello world catalog
 
 ```typescript
 import { Catalog, DEFAULT_CATALOG } from '@a2ui/angular'; 
@@ -237,13 +235,35 @@ export const RIZZ_CHARTS_CATALOG = {
   HelloWorldBanner: {     
     type: () => import('./hello_world_banner').then((r) => r.HelloWorldBanner),     
     bindings: ({ properties }) => [       
-      inputBinding('message', () => ('message' in properties && properties['message']) || undefined),       
-      inputBinding('backgroundColor', () => ('backgroundColor' in properties && properties['backgroundColor']) || undefined),       
+      inputBinding('message', () => ('message' in properties && properties['message']) || undefined)
     ],   
   }, 
 } as Catalog;
 ```
 
+and the hello_world_banner implementation
+
+```typescript
+import { DynamicComponent } from '@a2ui/angular';
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'hello-world-banner',
+  imports: [], 
+  template: `
+    <div>
+      <h2>Hello World Banner</h2>
+      <p>{{ message }}</p>
+    </div>
+  `,
+})
+export class HelloWorldBanner extends DynamicComponent {
+  @Input() message?: string;
+}
+```
+
+You can see a working example of a client renderer in the [Rizzcharts demo](../samples/client/angular/projects/rizzcharts/src/a2ui-catalog/catalog.ts).
+
 ## A2UI Catalog Negotiation
 
 Because clients and agents can support multiple catalogs, they must agree on which catalog to use through a catalog negotiation handshake.
@@ -404,5 +424,4 @@ Example of client reporting a missing required field
 
 ## Inline Catalogs
 
-Inline catalogs sent by the client at runtime are supported but not recommended in production. More details about them can be found [here](../specification/v0_9/docs/a2ui_protocol.md#client-capabilities--metadata).
-
+Inline catalogs sent by the client at runtime are supported but not recommended in production. More details about them can be found [here](../specification/v0_9/docs/a2ui_protocol.md#client-capabilities--metadata).
\ No newline at end of file