v3.42.2

fix(dees-chart-area): add ApexAxisChartSeries type to dees-chart-area component to improve typing for ApexCharts series data
v3.42.1
2026-02-16 17:16:49 +00:00 · 2026-02-16 17:16:49 +00:00 · 2026-02-16 16:03:23 +00:00 · 2026-02-16 16:03:23 +00:00 · 2026-02-02 14:32:20 +00:00 · 2026-02-02 14:32:20 +00:00
229 changed files with 6529 additions and 803 deletions
--- a/changelog.md
+++ b/changelog.md
@@ -1,5 +1,119 @@
 # Changelog

+## 2026-02-16 - 3.42.2 - fix(dees-chart-area)
+add ApexAxisChartSeries type to dees-chart-area component to improve typing for ApexCharts series data
+
+- Introduces ApexAxisChartSeries type alias with support for number arrays, [x,y] tuples, and object {x,y,...} series entries
+- Type-only change — no runtime or API behavior modified
+- File changed: ts_web/elements/00group-chart/dees-chart-area/component.ts
+
+## 2026-02-16 - 3.42.1 - fix(dees-table)
+Guard against undefined action.type in dees-table by using optional chaining and update several dependencies
+
+- Use optional chaining (action.type?.includes(...)) in ts_web/elements/.../dees-table.ts to prevent runtime errors when action.type is undefined
+- Bump dependency apexcharts from ^5.3.6 to ^5.5.0
+- Bump dependency lucide from ^0.563.0 to ^0.564.0
+- Bump devDependency @git.zone/tswatch from ^3.0.1 to ^3.1.0
+- Bump devDependency @types/node from ^25.0.10 to ^25.2.3
+
+## 2026-02-02 - 3.42.0 - feat(dees-form-submit)
+forward button properties to internal dees-button, use property bindings, add demo and styles
+
+- Added forwarded properties: type, size, icon, iconPosition (with defaults) and preserved text/status/disabled
+- Changed template to use property bindings (.prop) for dees-button instead of string attributes
+- Switched internal event handler to listen for dees-button's @clicked event (was @click)
+- Added component styles (:host display and dees-button width:100%) and improved layout
+- Expanded demo with multiple usage examples (basic, icons, types, sizes, states, and a form context)
+
+## 2026-02-02 - 3.41.6 - fix(dees-simple-appdash)
+respect selectedView when loading initial view, falling back to the first tab
+
+- firstUpdated now loads this.selectedView if set, otherwise loads the first view tab
+- Prevents always loading the first tab and preserves a previously selected view on initial render
+
+## 2026-02-01 - 3.41.5 - fix(dees-service-lib-loader)
+prevent horizontal scrollbar by offsetting xterm WidthCache measurement container
+
+- Injects additional CSS into DeesServiceLibLoader to move xterm.js WidthCache measurement div off-screen horizontally (selector: body > div[style*="top: -50000px"][style*="width: 50000px"])
+- Fixes root cause where xterm creates a large-width measurement container (width: 50000px) on document.body that expands scrollWidth and causes a horizontal scrollbar
+- Change applied in ts_web/services/DeesServiceLibLoader.ts by concatenating the fix CSS into the injected stylesheet
+
+## 2026-01-29 - 3.41.4 - fix()
+no changes
+
+- No files changed in this commit; no code or documentation modified
+- No release required
+
+## 2026-01-29 - 3.41.3 - fix(dees-pdf-viewer)
+use in-memory PDF data for download and print; add robust print wrapper, cleanup and error handling
+
+- Download and Print now use pdfDocument.getData() to create Blob URLs so in-memory PDFs (pdf.js) can be saved/printed.
+- Print flow now opens an HTML wrapper with an iframe to allow onafterprint handling, auto-close, popup-fallback and timed cleanup of Blob URLs.
+- Added try/catch logging, URL.revokeObjectURL calls and safety timeouts to avoid resource leaks.
+- Removed context menu items that relied on the raw PDF URL (Open in New Tab, Copy PDF URL); Download/Print actions now await the async handlers.
+
+## 2026-01-28 - 3.41.2 - fix(dees-pdf-viewer)
+account for devicePixelRatio when setting canvas dimensions and scale 2D context to render crisp PDF pages and thumbnails on high-DPI displays
+
+- Multiply canvas.width and canvas.height by window.devicePixelRatio (dpr) and use Math.floor to set the actual pixel buffer size
+- Call ctx.scale(dpr, dpr) so drawing is rendered at device pixels while keeping CSS display size unchanged
+- Apply the same high-DPI adjustments to both main page rendering and thumbnail generation
+- Keep canvas.style.width and canvas.style.height set to viewport dimensions to preserve layout
+
+## 2026-01-27 - 3.41.1 - fix(dataview-codebox)
+fix dees-dataview codebox layout to ensure full-height, proper flex behavior and scrolling; bump internal dependencies
+
+- Updated CSS in ts_web/elements/00group-dataview/dees-dataview-codebox/dees-dataview-codebox.ts: added height:100%, box-sizing, display:flex and flex-direction:column on container, set flex-shrink on header elements, made code grid overflow:auto with flex:1 and min-height:0 to prevent overflow issues.
+- Bumped dependencies in package.json: @design.estate/dees-domtools from ^2.3.7 to ^2.3.8 and @design.estate/dees-element from ^2.1.5 to ^2.1.6.
+- Non-breaking visual/layout fix — suitable for a patch release.
+
+## 2026-01-27 - 3.41.0 - feat(docs)
+document new media & tile components and expand Workspace/IDE component docs; update component count to 90+
+
+- Updated README component count from 70+ to 90+.
+- Added Media & Tile components documentation (DeesTilePdf, DeesTileImage, DeesTileAudio, DeesTileVideo, DeesTileNote, DeesTileFolder, DeesPreview, DeesPdfViewer, DeesImageViewer, DeesAudioViewer, DeesVideoViewer).
+- Expanded Workspace/IDE documentation and introduced workspace subcomponents (DeesWorkspace, DeesWorkspaceMonaco, DeesWorkspaceDiffEditor, DeesWorkspaceFiletree, DeesWorkspaceTerminal, DeesWorkspaceTerminalPreview, DeesWorkspaceMarkdown, DeesWorkspaceMarkdownoutlet, DeesWorkspaceBottombar).
+- Enhanced Contextmenu docs to demonstrate nested submenus and programmatic API usage.
+- Added ITileFolderItem interface example for tile folder items.
+
+## 2026-01-27 - 3.40.0 - feat(dees-tile)
+unify tile badge styling and markup; replace component-specific badge classes with shared tile-badge classes and update related imports/tests
+
+- Add shared badge styles: .tile-badge-corner, .tile-badge-topright, .tile-badge and layout rules in dees-tile-shared/styles.ts
+- Update tile components (audio, video, image, folder, note, pdf) to use new badge markup and remove duplicated badge CSS
+- Shift badge positioning when a tile label is present (.tile-container:has(.tile-label))
+- Remove older per-component badge rules (duration-badge, item-count-badge, dimension-badge, note-language/note-line-indicator, preview-page-indicator) and replace with unified classes
+- Update tests to import dees-contextmenu and dees-dashboardgrid from new 00group-overlay / 00group-layout paths to reflect folder reorganization
+
+## 2026-01-27 - 3.39.1 - fix(dees-tile-note)
+use horizontal pointer position to scroll note body by computing percentage from clientX and element width instead of clientY and height
+
+- Changed ts_web/elements/00group-media/dees-tile-note/component.ts: use x = e.clientX - rect.left and percentage = x / rect.width to drive scrollTop calculation instead of using vertical coordinates
+- Fixes incorrect scroll mapping where vertical mouse position was used for horizontal scrolling interaction
+
+## 2026-01-27 - 3.39.0 - feat(components)
+add large set of new UI components and demos, reorganize groups, and bump a few dependencies
+
+- Add Media viewers: dees-image-viewer, dees-audio-viewer, dees-video-viewer, DeesPdf/DeesPdfViewer and related PDF utilities (CanvasPool, PdfManager) and demos
+- Introduce dees-preview composite that auto-detects content and delegates to appropriate viewers
+- New Tile system (DeesTileBase) and tile components: dees-tile-pdf, dees-tile-image, dees-tile-audio, dees-tile-video, dees-tile-note, dees-tile-folder plus demos
+- Add dashboard/grid system: dees-dashboardgrid with drag/resize, collision resolution, layout helpers, demos and utilities
+- Data view additions: dees-table with lucene-like query parser, column utilities, and dees-statsgrid enhancements (including cpuCores visualization)
+- New feedback & overlay components: dees-toast, dees-actionbar, dees-progressbar, dees-spinner, dees-badge and supporting demos/interfaces
+- Many layout and utility components added or improved: dees-panel, dees-chips, dees-heading, dees-label, dees-pagination, dees-stepper, and associated demos
+- Refactor project structure: components organized into 00group-* directories and demo metadata migrated from demoGroup to demoGroups (string[]); many import path updates to match new grouping
+- Deprecations/notes: dees-pdf-preview and legacy dees-pdf marked as deprecated in favor of new viewers/tiles
+- Dependency bumps in package.json: @design.estate/dees-wcctools -> ^3.8.0, @git.zone/tstest -> ^3.1.8
+
+## 2026-01-26 - 3.38.0 - feat(appui)
+add app shell and bottom bar APIs, new input components, and update README component listings and docs
+
+- README: updated components count (80+ → 70+), reorganized categories (added App Shell / Pre-built Templates, renamed Workspace/IDE) and improved typography
+- Document listing: added DeesActionbar, DeesInputToggle, DeesInputCode, DeesAppuiBottombar and other component entries
+- Menu item interface: added closeable and onClose properties for dismissible menu items
+- IViewDefinition: expanded content type to accept element constructors and async content, added badgeVariant and cache flags
+- New interfaces added: IBottomBarWidget, IBottomBarAction, IViewActivationContext to support bottom bar widgets/actions and view activation context
+
 ## 2026-01-25 - 3.37.1 - fix(editor)
 fix monaco/editor layout, update dev deps, simplify watch script and remove Playwright snapshots

--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@design.estate/dees-catalog",
-  "version": "3.37.1",
+  "version": "3.42.2",
  "private": false,
  "description": "A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.",
  "main": "dist_ts_web/index.js",
