feat(demo): add DeesDemoWrapper component for enhanced demo element handling

readme.hints.md

@@ -21,4 +21,31 @@ The properties panel had timing issues detecting rendered elements because:
 1. Dashboard renders element demo into viewport using `render(anonItem.demo(), viewport)`
 2. Properties panel waits, then searches recursively for the element instance
 3. If not found, retries with delays to handle async rendering
-4. Once found, extracts and displays element properties
+4. Once found, extracts and displays element properties
+
+## Demo Tools
+
+### DeesDemoWrapper Component
+A utility component for wrapping demo elements with post-render functionality.
+
+**Usage:**
+```typescript
+import { DeesDemoWrapper } from '@design.estate/dees-wcctools/demoTools';
+
+// In your demo function:
+demo: () => html`
+  <dees-demowrapper .runAfterRender=${(element) => {
+    // Do something with the rendered element
+    element.setAttribute('data-demo', 'true');
+    console.log('Element rendered:', element);
+  }}>
+    <my-custom-element></my-custom-element>
+  </dees-demowrapper>
+`
+```
+
+**Features:**
+- Wraps demo elements without affecting layout (uses `display: contents`)
+- Provides access to the rendered element instance after mounting
+- Supports async operations in runAfterRender callback
+- Automatically handles timing to ensure element is fully rendered