v3.49.0

changelog.md

@@ -1,5 +1,24 @@
 # Changelog
 
+## 2026-03-18 - 3.49.0 - feat(dataview-statusobject)
+add last updated footer to status object and refresh demo data
+
+- Render a bottom bar that shows the status object's lastUpdated timestamp when available.
+- Adjust detail row padding to keep spacing consistent with the new footer layout.
+- Update demo status objects to include lastUpdated examples for current, hourly, and daily timestamps.
+- Bump @tsclass/tsclass from ^9.3.0 to ^9.5.0.
+
+## 2026-03-14 - 3.48.5 - fix(repo)
+no changes to commit
+
+
+## 2026-03-14 - 3.48.4 - fix(storage-browser)
+rename S3-specific storage browser interfaces to generic storage types
+
+- Replaces IS3DataProvider, IS3Object, and IS3ChangeEvent with generic storage interface names across storage browser components
+- Updates demo provider naming and user-facing demo text from S3 browser to Storage browser
+- Aligns interface and utility comments with storage-agnostic terminology
+
 ## 2026-03-14 - 3.48.3 - fix(dataview)
 rename dees-s3-browser exports and custom elements to dees-storage-browser
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@design.estate/dees-catalog",
-  "version": "3.48.3",
+  "version": "3.49.0",
   "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",
@@ -33,7 +33,7 @@
     "@tiptap/extension-typography": "^2.23.0",
     "@tiptap/extension-underline": "^2.23.0",
     "@tiptap/starter-kit": "^2.23.0",
-    "@tsclass/tsclass": "^9.3.0",
+    "@tsclass/tsclass": "^9.5.0",
     "apexcharts": "^5.10.3",
     "highlight.js": "11.11.1",
     "ibantools": "^4.5.1",

pnpm-lock.yaml

@@ -60,8 +60,8 @@ importers:
         specifier: ^2.23.0
         version: 2.27.2
       '@tsclass/tsclass':
-        specifier: ^9.3.0
+        specifier: ^9.5.0
-        version: 9.3.0
+        version: 9.5.0
       apexcharts:
         specifier: ^5.10.3
         version: 5.10.3
@@ -1867,8 +1867,8 @@ packages:
   '@tsclass/tsclass@4.4.4':
     resolution: {integrity: sha512-YZOAF+u+r4u5rCev2uUd1KBTBdfyFdtDmcv4wuN+864lMccbdfRICR3SlJwCfYS1lbeV3QNLYGD30wjRXgvCJA==}
 
-  '@tsclass/tsclass@9.3.0':
+  '@tsclass/tsclass@9.5.0':
-    resolution: {integrity: sha512-KD3oTUN3RGu67tgjNHgWWZGsdYipr1RUDxQ9MMKSgIJ6oNZ4q5m2rg0ibrgyHWkAjTPlHVa6kHP3uVOY+8bnHw==}
+    resolution: {integrity: sha512-HwMVwkrBnEFMjwOsMkGwWN/q+XEczSpf4a/PBAXgkDdV6sXdxAMFXUH1tW8Y5ecuvXFYMvFry4X57MCCT7Dm8A==}
 
   '@tybys/wasm-util@0.10.1':
     resolution: {integrity: sha512-9tTaPJLSiejZKx+Bmog4uSubteqTvFrVrURwkmHixBo0G4seD0zUxp98E1DzUBJxLQ3NPwXrGKDiVjwx/DpPsg==}
@@ -3750,6 +3750,10 @@ packages:
     os: [darwin, linux, win32, freebsd, openbsd, netbsd, sunos, android]
     hasBin: true
 