@@ -16,9 +16,9 @@
  "author": "Lossless GmbH",
  "license": "MIT",
  "dependencies": {
-    "@design.estate/dees-domtools": "^2.3.7",
-    "@design.estate/dees-element": "^2.1.5",
-    "@design.estate/dees-wcctools": "^3.7.1",
+    "@design.estate/dees-domtools": "^2.3.8",
+    "@design.estate/dees-element": "^2.1.6",
+    "@design.estate/dees-wcctools": "^3.8.0",
    "@fortawesome/fontawesome-svg-core": "^7.1.0",
    "@fortawesome/free-brands-svg-icons": "^7.1.0",
    "@fortawesome/free-regular-svg-icons": "^7.1.0",
@@ -34,10 +34,10 @@
    "@tiptap/extension-underline": "^2.23.0",
    "@tiptap/starter-kit": "^2.23.0",
    "@tsclass/tsclass": "^9.3.0",
-    "apexcharts": "^5.3.6",
+    "apexcharts": "^5.5.0",
    "highlight.js": "11.11.1",
    "ibantools": "^4.5.1",
-    "lucide": "^0.563.0",
+    "lucide": "^0.564.0",
    "monaco-editor": "0.55.1",
    "pdfjs-dist": "^4.10.38",
    "xterm": "^5.3.0",
@@ -46,10 +46,10 @@
  "devDependencies": {
    "@git.zone/tsbuild": "^4.1.2",
    "@git.zone/tsbundle": "^2.8.3",
-    "@git.zone/tstest": "^3.1.7",
-    "@git.zone/tswatch": "^3.0.1",
+    "@git.zone/tstest": "^3.1.8",
+    "@git.zone/tswatch": "^3.1.0",
    "@push.rocks/projectinfo": "^5.0.2",
-    "@types/node": "^25.0.10"
+    "@types/node": "^25.2.3"
  },
  "files": [
    "ts/**/*",
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -9,14 +9,14 @@ importers:
  .:
    dependencies:
      '@design.estate/dees-domtools':
-        specifier: ^2.3.7
-        version: 2.3.7
+        specifier: ^2.3.8
+        version: 2.3.8
      '@design.estate/dees-element':
-        specifier: ^2.1.5
-        version: 2.1.5
+        specifier: ^2.1.6
+        version: 2.1.6
      '@design.estate/dees-wcctools':
-        specifier: ^3.7.1
-        version: 3.7.1
+        specifier: ^3.8.0
+        version: 3.8.0
      '@fortawesome/fontawesome-svg-core':
        specifier: ^7.1.0
        version: 7.1.0
@@ -63,8 +63,8 @@ importers:
        specifier: ^9.3.0
        version: 9.3.0
      apexcharts:
-        specifier: ^5.3.6
-        version: 5.3.6
+        specifier: ^5.5.0
+        version: 5.5.0
      highlight.js:
        specifier: 11.11.1
        version: 11.11.1
@@ -72,8 +72,8 @@ importers:
        specifier: ^4.5.1
        version: 4.5.1
      lucide:
-        specifier: ^0.563.0
-        version: 0.563.0
+        specifier: ^0.564.0
+        version: 0.564.0
      monaco-editor:
        specifier: 0.55.1
        version: 0.55.1
@@ -94,17 +94,17 @@ importers:
        specifier: ^2.8.3
        version: 2.8.3
      '@git.zone/tstest':
-        specifier: ^3.1.7
-        version: 3.1.7(@push.rocks/smartserve@2.0.1)(socks@2.8.7)(typescript@5.9.3)
+        specifier: ^3.1.8
+        version: 3.1.8(@push.rocks/smartserve@2.0.1)(socks@2.8.7)(typescript@5.9.3)
      '@git.zone/tswatch':
-        specifier: ^3.0.1
-        version: 3.0.1(@tiptap/pm@2.27.2)
+        specifier: ^3.1.0
+        version: 3.1.0(@tiptap/pm@2.27.2)
      '@push.rocks/projectinfo':
        specifier: ^5.0.2
        version: 5.0.2
      '@types/node':
-        specifier: ^25.0.10
-        version: 25.0.10
+        specifier: ^25.2.3
+        version: 25.2.3

 packages:

@@ -117,6 +117,9 @@ packages:
  '@api.global/typedrequest@3.2.5':
    resolution: {integrity: sha512-LM/sUTuYnU5xY4gNZrN6ERMiKr+SpDZuSxJkAZz1YazC7ymGfo6uQ8sCnN8eNNQNFqIOkC+BtfYRayfbGwYLLg==}

+  '@api.global/typedrequest@3.2.6':
+    resolution: {integrity: sha512-CnvbjYjnGGw3rwL+7bTHSgRHEpDujzhs3cv7l1xgCXMPQe3DcPg74+9ep1Y5cu21T/w0pxNnDCJpbb0SHqHzAw==}
+
  '@api.global/typedserver@3.0.80':
    resolution: {integrity: sha512-dcp0oXsjBL+XdFg1wUUP08uJQid5bQ0Yv3V3Y3lnI2QCbat0FU+Tsb0TZRnZ4+P150Vj/ITBqJUgDzFsF34grA==}

@@ -337,26 +340,29 @@ packages:
  '@cfworker/json-schema@4.1.1':
    resolution: {integrity: sha512-gAmrUZSGtKc3AiBL71iNWxDsyUC5uMaKKGdvzYsBoTW/xi42JQHl7eKV2OYzCUqvc+D2RCcf7EXY2iCyFIk6og==}

-  '@cloudflare/workers-types@4.20260124.0':
-    resolution: {integrity: sha512-h6TJlew6AtGuEXFc+k5ifalk+tg3fkg0lla6XbMAb2AKKfJGwlFNTwW2xyT/Ha92KY631CIJ+Ace08DPdFohdA==}
+  '@cloudflare/workers-types@4.20260127.0':
+    resolution: {integrity: sha512-4M1HLcWViSdT/pAeDGEB5x5P3sqW7UIi34QrBRnxXbqjAY9if8vBU/lWRWnM+UqKzxWGB2LYjEVOzZrp0jZL+w==}
+
+  '@cloudflare/workers-types@4.20260214.0':
+    resolution: {integrity: sha512-qb8rgbAdJR4BAPXolXhFL/wuGtecHLh1veOyZ1mK6QqWuCdI3vK1biKC0i3lzmzdLR/DZvsN3mNtpUE8zpWGEg==}

  '@configvault.io/interfaces@1.0.17':
    resolution: {integrity: sha512-bEcCUR2VBDJsTin8HQh8Uw/mlYl2v8A3jMIaQ+MTB9Hrqd6CZL2dL7iJdWyFl/3EIX+LDxWFR+Oq7liIq7w+1Q==}

-  '@design.estate/dees-catalog@3.37.0':
-    resolution: {integrity: sha512-c6q+yK2FwMsMK72GykUhZnvKUgTzjFO9vdbn6OBxas2/eY/6Wi6BC5i9YONN0UYcW8yqjHIDjN9nP7yE1Ai4PA==}
+  '@design.estate/dees-catalog@3.42.0':
+    resolution: {integrity: sha512-pArkafnrhRsHsSxKUMUM2YP5ei/AbcchPEKZY2PyHHAdXcNxyT3pE2Oh1FPcs1pqF2LpEgJRq8KFQbFhvhp8Nw==}

  '@design.estate/dees-comms@1.0.30':
    resolution: {integrity: sha512-KchMlklJfKAjQiJiR0xmofXtQ27VgZtBIxcMwPE9d+h3jJRv+lPZxzBQVOM0eyM0uS44S5vJMZ11IeV4uDXSHg==}

-  '@design.estate/dees-domtools@2.3.7':
-    resolution: {integrity: sha512-MXoDBrP7JTOpni8b12aFXHJKnKBoQppM8cYBuL9cesRmCVGdB7p39XMRQ7dRyMhmmyr66L3cOczhiCV6febCwg==}
+  '@design.estate/dees-domtools@2.3.8':
+    resolution: {integrity: sha512-jUG9GMvPxKMwmRIZ9oLTL3c8hHvHuiwIk8cTrYnuZzGO/uJJ5/czk9o6LRXUuCOOG7TRLtqgOpK8EEQgaadfZA==}

-  '@design.estate/dees-element@2.1.5':
-    resolution: {integrity: sha512-czUOFvBiUKi34I+/keDRDc71fuORZS0NfbSuD2jJ4D1ODiTPjaZ6A6SkdQ2QqCEzVsx73XF99Pu8pxPnaOLnHg==}
+  '@design.estate/dees-element@2.1.6':
+    resolution: {integrity: sha512-7zyHkUjB8UEQgT9VbB2IJtc/yuPt9CI5JGel3b6BxA1kecY64ceIjFvof1uIkc0QP8q2fMLLY45r1c+9zDTjzg==}

-  '@design.estate/dees-wcctools@3.7.1':
-    resolution: {integrity: sha512-BiNWghUoC05RTQOGVCTK+wis6d18LyLY+2p8vHC0q2OBw9hrPoY8k9EplpQgY40MvP0sTXWUwaa7VPXra8ASjA==}
+  '@design.estate/dees-wcctools@3.8.0':
+    resolution: {integrity: sha512-CC14iVKUrguzD9jIrdPBd9fZ4egVJEZMxl5y8iy0l7WLumeoYvGsoXj5INVkRPLRVLqziIdi4Je1hXqHt2NU+g==}

  '@emnapi/core@1.8.1':
    resolution: {integrity: sha512-AvT9QFpxK0Zd8J0jopedNm+w/2fIzvtPKPjqyw9jwvBaReTTqPBk9Hixaz7KbjimP+QNz605/XnjFcDAL2pqBg==}
@@ -559,12 +565,12 @@ packages:
    resolution: {integrity: sha512-NEcnsjvlC1o3Z6SS3VhKCf6Ev+Sh4EAinmggslrIR/ppMrvjDbXNFXoyr3PB+GLeSAR0JRZ1fGvVYjpEzjBdIg==}
    hasBin: true

-  '@git.zone/tstest@3.1.7':
-    resolution: {integrity: sha512-YCDA+65LJhoY3WJxrNduKlpGf37aq4bFe+fdRqE0dZ2W1f7j3sUunBaBzckShSHKRjkMdPZKr0W0sXFXUK/PcA==}
+  '@git.zone/tstest@3.1.8':
+    resolution: {integrity: sha512-nmiLGeOkKMkLDyIk5BUBLx5ExskFbKHKlPdrWCARPVFkU4cAAiuIyJWVfLwISoS0TO/zSInLqArPwIc76yvaNw==}
    hasBin: true

-  '@git.zone/tswatch@3.0.1':
-    resolution: {integrity: sha512-vrAkKM5ff/e1BLNkrIRXnTIkMyjl/uW49c1cYaw2nYGloM6/wT1FSwYjwh6BcDkHIYMnzS30SOy9jSYRptW/iw==}
+  '@git.zone/tswatch@3.1.0':
+    resolution: {integrity: sha512-R2ZI+j1OKVgd0zTbtGtJjyt7r2kF0Z4nl8neolHuQL+jpr16i2NHVfVK92uIeeZDnJSqo5vf7Syt0XeQ4rz2HA==}
    hasBin: true

  '@happy-dom/global-registrator@15.11.7':
@@ -851,8 +857,8 @@ packages:
  '@push.rocks/smartbucket@3.3.10':
    resolution: {integrity: sha512-0H2MioALspC8Aj0Q1FPCs2w4k2u9oJg7Q5yM8+1TZo7aRfrdxgM5HQ7z3apUaqC3ZEDewW6vSlttjHFHhMEC3A==}

-  '@push.rocks/smartbucket@4.3.1':
-    resolution: {integrity: sha512-fMA8w98/E+usaaLkLm6wDj1XSpR0shTtG8AxTdwWIlH1YemQj/aCf4wReezDxUFVoUpC3HMzzV2RTFtQvHndeQ==}
+  '@push.rocks/smartbucket@4.4.1':
+    resolution: {integrity: sha512-68GFLgJKW+LXvuN+yuV8O/FozGMecraoT+PkI5whdRPFe7N3u2iYIHWAUjvQvVU4ygpdJv0kih2JDf5k3PYycw==}

  '@push.rocks/smartbuffer@3.0.5':
    resolution: {integrity: sha512-pWYF08Mn8s/KF/9nHRk7pZPzuMjmYVQay2c5gGexdayxn1W4eCSYYhWH73vR2JBfGeGq/izbRNuUuEaIEeTIKA==}
@@ -942,6 +948,9 @@ packages:
  '@push.rocks/smartlog@3.1.10':
    resolution: {integrity: sha512-5pf5JyzOE2WTCUislNIW4EHePo1a7hiXB+jbil38+N5hW71AEwcPFe6oGxbp5w9ALlz66hV2+E+25R0SsxN+fQ==}

+  '@push.rocks/smartlog@3.1.11':
+    resolution: {integrity: sha512-zyLH8pQD2UD7l76wJBESEWXU1FSTBLOuRI0/DN139EYyMkwMq1+pdQKptTkJhhVL/OIj56oMg9SpJb4bJB7uKg==}
+
  '@push.rocks/smartmanifest@2.0.2':
    resolution: {integrity: sha512-QGc5C9vunjfUbYsPGz5bynV/mVmPHkrQDkWp8ZO8VJtK1GZe+njgbrNyxn2SUHR0IhSAbSXl1j4JvBqYf5eTVg==}

@@ -1041,6 +1050,9 @@ packages:
  '@push.rocks/smarttime@4.1.1':
    resolution: {integrity: sha512-Ha/3J/G+zfTl4ahpZgF6oUOZnUjpLhrBja0OQ2cloFxF9sKT8I1COaSqIfBGDtoK2Nly4UD4aTJ3JcJNOg/kgA==}

+  '@push.rocks/smarttime@4.2.3':
+    resolution: {integrity: sha512-8gMg8RUkrCG4p9NcEUZV7V6KpL24+jAMK02g7qyhfA6giz/JJWD0+8w8xjSR+G7qe16KVQ2y3RbvAL9TxmO36g==}
+
  '@push.rocks/smartunique@3.0.9':
    resolution: {integrity: sha512-q6DYQgT7/dqdWi9HusvtWCjdsFzLFXY9LTtaZV6IYNJt6teZOonoygxTdNt9XLn6niBSbLYrHSKvJNTRH/uK+g==}

@@ -1066,6 +1078,9 @@ packages:
  '@push.rocks/taskbuffer@3.5.0':
    resolution: {integrity: sha512-Y9WwIEIyp6oVFdj06j84tfrZIvjhbMb3DF52rYxlTeYLk3W7RPhSg1bGPCbtkXWeKdBrSe37V90BkOG7Qq8Pqg==}

+  '@push.rocks/taskbuffer@4.2.1':
+    resolution: {integrity: sha512-F3aizWLGWdAz7wSJqOzjwVgo1VQJcxTbHUjDN/Pqxw0WMQUwODRGbhgy4zLag7bOyE4tc8Jv7yid7Bjmn5hKdg==}
+
  '@push.rocks/webrequest@3.0.37':
    resolution: {integrity: sha512-fLN7kP6GeHFxE4UH4r9C9pjcQb0QkJxHeAMwXvbOqB9hh0MFNKhtGU7GoaTn8SVRGRMPc9UqZVNwo6u5l8Wn0A==}

@@ -1492,31 +1507,6 @@ packages:
  '@socket.io/component-emitter@3.1.2':
    resolution: {integrity: sha512-9BCxFwvbGg/RsZK9tjXd8s4UcwR0MWeFQ1XEKIQVVvAGJyINdrqKMcTRyLoK8Rse1GjzLV9cwjWV1olXRWEXVA==}

-  '@svgdotjs/svg.draggable.js@3.0.6':
-    resolution: {integrity: sha512-7iJFm9lL3C40HQcqzEfezK2l+dW2CpoVY3b77KQGqc8GXWa6LhhmX5Ckv7alQfUXBuZbjpICZ+Dvq1czlGx7gA==}
-    peerDependencies:
-      '@svgdotjs/svg.js': ^3.2.4
-
-  '@svgdotjs/svg.filter.js@3.0.9':
-    resolution: {integrity: sha512-/69XMRCDoam2HgC4ldHIaDgeQf1ViHIsa0Ld4uWgiXtZ+E24DWHe/9Ib6kbNiZ7WRIdlVokUDR1Fg0kjIpkfbw==}
-    engines: {node: '>= 0.8.0'}
-
-  '@svgdotjs/svg.js@3.2.5':
-    resolution: {integrity: sha512-/VNHWYhNu+BS7ktbYoVGrCmsXDh+chFMaONMwGNdIBcFHrWqk2jY8fNyr3DLdtQUIalvkPfM554ZSFa3dm3nxQ==}
-
-  '@svgdotjs/svg.resize.js@2.0.5':
-    resolution: {integrity: sha512-4heRW4B1QrJeENfi7326lUPYBCevj78FJs8kfeDxn5st0IYPIRXoTtOSYvTzFWgaWWXd3YCDE6ao4fmv91RthA==}
-    engines: {node: '>= 14.18'}
-    peerDependencies:
-      '@svgdotjs/svg.js': ^3.2.4
-      '@svgdotjs/svg.select.js': ^4.0.1
-
-  '@svgdotjs/svg.select.js@4.0.3':
-    resolution: {integrity: sha512-qkMgso1sd2hXKd1FZ1weO7ANq12sNmQJeGDjs46QwDVsxSRcHmvWKL2NDF7Yimpwf3sl5esOLkPqtV2bQ3v/Jg==}
-    engines: {node: '>= 14.18'}
-    peerDependencies:
-      '@svgdotjs/svg.js': ^3.2.4
-
  '@szmarczak/http-timer@5.0.1':
    resolution: {integrity: sha512-+PmQX0PiAYPMeVYe237LJAYvOMYW1j2rH5YROyS3b4CTVJum34HfRvKvAzozHAQG0TnHNdUfY9nCeUyRAs//cw==}
    engines: {node: '>=14.16'}
@@ -1782,11 +1772,11 @@ packages:
  '@types/node-forge@1.3.14':
    resolution: {integrity: sha512-mhVF2BnD4BO+jtOp7z1CdzaK4mbuK0LLQYAvdOLqHTavxFNq4zA1EmYkpnFjP8HOUzedfQkRnp0E2ulSAYSzAw==}

-  '@types/node@22.19.7':
-    resolution: {integrity: sha512-MciR4AKGHWl7xwxkBa6xUGxQJ4VBOmPTF7sL+iGzuahOFaO0jHCsuEfS80pan1ef4gWId1oWOweIhrDEYLuaOw==}
+  '@types/node@22.19.11':
+    resolution: {integrity: sha512-BH7YwL6rA93ReqeQS1c4bsPpcfOmJasG+Fkr6Y59q83f9M1WcBRHR2vM+P9eOisYRcN3ujQoiZY8uk5W+1WL8w==}

-  '@types/node@25.0.10':
-    resolution: {integrity: sha512-zWW5KPngR/yvakJgGOmZ5vTBemDoSqF3AcV/LrO5u5wTWyEAVVh+IT39G4gtyAkh3CtTZs8aX/yRM82OfzHJRg==}
+  '@types/node@25.2.3':
+    resolution: {integrity: sha512-m0jEgYlYz+mDJZ2+F4v8D1AyQb+QzsNqRuI7xg1VQX/KlKS0qT9r1Mo16yo5F/MtifXFgaofIFsdFMox2SxIbQ==}

  '@types/ping@0.4.4':
    resolution: {integrity: sha512-ifvo6w2f5eJYlXm+HiVx67iJe8WZp87sfa683nlqED5Vnt9Z93onkokNoWqOG21EaE8fMxyKPobE+mkPEyxsdw==}
@@ -1904,8 +1894,8 @@ packages:
    resolution: {integrity: sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==}
    engines: {node: '>=12'}

-  apexcharts@5.3.6:
-    resolution: {integrity: sha512-sVEPw+J0Gp0IHQabKu8cfdsxlfME0e36Wid7RIaPclGM2OUt+O7O4+6mfAmTUYhy5bDk8cNHzEhPfVtLCIXEJA==}
+  apexcharts@5.5.0:
+    resolution: {integrity: sha512-r0GzBUmIAihVDHiPTWrKzd2I+T2Dw+oZTDBRJeBExUuCyqEaCe2pAMEKZnTbJQXyDAhCBzPgkM2SeeKQuW4Ddw==}

  argparse@1.0.10:
    resolution: {integrity: sha512-o5Roy6tNG4SL/FOkCAN6RzjiakZS25RLYFrcMttJqbdd8BWrnA+fGz57iN5Pb06pvBGvl5gQ0B48dJlslXvoTg==}
@@ -1927,8 +1917,8 @@ packages:
  asynckit@0.4.0:
    resolution: {integrity: sha1-x57Zf380y48robyXkLzDZkdLS3k=}

-  axios@1.13.2:
-    resolution: {integrity: sha512-VPk9ebNqPcy5lRGuSlKx752IlDatOjT9paPlm8A7yOuW2Fbvp4X3JznJtT4f0GzGLLiWE9W8onz51SqLYwzGaA==}
+  axios@1.13.3:
+    resolution: {integrity: sha512-ERT8kdX7DZjtUm7IitEyV7InTHAF42iJuMArIiDIV5YtPanJkgw4hw5Dyg9fh0mihdWNn1GKaeIWErfe56UQ1g==}

  b4a@1.7.3:
    resolution: {integrity: sha512-5Q2mfq2WfGuFp3uS//0s6baOJLMoVduPYVeNmDYxu5OUA1/cBfvr2RIS7vi62LdNj/urk1hfmj867I3qt6uZ7Q==}
@@ -1952,8 +1942,8 @@ packages:
      bare-abort-controller:
        optional: true

-  bare-fs@4.5.2:
-    resolution: {integrity: sha512-veTnRzkb6aPHOvSKIOy60KzURfBdUflr5VReI+NSaPL6xf+XLdONQgZgpYvUuZLVQ8dCqxpBAudaOM1+KpAUxw==}
+  bare-fs@4.5.3:
+    resolution: {integrity: sha512-9+kwVx8QYvt3hPWnmb19tPnh38c6Nihz8Lx3t0g9+4GoIf3/fTgYwM4Z6NxgI+B9elLQA7mLE9PpqcWtOMRDiQ==}
    engines: {bare: '>=1.16.0'}
    peerDependencies:
      bare-buffer: '*'
@@ -2164,6 +2154,10 @@ packages:
  crelt@1.0.6:
    resolution: {integrity: sha512-VQ2MBenTq1fWZUH9DJNGti7kKv6EeAuYr3cLwxUWhIu1baTaXh4Ib5W2CqHVqib4/MqbYGJqiL3Zb8GJZr3l4g==}

+  croner@10.0.1:
+    resolution: {integrity: sha512-ixNtAJndqh173VQ4KodSdJEI6nuioBWI0V1ITNKhZZsO0pEMoDxz539T4FTTbSZ/xIOSuDnzxLVRqBVSvPNE2g==}
+    engines: {node: '>=18.0'}
+
  croner@9.1.0:
    resolution: {integrity: sha512-p9nwwR4qyT5W996vBZhdvBCnMhicY5ytZkR4D1Xj0wuTDEiMnjwR57Q3RXYY/s0EpX6Ay3vgIcfaR+ewGHsi+g==}
    engines: {node: '>=18.0'}
@@ -2857,12 +2851,12 @@ packages:
    resolution: {integrity: sha512-jumlc0BIUrS3qJGgIkWZsyfAM7NCWiBcCDhnd+3NNM5KbBmLTgHVfWBcg6W+rLUsIpzpERPsvwUP7CckAQSOoA==}
    engines: {node: '>=12'}

-  lucide@0.562.0:
-    resolution: {integrity: sha512-k1Fb8ZMnRQovWRlea7Jr0b9UKA29IM7/cu79+mJrhVohvA2YC/Ti3Sk+G+h/SIu3IlrKT4RAbWMHUBBQd1O6XA==}
-
  lucide@0.563.0:
    resolution: {integrity: sha512-2zBzDJ5n2Plj3d0ksj6h9TWPOSiKu9gtxJxnBAye11X/8gfWied6IYJn6ADYBp1NPoJmgpyOYP3wMrVx69+2AA==}

+  lucide@0.564.0:
+    resolution: {integrity: sha512-FasyXKHWon773WIl3HeCQpd5xS6E0aLjqxiQStlHNKktni+HDncc1sqY+6vRUbCfmDsIaKQz43EEQLAUDLZO0g==}
+
  make-dir@3.1.0:
    resolution: {integrity: sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==}
    engines: {node: '>=8'}
@@ -4043,12 +4037,24 @@ snapshots:
      '@push.rocks/webrequest': 3.0.37
      '@push.rocks/webstream': 1.0.10

+  '@api.global/typedrequest@3.2.6':
+    dependencies:
+      '@api.global/typedrequest-interfaces': 3.0.19
+      '@push.rocks/isounique': 1.0.5
+      '@push.rocks/lik': 6.2.2
+      '@push.rocks/smartbuffer': 3.0.5
+      '@push.rocks/smartdelay': 3.0.5
+      '@push.rocks/smartguard': 3.1.0
+      '@push.rocks/smartpromise': 4.2.3
+      '@push.rocks/webrequest': 4.0.1
+      '@push.rocks/webstream': 1.0.10
+
  '@api.global/typedserver@3.0.80(@push.rocks/smartserve@2.0.1)':
    dependencies:
      '@api.global/typedrequest': 3.2.5
      '@api.global/typedrequest-interfaces': 3.0.19
      '@api.global/typedsocket': 3.1.1(@push.rocks/smartserve@2.0.1)
-      '@cloudflare/workers-types': 4.20260124.0
+      '@cloudflare/workers-types': 4.20260127.0
      '@design.estate/dees-comms': 1.0.30
      '@push.rocks/lik': 6.2.2
      '@push.rocks/smartchok': 1.2.0
@@ -4093,11 +4099,11 @@ snapshots:

  '@api.global/typedserver@8.3.0(@tiptap/pm@2.27.2)':
    dependencies:
-      '@api.global/typedrequest': 3.2.5
+      '@api.global/typedrequest': 3.2.6
      '@api.global/typedrequest-interfaces': 3.0.19
      '@api.global/typedsocket': 4.1.0(@push.rocks/smartserve@2.0.1)
-      '@cloudflare/workers-types': 4.20260124.0
-      '@design.estate/dees-catalog': 3.37.0(@tiptap/pm@2.27.2)
+      '@cloudflare/workers-types': 4.20260214.0
+      '@design.estate/dees-catalog': 3.42.0(@tiptap/pm@2.27.2)
      '@design.estate/dees-comms': 1.0.30
      '@push.rocks/lik': 6.2.2
      '@push.rocks/smartdelay': 3.0.5
@@ -4106,7 +4112,7 @@ snapshots:
      '@push.rocks/smartfile': 13.1.2
      '@push.rocks/smartfs': 1.3.1
      '@push.rocks/smartjson': 5.2.0
-      '@push.rocks/smartlog': 3.1.10
+      '@push.rocks/smartlog': 3.1.11
      '@push.rocks/smartlog-destination-devtools': 1.0.12
      '@push.rocks/smartlog-interfaces': 3.0.2
      '@push.rocks/smartmanifest': 2.0.2
@@ -4121,7 +4127,7 @@ snapshots:
      '@push.rocks/smartserve': 2.0.1
      '@push.rocks/smartsitemap': 2.0.4
      '@push.rocks/smartstream': 3.2.5
-      '@push.rocks/smarttime': 4.1.1
+      '@push.rocks/smarttime': 4.2.3
      '@push.rocks/smartwatch': 6.3.0
      '@push.rocks/taskbuffer': 3.5.0
      '@push.rocks/webrequest': 4.0.1
@@ -4159,7 +4165,7 @@ snapshots:

  '@api.global/typedsocket@4.1.0(@push.rocks/smartserve@2.0.1)':
    dependencies:
-      '@api.global/typedrequest': 3.2.5
+      '@api.global/typedrequest': 3.2.6
      '@api.global/typedrequest-interfaces': 3.0.19
      '@push.rocks/isohash': 2.0.1
      '@push.rocks/smartdelay': 3.0.5
@@ -4717,17 +4723,19 @@ snapshots:

  '@cfworker/json-schema@4.1.1': {}

-  '@cloudflare/workers-types@4.20260124.0': {}
+  '@cloudflare/workers-types@4.20260127.0': {}
+
+  '@cloudflare/workers-types@4.20260214.0': {}

  '@configvault.io/interfaces@1.0.17':
    dependencies:
      '@api.global/typedrequest-interfaces': 3.0.19

-  '@design.estate/dees-catalog@3.37.0(@tiptap/pm@2.27.2)':
+  '@design.estate/dees-catalog@3.42.0(@tiptap/pm@2.27.2)':
    dependencies:
-      '@design.estate/dees-domtools': 2.3.7
-      '@design.estate/dees-element': 2.1.5
-      '@design.estate/dees-wcctools': 3.7.1
+      '@design.estate/dees-domtools': 2.3.8
+      '@design.estate/dees-element': 2.1.6
+      '@design.estate/dees-wcctools': 3.8.0
      '@fortawesome/fontawesome-svg-core': 7.1.0
      '@fortawesome/free-brands-svg-icons': 7.1.0
      '@fortawesome/free-regular-svg-icons': 7.1.0
@@ -4743,10 +4751,10 @@ snapshots:
      '@tiptap/extension-underline': 2.27.2(@tiptap/core@2.27.2(@tiptap/pm@2.27.2))
      '@tiptap/starter-kit': 2.27.2
      '@tsclass/tsclass': 9.3.0
-      apexcharts: 5.3.6
+      apexcharts: 5.5.0
      highlight.js: 11.11.1
      ibantools: 4.5.1
-      lucide: 0.562.0
+      lucide: 0.563.0
      monaco-editor: 0.55.1
      pdfjs-dist: 4.10.38
      xterm: 5.3.0
@@ -4765,7 +4773,7 @@ snapshots:
      '@push.rocks/smartdelay': 3.0.5
      broadcast-channel: 7.3.0

-  '@design.estate/dees-domtools@2.3.7':
+  '@design.estate/dees-domtools@2.3.8':
    dependencies:
      '@api.global/typedrequest': 3.2.5
      '@design.estate/dees-comms': 1.0.30
@@ -4791,9 +4799,9 @@ snapshots:
      - supports-color
      - vue

-  '@design.estate/dees-element@2.1.5':
+  '@design.estate/dees-element@2.1.6':
    dependencies:
-      '@design.estate/dees-domtools': 2.3.7
+      '@design.estate/dees-domtools': 2.3.8
      '@push.rocks/isounique': 1.0.5
      '@push.rocks/smartrx': 3.0.10
      lit: 3.3.2
@@ -4803,10 +4811,10 @@ snapshots:
      - supports-color
      - vue

-  '@design.estate/dees-wcctools@3.7.1':
+  '@design.estate/dees-wcctools@3.8.0':
    dependencies:
-      '@design.estate/dees-domtools': 2.3.7
-      '@design.estate/dees-element': 2.1.5
+      '@design.estate/dees-domtools': 2.3.8
+      '@design.estate/dees-element': 2.1.6
      '@push.rocks/smartdelay': 3.0.5
      lit: 3.3.2
    transitivePeerDependencies:
@@ -5002,7 +5010,7 @@ snapshots:
      '@push.rocks/smartshell': 3.3.0
      tsx: 4.21.0

-  '@git.zone/tstest@3.1.7(@push.rocks/smartserve@2.0.1)(socks@2.8.7)(typescript@5.9.3)':
+  '@git.zone/tstest@3.1.8(@push.rocks/smartserve@2.0.1)(socks@2.8.7)(typescript@5.9.3)':
    dependencies:
      '@api.global/typedserver': 3.0.80(@push.rocks/smartserve@2.0.1)
      '@git.zone/tsbundle': 2.8.3
@@ -5051,7 +5059,7 @@ snapshots:
      - utf-8-validate
      - vue

-  '@git.zone/tswatch@3.0.1(@tiptap/pm@2.27.2)':
+  '@git.zone/tswatch@3.1.0(@tiptap/pm@2.27.2)':
    dependencies:
      '@api.global/typedserver': 8.3.0(@tiptap/pm@2.27.2)
      '@git.zone/tsbundle': 2.8.3
@@ -5063,11 +5071,11 @@ snapshots:
      '@push.rocks/smartdelay': 3.0.5
      '@push.rocks/smartfs': 1.3.1
      '@push.rocks/smartinteract': 2.0.16
-      '@push.rocks/smartlog': 3.1.10
+      '@push.rocks/smartlog': 3.1.11
      '@push.rocks/smartlog-destination-local': 9.0.2
      '@push.rocks/smartshell': 3.3.0
      '@push.rocks/smartwatch': 6.3.0
-      '@push.rocks/taskbuffer': 3.5.0
+      '@push.rocks/taskbuffer': 4.2.1
    transitivePeerDependencies:
      - '@nuxt/kit'
      - '@swc/helpers'
@@ -5100,7 +5108,7 @@ snapshots:
      '@inquirer/figures': 1.0.15
      '@inquirer/type': 2.0.0
      '@types/mute-stream': 0.0.4
-      '@types/node': 22.19.7
+      '@types/node': 22.19.11
      '@types/wrap-ansi': 3.0.0
      ansi-escapes: 4.3.2
      cli-width: 4.1.0
@@ -5572,7 +5580,7 @@ snapshots:
    transitivePeerDependencies:
      - aws-crt

-  '@push.rocks/smartbucket@4.3.1':
+  '@push.rocks/smartbucket@4.4.1':
    dependencies:
      '@aws-sdk/client-s3': 3.975.0
      '@push.rocks/smartmime': 2.0.4
@@ -5828,6 +5836,19 @@ snapshots:
      '@push.rocks/webrequest': 3.0.37
      '@tsclass/tsclass': 9.3.0

+  '@push.rocks/smartlog@3.1.11':
+    dependencies:
+      '@api.global/typedrequest-interfaces': 3.0.19
+      '@push.rocks/consolecolor': 2.0.3
+      '@push.rocks/isounique': 1.0.5
+      '@push.rocks/smartclickhouse': 2.0.17
+      '@push.rocks/smartfile': 11.2.7
+      '@push.rocks/smarthash': 3.2.6
+      '@push.rocks/smartpromise': 4.2.3
+      '@push.rocks/smarttime': 4.2.3
+      '@push.rocks/webrequest': 4.0.1
+      '@tsclass/tsclass': 9.3.0
+
  '@push.rocks/smartmanifest@2.0.2': {}

  '@push.rocks/smartmarkdown@3.0.3':
@@ -5916,7 +5937,7 @@ snapshots:

  '@push.rocks/smartntml@2.0.8':
    dependencies:
-      '@design.estate/dees-element': 2.1.5
+      '@design.estate/dees-element': 2.1.6
      '@happy-dom/global-registrator': 15.11.7
      '@push.rocks/smartpromise': 4.2.3
      fake-indexeddb: 6.2.5
@@ -6023,7 +6044,7 @@ snapshots:

  '@push.rocks/smarts3@3.0.3':
    dependencies:
-      '@push.rocks/smartbucket': 4.3.1
+      '@push.rocks/smartbucket': 4.4.1
      '@push.rocks/smartfs': 1.3.1
      '@push.rocks/smartpath': 6.0.0
      '@push.rocks/smartxml': 2.0.0
@@ -6033,11 +6054,11 @@ snapshots:

  '@push.rocks/smartserve@2.0.1':
    dependencies:
-      '@api.global/typedrequest': 3.2.5
+      '@api.global/typedrequest': 3.2.6
      '@cfworker/json-schema': 4.1.1
      '@push.rocks/lik': 6.2.2
      '@push.rocks/smartenv': 6.0.0
-      '@push.rocks/smartlog': 3.1.10
+      '@push.rocks/smartlog': 3.1.11
      '@push.rocks/smartpath': 6.0.0
      ws: 8.19.0
    transitivePeerDependencies:
@@ -6136,6 +6157,17 @@ snapshots:
      is-nan: 1.3.2
      pretty-ms: 9.3.0

+  '@push.rocks/smarttime@4.2.3':
+    dependencies:
+      '@push.rocks/lik': 6.2.2
+      '@push.rocks/smartdelay': 3.0.5
+      '@push.rocks/smartpromise': 4.2.3
+      croner: 10.0.1
+      date-fns: 4.1.0
+      dayjs: 1.11.19
+      is-nan: 1.3.2
+      pretty-ms: 9.3.0
+
  '@push.rocks/smartunique@3.0.9':
    dependencies:
      '@types/uuid': 9.0.8
@@ -6173,7 +6205,7 @@ snapshots:

  '@push.rocks/taskbuffer@3.5.0':
    dependencies:
-      '@design.estate/dees-element': 2.1.5
+      '@design.estate/dees-element': 2.1.6
      '@push.rocks/lik': 6.2.2
      '@push.rocks/smartdelay': 3.0.5
      '@push.rocks/smartlog': 3.1.10
@@ -6187,6 +6219,22 @@ snapshots:
      - supports-color
      - vue

+  '@push.rocks/taskbuffer@4.2.1':
+    dependencies:
+      '@design.estate/dees-element': 2.1.6
+      '@push.rocks/lik': 6.2.2
+      '@push.rocks/smartdelay': 3.0.5
+      '@push.rocks/smartlog': 3.1.11
+      '@push.rocks/smartpromise': 4.2.3
+      '@push.rocks/smartrx': 3.0.10
+      '@push.rocks/smarttime': 4.2.3
+      '@push.rocks/smartunique': 3.0.9
+    transitivePeerDependencies:
+      - '@nuxt/kit'
+      - react
+      - supports-color
+      - vue
+
  '@push.rocks/webrequest@3.0.37':
    dependencies:
      '@push.rocks/smartdelay': 3.0.5
@@ -6711,25 +6759,6 @@ snapshots:

  '@socket.io/component-emitter@3.1.2': {}

-  '@svgdotjs/svg.draggable.js@3.0.6(@svgdotjs/svg.js@3.2.5)':
-    dependencies:
-      '@svgdotjs/svg.js': 3.2.5
-
-  '@svgdotjs/svg.filter.js@3.0.9':
-    dependencies:
-      '@svgdotjs/svg.js': 3.2.5
-
-  '@svgdotjs/svg.js@3.2.5': {}
-
-  '@svgdotjs/svg.resize.js@2.0.5(@svgdotjs/svg.js@3.2.5)(@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5))':
-    dependencies:
-      '@svgdotjs/svg.js': 3.2.5
-      '@svgdotjs/svg.select.js': 4.0.3(@svgdotjs/svg.js@3.2.5)
-
-  '@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5)':
-    dependencies:
-      '@svgdotjs/svg.js': 3.2.5
-
  '@szmarczak/http-timer@5.0.1':
    dependencies:
      defer-to-connect: 2.0.1
@@ -6914,27 +6943,27 @@ snapshots:

  '@types/bn.js@5.2.0':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/body-parser@1.19.6':
    dependencies:
      '@types/connect': 3.4.38
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/buffer-json@2.0.3': {}

  '@types/clean-css@4.2.11':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3
      source-map: 0.6.1

  '@types/connect@3.4.38':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/cors@2.8.19':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/debug@4.1.12':
    dependencies:
@@ -6942,7 +6971,7 @@ snapshots:

  '@types/dns-packet@5.6.5':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/elliptic@6.4.18':
    dependencies:
@@ -6950,7 +6979,7 @@ snapshots:

  '@types/express-serve-static-core@5.1.1':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3
      '@types/qs': 6.14.0
      '@types/range-parser': 1.2.7
      '@types/send': 1.2.1
@@ -6963,17 +6992,17 @@ snapshots:

  '@types/from2@2.3.6':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/fs-extra@11.0.4':
    dependencies:
      '@types/jsonfile': 6.1.4
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/glob@8.1.0':
    dependencies:
      '@types/minimatch': 5.1.2
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/hast@3.0.4':
    dependencies:
@@ -6995,7 +7024,7 @@ snapshots:

  '@types/jsonfile@6.1.4':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/linkify-it@5.0.0': {}

@@ -7018,17 +7047,17 @@ snapshots:

  '@types/mute-stream@0.0.4':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/node-forge@1.3.14':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

-  '@types/node@22.19.7':
+  '@types/node@22.19.11':
    dependencies:
      undici-types: 6.21.0

-  '@types/node@25.0.10':
+  '@types/node@25.2.3':
    dependencies:
      undici-types: 7.16.0

@@ -7046,22 +7075,22 @@ snapshots:

  '@types/send@1.2.1':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/serve-static@2.2.0':
    dependencies:
      '@types/http-errors': 2.0.5
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/symbol-tree@3.2.5': {}

  '@types/tar-stream@3.1.4':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/through2@2.0.41':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/trusted-types@2.0.7': {}

@@ -7087,11 +7116,11 @@ snapshots:

  '@types/ws@8.18.1':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3

  '@types/yauzl@2.10.3':
    dependencies:
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3
    optional: true

  '@ungap/structured-clone@1.3.0': {}
@@ -7112,7 +7141,7 @@ snapshots:
    dependencies:
      '@peculiar/x509': 1.14.3
      asn1js: 3.0.7
-      axios: 1.13.2(debug@4.4.3)
+      axios: 1.13.3(debug@4.4.3)
      debug: 4.4.3
      node-forge: 1.3.3
    transitivePeerDependencies:
@@ -7140,13 +7169,8 @@ snapshots:

  ansi-styles@6.2.3: {}

-  apexcharts@5.3.6:
+  apexcharts@5.5.0:
    dependencies:
-      '@svgdotjs/svg.draggable.js': 3.0.6(@svgdotjs/svg.js@3.2.5)
-      '@svgdotjs/svg.filter.js': 3.0.9
-      '@svgdotjs/svg.js': 3.2.5
-      '@svgdotjs/svg.resize.js': 2.0.5(@svgdotjs/svg.js@3.2.5)(@svgdotjs/svg.select.js@4.0.3(@svgdotjs/svg.js@3.2.5))
-      '@svgdotjs/svg.select.js': 4.0.3(@svgdotjs/svg.js@3.2.5)
      '@yr/monotone-cubic-spline': 1.0.3

  argparse@1.0.10:
@@ -7171,7 +7195,7 @@ snapshots:

  asynckit@0.4.0: {}

-  axios@1.13.2(debug@4.4.3):
+  axios@1.13.3(debug@4.4.3):
    dependencies:
      follow-redirects: 1.15.11(debug@4.4.3)
      form-data: 4.0.5
@@ -7187,7 +7211,7 @@ snapshots:

  bare-events@2.8.2: {}

-  bare-fs@4.5.2:
+  bare-fs@4.5.3:
    dependencies:
      bare-events: 2.8.2
      bare-path: 3.0.0
@@ -7398,6 +7422,8 @@ snapshots:

  crelt@1.0.6: {}

+  croner@10.0.1: {}
+
  croner@9.1.0: {}

  cross-spawn@7.0.6:
@@ -7523,7 +7549,7 @@ snapshots:
  engine.io@6.6.4:
    dependencies:
      '@types/cors': 2.8.19
-      '@types/node': 25.0.10
+      '@types/node': 25.2.3
      accepts: 1.3.8
      base64id: 2.0.0
      cookie: 0.7.2
@@ -8189,10 +8215,10 @@ snapshots:

  lru-cache@7.18.3: {}

-  lucide@0.562.0: {}
-
  lucide@0.563.0: {}

+  lucide@0.564.0: {}
+
  make-dir@3.1.0:
    dependencies:
      semver: 6.3.1
@@ -9403,7 +9429,7 @@ snapshots:
      pump: 3.0.3
      tar-stream: 3.1.7
    optionalDependencies:
-      bare-fs: 4.5.2
+      bare-fs: 4.5.3
      bare-path: 3.0.0
    transitivePeerDependencies:
      - bare-abort-controller
--- a/readme.hints.md
+++ b/readme.hints.md
@@ -912,6 +912,93 @@ appui.getBottomBarVisible();
 - `ts_web/elements/00group-appui/dees-appui-bottombar/dees-appui-bottombar.demo.ts` - Demo
 - `ts_web/elements/interfaces/appconfig.ts` - New interfaces added

+## Media Components (2026-01-26)
+
+New media viewer components and a unified preview composite component.
+
+### Directory: `ts_web/elements/00group-media/`
+
+#### dees-image-viewer
+- Image display with zoom, pan, fit, and download controls
+- Properties: `src`, `alt`, `fit` ('contain'|'cover'|'actual'), `showToolbar`
+- Features: mouse wheel zoom, click-drag pan, double-click toggle, checkerboard transparency background
+- Toolbar matches PDF viewer pattern (48px height, 32px buttons, 16px icons, 6px border-radius)
+
+#### dees-audio-viewer
+- Audio player with waveform visualization via Web Audio API
+- Properties: `src`, `title`, `artist`, `showWaveform`, `autoplay`, `loop`
+- Features: canvas waveform rendering, play/pause, seek, volume control, mute toggle, loop toggle
+- Uses `HTMLAudioElement` for playback, `AudioContext.decodeAudioData` for waveform data
+
+#### dees-video-viewer
+- Video player with custom overlay controls
+- Properties: `src`, `poster`, `showControls`, `autoplay`, `loop`, `muted`
+- Features: custom controls bar with gradient, seekbar, volume slider, fullscreen toggle, auto-hide controls, 16:9 aspect ratio
+
+### dees-preview (Composite Component)
+- Auto-detects content type and delegates to the appropriate viewer
+- Directory: `ts_web/elements/dees-preview/`
+- Properties: `url`, `file` (File object), `base64`, `textContent`, `contentType` (override), `language`, `mimeType`, `filename`, `showToolbar`, `showFilename`
+- Content type detection priority: explicit override → MIME type → file extension → fallback
+- Renders: image→DeesImageViewer, pdf→DeesPdfViewer, code→DeesDataviewCodebox, audio→DeesAudioViewer, video→DeesVideoViewer, text→pre, unknown→placeholder
+- Header bar with file type icon, filename, and type badge
+
+### dees-dataview-codebox modification
+- Removed `<dees-windowcontrols>` elements from the appbar (Step 1 of the plan)
+- Now shows clean centered filename title bar without fake window buttons
+
+### Icon Sizing Convention
+- All `dees-icon` elements in buttons need explicit `font-size: 16px` CSS rule
+- Toolbar buttons: 32px × 32px, border-radius: 6px
+- Placeholder/error icons: `font-size: 32px`
+- Pattern: `.button-class dees-icon { font-size: 16px; }`
+
+## Tile Component System (2026-01-27)
+
+A family of 200×260px content preview cards with a shared abstract base class. All tiles support lazy loading (IntersectionObserver with 200px margin), hover lift effect, click events, loading/error states, and three sizes (small: 150×195, default: 200×260, large: 250×325).
+
+### Architecture
+
+- **DeesTileBase** (`dees-tile-shared/DeesTileBase.ts`) — Abstract base class extending DeesElement
+  - Common properties: `clickable`, `loading`, `error`, `size`, `label`
+  - IntersectionObserver lazy loading via `onBecameVisible()` hook
+  - Click dispatch via `tile-click` CustomEvent (detail from `getTileClickDetail()`)
+  - Subclasses implement `renderTileContent(): TemplateResult`
+
+### Components
+
+| Tag | Class | Description |
+|-----|-------|-------------|
+| `dees-tile-pdf` | `DeesTilePdf` | PDF page thumbnail with hover-to-browse pages. Canvas-rendered via PDF.js/CanvasPool. |
+| `dees-tile-image` | `DeesTileImage` | Image thumbnail with `object-fit: cover`, dimension detection on load |
+| `dees-tile-audio` | `DeesTileAudio` | Music icon + mini waveform (AudioContext decode), duration badge |
+| `dees-tile-video` | `DeesTileVideo` | Auto-captured first frame, duration badge, hover muted auto-preview |
+| `dees-tile-note` | `DeesTileNote` | First ~12 lines of text in monospace, gradient fade, optional language badge |
+| `dees-tile-folder` | `DeesTileFolder` | 2×2 grid of mini-previews (thumbnails or type icons), item count badge |
+
+### Deprecations
+
+- `dees-pdf-preview` → Use `dees-tile-pdf` instead. Old tag still works as a thin wrapper with console warning.
+- `dees-pdf` deprecation comment updated to reference `DeesTilePdf`.
+
+### File Structure
+
+All tile components live in `ts_web/elements/00group-media/dees-tile-*/`:
+- `component.ts` — Main component class
+- `demo.ts` — Demo function
+- `index.ts` — Re-export
+- `styles.ts` — (PDF tile only) Component-specific styles
+- Shared base: `dees-tile-shared/{DeesTileBase,styles,index}.ts`
+
+### Interface: ITileFolderItem
+```typescript
+interface ITileFolderItem {
+  type: 'pdf' | 'image' | 'audio' | 'video' | 'note' | 'folder' | 'unknown';
+  thumbnailSrc?: string;
+  name: string;
+}
+```
+
 ## StatsGrid Enhancements (2026-01-12)

 ### Column Spanning
@@ -973,4 +1060,51 @@ Features:
 - `trend` - Sparkline with recent data
 - `text` - Text value display
 - `multiPercentage` - Multiple progress bars
- `cpuCores` - Vertical bar visualization for CPU cores
+- `cpuCores` - Vertical bar visualization for CPU cores
+
+## Component Group Taxonomy (2026-01-27)
+
+All components are organized into `00group-*` directories with 14 groups visible in the wcctools sidebar. The `demoGroups` property (plural, `string[]`) replaces the old `demoGroup` (singular). Components can belong to multiple groups.
+
+### Group Directories
+| Directory | Group Name | Count |
+|-----------|-----------|-------|
+| `00group-appui` | App UI | 10 |
+| `00group-button` | Button | 3 |
+| `00group-chart` | Chart | 2 |
+| `00group-dataview` | Data View | 4 |
+| `00group-feedback` | Feedback | 6 |
+| `00group-form` | Form | 2 |
+| `00group-input` | Input | 18 |
+| `00group-layout` | Layout | 7 |
+| `00group-media` | Media | 14 (viewers + PDF + tiles) |
+| `00group-overlay` | Overlay | 4 |
+| `00group-simple` | Simple | 3 |
+| `00group-utility` | Utility | 5 |
+| `00group-workspace` | Workspace | 9 |
+| `00group-runtime` | (internal) | - |
+
+### Multi-Group Components
+Some components appear in multiple groups via `demoGroups = ['Primary', 'Secondary']`:
+- `dees-chart-log`: Chart, Workspace
+- `dees-dataview-codebox`: Data View, Workspace
+- `dees-input-code`: Input, Workspace
+- `dees-input-wysiwyg`: Input, Workspace
+- `dees-form-submit`: Form, Button
+- `dees-preview`: Media, Data View
+- `dees-pdf*` / `dees-tile-pdf`: Media, PDF
+- `dees-stepper`: Layout, Form
+- `dees-label`: Layout, Input
+- `dees-toast`: Feedback, Overlay
+- `dees-actionbar`: Feedback, Overlay
+
+### Import Conventions
+- Within same group: `import '../sibling-component/file.js'`
+- Cross-group (from depth-2): `import '../../00group-X/component/file.js'`
+- Shared utilities: `import '../../00plugins.js'`, `import '../../00theme.js'`, etc.
+
+### Key Notes
+- The old `demoGroup` property (singular, string) is fully removed
+- All 79 components with demos use `demoGroups` (plural, string[])
+- `00group-pdf` no longer exists; PDF components are in `00group-media`
+- `dees-search` and `dees-tooltip` remain standalone (no demos)
--- a/readme.md
+++ b/readme.md
@@ -1,6 +1,6 @@
 # @design.estate/dees-catalog

-A comprehensive web components library built with TypeScript and LitElement, providing **80+ production-ready UI components** for building modern web applications with consistent design and behavior. 🚀
+A comprehensive web components library built with TypeScript and LitElement, providing **90+ production-ready UI components** for building modern web applications with consistent design and behavior. 🚀

 [![TypeScript](https://img.shields.io/badge/TypeScript-5.0+-blue.svg)](https://www.typescriptlang.org/)
 [![LitElement](https://img.shields.io/badge/LitElement-4.0+-orange.svg)](https://lit.dev/)
@@ -11,12 +11,15 @@ For reporting bugs, issues, or security vulnerabilities, please visit [community

 ## ✨ Features

- 🎨 **Consistent Design System** - Beautiful, cohesive components following modern UI/UX principles
- 🌙 **Dark/Light Theme Support** - All components automatically adapt to your theme
- ⌨️ **Keyboard Accessible** - Full keyboard navigation and ARIA support
- 📱 **Responsive** - Mobile-first design that works across all screen sizes
- 🔧 **TypeScript-First** - Fully typed APIs with excellent IDE support
- 🧩 **Modular** - Use only what you need, tree-shakeable architecture
+- 🎨 **Consistent Design System** — Beautiful, cohesive components following modern UI/UX principles
+- 🌙 **Dark/Light Theme Support** — All components automatically adapt to your theme
+- ⌨️ **Keyboard Accessible** — Full keyboard navigation and ARIA support
+- 📱 **Responsive** — Mobile-first design that works across all screen sizes
+- 🔧 **TypeScript-First** — Fully typed APIs with excellent IDE support
+- 🧩 **Modular** — Use only what you need, tree-shakeable architecture
+- 🏗️ **Full App Shell** — `dees-appui` provides a complete application framework with menus, routing, activity log, and bottom bar
+- 🎬 **Media Components** — Rich tile-based previews for PDFs, images, audio, video, notes, and folders
+- 💻 **IDE Workspace** — Full workspace component with Monaco editor, file tree, terminal, and diff viewer

 ## 📦 Installation

@@ -52,16 +55,17 @@ For developers working on this library, please refer to the [UI Components Playb

 | Category | Components |
 |----------|------------|
-| **Core UI** | [`DeesButton`](#deesbutton), [`DeesButtonExit`](#deesbuttonexit), [`DeesButtonGroup`](#deesbuttongroup), [`DeesBadge`](#deesbadge), [`DeesChips`](#deeschips), [`DeesHeading`](#deesheading), [`DeesHint`](#deeshint), [`DeesIcon`](#deesicon), [`DeesLabel`](#deeslabel), [`DeesPanel`](#deespanel), [`DeesSearchbar`](#deessearchbar), [`DeesSpinner`](#deesspinner), [`DeesToast`](#deestoast), [`DeesWindowcontrols`](#deeswindowcontrols) |
-| **Forms** | [`DeesForm`](#deesform), [`DeesInputText`](#deesinputtext), [`DeesInputCheckbox`](#deesinputcheckbox), [`DeesInputDropdown`](#deesinputdropdown), [`DeesInputRadiogroup`](#deesinputradiogroup), [`DeesInputFileupload`](#deesinputfileupload), [`DeesInputIban`](#deesinputiban), [`DeesInputPhone`](#deesinputphone), [`DeesInputQuantitySelector`](#deesinputquantityselector), [`DeesInputMultitoggle`](#deesinputmultitoggle), [`DeesInputTags`](#deesinputtags), [`DeesInputTypelist`](#deesinputtypelist), [`DeesInputList`](#deesinputlist), [`DeesInputProfilepicture`](#deesinputprofilepicture), [`DeesInputRichtext`](#deesinputrichtext), [`DeesInputWysiwyg`](#deesinputwysiwyg), [`DeesInputDatepicker`](#deesinputdatepicker), [`DeesInputSearchselect`](#deesinputsearchselect), [`DeesFormSubmit`](#deesformsubmit) |
-| **Layout** | [`DeesAppui`](#deesappui), [`DeesAppuiMainmenu`](#deesappuimainmenu), [`DeesAppuiSecondarymenu`](#deesappuisecondarymenu), [`DeesAppuiMaincontent`](#deesappuimaincontent), [`DeesAppuiAppbar`](#deesappuiappbar), [`DeesAppuiActivitylog`](#deesappuiactivitylog), [`DeesAppuiProfiledropdown`](#deesappuiprofiledropdown), [`DeesAppuiTabs`](#deesappuitabs), [`DeesMobileNavigation`](#deesmobilenavigation), [`DeesDashboardGrid`](#deesdashboardgrid) |
+| **Core UI** | [`DeesButton`](#deesbutton), [`DeesButtonExit`](#deesbuttonexit), [`DeesButtonGroup`](#deesbuttongroup), [`DeesBadge`](#deesbadge), [`DeesChips`](#deeschips), [`DeesHeading`](#deesheading), [`DeesHint`](#deeshint), [`DeesIcon`](#deesicon), [`DeesLabel`](#deeslabel), [`DeesPanel`](#deespanel), [`DeesSearchbar`](#deessearchbar), [`DeesSpinner`](#deesspinner), [`DeesToast`](#deestoast), [`DeesWindowcontrols`](#deeswindowcontrols), [`DeesActionbar`](#deesactionbar) |
+| **Forms** | [`DeesForm`](#deesform), [`DeesInputText`](#deesinputtext), [`DeesInputCheckbox`](#deesinputcheckbox), [`DeesInputDropdown`](#deesinputdropdown), [`DeesInputRadiogroup`](#deesinputradiogroup), [`DeesInputFileupload`](#deesinputfileupload), [`DeesInputIban`](#deesinputiban), [`DeesInputPhone`](#deesinputphone), [`DeesInputQuantitySelector`](#deesinputquantityselector), [`DeesInputMultitoggle`](#deesinputmultitoggle), [`DeesInputToggle`](#deesinputtoggle), [`DeesInputTags`](#deesinputtags), [`DeesInputTypelist`](#deesinputtypelist), [`DeesInputList`](#deesinputlist), [`DeesInputProfilepicture`](#deesinputprofilepicture), [`DeesInputRichtext`](#deesinputrichtext), [`DeesInputWysiwyg`](#deesinputwysiwyg), [`DeesInputDatepicker`](#deesinputdatepicker), [`DeesInputSearchselect`](#deesinputsearchselect), [`DeesInputCode`](#deesinputcode), [`DeesFormSubmit`](#deesformsubmit) |
+| **App Shell (Layout)** | [`DeesAppui`](#deesappui-️), [`DeesAppuiMainmenu`](#deesappuimainmenu), [`DeesAppuiSecondarymenu`](#deesappuisecondarymenu), [`DeesAppuiMaincontent`](#deesappuimaincontent), [`DeesAppuiAppbar`](#deesappuiappbar), [`DeesAppuiActivitylog`](#deesappuiactivitylog), [`DeesAppuiBottombar`](#deesappuibottombar), [`DeesAppuiProfiledropdown`](#deesappuiprofiledropdown), [`DeesAppuiTabs`](#deesappuitabs), [`DeesMobileNavigation`](#deesmobilenavigation), [`DeesDashboardGrid`](#deesdashboardgrid) |
 | **Data Display** | [`DeesTable`](#deestable), [`DeesDataviewCodebox`](#deesdataviewcodebox), [`DeesDataviewStatusobject`](#deesdataviewstatusobject), [`DeesPdf`](#deespdf), [`DeesStatsGrid`](#deesstatsgrid), [`DeesPagination`](#deespagination) |
+| **Media & Tiles** | [`DeesTilePdf`](#deestilepdf), [`DeesTileImage`](#deestileimage), [`DeesTileAudio`](#deestileaudio), [`DeesTileVideo`](#deestilevideo), [`DeesTileNote`](#deestilenote), [`DeesTileFolder`](#deestilefolder), [`DeesPreview`](#deespreview), [`DeesPdfViewer`](#deespdfviewer), [`DeesPdfPreview`](#deespdfpreview), [`DeesImageViewer`](#deesimageviewer), [`DeesAudioViewer`](#deesaudioviewer), [`DeesVideoViewer`](#deesvideoviewer) |
 | **Visualization** | [`DeesChartArea`](#deeschartarea), [`DeesChartLog`](#deeschartlog) |
 | **Dialogs & Overlays** | [`DeesModal`](#deesmodal), [`DeesContextmenu`](#deescontextmenu), [`DeesSpeechbubble`](#deesspeechbubble), [`DeesWindowlayer`](#deeswindowlayer) |
 | **Navigation** | [`DeesStepper`](#deesstepper), [`DeesProgressbar`](#deesprogressbar) |
-| **Development** | [`DeesEditor`](#deeseditor), [`DeesEditorMarkdown`](#deeseditormarkdown), [`DeesEditorMarkdownoutlet`](#deeseditormarkdownoutlet), [`DeesTerminal`](#deesterminal), [`DeesUpdater`](#deesupdater) |
+| **Workspace / IDE** | [`DeesWorkspace`](#deesworkspace), [`DeesWorkspaceMonaco`](#deesworkspacemonaco), [`DeesWorkspaceDiffEditor`](#deesworkspacediffeditor), [`DeesWorkspaceFiletree`](#deesworkspacefiletree), [`DeesWorkspaceTerminal`](#deesworkspaceterminal), [`DeesWorkspaceTerminalPreview`](#deesworkspaceterminalpreview), [`DeesWorkspaceMarkdown`](#deesworkspacemarkdown), [`DeesWorkspaceMarkdownoutlet`](#deesworkspacemarkdownoutlet), [`DeesWorkspaceBottombar`](#deesworkspacebottombar) |
 | **Theming** | [`DeesTheme`](#deestheme) |
-| **Auth & Utilities** | [`DeesSimpleAppdash`](#deessimpleappdash), [`DeesSimpleLogin`](#deessimplelogin) |
+| **Pre-built Templates** | [`DeesSimpleAppdash`](#deessimpleappdash), [`DeesSimpleLogin`](#deessimplelogin) |
 | **Shopping** | [`DeesShoppingProductcard`](#deesshoppingproductcard) |

 ---
@@ -117,14 +121,14 @@ Interactive chips/tags with selection capabilities.
 Display icons from FontAwesome and Lucide icon libraries with library prefixes.

 ```typescript
-// FontAwesome icons - use 'fa:' prefix
+// FontAwesome icons — use 'fa:' prefix
 <dees-icon
  icon="fa:check"       // FontAwesome icon with fa: prefix
  iconSize="24"         // Size in pixels
  color="#22c55e"       // Optional: custom color
 ></dees-icon>

-// Lucide icons - use 'lucide:' prefix
+// Lucide icons — use 'lucide:' prefix
 <dees-icon
  icon="lucide:menu"    // Lucide icon with lucide: prefix
  iconSize="24"         // Size in pixels
@@ -134,7 +138,7 @@ Display icons from FontAwesome and Lucide icon libraries with library prefixes.

 // Legacy API (deprecated but still supported)
 <dees-icon
-  iconFA="check"        // Without prefix - assumes FontAwesome
+  iconFA="check"        // Without prefix — assumes FontAwesome
 ></dees-icon>
 ```

@@ -287,6 +291,18 @@ Window control buttons (minimize, maximize, close) for desktop-like applications
 ></dees-windowcontrols>
 ```

+#### `DeesActionbar`
+Floating action bar for contextual actions.
+
+```typescript
+<dees-actionbar
+  .actions=${[
+    { icon: 'lucide:save', label: 'Save', action: () => handleSave() },
+    { icon: 'lucide:trash', label: 'Delete', action: () => handleDelete() }
+  ]}
+></dees-actionbar>
+```
+
 ---

 ### Form Components
@@ -331,6 +347,18 @@ Checkbox input component for boolean values.
 ></dees-input-checkbox>
 ```

+#### `DeesInputToggle`
+Toggle switch component for boolean on/off states.
+
+```typescript
+<dees-input-toggle
+  key="darkMode"
+  label="Enable Dark Mode"
+  .value=${true}
+  @change=${handleToggle}
+></dees-input-toggle>
+```
+
 #### `DeesInputDropdown`
 Dropdown selection component with search and filtering capabilities.

@@ -658,6 +686,19 @@ Advanced block-based editor with slash commands and rich content blocks.
 - Collaborative editing ready
 - Extensible block types

+#### `DeesInputCode`
+Code input component for editing source code with syntax highlighting.
+
+```typescript
+<dees-input-code
+  key="snippet"
+  label="Code Snippet"
+  .value=${codeString}
+  language="typescript"
+  @change=${handleCodeChange}
+></dees-input-code>
+```
+
 #### `DeesFormSubmit`
 Submit button component specifically designed for `DeesForm`.

@@ -670,10 +711,10 @@ Submit button component specifically designed for `DeesForm`.

 ---

-### Layout Components
+### App Shell (Layout) Components

-#### `DeesAppui`
-A comprehensive application shell component providing a complete UI framework with navigation, menus, activity logging, and view management.
+#### `DeesAppui` 🏗️
+A comprehensive application shell component providing a complete UI framework with navigation, menus, activity logging, bottom bar, and view management.

 > **Full API Documentation**: See [ts_web/elements/00group-appui/dees-appui/readme.md](./ts_web/elements/00group-appui/dees-appui/readme.md) for complete documentation including all programmatic APIs, view lifecycle hooks, and TypeScript interfaces.

@@ -690,7 +731,6 @@ class MyApp extends DeesElement {
  async firstUpdated() {
    this.appui = this.shadowRoot.querySelector('dees-appui');

-    // Configure with views and menu
    this.appui.configure({
      branding: { logoIcon: 'lucide:box', logoText: 'My App' },
      views: [
@@ -700,7 +740,13 @@ class MyApp extends DeesElement {
      mainMenu: {
        sections: [{ name: 'Main', views: ['dashboard', 'settings'] }]
      },
-      defaultView: 'dashboard'
+      defaultView: 'dashboard',
+      bottomBar: {
+        visible: true,
+        widgets: [
+          { id: 'status', iconName: 'lucide:activity', label: 'Online', status: 'success' }
+        ]
+      }
    });
  }

@@ -710,43 +756,123 @@ class MyApp extends DeesElement {
 }
 ```

-**Key Features:**
- **Configure API**: Single `configure()` method for complete app setup
- **View Management**: Automatic view caching, lazy loading, and lifecycle hooks
- **Programmatic APIs**: Full control over AppBar, Main Menu, Secondary Menu, Content Tabs, and Activity Log
- **View Lifecycle Hooks**: `onActivate()`, `onDeactivate()`, and `canDeactivate()` for view components
- **Hash-based Routing**: Automatic URL synchronization with view navigation
- **RxJS Observables**: `viewChanged$` and `viewLifecycle$` for reactive programming
- **TypeScript-first**: Typed `IViewActivationContext` passed to views on activation
- **Activity Log Toggle**: Built-in appbar button to show/hide activity panel with entry count badge
+**Architecture Overview:**

-**Programmatic APIs include:**
- `navigateToView(viewId, params?)` - Navigate between views
- `setAppBarMenus()`, `setBreadcrumbs()`, `setUser()` - Control the app bar
- `setMainMenu()`, `setMainMenuSelection()`, `setMainMenuBadge()` - Control main navigation
- `setMainMenuCollapsed()`, `setMainMenuVisible()` - Control main menu visibility
- `setSecondaryMenu()`, `setSecondaryMenuCollapsed()`, `setSecondaryMenuVisible()` - Control secondary menu
- `setContentTabs()`, `setContentTabsVisible()` - Control view-specific UI
- `activityLog.add()`, `activityLog.addMany()`, `activityLog.clear()` - Manage activity entries
- `setActivityLogVisible()`, `toggleActivityLog()`, `getActivityLogVisible()` - Control activity panel
+```
+┌─────────────────────────────────────────────────────────────────────┐
+│  AppBar (dees-appui-appbar)                                         │
+│  ├── Menus (File, Edit, View...)                                    │
+│  ├── Breadcrumbs                                                    │
+│  ├── User Profile + Dropdown                                        │
+│  └── Activity Log Toggle                                            │
+├─────────────┬───────────────────────────────────┬───────────────────┤
+│ Main Menu   │  Content Area                     │  Activity Log     │
+│ (collapsed/ │  ├── Content Tabs                 │  (slide panel)    │
+│  expanded)  │  │   (closable, from tables/lists)│                   │
+│             │  └── View Container               │                   │
+│ ┌─────────┐ │      └── Active View              │                   │
+│ │ 🏠 Home │ ├─────────────────────────────────┐ │                   │
+│ │ 📁 Files│ │ Secondary Menu                  │ │                   │
+│ │ ⚙ Set.. │ │  ├── Collapsible Groups         │ │                   │
+│ │         │ │  │   ├── Tabs / Actions          │ │                   │
+│ └─────────┘ │  │   ├── Filters / Links         │ │                   │
+│             │  │   └── Dividers / Headers       │ │                   │
+├─────────────┴──┴───────────────────────────────┴───────────────────┤
+│  Bottom Bar (dees-appui-bottombar) — 24px status bar                │
+│  ├── Status widgets (left/right)                                    │
+│  └── Action buttons (left/right)                                    │
+└─────────────────────────────────────────────────────────────────────┘
+```
+
+**Configuration (`IAppConfig`):**

-**View Visibility Control:**
 ```typescript
-// In your view's onActivate hook
-onActivate(context: IViewActivationContext) {
-  // Hide secondary menu for a fullscreen view
-  context.appui.setSecondaryMenuVisible(false);
-
-  // Hide content tabs
-  context.appui.setContentTabsVisible(false);
-
-  // Collapse main menu to give more space
-  context.appui.setMainMenuCollapsed(true);
+interface IAppConfig {
+  branding?: { logoIcon?: string; logoText?: string };
+  appBar?: IAppBarConfig;
+  views: IViewDefinition[];
+  mainMenu?: IMainMenuConfig;
+  defaultView?: string;
+  activityLog?: IActivityLogConfig;
+  bottomBar?: IBottomBarConfig;
+  onViewChange?: (viewId: string, view: IViewDefinition) => void;
+  onSearch?: (query: string) => void;
 }
 ```

+**Key Features:**
+- 🔧 **Configure API** — Single `configure()` method for complete app setup
+- 📄 **View Management** — Automatic view caching, lazy loading, and lifecycle hooks (`onActivate`, `onDeactivate`, `canDeactivate`)
+- 🧭 **Hash-based Routing** — Automatic URL synchronization with view navigation and parameterized routes
+- 📊 **Activity Log** — Slide-out panel with stacked entries, date grouping, search, and filtering
+- 📌 **Bottom Status Bar** — Configurable widgets and actions with status colors and loading states
+- 🎯 **RxJS Observables** — `viewChanged$` and `viewLifecycle$` for reactive programming
+- 🏷️ **TypeScript-first** — Typed `IViewActivationContext` passed to views on activation
+
+**Programmatic APIs:**
+
+| Area | Methods |
+|------|---------|
+| **Navigation** | `navigateToView(viewId, params?)`, `getCurrentView()`, `getViewRegistry()` |
+| **App Bar** | `setAppBarMenus()`, `updateAppBarMenu()`, `setBreadcrumbs()`, `setUser()`, `setProfileMenuItems()`, `setSearchVisible()`, `onSearch()`, `setWindowControlsVisible()` |
+| **Main Menu** | `setMainMenu()`, `updateMainMenuGroup()`, `addMainMenuItem()`, `removeMainMenuItem()`, `setMainMenuSelection()`, `setMainMenuCollapsed()`, `setMainMenuVisible()`, `setMainMenuBadge()`, `clearMainMenuBadge()` |
+| **Secondary Menu** | `setSecondaryMenu()`, `updateSecondaryMenuGroup()`, `addSecondaryMenuItem()`, `setSecondaryMenuSelection()`, `setSecondaryMenuCollapsed()`, `setSecondaryMenuVisible()`, `clearSecondaryMenu()` |
+| **Content Tabs** | `setContentTabs()`, `addContentTab()`, `removeContentTab()`, `selectContentTab()`, `getSelectedContentTab()`, `setContentTabsVisible()`, `setContentTabsAutoHide()` |
+| **Activity Log** | `activityLog.add()`, `activityLog.addMany()`, `activityLog.clear()`, `activityLog.getEntries()`, `activityLog.filter()`, `activityLog.search()`, `setActivityLogVisible()`, `toggleActivityLog()`, `getActivityLogVisible()` |
+| **Bottom Bar** | `bottomBar.addWidget()`, `bottomBar.updateWidget()`, `bottomBar.removeWidget()`, `bottomBar.getWidget()`, `bottomBar.clearWidgets()`, `bottomBar.addAction()`, `bottomBar.removeAction()`, `bottomBar.clearActions()`, `setBottomBarVisible()`, `getBottomBarVisible()` |
+| **Observables** | `viewChanged$`, `viewLifecycle$` |
+
+**View Lifecycle Hooks:**
+
+```typescript
+import { DeesElement, customElement } from '@design.estate/dees-element';
+import type { IViewActivationContext, IViewLifecycle } from '@design.estate/dees-catalog';
+
+@customElement('my-settings-view')
+class MySettingsView extends DeesElement implements IViewLifecycle {
+  // Called when view becomes visible
+  async onActivate(context: IViewActivationContext) {
+    const { appui, viewId, params } = context;
+
+    // Set view-specific secondary menu
+    appui.setSecondaryMenu({
+      heading: 'Settings',
+      groups: [{ name: 'Options', items: [...] }]
+    });
+
+    // Control visibility of other shell parts
+    appui.setContentTabsVisible(false);
+    appui.setSecondaryMenuVisible(true);
+  }
+
+  // Called when navigating away
+  onDeactivate() { /* cleanup */ }
+
+  // Return false or a message string to block navigation
+  canDeactivate(): boolean | string {
+    if (this.hasUnsavedChanges) return 'You have unsaved changes. Leave anyway?';
+    return true;
+  }
+}
+```
+
+**Secondary Menu Item Types:**
+
+The secondary menu supports **8 distinct item types** for building rich contextual sidebars:
+
+| Type | Description |
+|------|-------------|
+| **Tab** (default) | Selectable item that stays highlighted |
+| **Action** | Executes on click without staying selected (blue styling) |
+| **Filter** | Checkbox toggle for filtering |
+| **MultiFilter** | Collapsible multi-select filter box |
+| **Divider** | Visual separator line |
+| **Header** | Non-interactive section label |
+| **Link** | Opens an external URL |
+| **Danger Action** | Red-styled action with optional confirmation |
+
 #### `DeesAppuiMainmenu`
-Main navigation menu component for application-wide navigation.
+Main navigation menu component for application-wide navigation. Supports collapsed (icon-only) mode.

 ```typescript
 <dees-appui-mainmenu
@@ -759,12 +885,12 @@ Main navigation menu component for application-wide navigation.
      ]
    }
  ]}
-  collapsed           // Optional: show collapsed version
+  collapsed           // Optional: show collapsed icon-only version
 ></dees-appui-mainmenu>
 ```

 #### `DeesAppuiSecondarymenu`
-Secondary navigation component for sub-section selection with collapsible groups and badges.
+Secondary navigation component for sub-section selection with collapsible groups, badges, and 8 item types.

 ```typescript
 <dees-appui-secondarymenu
@@ -806,28 +932,12 @@ Professional application bar component with hierarchical menus, breadcrumb navig
  .menuItems=${[
    {
      name: 'File',
-      action: async () => {},  // No-op for parent menu items
+      action: async () => {},
      submenu: [
-        {
-          name: 'New File',
-          shortcut: 'Cmd+N',
-          iconName: 'file-plus',
-          action: async () => handleNewFile()
-        },
-        {
-          name: 'Open...',
-          shortcut: 'Cmd+O',
-          iconName: 'folder-open',
-          action: async () => handleOpen()
-        },
-        { divider: true },  // Menu separator
-        {
-          name: 'Save',
-          shortcut: 'Cmd+S',
-          iconName: 'save',
-          action: async () => handleSave(),
-          disabled: true  // Disabled state
-        }
+        { name: 'New File', shortcut: 'Cmd+N', iconName: 'file-plus', action: async () => handleNewFile() },
+        { name: 'Open...', shortcut: 'Cmd+O', iconName: 'folder-open', action: async () => handleOpen() },
+        { divider: true },
+        { name: 'Save', shortcut: 'Cmd+S', iconName: 'save', action: async () => handleSave(), disabled: true }
      ]
    }
  ]}
@@ -849,12 +959,12 @@ Professional application bar component with hierarchical menus, breadcrumb navig
 ```

 **Key Features:**
- **Hierarchical Menu System** - Top-level menus with dropdown submenus, icons, and keyboard shortcuts
- **Keyboard Navigation** - Full keyboard support (Tab, Arrow keys, Enter, Escape)
- **Breadcrumb Navigation** - Customizable breadcrumb trail with click events
- **User Account Section** - Avatar with status indicator and profile dropdown
- **Activity Log Toggle** - Button with badge count to show/hide activity panel
- **Accessibility** - Full ARIA support with menubar roles
+- **Hierarchical Menu System** — Top-level menus with dropdown submenus, icons, and keyboard shortcuts
+- **Keyboard Navigation** — Full keyboard support (Tab, Arrow keys, Enter, Escape)
+- **Breadcrumb Navigation** — Customizable breadcrumb trail with click events
+- **User Account Section** — Avatar with status indicator and profile dropdown
+- **Activity Log Toggle** — Button with badge count to show/hide activity panel
+- **Accessibility** — Full ARIA support with menubar roles

 #### `DeesAppuiActivitylog`
 Real-time activity log panel for displaying user actions and system events.
@@ -886,6 +996,61 @@ activityLog.search('settings');        // Search by message
 - Animated slide-in/out panel
 - Theme-aware styling

+#### `DeesAppuiBottombar`
+A 24px fixed-height status bar at the bottom of the application shell. Supports status widgets and action buttons positioned left or right.
+
+```typescript
+// Configure via DeesAppui
+appui.configure({
+  bottomBar: {
+    visible: true,
+    widgets: [
+      {
+        id: 'status',
+        iconName: 'lucide:activity',
+        label: 'System Online',
+        status: 'success',       // 'idle' | 'active' | 'success' | 'warning' | 'error'
+        tooltip: 'All systems operational',
+        onClick: () => console.log('Status clicked'),
+      },
+      {
+        id: 'version',
+        iconName: 'lucide:gitBranch',
+        label: 'v1.2.3',
+        position: 'right',
+      }
+    ],
+    actions: [
+      {
+        id: 'terminal',
+        iconName: 'lucide:terminal',
+        tooltip: 'Open Terminal',
+        position: 'right',
+        onClick: () => console.log('Terminal clicked'),
+      }
+    ]
+  }
+});
+
+// Programmatic updates
+appui.bottomBar.addWidget({ id: 'build', iconName: 'lucide:hammer', label: 'Building...', loading: true, status: 'active' });
+appui.bottomBar.updateWidget('build', { label: 'Build complete', loading: false, status: 'success' });
+appui.bottomBar.removeWidget('build');
+
+appui.bottomBar.addAction({ id: 'refresh', iconName: 'lucide:refreshCw', onClick: () => location.reload() });
+appui.bottomBar.removeAction('refresh');
+
+appui.setBottomBarVisible(false);
+```
+
+**Key Features:**
+- Configurable status widgets with icons, labels, and colored status indicators
+- Loading spinner state for widgets
+- Contextual actions with icon buttons
+- Left/right positioning for both widgets and actions
+- Tooltips on hover
+- Context menu support per widget
+
 #### `DeesAppuiTabs`
 Reusable tab component with horizontal/vertical layout support.

@@ -1007,7 +1172,7 @@ A responsive grid component for displaying statistical data with various visuali
      value: 125420,
      unit: '$',
      type: 'number',
-      icon: 'faDollarSign',
+      icon: 'lucide:dollarSign',
      description: '+12.5% from last month',
      color: '#22c55e'
    },
@@ -1016,7 +1181,7 @@ A responsive grid component for displaying statistical data with various visuali
      title: 'CPU Usage',
      value: 73,
      type: 'gauge',
-      icon: 'faMicrochip',
+      icon: 'lucide:cpu',
      gaugeOptions: {
        min: 0, max: 100,
        thresholds: [
@@ -1032,8 +1197,22 @@ A responsive grid component for displaying statistical data with various visuali
      value: '1.2k',
      unit: '/min',
      type: 'trend',
-      icon: 'faServer',
+      icon: 'lucide:server',
      trendData: [45, 52, 38, 65, 72, 68, 75, 82, 79, 85, 88, 92]
+    },
+    {
+      id: 'cores',
+      title: 'CPU Cores',
+      value: 0,
+      type: 'cpuCores',
+      icon: 'lucide:cpu',
+      columnSpan: 2,
+      coresData: [
+        { id: 0, usage: 45, label: '0' },
+        { id: 1, usage: 72, label: '1' },
+        { id: 2, usage: 30, label: '2' },
+        { id: 3, usage: 88, label: '3' }
+      ]
    }
  ]}
  .minTileWidth=${250}
@@ -1041,6 +1220,8 @@ A responsive grid component for displaying statistical data with various visuali
 ></dees-statsgrid>
 ```

+**Tile Types:** `number`, `gauge`, `percentage`, `trend`, `text`, `multiPercentage`, `cpuCores`
+
 #### `DeesPagination`
 Pagination component for navigating through large datasets.

@@ -1056,6 +1237,146 @@ Pagination component for navigating through large datasets.

 ---

+### Media & Tile Components 🎬
+
+A rich collection of tile-based preview components for displaying media files in grids. All tiles share a consistent base class (`DeesTileBase`) with lazy loading via `IntersectionObserver`, hover interactions, click events, context menus, and three size variants (`small`, `default`, `large`).
+
+All tile badges use a unified styling system with label-awareness — when a `label` is set, bottom badges automatically shift up to avoid overlapping.
+
+#### `DeesTilePdf`
+PDF document tile with live page preview on hover.
+
+```typescript
+<dees-tile-pdf
+  pdfUrl="/documents/report.pdf"
+  label="Annual Report"
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-pdf>
+```
+
+**Key Features:**
+- Renders first page as canvas preview
+- Hover to scrub through pages (mouse X position maps to page number)
+- Shows page count badge, hover page indicator
+- Detects A4/Letter vs non-standard aspect ratios
+
+#### `DeesTileImage`
+Image tile with lazy loading and dimension display.
+
+```typescript
+<dees-tile-image
+  src="/photos/landscape.jpg"
+  alt="Mountain landscape"
+  label="landscape.jpg"
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-image>
+```
+
+**Key Features:**
+- Lazy loads image on scroll into view
+- Shows image dimensions on hover (e.g. "1920 × 1080")
+- Checkerboard background for transparent images
+
+#### `DeesTileAudio`
+Audio file tile with waveform visualization.
+
+```typescript
+<dees-tile-audio
+  src="/music/track.mp3"
+  title="Summer Vibes"
+  artist="DJ Example"
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-audio>
+```
+
+**Key Features:**
+- Generates waveform visualization from audio data
+- Shows duration badge (e.g. "3:42")
+- Displays title and artist metadata
+- Play overlay on hover
+
+#### `DeesTileVideo`
+Video tile with thumbnail capture and hover preview.
+
+```typescript
+<dees-tile-video
+  src="/videos/intro.mp4"
+  poster="/thumbs/intro.jpg"
+  label="Introduction"
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-video>
+```
+
+**Key Features:**
+- Auto-captures first frame as thumbnail (or uses provided `poster`)
+- Plays video preview on hover
+- Shows duration badge
+- Play button overlay
+
+#### `DeesTileNote`
+Code/text snippet tile with syntax-aware display.
+
+```typescript
+<dees-tile-note
+  title="config.ts"
+  language="TypeScript"
+  .content=${codeString}
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-note>
+```
+
+**Key Features:**
+- Monospace font with line numbers
+- Language badge (top-right)
+- Scrollable content on hover (mouse X position controls scroll)
+- Line indicator badge while scrolling
+- Gradient fade at bottom
+
+#### `DeesTileFolder`
+Folder tile with 2×2 content preview grid.
+
+```typescript
+<dees-tile-folder
+  name="Project Assets"
+  .items=${[
+    { type: 'image', name: 'logo.png', thumbnailSrc: '/thumbs/logo.png' },
+    { type: 'pdf', name: 'spec.pdf' },
+    { type: 'audio', name: 'jingle.mp3' },
+    { type: 'video', name: 'demo.mp4' },
+  ]}
+  clickable
+  @tile-click=${handleClick}
+></dees-tile-folder>
+```
+
+**Key Features:**
+- 2×2 preview grid showing first 4 items (thumbnails or type icons)
+- Item count badge (e.g. "12 items")
+- Folder icon header with name
+- Supports: `pdf`, `image`, `audio`, `video`, `note`, `folder`, `unknown` types
+
+#### `DeesPreview`
+Unified preview component that auto-selects the right tile type based on content.
+
+#### `DeesPdfViewer` / `DeesPdfPreview`
+Full PDF viewing components with navigation controls.
+
+#### `DeesImageViewer`
+Full-screen image viewer with zoom and pan.
+
+#### `DeesAudioViewer`
+Audio playback component with waveform and controls.
+
+#### `DeesVideoViewer`
+Video playback component with standard controls.
+
+---
+
 ### Visualization Components

 #### `DeesChartArea`
@@ -1116,16 +1437,41 @@ DeesModal.createAndShow({
 ```

 #### `DeesContextmenu`
-Context menu component for right-click actions.
+Context menu component for right-click actions with nested submenu support.

 ```typescript
-<dees-contextmenu
-  .items=${[
-    { label: 'Edit', icon: 'edit', action: () => handleEdit() },
-    { label: 'Delete', icon: 'trash', action: () => handleDelete() }
-  ]}
-  position="right"
-></dees-contextmenu>
+// Programmatic usage
+DeesContextmenu.openContextMenuWithOptions(mouseEvent, [
+  {
+    name: 'Edit',
+    iconName: 'lucide:edit',
+    action: async () => handleEdit()
+  },
+  { divider: true },
+  {
+    name: 'More Options',
+    iconName: 'lucide:moreHorizontal',
+    submenu: [
+      { name: 'Duplicate', iconName: 'lucide:copy', action: async () => handleDuplicate() },
+      { name: 'Archive', iconName: 'lucide:archive', action: async () => handleArchive() },
+    ]
+  },
+  {
+    name: 'Delete',
+    iconName: 'lucide:trash2',
+    action: async () => handleDelete()
+  }
+]);
+
+// Component-based (implement getContextMenuItems on any element)
+class MyComponent extends DeesElement {
+  getContextMenuItems() {
+    return [
+      { name: 'View Details', iconName: 'lucide:eye', action: async () => { ... } },
+      { name: 'Edit', iconName: 'lucide:edit', action: async () => { ... } },
+    ];
+  }
+}
 ```

 #### `DeesSpeechbubble`
@@ -1189,7 +1535,7 @@ Progress indicator component for tracking completion status.
 Theme provider component that wraps children and provides CSS custom properties for consistent theming.

 ```typescript
-// Basic usage - wrap your app
+// Basic usage — wrap your app
 <dees-theme>
  <my-app></my-app>
 </dees-theme>
@@ -1217,76 +1563,71 @@ Theme provider component that wraps children and provides CSS custom properties

 ---

-### Development Components
+### Workspace / IDE Components 💻

-#### `DeesEditor`
-Code editor component with syntax highlighting and code completion, powered by Monaco Editor.
+A full-featured IDE workspace component suite for building browser-based code editors, terminal interfaces, and documentation viewers.
+
+#### `DeesWorkspace`
+Top-level workspace shell that composes editor, file tree, terminal, and bottom bar into an IDE-like layout.

 ```typescript
-<dees-editor
+<dees-workspace></dees-workspace>
+```
+
+#### `DeesWorkspaceMonaco`
+Monaco Editor integration for code editing with full IntelliSense, syntax highlighting, and language support.
+
+```typescript
+<dees-workspace-monaco
  .value=${code}
-  @change=${handleCodeChange}
  .language=${'typescript'}
-  .theme=${'vs-dark'}
-  .options=${{
-    lineNumbers: true,
-    minimap: { enabled: true },
-    autoClosingBrackets: 'always'
-  }}
-></dees-editor>
+  @change=${handleCodeChange}
+></dees-workspace-monaco>
 ```

-#### `DeesEditorMarkdown`
-Markdown editor component with live preview.
+#### `DeesWorkspaceDiffEditor`
+Side-by-side diff editor powered by Monaco for comparing file versions.

 ```typescript
-<dees-editor-markdown
-  .value=${markdown}
-  @change=${handleMarkdownChange}
-  .options=${{ preview: true, toolbar: true, spellcheck: true }}
-></dees-editor-markdown>
+<dees-workspace-diff-editor
+  .originalValue=${originalCode}
+  .modifiedValue=${modifiedCode}
+  .language=${'typescript'}
+></dees-workspace-diff-editor>
 ```

-#### `DeesEditorMarkdownoutlet`
-Markdown preview component for rendering markdown content.
+#### `DeesWorkspaceFiletree`
+File tree navigation component with expand/collapse, file icons, and selection.

 ```typescript
-<dees-editor-markdownoutlet
-  .markdown=${markdownContent}
-  .theme=${'github'}
-  allowHtml={false}
-></dees-editor-markdownoutlet>
+<dees-workspace-filetree
+  .files=${fileTreeData}
+  @file-select=${handleFileSelect}
+></dees-workspace-filetree>
 ```

-#### `DeesTerminal`
-Terminal emulator component for command-line interface.
+#### `DeesWorkspaceTerminal`
+Terminal emulator component powered by xterm.js.

 ```typescript
-<dees-terminal
-  .commands=${{
-    'echo': (args) => `Echo: ${args.join(' ')}`,
-    'help': () => 'Available commands: echo, help'
-  }}
-  .prompt=${'$'}
-  .welcomeMessage=${'Welcome! Type "help" for available commands.'}
-></dees-terminal>
+<dees-workspace-terminal></dees-workspace-terminal>
 ```

-#### `DeesUpdater`
-Component for managing application updates and version control.
+#### `DeesWorkspaceTerminalPreview`
+Terminal with integrated preview pane for output visualization.

-```typescript
-<dees-updater
-  .currentVersion=${'1.5.2'}
-  .checkInterval=${3600000}
-  .autoUpdate=${false}
-  @update-available=${handleUpdateAvailable}
-></dees-updater>
-```
+#### `DeesWorkspaceMarkdown`
+Markdown editor with live preview.
+
+#### `DeesWorkspaceMarkdownoutlet`
+Read-only markdown renderer for documentation display.
+
+#### `DeesWorkspaceBottombar`
+IDE-style bottom status bar for the workspace.

 ---

-### Auth & Utilities Components
+### Pre-built Templates

 #### `DeesSimpleAppdash`
 Simple application dashboard component for quick prototyping.
@@ -1360,6 +1701,8 @@ interface IMenuItem {
  action: () => void;
  badge?: string | number;
  badgeVariant?: 'default' | 'success' | 'warning' | 'error';
+  closeable?: boolean;
+  onClose?: () => void;
 }

 // Menu group interface for organized menus
@@ -1375,11 +1718,13 @@ interface IViewDefinition {
  id: string;
  name: string;
  iconName?: string;
-  content: string | HTMLElement | (() => TemplateResult);
+  content: string | (new () => HTMLElement) | (() => TemplateResult) | (() => Promise<any>);
  secondaryMenu?: ISecondaryMenuGroup[];
  contentTabs?: IMenuItem[];
  route?: string;
  badge?: string | number;
+  badgeVariant?: 'default' | 'success' | 'warning' | 'error';
+  cache?: boolean;
 }

 // Activity log entry
@@ -1392,6 +1737,43 @@ interface IActivityEntry {
  iconName?: string;
  data?: Record<string, unknown>;
 }
+
+// Bottom bar widget
+interface IBottomBarWidget {
+  id: string;
+  iconName?: string;
+  label?: string;
+  status?: 'idle' | 'active' | 'success' | 'warning' | 'error';
+  tooltip?: string;
+  loading?: boolean;
+  onClick?: () => void;
+  position?: 'left' | 'right';
+  order?: number;
+}
+
+// Bottom bar action button
+interface IBottomBarAction {
+  id: string;
+  iconName: string;
+  tooltip?: string;
+  onClick: () => void | Promise<void>;
+  disabled?: boolean;
+  position?: 'left' | 'right';
+}
+
+// View activation context (passed to onActivate)
+interface IViewActivationContext {
+  appui: DeesAppui;
+  viewId: string;
+  params?: Record<string, string>;
+}
+
+// Tile folder item (for DeesTileFolder)
+interface ITileFolderItem {
+  type: 'pdf' | 'image' | 'audio' | 'video' | 'note' | 'folder' | 'unknown';
+  thumbnailSrc?: string;
+  name: string;
+}
 ```

 ---
--- a/test/test.contextmenu-demo.chromium.ts
+++ b/test/test.contextmenu-demo.chromium.ts
@@ -1,6 +1,6 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
-import { demoFunc } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.demo.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';
+import { demoFunc } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.demo.js';

 tap.test('should render context menu demo', async () => {
  // Create demo container
--- a/test/test.contextmenu-nested-close.chromium.ts
+++ b/test/test.contextmenu-nested-close.chromium.ts
@@ -1,5 +1,5 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';

 tap.test('should close all parent menus when clicking action in nested submenu', async () => {
  let actionCalled = false;
--- a/test/test.contextmenu-shadowdom.chromium.ts
+++ b/test/test.contextmenu-shadowdom.chromium.ts
@@ -1,5 +1,5 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { DeesElement, customElement, html } from '@design.estate/dees-element';

 // Create a test element with shadow DOM
--- a/test/test.contextmenu.chromium.ts
+++ b/test/test.contextmenu.chromium.ts
@@ -1,5 +1,5 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';

 tap.test('should show context menu with nested submenu', async () => {
  // Create a test element with context menu items
--- a/test/test.dashboardgrid-layout.node.ts
+++ b/test/test.dashboardgrid-layout.node.ts
@@ -3,8 +3,8 @@ import { tap, expect } from '@git.zone/tstest/tapbundle';
 import {
  resolveWidgetPlacement,
  collectCollisions,
-} from '../ts_web/elements/dees-dashboardgrid/layout.ts';
-import type { DashboardWidget } from '../ts_web/elements/dees-dashboardgrid/types.ts';
+} from '../ts_web/elements/00group-layout/dees-dashboardgrid/layout.ts';
+import type { DashboardWidget } from '../ts_web/elements/00group-layout/dees-dashboardgrid/types.ts';

 tap.test('dashboardgrid does not overlap widgets after swap attempt', async () => {
  const widgets: DashboardWidget[] = [
--- a/test/test.pdf-text-selection.chromium.ts
+++ b/test/test.pdf-text-selection.chromium.ts
@@ -0,0 +1,79 @@
+import { expect, tap, webhelpers } from '@git.zone/tstest/tapbundle';
+import * as deesCatalog from '../ts_web/index.js';
+
+tap.test('PDF viewer should render text layer', async () => {
+  const viewer = await webhelpers.fixture(
+    webhelpers.html`
+      <dees-pdf-viewer
+        pdfUrl="https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/web/compressed.tracemonkey-pldi-09.pdf"
+        initialZoom="page-fit"
+        style="height: 600px; width: 100%;"
+      ></dees-pdf-viewer>
+    `
+  ) as deesCatalog.DeesPdfViewer;
+
+  // Wait for PDF to load and render
+  await new Promise(resolve => setTimeout(resolve, 5000));
+  await viewer.updateComplete;
+
+  expect(viewer.totalPages).toBeGreaterThan(0);
+
+  const textLayer = viewer.shadowRoot?.querySelector('.text-layer[data-page="1"]');
+  expect(textLayer).toBeTruthy();
+
+  const textSpans = textLayer?.querySelectorAll('span');
+  expect(textSpans?.length).toBeGreaterThan(0);
+  console.log(`Text layer has ${textSpans?.length} spans`);
+});
+
+tap.test('Text should be selectable', async () => {
+  const viewer = await webhelpers.fixture(
+    webhelpers.html`
+      <dees-pdf-viewer
+        pdfUrl="https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/web/compressed.tracemonkey-pldi-09.pdf"
+        initialZoom="page-fit"
+        style="height: 600px; width: 100%;"
+      ></dees-pdf-viewer>
+    `
+  ) as deesCatalog.DeesPdfViewer;
+
+  // Wait for PDF to load and render
+  await new Promise(resolve => setTimeout(resolve, 5000));
+
+  const textLayer = viewer.shadowRoot?.querySelector('.text-layer[data-page="1"]');
+  const firstSpan = textLayer?.querySelector('span') as HTMLElement;
+
+  if (firstSpan?.textContent) {
+    const range = document.createRange();
+    const textNode = firstSpan.firstChild;
+    if (textNode) {
+      range.setStart(textNode, 0);
+      range.setEnd(textNode, Math.min(5, textNode.textContent?.length || 0));
+      const selection = window.getSelection();
+      selection?.removeAllRanges();
+      selection?.addRange(range);
+      expect(selection?.toString().length).toBeGreaterThan(0);
+      console.log('Selected text:', selection?.toString());
+    }
+  }
+});
+
+tap.test('endOfContent element exists for selection boundary', async () => {
+  const viewer = await webhelpers.fixture(
+    webhelpers.html`
+      <dees-pdf-viewer
+        pdfUrl="https://raw.githubusercontent.com/mozilla/pdf.js/ba2edeae/web/compressed.tracemonkey-pldi-09.pdf"
+        initialZoom="page-fit"
+        style="height: 600px; width: 100%;"
+      ></dees-pdf-viewer>
+    `
+  ) as deesCatalog.DeesPdfViewer;
+
+  // Wait for PDF to load and render
+  await new Promise(resolve => setTimeout(resolve, 5000));
+
+  const endOfContent = viewer.shadowRoot?.querySelector('.text-layer[data-page="1"] .endOfContent');
+  expect(endOfContent).toBeTruthy();
+});
+
+export default tap.start();
--- a/test/test.wysiwyg-blocktype-change.chromium.ts
+++ b/test/test.wysiwyg-blocktype-change.chromium.ts
@@ -1,6 +1,6 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
 import { DeesInputWysiwyg } from '../ts_web/elements/00group-input/dees-input-wysiwyg/dees-input-wysiwyg.js';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';

 tap.test('should change block type via context menu', async () => {
  // Create WYSIWYG editor with a paragraph
--- a/test/test.wysiwyg-contextmenu.chromium.ts
+++ b/test/test.wysiwyg-contextmenu.chromium.ts
@@ -1,6 +1,6 @@
 import { expect, tap } from '@git.zone/tstest/tapbundle';
 import { DeesInputWysiwyg } from '../ts_web/elements/00group-input/dees-input-wysiwyg/dees-input-wysiwyg.js';
-import { DeesContextmenu } from '../ts_web/elements/dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../ts_web/elements/00group-overlay/dees-contextmenu/dees-contextmenu.js';

 tap.test('should show context menu on WYSIWYG blocks', async () => {
  // Create WYSIWYG editor
--- a/ts_web/00_commitinfo_data.ts
+++ b/ts_web/00_commitinfo_data.ts
@@ -3,6 +3,6 @@
 */
 export const commitinfo = {
  name: '@design.estate/dees-catalog',
-  version: '3.37.1',
+  version: '3.42.2',
  description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 }
--- a/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts
+++ b/ts_web/elements/00group-appui/dees-appui-activitylog/dees-appui-activitylog.ts
@@ -10,8 +10,8 @@ import {
 } from '@design.estate/dees-element';

 import * as domtools from '@design.estate/dees-domtools';
-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
-import '../../dees-icon/dees-icon.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
 import type { IActivityEntry, IActivityLogAPI } from '../../interfaces/appconfig.js';
 import { demoFunc } from './dees-appui-activitylog.demo.js';
 import { themeDefaultStyles } from '../../00theme.js';
@@ -20,7 +20,7 @@ import { themeDefaultStyles } from '../../00theme.js';
 export class DeesAppuiActivitylog extends DeesElement implements IActivityLogAPI {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE PROPERTIES
  @state()
--- a/ts_web/elements/00group-appui/dees-appui-appbar/component.ts
+++ b/ts_web/elements/00group-appui/dees-appui-appbar/component.ts
@@ -15,8 +15,8 @@ import { appuiAppbarStyles } from './styles.js';
 import { renderAppuiAppbar } from './template.js';

 // Import required components
-import '../../dees-icon/dees-icon.js';
-import '../../dees-windowcontrols/dees-windowcontrols.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import '../../00group-utility/dees-windowcontrols/dees-windowcontrols.js';
 import '../dees-appui-profiledropdown/dees-appui-profiledropdown.js';

 declare global {
@@ -28,7 +28,7 @@ declare global {
@customElement('dees-appui-appbar')
 export class DeesAppuiBar extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE PROPERTIES
  @property({ type: Array })
--- a/ts_web/elements/00group-appui/dees-appui-bottombar/dees-appui-bottombar.ts
+++ b/ts_web/elements/00group-appui/dees-appui-bottombar/dees-appui-bottombar.ts
@@ -8,8 +8,8 @@ import {
  state,
 } from '@design.estate/dees-element';
 import { themeDefaultStyles } from '../../00theme.js';
-import '../../dees-icon/dees-icon.js';
-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import type {
  IBottomBarWidget,
  IBottomBarAction,
@@ -26,7 +26,7 @@ declare global {
@customElement('dees-appui-bottombar')
 export class DeesAppuiBottombar extends DeesElement implements IBottomBarAPI {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE PROPERTIES
  @state()
--- a/ts_web/elements/00group-appui/dees-appui-maincontent/dees-appui-maincontent.ts
+++ b/ts_web/elements/00group-appui/dees-appui-maincontent/dees-appui-maincontent.ts
@@ -31,7 +31,7 @@ export class DeesAppuiMaincontent extends DeesElement {
      </div>
    </dees-appui-maincontent>
  `;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts
+++ b/ts_web/elements/00group-appui/dees-appui-mainmenu/dees-appui-mainmenu.ts
@@ -11,7 +11,7 @@ import {
  css,
  cssManager,
 } from '@design.estate/dees-element';
-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { demoFunc } from './dees-appui-mainmenu.demo.js';
 import { themeDefaultStyles } from '../../00theme.js';

@@ -22,7 +22,7 @@ import { themeDefaultStyles } from '../../00theme.js';
@customElement('dees-appui-mainmenu')
 export class DeesAppuiMainmenu extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE

--- a/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts
+++ b/ts_web/elements/00group-appui/dees-appui-profiledropdown/dees-appui-profiledropdown.ts
@@ -35,7 +35,7 @@ export class DeesAppuiProfileDropdown extends DeesElement {
      .isOpen=${true}
    ></dees-appui-profiledropdown>
  `;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  @property({ type: Object })
  accessor user: {
--- a/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts
+++ b/ts_web/elements/00group-appui/dees-appui-secondarymenu/dees-appui-secondarymenu.ts
@@ -1,8 +1,8 @@
 import * as plugins from '../../00plugins.js';
 import * as interfaces from '../../interfaces/index.js';

-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
-import '../../dees-icon/dees-icon.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
+import '../../00group-utility/dees-icon/dees-icon.js';

 import {
  DeesElement,
@@ -33,7 +33,7 @@ import { themeDefaultStyles } from '../../00theme.js';
@customElement('dees-appui-secondarymenu')
 export class DeesAppuiSecondarymenu extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE

--- a/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts
+++ b/ts_web/elements/00group-appui/dees-appui-tabs/dees-appui-tabs.ts
@@ -18,7 +18,7 @@ import { themeDefaultStyles } from '../../00theme.js';
@customElement('dees-appui-tabs')
 export class DeesAppuiTabs extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-appui/dees-appui/dees-appui.demo.ts
+++ b/ts_web/elements/00group-appui/dees-appui/dees-appui.demo.ts
@@ -3,8 +3,8 @@ import type { DeesAppui } from './dees-appui.js';
 import type { IAppConfig, IViewActivationContext } from '../../interfaces/appconfig.js';
 import type * as interfaces from '../../interfaces/index.js';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-statsgrid/dees-statsgrid.js';
-import type { IStatsTile } from '../../dees-statsgrid/dees-statsgrid.js';
+import '../../00group-dataview/dees-statsgrid/dees-statsgrid.js';
+import type { IStatsTile } from '../../00group-dataview/dees-statsgrid/dees-statsgrid.js';

 // Demo view component with lifecycle hooks
@customElement('demo-dashboard-view')
--- a/ts_web/elements/00group-appui/dees-appui/dees-appui.ts
+++ b/ts_web/elements/00group-appui/dees-appui/dees-appui.ts
@@ -39,7 +39,7 @@ declare global {
@customElement('dees-appui')
 export class DeesAppui extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'App UI';
+  public static demoGroups = ['App UI'];

  // ==========================================
  // REACTIVE OBSERVABLES (RxJS Subjects)
--- a/ts_web/elements/00group-appui/dees-mobilenavigation/dees-mobilenavigation.demo.ts
+++ b/ts_web/elements/00group-appui/dees-mobilenavigation/dees-mobilenavigation.demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '../00group-button/dees-button/dees-button.js';
-import '../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import '@design.estate/dees-wcctools/demotools';

 export const demoFunc = () => html`
--- a/ts_web/elements/00group-appui/dees-mobilenavigation/dees-mobilenavigation.ts
+++ b/ts_web/elements/00group-appui/dees-mobilenavigation/dees-mobilenavigation.ts
@@ -1,6 +1,6 @@
-import * as plugins from '../00plugins.js';
-import { zIndexRegistry } from '../00zindex.js';
-import { cssGeistFontFamily } from '../00fonts.js';
+import * as plugins from '../../00plugins.js';
+import { zIndexRegistry } from '../../00zindex.js';
+import { cssGeistFontFamily } from '../../00fonts.js';
 import {
  cssManager,
  css,
@@ -12,13 +12,14 @@ import {
  property,
  state,
 } from '@design.estate/dees-element';
-import { DeesWindowLayer } from '../dees-windowlayer/dees-windowlayer.js';
-import '../dees-icon/dees-icon.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { DeesWindowLayer } from '../../00group-overlay/dees-windowlayer/dees-windowlayer.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import { themeDefaultStyles } from '../../00theme.js';

@customElement('dees-mobilenavigation')
 export class DeesMobilenavigation extends DeesElement {
  // STATIC
+  public static demoGroups = ['App UI'];
  public static demo = () => html`
    <dees-button @click=${() => {
      DeesMobilenavigation.createAndShow([
--- a/ts_web/elements/00group-appui/dees-mobilenavigation/index.ts
+++ b/ts_web/elements/00group-appui/dees-mobilenavigation/index.ts
--- a/ts_web/elements/00group-appui/index.ts
+++ b/ts_web/elements/00group-appui/index.ts
@@ -8,3 +8,4 @@ export * from './dees-appui-mainmenu/index.js';
 export * from './dees-appui-secondarymenu/index.js';
 export * from './dees-appui-profiledropdown/index.js';
 export * from './dees-appui-tabs/index.js';
+export * from './dees-mobilenavigation/index.js';
--- a/ts_web/elements/00group-button/dees-button-exit/dees-button-exit.ts
+++ b/ts_web/elements/00group-button/dees-button-exit/dees-button-exit.ts
@@ -16,7 +16,7 @@ export class DeesButtonExit extends DeesElement {
  public static demo = () => html`
    <dees-button-exit></dees-button-exit>
  `;
-  public static demoGroup = 'Button';
+  public static demoGroups = ['Button'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-button/dees-button-group/dees-button-group.ts
+++ b/ts_web/elements/00group-button/dees-button-group/dees-button-group.ts
@@ -21,7 +21,7 @@ declare global {
@customElement('dees-button-group')
 export class DeesButtonGroup extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Button';
+  public static demoGroups = ['Button'];

  @property()
  accessor label: string = '';
--- a/ts_web/elements/00group-button/dees-button/dees-button.demo.ts
+++ b/ts_web/elements/00group-button/dees-button/dees-button.demo.ts
@@ -1,10 +1,10 @@
 import { html, css, cssManager, domtools } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import '../../00group-form/dees-form/dees-form.js';
 import '../../00group-form/dees-form-submit/dees-form-submit.js';
 import '../../00group-input/dees-input-text/dees-input-text.js';
-import '../../dees-icon/dees-icon.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
 import type { DeesButton } from '../dees-button/dees-button.js';

 export const demoFunc = () => html`
--- a/ts_web/elements/00group-button/dees-button/dees-button.ts
+++ b/ts_web/elements/00group-button/dees-button/dees-button.ts
@@ -23,7 +23,7 @@ declare global {
@customElement('dees-button')
 export class DeesButton extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Button';
+  public static demoGroups = ['Button'];

  @property({
    reflect: true,
--- a/ts_web/elements/00group-chart/dees-chart-area/component.ts
+++ b/ts_web/elements/00group-chart/dees-chart-area/component.ts
@@ -12,6 +12,16 @@ import { chartAreaStyles } from './styles.js';
 import { renderChartArea } from './template.js';

 import type ApexCharts from 'apexcharts';
+
+type ApexAxisChartSeries = {
+  name?: string;
+  type?: string;
+  color?: string;
+  group?: string;
+  hidden?: boolean;
+  zIndex?: number;
+  data: (number | null)[] | { x: any; y: any; [key: string]: any }[] | [number, number | null][] | number[][];
+}[];
 import { DeesServiceLibLoader } from '../../../services/index.js';

 declare global {
@@ -23,7 +33,7 @@ declare global {
@customElement('dees-chart-area')
 export class DeesChartArea extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Chart';
+  public static demoGroups = ['Chart'];

  // instance
  @state()
--- a/ts_web/elements/00group-chart/dees-chart-log/dees-chart-log.ts
+++ b/ts_web/elements/00group-chart/dees-chart-log/dees-chart-log.ts
@@ -44,7 +44,7 @@ export interface ILogMetrics {
@customElement('dees-chart-log')
 export class DeesChartLog extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Chart';
+  public static demoGroups = ['Chart', 'Workspace'];

  @property()
  accessor label: string = 'Server Logs';
--- a/ts_web/elements/00group-dataview/dees-dataview-codebox/dees-dataview-codebox.ts
+++ b/ts_web/elements/00group-dataview/dees-dataview-codebox/dees-dataview-codebox.ts
@@ -15,7 +15,7 @@ import type { HLJSApi } from 'highlight.js';
 import * as smartstring from '@push.rocks/smartstring';

 import * as domtools from '@design.estate/dees-domtools';
-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { DeesServiceLibLoader } from '../../../services/index.js';

 declare global {
@@ -27,7 +27,7 @@ declare global {
@customElement('dees-dataview-codebox')
 export class DeesDataviewCodebox extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Data View';
+  public static demoGroups = ['Data View', 'Workspace'];

  @property()
  accessor progLang: string = 'typescript';
@@ -52,6 +52,8 @@ export class DeesDataviewCodebox extends DeesElement {
          text-align: left;
          font-size: 16px;
          font-family: ${cssGeistFontFamily};
+          height: 100%;
+          box-sizing: border-box;
        }
        .mainbox {
          position: relative;
@@ -61,6 +63,10 @@ export class DeesDataviewCodebox extends DeesElement {
          background: ${cssManager.bdTheme('#ffffff', '#09090b')};
          border-radius: 6px;
          overflow: hidden;
+          display: flex;
+          flex-direction: column;
+          height: 100%;
+          box-sizing: border-box;
        }

        .appbar {
@@ -74,6 +80,7 @@ export class DeesDataviewCodebox extends DeesElement {
          line-height: 32px;
          justify-content: center;
          align-items: center;
+          flex-shrink: 0;
        }

        .appbar .fileName {
@@ -95,6 +102,7 @@ export class DeesDataviewCodebox extends DeesElement {
          justify-content: flex-end;
          align-items: stretch;
          overflow: hidden;
+          flex-shrink: 0;
        }

        .spacesLabel {
@@ -121,7 +129,9 @@ export class DeesDataviewCodebox extends DeesElement {
        .codegrid {
          display: grid;
          grid-template-columns: 50px auto;
-          overflow: hidden;
+          overflow: auto;
+          flex: 1;
+          min-height: 0;
        }

        .lineNumbers {
@@ -206,9 +216,7 @@ export class DeesDataviewCodebox extends DeesElement {
        }}"
      >
        <div class="appbar">
-          <dees-windowcontrols type="mac" position="left"></dees-windowcontrols>
          <div class="fileName">index.ts</div>
-          <dees-windowcontrols type="mac" position="right"></dees-windowcontrols>
        </div>
        <div class="codegrid">
          <div class="lineNumbers">
--- a/ts_web/elements/00group-dataview/dees-dataview-statusobject/dees-dataview-statusobject.ts
+++ b/ts_web/elements/00group-dataview/dees-dataview-statusobject/dees-dataview-statusobject.ts
@@ -15,7 +15,7 @@ import {
 } from '@design.estate/dees-element';

 import * as tsclass from '@tsclass/tsclass';
-import { DeesContextmenu } from '../../dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { themeDefaultStyles } from '../../00theme.js';

 declare global {
@@ -27,7 +27,7 @@ declare global {
@customElement('dees-dataview-statusobject')
 export class DeesDataviewStatusobject extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Data View';
+  public static demoGroups = ['Data View'];

  @property({ type: Object }) accessor statusObject: tsclass.code.IStatusObject;

--- a/ts_web/elements/00group-dataview/dees-statsgrid/dees-statsgrid.demo.ts
+++ b/ts_web/elements/00group-dataview/dees-statsgrid/dees-statsgrid.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import type { IStatsTile, ICpuCore, IPartitionData, IDiskData } from '../dees-statsgrid/dees-statsgrid.js';

 // Helper function to generate random CPU core data
--- a/ts_web/elements/00group-dataview/dees-statsgrid/dees-statsgrid.ts
+++ b/ts_web/elements/00group-dataview/dees-statsgrid/dees-statsgrid.ts
@@ -1,6 +1,6 @@
 import { demoFunc } from './dees-statsgrid.demo.js';
-import * as plugins from '../00plugins.js';
-import { cssGeistFontFamily } from '../00fonts.js';
+import * as plugins from '../../00plugins.js';
+import { cssGeistFontFamily } from '../../00fonts.js';
 import {
  customElement,
  html,
@@ -13,10 +13,10 @@ import {
 } from '@design.estate/dees-element';
 import type { TemplateResult } from '@design.estate/dees-element';

-import '../dees-icon/dees-icon.js';
-import '../dees-contextmenu/dees-contextmenu.js';
-import '../00group-button/dees-button/dees-button.js';
-import { themeDefaultStyles } from '../00theme.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
+import '../../00group-button/dees-button/dees-button.js';
+import { themeDefaultStyles } from '../../00theme.js';

 declare global {
  interface HTMLElementTagNameMap {
@@ -96,6 +96,7 @@ export interface IStatsTile {
@customElement('dees-statsgrid')
 export class DeesStatsGrid extends DeesElement {
  public static demo = demoFunc;
+  public static demoGroups = ['Data View'];

  @property({ type: Array })
  accessor tiles: IStatsTile[] = [];
--- a/ts_web/elements/00group-dataview/dees-statsgrid/index.ts
+++ b/ts_web/elements/00group-dataview/dees-statsgrid/index.ts
--- a/ts_web/elements/00group-dataview/dees-table/data.ts
+++ b/ts_web/elements/00group-dataview/dees-table/data.ts
--- a/ts_web/elements/00group-dataview/dees-table/dees-table.demo.ts
+++ b/ts_web/elements/00group-dataview/dees-table/dees-table.demo.ts
@@ -1,5 +1,5 @@
 import { type ITableAction } from './dees-table.js';
-import * as plugins from '../00plugins.js';
+import * as plugins from '../../00plugins.js';
 import { html, css, cssManager } from '@design.estate/dees-element';

 interface ITableDemoData {
--- a/ts_web/elements/00group-dataview/dees-table/dees-table.ts
+++ b/ts_web/elements/00group-dataview/dees-table/dees-table.ts
@@ -1,10 +1,10 @@
-import * as plugins from '../00plugins.js';
+import * as plugins from '../../00plugins.js';
 import { demoFunc } from './dees-table.demo.js';
 import { customElement, html, DeesElement, property, type TemplateResult, directives } from '@design.estate/dees-element';

-import { DeesContextmenu } from '../dees-contextmenu/dees-contextmenu.js';
+import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import * as domtools from '@design.estate/dees-domtools';
-import { type TIconKey } from '../dees-icon/dees-icon.js';
+import { type TIconKey } from '../../00group-utility/dees-icon/dees-icon.js';
 import { tableStyles } from './styles.js';
 import type { Column, ITableAction, ITableActionDataArg, TDisplayFunction } from './types.js';
 import {
@@ -14,7 +14,7 @@ import {
  getViewData as getViewDataFn,
 } from './data.js';
 import { compileLucenePredicate } from './lucene.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { themeDefaultStyles } from '../../00theme.js';

 export type { Column, ITableAction, ITableActionDataArg, TDisplayFunction } from './types.js';

@@ -30,6 +30,7 @@ declare global {
@customElement('dees-table')
 export class DeesTable<T> extends DeesElement {
  public static demo = demoFunc;
+  public static demoGroups = ['Data View'];

  // INSTANCE
  @property({
@@ -231,7 +232,7 @@ export class DeesTable<T> extends DeesElement {
            ${directives.resolveExec(async () => {
              const resultArray: TemplateResult[] = [];
              for (const action of this.dataActions) {
-                if (!action.type.includes('header')) continue;
+                if (!action.type?.includes('header')) continue;
                resultArray.push(
                  html`<div
                    class="headerAction"
@@ -449,7 +450,7 @@ export class DeesTable<T> extends DeesElement {
                              <td
                                @dblclick=${(e: Event) => {
                                  const dblAction = this.dataActions.find((actionArg) =>
-                                    actionArg.type.includes('doubleClick')
+                                    actionArg.type?.includes('doubleClick')
                                  );
                                  if (this.editableFields.includes(editKey)) {
                                    this.handleCellEditing(e, itemArg, editKey);
@@ -505,7 +506,7 @@ export class DeesTable<T> extends DeesElement {
            ${directives.resolveExec(async () => {
              const resultArray: TemplateResult[] = [];
              for (const action of this.dataActions) {
-                if (!action.type.includes('footer')) continue;
+                if (!action.type?.includes('footer')) continue;
                resultArray.push(
                  html`<div
                    class="footerAction"
@@ -539,7 +540,7 @@ export class DeesTable<T> extends DeesElement {
    super.updated(changedProperties);
    this.determineColumnWidths();
    if (this.searchable) {
-      const existing = this.dataActions.find((actionArg) => actionArg.type.includes('header') && actionArg.name === 'Search');
+      const existing = this.dataActions.find((actionArg) => actionArg.type?.includes('header') && actionArg.name === 'Search');
      if (!existing) {
        this.dataActions.unshift({
          name: 'Search',
@@ -622,7 +623,7 @@ export class DeesTable<T> extends DeesElement {
      const width = window.getComputedStyle(cell).width;
      if (cell.textContent.includes('Actions')) {
        const neededWidth =
-          this.dataActions.filter((actionArg) => actionArg.type.includes('inRow')).length * 36;
+          this.dataActions.filter((actionArg) => actionArg.type?.includes('inRow')).length * 36;
        cell.style.width = `${Math.max(neededWidth, 68)}px`;
      } else {
        cell.style.width = width;
@@ -794,7 +795,7 @@ export class DeesTable<T> extends DeesElement {
  getActionsForType(typeArg: ITableAction['type'][0]) {
    const actions: ITableAction[] = [];
    for (const action of this.dataActions) {
-      if (!action.type.includes(typeArg)) continue;
+      if (!action.type?.includes(typeArg)) continue;
      actions.push(action);
    }
    return actions;
--- a/ts_web/elements/00group-dataview/dees-table/index.ts
+++ b/ts_web/elements/00group-dataview/dees-table/index.ts
--- a/ts_web/elements/00group-dataview/dees-table/lucene.ts
+++ b/ts_web/elements/00group-dataview/dees-table/lucene.ts
--- a/ts_web/elements/00group-dataview/dees-table/styles.ts
+++ b/ts_web/elements/00group-dataview/dees-table/styles.ts
@@ -1,6 +1,6 @@
 import { cssManager, css, type CSSResult } from '@design.estate/dees-element';
-import { cssGeistFontFamily } from '../00fonts.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { cssGeistFontFamily } from '../../00fonts.js';
+import { themeDefaultStyles } from '../../00theme.js';

 export const tableStyles: CSSResult[] = [
  themeDefaultStyles,
--- a/ts_web/elements/00group-dataview/dees-table/types.ts
+++ b/ts_web/elements/00group-dataview/dees-table/types.ts
@@ -1,5 +1,5 @@
 import type { TemplateResult } from '@design.estate/dees-element';
-import type { TIconKey } from '../dees-icon/dees-icon.js';
+import type { TIconKey } from '../../00group-utility/dees-icon/dees-icon.js';

 export interface ITableActionDataArg<T> {
  item: T;
--- a/ts_web/elements/00group-dataview/index.ts
+++ b/ts_web/elements/00group-dataview/index.ts
@@ -1,3 +1,5 @@
 // Data View Components
 export * from './dees-dataview-codebox/index.js';
 export * from './dees-dataview-statusobject/index.js';
+export * from './dees-table/index.js';
+export * from './dees-statsgrid/index.js';
--- a/ts_web/elements/00group-feedback/dees-actionbar/actionbar.interfaces.ts
+++ b/ts_web/elements/00group-feedback/dees-actionbar/actionbar.interfaces.ts
--- a/ts_web/elements/00group-feedback/dees-actionbar/dees-actionbar.ts
+++ b/ts_web/elements/00group-feedback/dees-actionbar/dees-actionbar.ts
@@ -7,8 +7,8 @@ import {
  state,
  cssManager,
 } from '@design.estate/dees-element';
-import { themeDefaultStyles } from '../00theme.js';
-import '../dees-icon/dees-icon.js';
+import { themeDefaultStyles } from '../../00theme.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
 import type {
  IActionBarOptions,
  IActionBarResult,
@@ -25,6 +25,7 @@ declare global {
@customElement('dees-actionbar')
 export class DeesActionbar extends DeesElement {
  // STATIC
+  public static demoGroups = ['Feedback', 'Overlay'];
  public static demo = () => {
    const getActionbar = (e: Event) => {
      const button = e.currentTarget as HTMLElement;
--- a/ts_web/elements/00group-feedback/dees-actionbar/index.ts
+++ b/ts_web/elements/00group-feedback/dees-actionbar/index.ts
--- a/ts_web/elements/00group-feedback/dees-badge/dees-badge.demo.ts
+++ b/ts_web/elements/00group-feedback/dees-badge/dees-badge.demo.ts
--- a/ts_web/elements/00group-feedback/dees-badge/dees-badge.ts
+++ b/ts_web/elements/00group-feedback/dees-badge/dees-badge.ts
@@ -11,7 +11,7 @@ import {

 import * as domtools from '@design.estate/dees-domtools';
 import { demoFunc } from './dees-badge.demo.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { themeDefaultStyles } from '../../00theme.js';

 declare global {
  interface HTMLElementTagNameMap {
@@ -22,6 +22,7 @@ declare global {
@customElement('dees-badge')
 export class DeesBadge extends DeesElement {
  public static demo = demoFunc;
+  public static demoGroups = ['Feedback'];

  @property({ type: String })
  accessor type: 'default' | 'primary' | 'success' | 'warning' | 'error' = 'default';
--- a/ts_web/elements/00group-feedback/dees-badge/index.ts
+++ b/ts_web/elements/00group-feedback/dees-badge/index.ts
--- a/ts_web/elements/00group-feedback/dees-hint/dees-hint.demo.ts
+++ b/ts_web/elements/00group-feedback/dees-hint/dees-hint.demo.ts
--- a/ts_web/elements/00group-feedback/dees-hint/dees-hint.ts
+++ b/ts_web/elements/00group-feedback/dees-hint/dees-hint.ts
@@ -11,7 +11,7 @@ import {

 import * as domtools from '@design.estate/dees-domtools';
 import { demoFunc } from './dees-hint.demo.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { themeDefaultStyles } from '../../00theme.js';

 declare global {
  interface HTMLElementTagNameMap {
@@ -22,6 +22,7 @@ declare global {
@customElement('dees-hint')
 export class DeesHint extends DeesElement {
  public static demo = demoFunc;
+  public static demoGroups = ['Feedback'];

  @property({ type: String })
  accessor type: 'info' | 'warn' | 'error' | 'critical' = 'info';
--- a/ts_web/elements/00group-feedback/dees-hint/index.ts
+++ b/ts_web/elements/00group-feedback/dees-hint/index.ts
--- a/ts_web/elements/00group-feedback/dees-progressbar/dees-progressbar.demo.ts
+++ b/ts_web/elements/00group-feedback/dees-progressbar/dees-progressbar.demo.ts
--- a/ts_web/elements/00group-feedback/dees-progressbar/dees-progressbar.ts
+++ b/ts_web/elements/00group-feedback/dees-progressbar/dees-progressbar.ts
@@ -1,5 +1,5 @@
-import * as plugins from '../00plugins.js';
-import * as colors from '../00colors.js';
+import * as plugins from '../../00plugins.js';
+import * as colors from '../../00colors.js';
 import { demoFunc } from './dees-progressbar.demo.js';
 import {
  customElement,
@@ -16,12 +16,13 @@ import {
 } from '@design.estate/dees-element';

 import * as domtools from '@design.estate/dees-domtools';
-import { themeDefaultStyles } from '../00theme.js';
+import { themeDefaultStyles } from '../../00theme.js';

@customElement('dees-progressbar')
 export class DeesProgressbar extends DeesElement {
  // STATIC
  public static demo = demoFunc;
+  public static demoGroups = ['Feedback'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-feedback/dees-progressbar/index.ts
+++ b/ts_web/elements/00group-feedback/dees-progressbar/index.ts
--- a/ts_web/elements/00group-feedback/dees-spinner/dees-spinner.ts
+++ b/ts_web/elements/00group-feedback/dees-spinner/dees-spinner.ts
@@ -11,7 +11,7 @@ import {
 } from '@design.estate/dees-element';

 import * as domtools from '@design.estate/dees-domtools';
-import { themeDefaultStyles } from '../00theme.js';
+import { themeDefaultStyles } from '../../00theme.js';

 declare global {
  interface HTMLElementTagNameMap {
@@ -21,6 +21,7 @@ declare global {

@customElement('dees-spinner')
 export class DeesSpinner extends DeesElement {
+  public static demoGroups = ['Feedback'];
  public static demo = () => html`
    <dees-spinner></dees-spinner>
    <dees-spinner status="success"></dees-spinner>
--- a/ts_web/elements/00group-feedback/dees-spinner/index.ts
+++ b/ts_web/elements/00group-feedback/dees-spinner/index.ts
--- a/ts_web/elements/00group-feedback/dees-toast/dees-toast.demo.ts
+++ b/ts_web/elements/00group-feedback/dees-toast/dees-toast.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
 import { DeesToast } from '../dees-toast/dees-toast.js';
-import '../00group-button/dees-button/dees-button.js';
+import '../../00group-button/dees-button/dees-button.js';

 export const demoFunc = () => html`
    <style>
--- a/ts_web/elements/00group-feedback/dees-toast/dees-toast.ts
+++ b/ts_web/elements/00group-feedback/dees-toast/dees-toast.ts
@@ -1,10 +1,10 @@
 import { customElement, DeesElement, type TemplateResult, html, css, property, cssManager } from '@design.estate/dees-element';

 import * as domtools from '@design.estate/dees-domtools';
-import { zIndexLayers } from '../00zindex.js';
+import { zIndexLayers } from '../../00zindex.js';
 import { demoFunc } from './dees-toast.demo.js';
-import { cssGeistFontFamily } from '../00fonts.js';
-import { themeDefaultStyles } from '../00theme.js';
+import { cssGeistFontFamily } from '../../00fonts.js';
+import { themeDefaultStyles } from '../../00theme.js';

 declare global {
  interface HTMLElementTagNameMap {
@@ -26,6 +26,7 @@ export interface IToastOptions {
 export class DeesToast extends DeesElement {
  // STATIC
  public static demo = demoFunc;
+  public static demoGroups = ['Feedback', 'Overlay'];

  private static toastContainers = new Map<ToastPosition, HTMLDivElement>();

--- a/ts_web/elements/00group-feedback/dees-toast/index.ts
+++ b/ts_web/elements/00group-feedback/dees-toast/index.ts
--- a/ts_web/elements/00group-feedback/index.ts
+++ b/ts_web/elements/00group-feedback/index.ts
@@ -0,0 +1,7 @@
+// Feedback Components
+export * from './dees-actionbar/index.js';
+export * from './dees-badge/index.js';
+export * from './dees-hint/index.js';
+export * from './dees-progressbar/index.js';
+export * from './dees-spinner/index.js';
+export * from './dees-toast/index.js';
--- a/ts_web/elements/00group-form/dees-form-submit/dees-form-submit.demo.ts
+++ b/ts_web/elements/00group-form/dees-form-submit/dees-form-submit.demo.ts
@@ -1,3 +1,85 @@
 import { html } from '@design.estate/dees-element';

-export const demoFunc = () => html`<dees-form-submit>Submit Form</dees-form-submit>`;
+export const demoFunc = () => html`
+  <style>
+    .demo-container {
+      display: flex;
+      flex-direction: column;
+      gap: 24px;
+      padding: 24px;
+    }
+    .demo-section {
+      display: flex;
+      flex-direction: column;
+      gap: 12px;
+    }
+    .demo-section h3 {
+      margin: 0 0 8px 0;
+      font-size: 14px;
+      font-weight: 500;
+      color: #888;
+    }
+    .demo-row {
+      display: flex;
+      gap: 12px;
+      flex-wrap: wrap;
+      align-items: center;
+    }
+  </style>
+  <div class="demo-container">
+    <div class="demo-section">
+      <h3>Basic Usage</h3>
+      <div class="demo-row">
+        <dees-form-submit>Submit Form</dees-form-submit>
+        <dees-form-submit text="With Text Property"></dees-form-submit>
+      </div>
+    </div>
+
+    <div class="demo-section">
+      <h3>With Icons (inherited from DeesButton)</h3>
+      <div class="demo-row">
+        <dees-form-submit icon="lucide:send">Submit</dees-form-submit>
+        <dees-form-submit icon="lucide:save" iconPosition="left">Save Form</dees-form-submit>
+        <dees-form-submit icon="lucide:arrow-right" iconPosition="right">Continue</dees-form-submit>
+      </div>
+    </div>
+
+    <div class="demo-section">
+      <h3>Button Types</h3>
+      <div class="demo-row">
+        <dees-form-submit type="highlighted" icon="lucide:send">Highlighted</dees-form-submit>
+        <dees-form-submit type="normal" icon="lucide:send">Normal</dees-form-submit>
+        <dees-form-submit type="discreet" icon="lucide:send">Discreet</dees-form-submit>
+      </div>
+    </div>
+
+    <div class="demo-section">
+      <h3>Sizes</h3>
+      <div class="demo-row">
+        <dees-form-submit size="small" icon="lucide:send">Small</dees-form-submit>
+        <dees-form-submit size="normal" icon="lucide:send">Normal</dees-form-submit>
+        <dees-form-submit size="large" icon="lucide:send">Large</dees-form-submit>
+      </div>
+    </div>
+
+    <div class="demo-section">
+      <h3>States</h3>
+      <div class="demo-row">
+        <dees-form-submit status="normal" icon="lucide:send">Normal</dees-form-submit>
+        <dees-form-submit status="pending" icon="lucide:send">Pending</dees-form-submit>
+        <dees-form-submit status="success" icon="lucide:check">Success</dees-form-submit>
+        <dees-form-submit status="error" icon="lucide:x">Error</dees-form-submit>
+        <dees-form-submit disabled icon="lucide:send">Disabled</dees-form-submit>
+      </div>
+    </div>
+
+    <div class="demo-section">
+      <h3>In a Form Context</h3>
+      <dees-form>
+        <dees-input-text label="Name" key="name"></dees-input-text>
+        <dees-input-text label="Email" key="email"></dees-input-text>
+        <dees-form-submit icon="lucide:send" type="highlighted">Submit Form</dees-form-submit>
+      </dees-form>
+    </div>
+  </div>
+`;
--- a/ts_web/elements/00group-form/dees-form-submit/dees-form-submit.ts
+++ b/ts_web/elements/00group-form/dees-form-submit/dees-form-submit.ts
@@ -6,6 +6,7 @@ import {
  css,
  cssManager,
  property,
+  type TemplateResult,
 } from '@design.estate/dees-element';
 import type { DeesForm } from '../dees-form/dees-form.js';
 import { themeDefaultStyles } from '../../00theme.js';
@@ -19,40 +20,63 @@ declare global {
@customElement('dees-form-submit')
 export class DeesFormSubmit extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Form';
+  public static demoGroups = ['Form', 'Button'];

-  @property({
-    type: Boolean,
-    reflect: true,
-  })
+  // =============================================
+  // Properties forwarded to internal dees-button
+  // =============================================
+
+  @property({ type: Boolean, reflect: true })
  accessor disabled = false;

-  @property({
-    type: String,
-  })
+  @property({ type: String })
  accessor text: string;

-  @property({
-    type: String,
-  })
+  @property({ type: String })
  accessor status: 'normal' | 'pending' | 'success' | 'error' = 'normal';

+  @property({ type: String, reflect: true })
+  accessor type: 'default' | 'secondary' | 'destructive' | 'outline' | 'ghost' | 'link' | 'normal' | 'highlighted' | 'discreet' | 'big' = 'default';
+
+  @property({ type: String, reflect: true })
+  accessor size: 'sm' | 'default' | 'lg' | 'icon' | 'small' | 'normal' | 'large' = 'default';
+
+  @property({ type: String })
+  accessor icon: string;
+
+  @property({ type: String })
+  accessor iconPosition: 'left' | 'right' = 'left';
+
  constructor() {
    super();
  }
-  
-  public static styles = [themeDefaultStyles, cssManager.defaultStyles, css`
-      /* TODO: Migrate hardcoded values to --dees-* CSS variables */
-    `];

-  public render() {
+  public static styles = [
+    themeDefaultStyles,
+    cssManager.defaultStyles,
+    css`
+      :host {
+        display: inline-block;
+      }
+      dees-button {
+        width: 100%;
+      }
+    `,
+  ];
+
+  public render(): TemplateResult {
    return html`
      <dees-button
-        status="${this.status}"
-        @click="${this.submit}"
-        ?disabled="${this.disabled}"
+        .status=${this.status}
+        .type=${this.type}
+        .size=${this.size}
+        .icon=${this.icon}
+        .iconPosition=${this.iconPosition}
+        .text=${this.text}
+        ?disabled=${this.disabled}
+        @clicked=${this.submit}
      >
-        ${this.text || html`<slot></slot>`}
+        <slot></slot>
      </dees-button>
    `;
  }
--- a/ts_web/elements/00group-form/dees-form/dees-form.ts
+++ b/ts_web/elements/00group-form/dees-form/dees-form.ts
@@ -22,7 +22,7 @@ import { DeesInputPhone } from '../../00group-input/dees-input-phone/dees-input-
 import { DeesInputToggle } from '../../00group-input/dees-input-toggle/dees-input-toggle.js';
 import { DeesInputTypelist } from '../../00group-input/dees-input-typelist/dees-input-typelist.js';
 import { DeesFormSubmit } from '../dees-form-submit/dees-form-submit.js';
-import { DeesTable } from '../../dees-table/index.js';
+import { DeesTable } from '../../00group-dataview/dees-table/index.js';
 import { demoFunc } from './dees-form.demo.js';

 // Unified set for form input types
@@ -68,7 +68,7 @@ declare global {
@customElement('dees-form')
 export class DeesForm extends DeesElement {
  public static demo = demoFunc;
-  public static demoGroup = 'Form';
+  public static demoGroups = ['Form'];

  public name: string = 'myform';
  public changeSubject = new domtools.plugins.smartrx.rxjs.Subject();
--- a/ts_web/elements/00group-input/dees-input-checkbox/dees-input-checkbox.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-checkbox/dees-input-checkbox.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import type { DeesInputCheckbox } from '../dees-input-checkbox/dees-input-checkbox.js';
 import '../../00group-button/dees-button/dees-button.js';

--- a/ts_web/elements/00group-input/dees-input-checkbox/dees-input-checkbox.ts
+++ b/ts_web/elements/00group-input/dees-input-checkbox/dees-input-checkbox.ts
@@ -21,7 +21,7 @@ declare global {
 export class DeesInputCheckbox extends DeesInputBase<DeesInputCheckbox> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE

--- a/ts_web/elements/00group-input/dees-input-code/dees-input-code.ts
+++ b/ts_web/elements/00group-input/dees-input-code/dees-input-code.ts
@@ -9,9 +9,9 @@ import {
  state,
 } from '@design.estate/dees-element';
 import { themeDefaultStyles } from '../../00theme.js';
-import { DeesModal } from '../../dees-modal/dees-modal.js';
-import '../../dees-icon/dees-icon.js';
-import '../../dees-label/dees-label.js';
+import { DeesModal } from '../../00group-overlay/dees-modal/dees-modal.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import '../../00group-layout/dees-label/dees-label.js';
 import '../../00group-workspace/dees-workspace-monaco/dees-workspace-monaco.js';
 import { DeesWorkspaceMonaco } from '../../00group-workspace/dees-workspace-monaco/dees-workspace-monaco.js';

@@ -54,7 +54,7 @@ export class DeesInputCode extends DeesInputBase<string> {
      .value=${'const greeting: string = "Hello World";\nconsole.log(greeting);'}
    ></dees-input-code>
  `;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input', 'Workspace'];

  // INSTANCE
  @property({ type: String })
--- a/ts_web/elements/00group-input/dees-input-datepicker/component.ts
+++ b/ts_web/elements/00group-input/dees-input-datepicker/component.ts
@@ -9,8 +9,8 @@ import { demoFunc } from './demo.js';
 import { datepickerStyles } from './styles.js';
 import { renderDatepicker } from './template.js';
 import type { IDateEvent } from './types.js';
-import '../../dees-icon/dees-icon.js';
-import '../../dees-label/dees-label.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import '../../00group-layout/dees-label/dees-label.js';


 declare global {
@@ -22,7 +22,7 @@ declare global {
@customElement('dees-input-datepicker')
 export class DeesInputDatepicker extends DeesInputBase<DeesInputDatepicker> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  @property({ type: String })
  accessor value: string = '';
--- a/ts_web/elements/00group-input/dees-input-datepicker/demo.ts
+++ b/ts_web/elements/00group-input/dees-input-datepicker/demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import './component.js';
 import type { DeesInputDatepicker } from './component.js';

--- a/ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import '../../00group-form/dees-form/dees-form.js';
 import '../../00group-form/dees-form-submit/dees-form-submit.js';

--- a/ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.ts
+++ b/ts_web/elements/00group-input/dees-input-dropdown/dees-input-dropdown.ts
@@ -22,7 +22,7 @@ declare global {
@customElement('dees-input-dropdown')
 export class DeesInputDropdown extends DeesInputBase<DeesInputDropdown> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE

--- a/ts_web/elements/00group-input/dees-input-fileupload/component.ts
+++ b/ts_web/elements/00group-input/dees-input-fileupload/component.ts
@@ -1,8 +1,8 @@
 import { DeesInputBase } from '../dees-input-base/dees-input-base.js';
 import { demoFunc } from './demo.js';
 import { fileuploadStyles } from './styles.js';
-import '../../dees-icon/dees-icon.js';
-import '../../dees-label/dees-label.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
+import '../../00group-layout/dees-label/dees-label.js';

 import {
  customElement,
@@ -21,7 +21,7 @@ declare global {
@customElement('dees-input-fileupload')
 export class DeesInputFileupload extends DeesInputBase<DeesInputFileupload> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  @property({ attribute: false })
  accessor value: File[] = [];
--- a/ts_web/elements/00group-input/dees-input-fileupload/demo.ts
+++ b/ts_web/elements/00group-input/dees-input-fileupload/demo.ts
@@ -1,6 +1,6 @@
 import { css, cssManager, html } from '@design.estate/dees-element';
 import './component.js';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';

 export const demoFunc = () => html`
  <dees-demowrapper>
--- a/ts_web/elements/00group-input/dees-input-iban/dees-input-iban.ts
+++ b/ts_web/elements/00group-input/dees-input-iban/dees-input-iban.ts
@@ -17,7 +17,7 @@ import { themeDefaultStyles } from '../../00theme.js';
 export class DeesInputIban extends DeesInputBase<DeesInputIban> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @state()
--- a/ts_web/elements/00group-input/dees-input-list/dees-input-list.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-list/dees-input-list.demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import '../../00group-form/dees-form/dees-form.js';
 import '../dees-input-text/dees-input-text.js';
 import '../../00group-form/dees-form-submit/dees-form-submit.js';
--- a/ts_web/elements/00group-input/dees-input-list/dees-input-list.ts
+++ b/ts_web/elements/00group-input/dees-input-list/dees-input-list.ts
@@ -8,7 +8,7 @@ import {
  type TemplateResult,
 } from '@design.estate/dees-element';
 import { DeesInputBase } from '../dees-input-base/dees-input-base.js';
-import '../../dees-icon/dees-icon.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
 import '../../00group-button/dees-button/dees-button.js';
 import { demoFunc } from './dees-input-list.demo.js';
 import { themeDefaultStyles } from '../../00theme.js';
@@ -23,7 +23,7 @@ declare global {
 export class DeesInputList extends DeesInputBase<DeesInputList> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @property({ type: Array })
--- a/ts_web/elements/00group-input/dees-input-multitoggle/dees-input-multitoggle.ts
+++ b/ts_web/elements/00group-input/dees-input-multitoggle/dees-input-multitoggle.ts
@@ -22,7 +22,7 @@ declare global {
@customElement('dees-input-multitoggle')
 export class DeesInputMultitoggle extends DeesInputBase<DeesInputMultitoggle> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];


  @property()
--- a/ts_web/elements/00group-input/dees-input-phone/dees-input-phone.ts
+++ b/ts_web/elements/00group-input/dees-input-phone/dees-input-phone.ts
@@ -22,7 +22,7 @@ declare global {
 export class DeesInputPhone extends DeesInputBase<DeesInputPhone> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @state()
--- a/ts_web/elements/00group-input/dees-input-quantityselector/dees-input-quantityselector.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-quantityselector/dees-input-quantityselector.demo.ts
@@ -1,5 +1,5 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
-import '../../dees-shopping-productcard/dees-shopping-productcard.js';
+import '../../00group-simple/dees-shopping-productcard/dees-shopping-productcard.js';

 export const demoFunc = () => html`
  <dees-demowrapper>
--- a/ts_web/elements/00group-input/dees-input-quantityselector/dees-input-quantityselector.ts
+++ b/ts_web/elements/00group-input/dees-input-quantityselector/dees-input-quantityselector.ts
@@ -13,7 +13,7 @@ declare global {
@customElement('dees-input-quantityselector')
 export class DeesInputQuantitySelector extends DeesInputBase<DeesInputQuantitySelector> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE

--- a/ts_web/elements/00group-input/dees-input-radiogroup/dees-input-radiogroup.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-radiogroup/dees-input-radiogroup.demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';

 export const demoFunc = () => html`
  <dees-demowrapper>
--- a/ts_web/elements/00group-input/dees-input-radiogroup/dees-input-radiogroup.ts
+++ b/ts_web/elements/00group-input/dees-input-radiogroup/dees-input-radiogroup.ts
@@ -21,7 +21,7 @@ type RadioOption = string | { option: string; key: string; payload?: any };
@customElement('dees-input-radiogroup')
 export class DeesInputRadiogroup extends DeesInputBase<string | object> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE

--- a/ts_web/elements/00group-input/dees-input-richtext/component.ts
+++ b/ts_web/elements/00group-input/dees-input-richtext/component.ts
@@ -3,7 +3,7 @@ import { demoFunc } from './demo.js';
 import { richtextStyles } from './styles.js';
 import { renderRichtext } from './template.js';
 import type { IToolbarButton } from './types.js';
-import '../../dees-icon/dees-icon.js';
+import '../../00group-utility/dees-icon/dees-icon.js';

 import {
  customElement,
@@ -28,7 +28,7 @@ declare global {
@customElement('dees-input-richtext')
 export class DeesInputRichtext extends DeesInputBase<string> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-input/dees-input-richtext/demo.ts
+++ b/ts_web/elements/00group-input/dees-input-richtext/demo.ts
@@ -1,7 +1,7 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
 import './component.js';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';

 export const demoFunc = () => html`
  <dees-demowrapper>
--- a/ts_web/elements/00group-input/dees-input-tags/dees-input-tags.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-tags/dees-input-tags.demo.ts
@@ -1,6 +1,6 @@
 import { html, css } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';

 export const demoFunc = () => html`
  <dees-demowrapper>
--- a/ts_web/elements/00group-input/dees-input-tags/dees-input-tags.ts
+++ b/ts_web/elements/00group-input/dees-input-tags/dees-input-tags.ts
@@ -8,7 +8,7 @@ import {
  type TemplateResult,
 } from '@design.estate/dees-element';
 import { DeesInputBase } from '../dees-input-base/dees-input-base.js';
-import '../../dees-icon/dees-icon.js';
+import '../../00group-utility/dees-icon/dees-icon.js';
 import { demoFunc } from './dees-input-tags.demo.js';
 import { themeDefaultStyles } from '../../00theme.js';

@@ -22,7 +22,7 @@ declare global {
 export class DeesInputTags extends DeesInputBase<DeesInputTags> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @property({ type: Array })
--- a/ts_web/elements/00group-input/dees-input-text/dees-input-text.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-text/dees-input-text.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import type { DeesInputText } from '../dees-input-text/dees-input-text.js';

 export const demoFunc = () => html`
--- a/ts_web/elements/00group-input/dees-input-text/dees-input-text.ts
+++ b/ts_web/elements/00group-input/dees-input-text/dees-input-text.ts
@@ -22,7 +22,7 @@ declare global {
@customElement('dees-input-text')
 export class DeesInputText extends DeesInputBase {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE
  @property({
--- a/ts_web/elements/00group-input/dees-input-toggle/dees-input-toggle.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-toggle/dees-input-toggle.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, cssManager } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../../dees-panel/dees-panel.js';
+import '../../00group-layout/dees-panel/dees-panel.js';
 import type { DeesInputToggle } from './dees-input-toggle.js';

 export const demoFunc = () => html`
--- a/ts_web/elements/00group-input/dees-input-toggle/dees-input-toggle.ts
+++ b/ts_web/elements/00group-input/dees-input-toggle/dees-input-toggle.ts
@@ -22,7 +22,7 @@ declare global {
 export class DeesInputToggle extends DeesInputBase<DeesInputToggle> {
  // STATIC
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];

  // INSTANCE

--- a/ts_web/elements/00group-input/dees-input-typelist/dees-input-typelist.ts
+++ b/ts_web/elements/00group-input/dees-input-typelist/dees-input-typelist.ts
@@ -16,7 +16,7 @@ import { themeDefaultStyles } from '../../00theme.js';
@customElement('dees-input-typelist')
 export class DeesInputTypelist extends DeesInputBase<DeesInputTypelist> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input'];


  // INSTANCE
--- a/ts_web/elements/00group-input/dees-input-wysiwyg.demo.ts
+++ b/ts_web/elements/00group-input/dees-input-wysiwyg.demo.ts
@@ -1,6 +1,6 @@
 import { html, css, type TemplateResult } from '@design.estate/dees-element';
 import '@design.estate/dees-wcctools/demotools';
-import '../dees-panel/dees-panel.js';
+import '../00group-layout/dees-panel/dees-panel.js';
 import type { DeesInputWysiwyg } from './dees-input-wysiwyg/dees-input-wysiwyg.js';
 import type { IBlock } from './dees-input-wysiwyg/wysiwyg.types.js';

--- a/ts_web/elements/00group-input/dees-input-wysiwyg/dees-input-wysiwyg.ts
+++ b/ts_web/elements/00group-input/dees-input-wysiwyg/dees-input-wysiwyg.ts
@@ -1,6 +1,6 @@
 import { DeesInputBase } from '../dees-input-base/dees-input-base.js';
 import { demoFunc } from '../dees-input-wysiwyg.demo.js';
-import { DeesModal } from '../../dees-modal/dees-modal.js';
+import { DeesModal } from '../../00group-overlay/dees-modal/dees-modal.js';

 import {
  customElement,
@@ -39,7 +39,7 @@ declare global {
@customElement('dees-input-wysiwyg')
 export class DeesInputWysiwyg extends DeesInputBase<string> {
  public static demo = demoFunc;
-  public static demoGroup = 'Input';
+  public static demoGroups = ['Input', 'Workspace'];

  @property({ type: String })
  accessor value: string = '';
--- a/ts_web/elements/00group-input/dees-input-wysiwyg/dees-slash-menu.ts
+++ b/ts_web/elements/00group-input/dees-input-wysiwyg/dees-slash-menu.ts
@@ -8,7 +8,7 @@ import {
  state,
 } from '@design.estate/dees-element';
 import { zIndexRegistry } from '../../00zindex.js';
-import '../../dees-icon/dees-icon.js';
+import '../../00group-utility/dees-icon/dees-icon.js';

 import { type ISlashMenuItem } from './wysiwyg.types.js';
 import { WysiwygShortcuts } from './wysiwyg.shortcuts.js';
--- a/ts_web/elements/00group-input/dees-input-wysiwyg/dees-wysiwyg-block.ts
+++ b/ts_web/elements/00group-input/dees-input-wysiwyg/dees-wysiwyg-block.ts
@@ -14,7 +14,7 @@ import { WysiwygSelection } from './wysiwyg.selection.js';
 import { BlockRegistry, type IBlockEventHandlers } from './blocks/index.js';
 import './wysiwyg.blockregistration.js';
 import { WysiwygShortcuts } from './wysiwyg.shortcuts.js';
-import '../../dees-contextmenu/dees-contextmenu.js';
+import '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { themeDefaultStyles } from '../../00theme.js';

 declare global {
--- a/ts_web/elements/00group-input/dees-input-wysiwyg/wysiwyg.modalmanager.ts
+++ b/ts_web/elements/00group-input/dees-input-wysiwyg/wysiwyg.modalmanager.ts
@@ -1,5 +1,5 @@
 import { html, type TemplateResult, cssManager } from '@design.estate/dees-element';
-import { DeesModal } from '../../dees-modal/dees-modal.js';
+import { DeesModal } from '../../00group-overlay/dees-modal/dees-modal.js';
 import { type IBlock } from './wysiwyg.types.js';
 import { WysiwygShortcuts } from './wysiwyg.shortcuts.js';
 import { PROGRAMMING_LANGUAGES } from './wysiwyg.constants.js';
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Juergen Kunz	ecd35683e6	v3.42.2 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-02-16 17:16:49 +00:00
Juergen Kunz	93cb632448	fix(dees-chart-area): add ApexAxisChartSeries type to dees-chart-area component to improve typing for ApexCharts series data	2026-02-16 17:16:49 +00:00
Juergen Kunz	047e42c6a3	v3.42.1 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-02-16 16:03:23 +00:00
Juergen Kunz	59efa8cff0	fix(dees-table): Guard against undefined action.type in dees-table by using optional chaining and update several dependencies	2026-02-16 16:03:23 +00:00
Juergen Kunz	09f0aa97dd	v3.42.0 Some checks failed Default (tags) / security (push) Failing after 0s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-02-02 14:32:20 +00:00
Juergen Kunz	7c62f45d77	feat(dees-form-submit): forward button properties to internal dees-button, use property bindings, add demo and styles	2026-02-02 14:32:20 +00:00
Juergen Kunz	b123768474	v3.41.6 Some checks failed Default (tags) / security (push) Failing after 0s Details Default (tags) / test (push) Failing after 0s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-02-02 09:27:53 +00:00
Juergen Kunz	f292e7a7f4	fix(dees-simple-appdash): respect selectedView when loading initial view, falling back to the first tab	2026-02-02 09:27:53 +00:00
Juergen Kunz	d82e5603a7	v3.41.5 Some checks failed Default (tags) / security (push) Failing after 0s Details Default (tags) / test (push) Failing after 0s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-02-01 23:51:53 +00:00
Juergen Kunz	7e2386bcdf	fix(dees-service-lib-loader): prevent horizontal scrollbar by offsetting xterm WidthCache measurement container	2026-02-01 23:51:53 +00:00
Juergen Kunz	eba2a03355	v3.41.4 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-29 13:21:30 +00:00
Juergen Kunz	06c01f0690	fix(): no changes	2026-01-29 13:21:30 +00:00
Juergen Kunz	91e03eb9c4	v3.41.3 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-29 07:46:19 +00:00
Juergen Kunz	b7f3f47c61	fix(dees-pdf-viewer): use in-memory PDF data for download and print; add robust print wrapper, cleanup and error handling	2026-01-29 07:46:19 +00:00
Juergen Kunz	0a83f0e136	update	2026-01-28 17:10:37 +00:00
Juergen Kunz	2b048cf34f	update	2026-01-28 17:02:52 +00:00
Juergen Kunz	7e50b8cb3f	update	2026-01-28 16:46:07 +00:00
Juergen Kunz	b97601a876	v3.41.2 Some checks failed Default (tags) / security (push) Failing after 0s Details Default (tags) / test (push) Failing after 0s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-28 16:17:05 +00:00
Juergen Kunz	5ddeb8fe7c	fix(dees-pdf-viewer): account for devicePixelRatio when setting canvas dimensions and scale 2D context to render crisp PDF pages and thumbnails on high-DPI displays	2026-01-28 16:17:05 +00:00
Juergen Kunz	25f46162c5	v3.41.1 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-27 14:02:25 +00:00
Juergen Kunz	b84b0e7ce6	fix(dataview-codebox): fix dees-dataview codebox layout to ensure full-height, proper flex behavior and scrolling; bump internal dependencies	2026-01-27 14:02:25 +00:00
Juergen Kunz	69840de3a6	v3.41.0 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-27 12:36:46 +00:00
Juergen Kunz	85badfbd21	feat(docs): document new media & tile components and expand Workspace/IDE component docs; update component count to 90+	2026-01-27 12:36:46 +00:00
Juergen Kunz	264e460365	v3.40.0 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-27 11:36:24 +00:00
Juergen Kunz	bfda6b75e7	feat(dees-tile): unify tile badge styling and markup; replace component-specific badge classes with shared tile-badge classes and update related imports/tests	2026-01-27 11:36:24 +00:00
Juergen Kunz	825a74b810	v3.39.1 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-27 11:10:39 +00:00
Juergen Kunz	f6bf0f8a45	fix(dees-tile-note): use horizontal pointer position to scroll note body by computing percentage from clientX and element width instead of clientY and height	2026-01-27 11:10:39 +00:00
Juergen Kunz	66661e05a9	v3.39.0 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-27 10:57:42 +00:00
Juergen Kunz	162688cdb5	feat(components): add large set of new UI components and demos, reorganize groups, and bump a few dependencies	2026-01-27 10:57:42 +00:00
Juergen Kunz	8158b791c7	v3.38.0 Some checks failed Default (tags) / security (push) Failing after 1s Details Default (tags) / test (push) Failing after 1s Details Default (tags) / release (push) Has been skipped Details Default (tags) / metadata (push) Has been skipped Details	2026-01-26 01:28:31 +00:00
Juergen Kunz	ed8167385f	feat(appui): add app shell and bottom bar APIs, new input components, and update README component listings and docs	2026-01-26 01:28:31 +00:00