+  tagged-tag@1.0.0:
+    resolution: {integrity: sha512-yEFYrVhod+hdNyx7g5Bnkkb0G6si8HJurOoOEgC8B/O0uXLHlaey/65KRv6cuWBNhBgHKAROVpc7QyYqE5gFng==}
+    engines: {node: '>=20'}
+
   tar-fs@3.1.2:
     resolution: {integrity: sha512-QGxxTxxyleAdyM3kpFs14ymbYmNFrfY+pHj7Z8FgtbZ7w2//VAgLMac7sT6nRpIHjppXO2AwwEOg0bPFVRcmXw==}
 
@@ -3833,6 +3837,10 @@ packages:
     resolution: {integrity: sha512-TeTSQ6H5YHvpqVwBRcnLDCBnDOHWYu7IvGbHT6N8AOymcr9PJGjc1GTtiWZTYg0NCgYwvnYWEkVChQAr9bjfwA==}
     engines: {node: '>=16'}
 
+  type-fest@5.4.4:
+    resolution: {integrity: sha512-JnTrzGu+zPV3aXIUhnyWJj4z/wigMsdYajGLIYakqyOW1nPllzXEJee0QQbHj+CTIQtXGlAjuK0UY+2xTyjVAw==}
+    engines: {node: '>=20'}
+
   typed-query-selector@2.12.1:
     resolution: {integrity: sha512-uzR+FzI8qrUEIu96oaeBJmd9E7CFEiQ3goA5qCVgc4s5llSubcfGHq9yUstZx/k4s9dXHVKsE35YWoFyvEqEHA==}
 
@@ -4072,7 +4080,7 @@ snapshots:
       '@push.rocks/taskbuffer': 3.5.0
       '@push.rocks/webrequest': 4.0.5
       '@push.rocks/webstore': 2.0.20
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       lit: 3.3.2
     transitivePeerDependencies:
       - '@nuxt/kit'
@@ -4578,7 +4586,7 @@ snapshots:
       '@tiptap/extension-typography': 2.27.2(@tiptap/core@2.27.2(@tiptap/pm@2.27.2))
       '@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
+      '@tsclass/tsclass': 9.5.0
       apexcharts: 5.10.3
       highlight.js: 11.11.1
       ibantools: 4.5.1
@@ -5571,7 +5579,7 @@ snapshots:
       '@push.rocks/smartstring': 4.1.0
       '@push.rocks/smartunique': 3.0.9
       '@push.rocks/taskbuffer': 3.5.0
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
     transitivePeerDependencies:
       - '@nuxt/kit'
       - aws-crt
@@ -5597,7 +5605,7 @@ snapshots:
       '@push.rocks/smartjson': 5.2.0
       '@push.rocks/smartpath': 6.0.0
       '@push.rocks/smartpromise': 4.2.3
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       mongodb: 6.21.0(socks@2.8.7)
     transitivePeerDependencies:
       - '@aws-sdk/credential-providers'
@@ -5618,7 +5626,7 @@ snapshots:
       '@push.rocks/smartpromise': 4.2.3
       '@push.rocks/smartrx': 3.0.10
       '@push.rocks/taskbuffer': 3.5.0
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
     transitivePeerDependencies:
       - '@nuxt/kit'
       - react
@@ -5690,7 +5698,7 @@ snapshots:
       '@push.rocks/smartstream': 3.4.0
       '@push.rocks/smartstring': 4.1.0
       '@push.rocks/smartunique': 3.0.9
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
     transitivePeerDependencies:
       - aws-crt
 
@@ -5742,7 +5750,7 @@ snapshots:
       '@push.rocks/smarttime': 4.2.3
       '@push.rocks/smartunique': 3.0.9
       '@push.rocks/taskbuffer': 3.5.0
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       mongodb: 6.21.0(socks@2.8.7)
     transitivePeerDependencies:
       - '@aws-sdk/credential-providers'
@@ -5770,7 +5778,7 @@ snapshots:
       '@push.rocks/smartenv': 6.0.0
       '@push.rocks/smartpromise': 4.2.3
       '@push.rocks/smartrust': 1.3.1
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       acme-client: 5.4.0
       minimatch: 10.2.4
     transitivePeerDependencies:
@@ -5809,7 +5817,7 @@ snapshots:
 
   '@push.rocks/smartfeed@1.4.0':
     dependencies:
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       fast-xml-parser: 4.5.4
 
   '@push.rocks/smartfile-interfaces@1.0.7': {}
@@ -5951,7 +5959,7 @@ snapshots:
       '@push.rocks/smartpromise': 4.2.3
       '@push.rocks/smarttime': 4.2.3
       '@push.rocks/webrequest': 4.0.5
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
 
   '@push.rocks/smartmanifest@2.0.2': {}
 
@@ -6109,7 +6117,7 @@ snapshots:
       '@push.rocks/smartpuppeteer': 2.0.5(typescript@5.9.3)
       '@push.rocks/smartserve': 2.0.1
       '@push.rocks/smartunique': 3.0.9
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
       pdf-lib: 1.17.1
       pdf2json: 4.0.2
     transitivePeerDependencies:
@@ -6191,7 +6199,7 @@ snapshots:
     dependencies:
       '@push.rocks/smartpath': 6.0.0
       '@push.rocks/smartrust': 1.3.1
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
 
   '@push.rocks/smartserve@2.0.1':
     dependencies:
@@ -6221,7 +6229,7 @@ snapshots:
       '@push.rocks/smartxml': 2.0.0
       '@push.rocks/smartyaml': 3.0.4
       '@push.rocks/webrequest': 4.0.5
-      '@tsclass/tsclass': 9.3.0
+      '@tsclass/tsclass': 9.5.0
 
   '@push.rocks/smartspawn@3.0.3':
     dependencies:
@@ -7009,9 +7017,9 @@ snapshots:
     dependencies:
       type-fest: 4.41.0
 
-  '@tsclass/tsclass@9.3.0':
+  '@tsclass/tsclass@9.5.0':
     dependencies:
-      type-fest: 4.41.0
+      type-fest: 5.4.4
 
   '@tybys/wasm-util@0.10.1':
     dependencies:
@@ -9264,6 +9272,8 @@ snapshots:
 
   systeminformation@5.31.3: {}
 
+  tagged-tag@1.0.0: {}
+
   tar-fs@3.1.2:
     dependencies:
       pump: 3.0.4
@@ -9373,6 +9383,10 @@ snapshots:
 
   type-fest@4.41.0: {}
 
+  type-fest@5.4.4:
+    dependencies:
+      tagged-tag: 1.0.0
+
   typed-query-selector@2.12.1: {}
 
   typescript@5.9.3: {}

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@design.estate/dees-catalog',
-  version: '3.48.3',
+  version: '3.49.0',
   description: 'A comprehensive library that provides dynamic web components for building sophisticated and modern web applications using JavaScript and TypeScript.'
 }

ts_web/elements/00group-dataview/dees-dataview-statusobject/dees-dataview-statusobject.demo.ts

@@ -50,6 +50,7 @@ export const demoFunc = () => html` <style>
           .statusObject=${{
             id: '1',
             name: 'API Gateway Service',
+            lastUpdated: Date.now(),
             combinedStatus: 'ok',
             combinedStatusText: 'All systems operational',
             details: [
@@ -89,6 +90,7 @@ export const demoFunc = () => html` <style>
           .statusObject=${{
             id: '2',
             name: 'PostgreSQL Cluster',
+            lastUpdated: Date.now() - 3600000,
             combinedStatus: 'partly_ok',
             combinedStatusText: 'Minor issues detected',
             details: [
@@ -128,6 +130,7 @@ export const demoFunc = () => html` <style>
           .statusObject=${{
             id: '3',
             name: 'CI/CD Pipeline',
+            lastUpdated: Date.now() - 86400000,
             combinedStatus: 'not_ok',
             combinedStatusText: 'Build failure',
             details: [

ts_web/elements/00group-dataview/dees-dataview-statusobject/dees-dataview-statusobject.ts

@@ -128,7 +128,7 @@ export class DeesDataviewStatusobject extends DeesElement {
         grid-template-columns: 48px auto;
         border-top: 1px solid ${cssManager.bdTheme('hsl(0 0% 94%)', 'hsl(0 0% 14.9%)')};
         transition: background-color 0.15s ease;
-        padding-right: 16px;
+        padding: 0 16px;
         cursor: context-menu;
       }
 
@@ -148,7 +148,7 @@ export class DeesDataviewStatusobject extends DeesElement {
       .detail .detailsText .label {
         font-size: 12px;
         font-weight: 500;
-        color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')}
+        color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
         margin-bottom: 2px;
         letter-spacing: -0.01em;
       }
@@ -159,6 +159,28 @@ export class DeesDataviewStatusobject extends DeesElement {
         color: ${cssManager.bdTheme('hsl(0 0% 15%)', 'hsl(0 0% 90%)')};
         line-height: 1.5;
       }
+
+      .bottomBar {
+        position: relative;
+        color: ${cssManager.bdTheme('hsl(0 0% 45.1%)', 'hsl(0 0% 63.9%)')};
+        background: ${cssManager.bdTheme('hsl(0 0% 97%)', 'hsl(0 0% 7%)')};
+        border-top: 1px solid ${cssManager.bdTheme('hsl(0 0% 89.8%)', 'hsl(0 0% 14.9%)')};
+        height: 28px;
+        font-size: 12px;
+        line-height: 28px;
+        display: flex;
+        justify-content: flex-end;
+        align-items: stretch;
+        overflow: hidden;
+        flex-shrink: 0;
+      }
+
+      .bottomBar .statusLabel {
+        padding: 0 16px;
+        display: flex;
+        align-items: center;
+        font-weight: 500;
+      }
     `,
   ];
 
@@ -209,6 +231,11 @@ export class DeesDataviewStatusobject extends DeesElement {
             </div>
           `;
         })}
+        <div class="bottomBar">
+          <div class="statusLabel">${this.statusObject?.lastUpdated
+            ? `Last updated: ${new Date(this.statusObject.lastUpdated).toLocaleString()}`
+            : ''}</div>
+        </div>
       </div>
     `;
   }

ts_web/elements/00group-dataview/dees-storage-browser/dees-storage-browser.demo.ts

@@ -1,16 +1,16 @@
 import { html } from '@design.estate/dees-element';
-import type { IS3DataProvider, IS3Object } from './interfaces.js';
+import type { IStorageDataProvider, IStorageObject } from './interfaces.js';
 import './dees-storage-browser.js';
 
-// Mock in-memory S3 data provider for demo purposes
+// Mock in-memory storage data provider for demo purposes
-class MockS3DataProvider implements IS3DataProvider {
+class MockStorageDataProvider implements IStorageDataProvider {
   private objects: Map<string, { content: string; contentType: string; size: number; lastModified: string }> = new Map();
 
   constructor() {
     const now = new Date().toISOString();
     // Seed with sample data
     this.objects.set('documents/readme.md', {
-      content: btoa('# Welcome\n\nThis is a demo S3 browser.\n'),
+      content: btoa('# Welcome\n\nThis is a demo Storage browser.\n'),
       contentType: 'text/markdown',
       size: 42,
       lastModified: now,
@@ -59,9 +59,9 @@ class MockS3DataProvider implements IS3DataProvider {
     });
   }
 
-  async listObjects(bucket: string, prefix?: string, delimiter?: string): Promise<{ objects: IS3Object[]; prefixes: string[] }> {
+  async listObjects(bucket: string, prefix?: string, delimiter?: string): Promise<{ objects: IStorageObject[]; prefixes: string[] }> {
     const pfx = prefix || '';
-    const objects: IS3Object[] = [];
+    const objects: IStorageObject[] = [];
     const prefixes = new Set<string>();
 
     for (const [key, data] of this.objects) {
@@ -149,7 +149,7 @@ export const demoFunc = () => html`
   </style>
   <div class="demo-container">
     <dees-storage-browser
-      .dataProvider=${new MockS3DataProvider()}
+      .dataProvider=${new MockStorageDataProvider()}
       .bucketName=${'demo-bucket'}
     ></dees-storage-browser>
   </div>

ts_web/elements/00group-dataview/dees-storage-browser/dees-storage-browser.ts

@@ -1,7 +1,7 @@
 import { customElement, html, css, cssManager, property, state, DeesElement } from '@design.estate/dees-element';
 import { themeDefaultStyles } from '../../00theme.js';
 import { demoFunc } from './dees-storage-browser.demo.js';
-import type { IS3DataProvider, IS3ChangeEvent } from './interfaces.js';
+import type { IStorageDataProvider, IStorageChangeEvent } from './interfaces.js';
 import './dees-storage-columns.js';
 import './dees-storage-keys.js';
 import './dees-storage-preview.js';
@@ -20,7 +20,7 @@ export class DeesStorageBrowser extends DeesElement {
   public static demoGroups = ['Data View'];
 
   @property({ type: Object })
-  public accessor dataProvider: IS3DataProvider | null = null;
+  public accessor dataProvider: IStorageDataProvider | null = null;
 
   @property({ type: String })
   public accessor bucketName: string = '';
@@ -30,7 +30,7 @@ export class DeesStorageBrowser extends DeesElement {
    * Pass a function that takes a callback and returns an unsubscribe function.
    */
   @property({ type: Object })
-  public accessor onChangeEvent: ((callback: (event: IS3ChangeEvent) => void) => (() => void)) | null = null;
+  public accessor onChangeEvent: ((callback: (event: IStorageChangeEvent) => void) => (() => void)) | null = null;
 
   @state()
   private accessor viewType: TViewType = 'columns';
@@ -288,7 +288,7 @@ export class DeesStorageBrowser extends DeesElement {
     }
 
     try {
-      this.changeUnsubscribe = this.onChangeEvent((event: IS3ChangeEvent) => {
+      this.changeUnsubscribe = this.onChangeEvent((event: IStorageChangeEvent) => {
         this.handleChange(event);
       });
       this.isStreamConnected = true;
@@ -306,7 +306,7 @@ export class DeesStorageBrowser extends DeesElement {
     this.isStreamConnected = false;
   }
 
-  private handleChange(event: IS3ChangeEvent) {
+  private handleChange(event: IStorageChangeEvent) {
     this.recentChangeCount++;
     this.refreshKey++;
   }

ts_web/elements/00group-dataview/dees-storage-browser/dees-storage-columns.ts

@@ -1,7 +1,7 @@
 import { customElement, html, css, cssManager, property, state, DeesElement } from '@design.estate/dees-element';
 import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { themeDefaultStyles } from '../../00theme.js';
-import type { IS3DataProvider, IS3Object, IColumn } from './interfaces.js';
+import type { IStorageDataProvider, IStorageObject, IColumn } from './interfaces.js';
 import { getFileName, validateMove, getParentPrefix, getContentType, getDefaultContent, getPathSegments } from './utilities.js';
 
 // FileSystem API types for drag-and-drop folder support
@@ -32,7 +32,7 @@ declare global {
 @customElement('dees-storage-columns')
 export class DeesStorageColumns extends DeesElement {
   @property({ type: Object })
-  public accessor dataProvider: IS3DataProvider | null = null;
+  public accessor dataProvider: IStorageDataProvider | null = null;
 
   @property({ type: String })
   public accessor bucketName: string = '';

ts_web/elements/00group-dataview/dees-storage-browser/dees-storage-keys.ts

@@ -1,7 +1,7 @@
 import { customElement, html, css, cssManager, property, state, DeesElement } from '@design.estate/dees-element';
 import { DeesContextmenu } from '../../00group-overlay/dees-contextmenu/dees-contextmenu.js';
 import { themeDefaultStyles } from '../../00theme.js';
-import type { IS3DataProvider, IS3Object } from './interfaces.js';
+import type { IStorageDataProvider, IStorageObject } from './interfaces.js';
 import { formatSize, getFileName, validateMove, getParentPrefix, getContentType, getDefaultContent, getPathSegments } from './utilities.js';
 
 declare global {
@@ -13,7 +13,7 @@ declare global {
 @customElement('dees-storage-keys')
 export class DeesStorageKeys extends DeesElement {
   @property({ type: Object })
-  public accessor dataProvider: IS3DataProvider | null = null;
+  public accessor dataProvider: IStorageDataProvider | null = null;
 
   @property({ type: String })
   public accessor bucketName: string = '';
@@ -25,7 +25,7 @@ export class DeesStorageKeys extends DeesElement {
   public accessor refreshKey: number = 0;
 
   @state()
-  private accessor allKeys: IS3Object[] = [];
+  private accessor allKeys: IStorageObject[] = [];
 
   @state()
   private accessor prefixes: string[] = [];

ts_web/elements/00group-dataview/dees-storage-browser/dees-storage-preview.ts

@@ -1,6 +1,6 @@
 import { customElement, html, css, cssManager, property, state, DeesElement } from '@design.estate/dees-element';
 import { themeDefaultStyles } from '../../00theme.js';
-import type { IS3DataProvider } from './interfaces.js';
+import type { IStorageDataProvider } from './interfaces.js';
 import { formatSize, getFileName } from './utilities.js';
 
 declare global {
@@ -12,7 +12,7 @@ declare global {
 @customElement('dees-storage-preview')
 export class DeesStoragePreview extends DeesElement {
   @property({ type: Object })
-  public accessor dataProvider: IS3DataProvider | null = null;
+  public accessor dataProvider: IStorageDataProvider | null = null;
 
   @property({ type: String })
   public accessor bucketName: string = '';

ts_web/elements/00group-dataview/dees-storage-browser/interfaces.ts

@@ -1,15 +1,15 @@
 /**
- * S3 Data Provider interface - implement this to connect the S3 browser to your backend
+ * Storage Data Provider interface - implement this to connect the storage browser to your backend
  */
 
-export interface IS3Object {
+export interface IStorageObject {
   key: string;
   size?: number;
   lastModified?: string;
   isPrefix?: boolean;
 }
 
-export interface IS3ChangeEvent {
+export interface IStorageChangeEvent {
   type: 'add' | 'modify' | 'delete';
   key: string;
   bucket: string;
@@ -17,8 +17,8 @@ export interface IS3ChangeEvent {
   lastModified?: Date;
 }
 
-export interface IS3DataProvider {
+export interface IStorageDataProvider {
-  listObjects(bucket: string, prefix?: string, delimiter?: string): Promise<{ objects: IS3Object[]; prefixes: string[] }>;
+  listObjects(bucket: string, prefix?: string, delimiter?: string): Promise<{ objects: IStorageObject[]; prefixes: string[] }>;
   getObject(bucket: string, key: string): Promise<{ content: string; contentType: string; size: number; lastModified: string }>;
   putObject(bucket: string, key: string, base64Content: string, contentType: string): Promise<boolean>;
   deleteObject(bucket: string, key: string): Promise<boolean>;
@@ -30,7 +30,7 @@ export interface IS3DataProvider {
 
 export interface IColumn {
   prefix: string;
-  objects: IS3Object[];
+  objects: IStorageObject[];
   prefixes: string[];
   selectedItem: string | null;
   width: number;

ts_web/elements/00group-dataview/dees-storage-browser/utilities.ts

@@ -1,5 +1,5 @@
 /**
- * Shared utilities for S3 browser components
+ * Shared utilities for Storage browser components
  */
 
 export interface IMoveValidation {