@design.estate/dees-catalog 1.0.185 → 1.0.187

package/dist_ts_web/00_commitinfo_data.js

@@ -3,7 +3,7 @@
  */
 export const commitinfo = {
     name: '@design.estate/dees-catalog',
-    version: '1.0.184',
+    version: '1.0.187',
     description: 'website for lossless.com'
 };
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiMDBfY29tbWl0aW5mb19kYXRhLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vdHNfd2ViLzAwX2NvbW1pdGluZm9fZGF0YS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7R0FFRztBQUNILE1BQU0sQ0FBQyxNQUFNLFVBQVUsR0FBRztJQUN4QixJQUFJLEVBQUUsNkJBQTZCO0lBQ25DLE9BQU8sRUFBRSxTQUFTO0lBQ2xCLFdBQVcsRUFBRSwwQkFBMEI7Q0FDeEMsQ0FBQSJ9

package/dist_ts_web/elements/dees-dataview-codebox.demo.d.ts

@@ -0,0 +1 @@
+export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

package/dist_ts_web/elements/dees-dataview-codebox.demo.js

@@ -0,0 +1,18 @@
+import { html } from '@design.estate/dees-element';
+export const demoFunc = () => html ` <style>
+.demoWrapper {
+  box-sizing: border-box;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  padding: 20px;
+  background: none;
+}
+</style>
+<div class="demoWrapper">
+<dees-dataview-codebox proglang="typescript">
+  import * as text from './hello'; const hiThere = 'nice'; const myFunction = async () => {
+  console.log('nice one'); }
+</dees-dataview-codebox>
+</div>`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1jb2RlYm94LmRlbW8uanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1kYXRhdmlldy1jb2RlYm94LmRlbW8udHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLDZCQUE2QixDQUFDO0FBRW5ELE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7Ozs7Ozs7Ozs7Ozs7OztPQWUzQixDQUFBIn0=

package/dist_ts_web/elements/dees-dataview-codebox.js

@@ -7,15 +7,13 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
+import { demoFunc } from './dees-dataview-codebox.demo.js';
 import { DeesElement, html, customElement, property, state, } from '@design.estate/dees-element';
 import hlight from 'highlight.js';
 import * as smartstring from '@push.rocks/smartstring';
 import * as domtools from '@design.estate/dees-domtools';
 export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
-    static { this.demo = () => html `<dees-dataview-codebox proglang="typescript">
-    import * as text from './hello'; const hiThere = 'nice'; const myFunction = async () => {
-    console.log('nice one'); }
-  </dees-dataview-codebox>`; }
+    static { this.demo = demoFunc; }
     constructor() {
         super();
         this.progLang = 'typescript';
@@ -35,19 +33,48 @@ export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
         .mainbox {
           position: relative;
           color: ${this.goBright ? '#333333' : '#ffffff'};
+          border-top: 1px solid ${this.goBright ? '#ffffff' : '#333333'};
+          box-shadow: 0px 0px 5px ${this.goBright ? 'rgba(0,0,0,0.1)' : 'rgba(0,0,0,0.5)'};
+          background: ${this.goBright ? '#ffffff' : '#191919'};
+          border-radius: 16px;
+          overflow: hidden;
+        }
+
+        .appbar {
+          height: 24px;
+          background: #161616;
+          border-bottom: 1px solid #222222;
+          font-size: 12px;
+          color: #CCC;
+          font-family: 'Hubot Sans', 'monospace';
+          line-height: 24px;
+        }
+
+        .appbar .fileName {
+          text-align: center;
+        }
+
+        .bottomBar {
+          height: 24px;
+          background: #161616;
+          border-top: 1px solid #222222;
+          font-size: 12px;
+          color: #CCC;
+          font-family: 'Hubot Sans', 'monospace';
+          line-height: 24px;
         }
 
         .languageLabel {
           color: #fff;
           font-size: 12px;
+          line-height: 24px;
           z-index: 10;
-          background: #6596ff;
+          background: #6596ff20;
           display: inline-block;
           position: absolute;
-          right: 32px;
-          padding: 4px;
-          border-bottom-left-radius: 3px;
-          border-bottom-right-radius: 3px;
+          bottom: 0px;
+          right: 0px;
+          padding: 0px 16px 0px 8px;
         }
 
         .hljs-keyword {
@@ -57,18 +84,15 @@ export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
         .codegrid {
           display: grid;
           grid-template-columns: 50px auto;
-          background: ${this.goBright ? '#ffffff' : '#191919'};
-          border-top: 1px solid ${this.goBright ? '#ffffff' : '#333333'};
-          box-shadow: 0px 0px 5px ${this.goBright ? 'rgba(0,0,0,0.1)' : 'rgba(0,0,0,0.5)'};
-          border-radius: 3px;
           overflow: hidden;
         }
 
         .lineNumbers {
-          background: ${this.goBright ? '#fafafa' : '#151515'};
+          
           color: ${this.goBright ? '#acacac' : '#666666'};
           padding: 30px 16px 0px 0px;
           text-align: right;
+          border-right: 1px solid ${this.goBright ? '#eaeaea' : '#222222'};
         }
 
         .lineCounter:last-child {
@@ -116,12 +140,14 @@ export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
         }
       </style>
       <div class="mainbox">
-        <div class="languageLabel">${this.progLang}</div>
+        <div class="appbar">
+          <div class="fileName">index.ts</div>
+        </div>
         <div class="codegrid">
           <div class="lineNumbers">
             ${(() => {
             let lineCounter = 0;
-            return this.codeToDisplay.split('\n').map(lineArg => {
+            return this.codeToDisplay.split('\n').map((lineArg) => {
                 lineCounter++;
                 return html `<div class="lineCounter">${lineCounter}</div>`;
             });
@@ -129,6 +155,10 @@ export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
           </div>
           <pre><code></code></pre>
         </div>
+        <div class="bottomBar">
+          Spaces: 2
+          <div class="languageLabel">${this.progLang}</div>
+        </div>
       </div>
     `;
     }
@@ -146,12 +176,17 @@ export let DeesDataviewCodebox = class DeesDataviewCodebox extends DeesElement {
             this.codeToDisplayStore = smartstring.indent.normalize(this.codeToDisplay).trimStart();
         }
         if (slottedCodeNodes[0] && slottedCodeNodes[0].wholeText && !this.codeToDisplay) {
-            this.codeToDisplayStore = smartstring.indent.normalize(slottedCodeNodes[0].wholeText).trimStart();
+            this.codeToDisplayStore = smartstring.indent
+                .normalize(slottedCodeNodes[0].wholeText)
+                .trimStart();
             this.codeToDisplay = this.codeToDisplayStore;
         }
         await domtools.plugins.smartdelay.delayFor(0);
         const localCodeNode = this.shadowRoot.querySelector('code');
-        const html = hlight.highlight(this.codeToDisplayStore, { language: this.progLang, ignoreIllegals: true });
+        const html = hlight.highlight(this.codeToDisplayStore, {
+            language: this.progLang,
+            ignoreIllegals: true,
+        });
         localCodeNode.innerHTML = html.value;
     }
 };
@@ -174,4 +209,4 @@ DeesDataviewCodebox = __decorate([
     customElement('dees-dataview-codebox'),
     __metadata("design:paramtypes", [])
 ], DeesDataviewCodebox);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1jb2RlYm94LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtZGF0YXZpZXctY29kZWJveC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFPLEVBQ0wsV0FBVyxFQUNYLElBQUksRUFDSixhQUFhLEVBRWIsUUFBUSxFQUNSLEtBQUssR0FDTixNQUFNLDZCQUE2QixDQUFDO0FBRXJDLE9BQU8sTUFBTSxNQUFNLGNBQWMsQ0FBQztBQUVsQyxPQUFPLEtBQUssV0FBVyxNQUFNLHlCQUF5QixDQUFDO0FBRXZELE9BQU8sS0FBSyxRQUFRLE1BQU0sOEJBQThCLENBQUM7QUFTbEQsV0FBTSxtQkFBbUIsR0FBekIsTUFBTSxtQkFBb0IsU0FBUSxXQUFXO2FBQ3BDLFNBQUksR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7OzsyQkFHTixBQUhQLENBR1E7SUFXMUI7UUFDRSxLQUFLLEVBQUUsQ0FBQztRQVRILGFBQVEsR0FBVyxZQUFZLENBQUM7UUFNaEMsa0JBQWEsR0FBVyxFQUFFLENBQUM7UUFzSDFCLHVCQUFrQixHQUFHLEVBQUUsQ0FBQztJQWxIaEMsQ0FBQztJQUVELE1BQU07UUFDSixPQUFPLElBQUksQ0FBQTtRQUNQLFFBQVEsQ0FBQyxZQUFZLENBQUMsTUFBTTs7Ozs7Ozs7OzttQkFVakIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozt3QkF1QmhDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMsU0FBUztrQ0FDM0IsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTO29DQUNuQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxpQkFBaUIsQ0FBQyxDQUFD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
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1jb2RlYm94LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vdHNfd2ViL2VsZW1lbnRzL2RlZXMtZGF0YXZpZXctY29kZWJveC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7QUFBQSxPQUFRLEVBQUUsUUFBUSxFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDNUQsT0FBTyxFQUNMLFdBQVcsRUFDWCxJQUFJLEVBQ0osYUFBYSxFQUViLFFBQVEsRUFDUixLQUFLLEdBQ04sTUFBTSw2QkFBNkIsQ0FBQztBQUVyQyxPQUFPLE1BQU0sTUFBTSxjQUFjLENBQUM7QUFFbEMsT0FBTyxLQUFLLFdBQVcsTUFBTSx5QkFBeUIsQ0FBQztBQUV2RCxPQUFPLEtBQUssUUFBUSxNQUFNLDhCQUE4QixDQUFDO0FBU2xELFdBQU0sbUJBQW1CLEdBQXpCLE1BQU0sbUJBQW9CLFNBQVEsV0FBVzthQUNwQyxTQUFJLEdBQUcsUUFBUSxBQUFYLENBQVk7SUFXOUI7UUFDRSxLQUFLLEVBQUUsQ0FBQztRQVRILGFBQVEsR0FBVyxZQUFZLENBQUM7UUFNaEMsa0JBQWEsR0FBVyxFQUFFLENBQUM7UUFzSjFCLHVCQUFrQixHQUFHLEVBQUUsQ0FBQztJQWxKaEMsQ0FBQztJQUVELE1BQU07UUFDSixPQUFPLElBQUksQ0FBQTtRQUNQLFFBQVEsQ0FBQyxZQUFZLENBQUMsTUFBTTs7Ozs7Ozs7OzttQkFVakIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxTQUFTO2tDQUN0QixJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLFNBQVM7b0NBQ25DLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxpQkFBaUI7d0JBQ2pFLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxDQUFDLENBQUMs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

package/dist_ts_web/elements/dees-dataview-statusobject.demo.d.ts

@@ -0,0 +1 @@
+export declare const demoFunc: () => import("@design.estate/dees-element").TemplateResult<1>;

package/dist_ts_web/elements/dees-dataview-statusobject.demo.js

@@ -0,0 +1,38 @@
+import { html } from '@design.estate/dees-element';
+import * as tsclass from '@tsclass/tsclass';
+export const demoFunc = () => html `<dees-dataview-statusobject
+  .statusObject=${{
+    id: '1',
+    name: 'Demo Item',
+    combinedStatus: 'partly_ok',
+    combinedStatusText: 'partly_ok',
+    details: [
+        {
+            name: 'Detail 1',
+            value: 'Value 1',
+            status: 'ok',
+            statusText: 'OK',
+        },
+        {
+            name: 'Detail 2',
+            value: 'Value 2',
+            status: 'partly_ok',
+            statusText: 'partly_ok',
+        },
+        {
+            name: 'Detail 3',
+            value: 'Value 3',
+            status: 'not_ok',
+            statusText: 'not_ok',
+        },
+        {
+            name: 'Detail 4',
+            value: 'Value 4 jhdkfjhalskdfjhfdjskalsdkfjhfdjskalskdjfhjdkslaksjdhfjdkslaskdfjhfjdkslaskdjfhjdskalskdjhfdjskalskdjfhdjskl',
+            status: 'ok',
+            statusText: 'OK',
+        },
+    ],
+}}
+>
+</dees-dataview-statusobject>`;
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QuZGVtby5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9lbGVtZW50cy9kZWVzLWRhdGF2aWV3LXN0YXR1c29iamVjdC5kZW1vLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUNuRCxPQUFPLEtBQUssT0FBTyxNQUFNLGtCQUFrQixDQUFDO0FBRTVDLE1BQU0sQ0FBQyxNQUFNLFFBQVEsR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7a0JBQ2hCO0lBQ2QsRUFBRSxFQUFFLEdBQUc7SUFDUCxJQUFJLEVBQUUsV0FBVztJQUNqQixjQUFjLEVBQUUsV0FBVztJQUMzQixrQkFBa0IsRUFBRSxXQUFXO0lBQy9CLE9BQU8sRUFBRTtRQUNQO1lBQ0UsSUFBSSxFQUFFLFVBQVU7WUFDaEIsS0FBSyxFQUFFLFNBQVM7WUFDaEIsTUFBTSxFQUFFLElBQUk7WUFDWixVQUFVLEVBQUUsSUFBSTtTQUNqQjtRQUNEO1lBQ0UsSUFBSSxFQUFFLFVBQVU7WUFDaEIsS0FBSyxFQUFFLFNBQVM7WUFDaEIsTUFBTSxFQUFFLFdBQVc7WUFDbkIsVUFBVSxFQUFFLFdBQVc7U0FDeEI7UUFDRDtZQUNFLElBQUksRUFBRSxVQUFVO1lBQ2hCLEtBQUssRUFBRSxTQUFTO1lBQ2hCLE1BQU0sRUFBRSxRQUFRO1lBQ2hCLFVBQVUsRUFBRSxRQUFRO1NBQ3JCO1FBQ0Q7WUFDRSxJQUFJLEVBQUUsVUFBVTtZQUNoQixLQUFLLEVBQ0gscUhBQXFIO1lBQ3ZILE1BQU0sRUFBRSxJQUFJO1lBQ1osVUFBVSxFQUFFLElBQUk7U0FDakI7S0FDRjtDQUM0Qjs7OEJBRUgsQ0FBQyJ9

package/dist_ts_web/elements/dees-dataview-statusobject.js

@@ -7,44 +7,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
+import { demoFunc } from './dees-dataview-statusobject.demo.js';
 import { DeesElement, html, customElement, property, state, cssManager, css, } from '@design.estate/dees-element';
 import * as tsclass from '@tsclass/tsclass';
 export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends DeesElement {
-    static { this.demo = () => html `<dees-dataview-statusobject
-    .statusObject=${{
-        id: '1',
-        name: 'Demo Item',
-        combinedStatus: 'partly_ok',
-        combinedStatusText: 'partly_ok',
-        details: [
-            {
-                name: 'Detail 1',
-                value: 'Value 1',
-                status: 'ok',
-                statusText: 'OK',
-            },
-            {
-                name: 'Detail 2',
-                value: 'Value 2',
-                status: 'partly_ok',
-                statusText: 'partly_ok',
-            },
-            {
-                name: 'Detail 3',
-                value: 'Value 3',
-                status: 'not_ok',
-                statusText: 'not_ok',
-            },
-            {
-                name: 'Detail 4',
-                value: 'Value 4 jhdkfjhalskdfjhfdjskalsdkfjhfdjskalskdjfhjdkslaksjdhfjdkslaskdfjhfjdkslaskdjfhjdskalskdjhfdjskalskdjfhdjskl',
-                status: 'ok',
-                statusText: 'OK',
-            },
-        ],
-    }}
-  >
-  </dees-dataview-statusobject>`; }
+    static { this.demo = demoFunc; }
     static { this.styles = [
         cssManager.defaultStyles,
         css `
@@ -82,7 +49,7 @@ export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends Dee
 
       .copyMain {
         cursor: pointer;
-        font-size: 8px;
+        font-size: 10px;
         font-weight: 600;
         text-transform: uppercase;
         border: 1px solid ${cssManager.bdTheme('#999', '#444')};
@@ -90,6 +57,7 @@ export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends Dee
         padding: 4px;
         border-radius: 3px;
         margin-right: 16px;
+        color: #ffffff80
       }
 
       .statusdot.ok {
@@ -109,7 +77,7 @@ export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends Dee
         align-items: center;
         display: grid;
         grid-template-columns: 40px auto;
-        border-top: 1px dotted ${cssManager.bdTheme('#999', '#444')};
+        border-top: 1px dotted ${cssManager.bdTheme('#999', '#282828')};
       }
 
       .detail .detailsText {
@@ -121,10 +89,11 @@ export let DeesDataviewStatusobject = class DeesDataviewStatusobject extends Dee
 
       .detail .detailsText .label {
         font-size: 12px;
+        color: #ffffff80
       }
 
       .detail .detailsText .value {
-        font-size: 16px;
+        font-size: 14px;
         font-family: 'Intel One Mono';
       }
     `,
@@ -160,4 +129,4 @@ __decorate([
 DeesDataviewStatusobject = __decorate([
     customElement('dees-dataview-statusobject')
 ], DeesDataviewStatusobject);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUNMLFdBQVcsRUFDWCxJQUFJLEVBQ0osYUFBYSxFQUViLFFBQVEsRUFDUixLQUFLLEVBQ0wsVUFBVSxFQUNWLEdBQUcsR0FFSixNQUFNLDZCQUE2QixDQUFDO0FBRXJDLE9BQU8sS0FBSyxPQUFPLE1BQU0sa0JBQWtCLENBQUM7QUFTckMsV0FBTSx3QkFBd0IsR0FBOUIsTUFBTSx3QkFBeUIsU0FBUSxXQUFXO2FBQ3pDLFNBQUksR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLENBQUE7b0JBQ2I7UUFDZCxFQUFFLEVBQUUsR0FBRztRQUNQLElBQUksRUFBRSxXQUFXO1FBQ2pCLGNBQWMsRUFBRSxXQUFXO1FBQzNCLGtCQUFrQixFQUFFLFdBQVc7UUFDL0IsT0FBTyxFQUFFO1lBQ1A7Z0JBQ0UsSUFBSSxFQUFFLFVBQVU7Z0JBQ2hCLEtBQUssRUFBRSxTQUFTO2dCQUNoQixNQUFNLEVBQUUsSUFBSTtnQkFDWixVQUFVLEVBQUUsSUFBSTthQUNqQjtZQUNEO2dCQUNFLElBQUksRUFBRSxVQUFVO2dCQUNoQixLQUFLLEVBQUUsU0FBUztnQkFDaEIsTUFBTSxFQUFFLFdBQVc7Z0JBQ25CLFVBQVUsRUFBRSxXQUFXO2FBQ3hCO1lBQ0Q7Z0JBQ0UsSUFBSSxFQUFFLFVBQVU7Z0JBQ2hCLEtBQUssRUFBRSxTQUFTO2dCQUNoQixNQUFNLEVBQUUsUUFBUTtnQkFDaEIsVUFBVSxFQUFFLFFBQVE7YUFDckI7WUFDRDtnQkFDRSxJQUFJLEVBQUUsVUFBVTtnQkFDaEIsS0FBSyxFQUFFLHFIQUFxSDtnQkFDNUgsTUFBTSxFQUFFLElBQUk7Z0JBQ1osVUFBVSxFQUFFLElBQUk7YUFDakI7U0FDRjtLQUNGOztnQ0FFMkIsQUFsQ1osQ0FrQ2E7YUFJakIsV0FBTSxHQUFHO1FBQ3JCLFVBQVUsQ0FBQyxhQUFhO1FBQ3hCLEdBQUcsQ0FBQTs7O3NCQUdlLFVBQVUsQ0FBQyxPQUFPLENBQUMsTUFBTSxFQUFFLFNBQVMsQ0FBQzs7O2lCQUcxQyxVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzRCQWdDdkIsVUFBVSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7aUNBd0I3QixVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7OztLQWtCOUQ7S0FDRixBQW5GbUIsQ0FtRmxCO0lBRUYsTUFBTTtRQUNKLE9BQU8sSUFBSSxDQUFBOzs7a0NBR21CLElBQUksQ0FBQyxZQUFZLEVBQUUsY0FBYztnQkFDbkQsSUFBSSxDQUFDLFlBQVksRUFBRSxJQUFJLElBQUksMkJBQTJCOzs7VUFHNUQsSUFBSSxDQUFDLFlBQVksRUFBRSxPQUFPLEVBQUUsR0FBRyxDQUFDLENBQUMsU0FBUyxFQUFFLEVBQUU7WUFDOUMsT0FBTyxJQUFJLENBQUE7O3NDQUVpQixTQUFTLENBQUMsTUFBTTs7cUNBRWpCLFNBQVMsQ0FBQyxJQUFJO3FDQUNkLFNBQVMsQ0FBQyxLQUFLOzs7V0FHekMsQ0FBQztRQUNKLENBQUMsQ0FBQzs7S0FFTCxDQUFDO0lBQ0osQ0FBQztJQUVELEtBQUssQ0FBQyxZQUFZLEtBQUksQ0FBQzs7QUE5R0s7SUFBM0IsUUFBUSxDQUFDLEVBQUUsSUFBSSxFQUFFLE1BQU0sRUFBRSxDQUFDOzs4REFBMEM7QUFyQzFELHdCQUF3QjtJQURwQyxhQUFhLENBQUMsNEJBQTRCLENBQUM7R0FDL0Isd0JBQXdCLENBb0pwQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi90c193ZWIvZWxlbWVudHMvZGVlcy1kYXRhdmlldy1zdGF0dXNvYmplY3QudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQ2hFLE9BQU8sRUFDTCxXQUFXLEVBQ1gsSUFBSSxFQUNKLGFBQWEsRUFFYixRQUFRLEVBQ1IsS0FBSyxFQUNMLFVBQVUsRUFDVixHQUFHLEdBRUosTUFBTSw2QkFBNkIsQ0FBQztBQUVyQyxPQUFPLEtBQUssT0FBTyxNQUFNLGtCQUFrQixDQUFDO0FBU3JDLFdBQU0sd0JBQXdCLEdBQTlCLE1BQU0sd0JBQXlCLFNBQVEsV0FBVzthQUN6QyxTQUFJLEdBQUcsUUFBUSxBQUFYLENBQVk7YUFJaEIsV0FBTSxHQUFHO1FBQ3JCLFVBQVUsQ0FBQyxhQUFhO1FBQ3hCLEdBQUcsQ0FBQTs7O3NCQUdlLFVBQVUsQ0FBQyxPQUFPLENBQUMsTUFBTSxFQUFFLFNBQVMsQ0FBQzs7O2lCQUcxQyxVQUFVLENBQUMsT0FBTyxDQUFDLE1BQU0sRUFBRSxNQUFNLENBQUM7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7OzRCQWdDdkIsVUFBVSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsTUFBTSxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7Ozs7O2lDQXlCN0IsVUFBVSxDQUFDLE9BQU8sQ0FBQyxNQUFNLEVBQUUsU0FBUyxDQUFDOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0tBbUJqRTtLQUNGLEFBckZtQixDQXFGbEI7SUFFRixNQUFNO1FBQ0osT0FBTyxJQUFJLENBQUE7OztrQ0FHbUIsSUFBSSxDQUFDLFlBQVksRUFBRSxjQUFjO2dCQUNuRCxJQUFJLENBQUMsWUFBWSxFQUFFLElBQUksSUFBSSwyQkFBMkI7OztVQUc1RCxJQUFJLENBQUMsWUFBWSxFQUFFLE9BQU8sRUFBRSxHQUFHLENBQUMsQ0FBQyxTQUFTLEVBQUUsRUFBRTtZQUM5QyxPQUFPLElBQUksQ0FBQTs7c0NBRWlCLFNBQVMsQ0FBQyxNQUFNOztxQ0FFakIsU0FBUyxDQUFDLElBQUk7cUNBQ2QsU0FBUyxDQUFDLEtBQUs7OztXQUd6QyxDQUFDO1FBQ0osQ0FBQyxDQUFDOztLQUVMLENBQUM7SUFDSixDQUFDO0lBRUQsS0FBSyxDQUFDLFlBQVksS0FBSSxDQUFDOztBQWhISztJQUEzQixRQUFRLENBQUMsRUFBRSxJQUFJLEVBQUUsTUFBTSxFQUFFLENBQUM7OzhEQUEwQztBQUgxRCx3QkFBd0I7SUFEcEMsYUFBYSxDQUFDLDRCQUE0QixDQUFDO0dBQy9CLHdCQUF3QixDQW9IcEMifQ==

package/dist_ts_web/elements/dees-pdf.d.ts

@@ -1,5 +1,4 @@
 import { DeesElement, type TemplateResult } from '@design.estate/dees-element';
-import type pdfjsTypes from 'pdfjs-dist';
 declare global {
     interface HTMLElementTagNameMap {
         'dees-pdf': DeesPdf;
@@ -11,7 +10,7 @@ export declare class DeesPdf extends DeesElement {
     constructor();
     render(): TemplateResult;
     static pdfJsReady: Promise<any>;
-    static pdfjsLib: typeof pdfjsTypes;
+    static pdfjsLib: any;
     connectedCallback(): Promise<void>;
     displayContent(): Promise<void>;
 }

package/dist_ts_web/elements/dees-simple-appdash.d.ts

@@ -0,0 +1 @@
+export {};

package/dist_ts_web/elements/dees-simple-appdash.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGVlcy1zaW1wbGUtYXBwZGFzaC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uL3RzX3dlYi9lbGVtZW50cy9kZWVzLXNpbXBsZS1hcHBkYXNoLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiIifQ==

package/dist_ts_web/elements/dees-table.js

@@ -20,7 +20,7 @@ export let DeesTable = class DeesTable extends DeesElement {
         position: absolute;
         width: 100%;
         height: 100%;
-        padding: 60px;
+        padding: 20px;
         background: #000000;
       }
     </style>
@@ -116,7 +116,7 @@ export let DeesTable = class DeesTable extends DeesElement {
         color: ${cssManager.bdTheme('#333', '#fff')};
         font-family: 'Mona Sans', 'Inter', sans-serif;
         font-weight: 400;
-        font-size: 16px;
+        font-size: 14px;
         padding: 16px;
         display: block;
         width: 100%;

package/dist_watch/bundle.js

@@ -71319,6 +71319,24 @@ DeesContextmenu = __decorateClass([
   e7("dees-contextmenu")
 ], DeesContextmenu);
 
+// ts_web/elements/dees-dataview-codebox.demo.ts
+var demoFunc = () => x` <style>
+.demoWrapper {
+  box-sizing: border-box;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  padding: 20px;
+  background: none;
+}
+</style>
+<div class="demoWrapper">
+<dees-dataview-codebox proglang="typescript">
+  import * as text from './hello'; const hiThere = 'nice'; const myFunction = async () => {
+  console.log('nice one'); }
+</dees-dataview-codebox>
+</div>`;
+
 // node_modules/.pnpm/highlight.js@11.8.0/node_modules/highlight.js/es/index.js
 var import_lib = __toESM(require_lib2(), 1);
 var es_default = import_lib.default;
@@ -71344,19 +71362,48 @@ var DeesDataviewCodebox = class extends DeesElement {
         .mainbox {
           position: relative;
           color: ${this.goBright ? "#333333" : "#ffffff"};
+          border-top: 1px solid ${this.goBright ? "#ffffff" : "#333333"};
+          box-shadow: 0px 0px 5px ${this.goBright ? "rgba(0,0,0,0.1)" : "rgba(0,0,0,0.5)"};
+          background: ${this.goBright ? "#ffffff" : "#191919"};
+          border-radius: 16px;
+          overflow: hidden;
+        }
+
+        .appbar {
+          height: 24px;
+          background: #161616;
+          border-bottom: 1px solid #222222;
+          font-size: 12px;
+          color: #CCC;
+          font-family: 'Hubot Sans', 'monospace';
+          line-height: 24px;
+        }
+
+        .appbar .fileName {
+          text-align: center;
+        }
+
+        .bottomBar {
+          height: 24px;
+          background: #161616;
+          border-top: 1px solid #222222;
+          font-size: 12px;
+          color: #CCC;
+          font-family: 'Hubot Sans', 'monospace';
+          line-height: 24px;
         }
 
         .languageLabel {
           color: #fff;
           font-size: 12px;
+          line-height: 24px;
           z-index: 10;
-          background: #6596ff;
+          background: #6596ff20;
           display: inline-block;
           position: absolute;
-          right: 32px;
-          padding: 4px;
-          border-bottom-left-radius: 3px;
-          border-bottom-right-radius: 3px;
+          bottom: 0px;
+          right: 0px;
+          padding: 0px 16px 0px 8px;
         }
 
         .hljs-keyword {
@@ -71366,18 +71413,15 @@ var DeesDataviewCodebox = class extends DeesElement {
         .codegrid {
           display: grid;
           grid-template-columns: 50px auto;
-          background: ${this.goBright ? "#ffffff" : "#191919"};
-          border-top: 1px solid ${this.goBright ? "#ffffff" : "#333333"};
-          box-shadow: 0px 0px 5px ${this.goBright ? "rgba(0,0,0,0.1)" : "rgba(0,0,0,0.5)"};
-          border-radius: 3px;
           overflow: hidden;
         }
 
         .lineNumbers {
-          background: ${this.goBright ? "#fafafa" : "#151515"};
+          
           color: ${this.goBright ? "#acacac" : "#666666"};
           padding: 30px 16px 0px 0px;
           text-align: right;
+          border-right: 1px solid ${this.goBright ? "#eaeaea" : "#222222"};
         }
 
         .lineCounter:last-child {
@@ -71425,7 +71469,9 @@ var DeesDataviewCodebox = class extends DeesElement {
         }
       </style>
       <div class="mainbox">
-        <div class="languageLabel">${this.progLang}</div>
+        <div class="appbar">
+          <div class="fileName">index.ts</div>
+        </div>
         <div class="codegrid">
           <div class="lineNumbers">
             ${(() => {
@@ -71438,6 +71484,10 @@ var DeesDataviewCodebox = class extends DeesElement {
           </div>
           <pre><code></code></pre>
         </div>
+        <div class="bottomBar">
+          Spaces: 2
+          <div class="languageLabel">${this.progLang}</div>
+        </div>
       </div>
     `;
   }
@@ -71460,14 +71510,14 @@ var DeesDataviewCodebox = class extends DeesElement {
     }
     await plugins.smartdelay.delayFor(0);
     const localCodeNode = this.shadowRoot.querySelector("code");
-    const html = es_default.highlight(this.codeToDisplayStore, { language: this.progLang, ignoreIllegals: true });
+    const html = es_default.highlight(this.codeToDisplayStore, {
+      language: this.progLang,
+      ignoreIllegals: true
+    });
     localCodeNode.innerHTML = html.value;
   }
 };
-DeesDataviewCodebox.demo = () => x`<dees-dataview-codebox proglang="typescript">
-    import * as text from './hello'; const hiThere = 'nice'; const myFunction = async () => {
-    console.log('nice one'); }
-  </dees-dataview-codebox>`;
+DeesDataviewCodebox.demo = demoFunc;
 __decorateClass([
   n5()
 ], DeesDataviewCodebox.prototype, "progLang", 2);
@@ -71484,35 +71534,9 @@ DeesDataviewCodebox = __decorateClass([
   e7("dees-dataview-codebox")
 ], DeesDataviewCodebox);
 
-// ts_web/elements/dees-dataview-statusobject.ts
-var DeesDataviewStatusobject = class extends DeesElement {
-  render() {
-    return x`
-      <div class="mainbox">
-        <div class="heading">
-          <div class="statusdot ${this.statusObject?.combinedStatus}"></div>
-          <h1>${this.statusObject?.name || "no status object assigned"}</h1>
-          <div class="copyMain">Copy as JSON</div>
-        </div>
-        ${this.statusObject?.details?.map((detailArg) => {
-      return x`
-            <div class="detail">
-              <div class="statusdot ${detailArg.status}"></div>
-              <div class="detailsText">
-                <div class="label">${detailArg.name}</div>
-                <div class="value">${detailArg.value}</div>
-              </div>
-            </div>
-          `;
-    })}
-      </div>
-    `;
-  }
-  async firstUpdated() {
-  }
-};
-DeesDataviewStatusobject.demo = () => x`<dees-dataview-statusobject
-    .statusObject=${{
+// ts_web/elements/dees-dataview-statusobject.demo.ts
+var demoFunc2 = () => x`<dees-dataview-statusobject
+  .statusObject=${{
   id: "1",
   name: "Demo Item",
   combinedStatus: "partly_ok",
@@ -71544,8 +71568,37 @@ DeesDataviewStatusobject.demo = () => x`<dees-dataview-statusobject
     }
   ]
 }}
-  >
-  </dees-dataview-statusobject>`;
+>
+</dees-dataview-statusobject>`;
+
+// ts_web/elements/dees-dataview-statusobject.ts
+var DeesDataviewStatusobject = class extends DeesElement {
+  render() {
+    return x`
+      <div class="mainbox">
+        <div class="heading">
+          <div class="statusdot ${this.statusObject?.combinedStatus}"></div>
+          <h1>${this.statusObject?.name || "no status object assigned"}</h1>
+          <div class="copyMain">Copy as JSON</div>
+        </div>
+        ${this.statusObject?.details?.map((detailArg) => {
+      return x`
+            <div class="detail">
+              <div class="statusdot ${detailArg.status}"></div>
+              <div class="detailsText">
+                <div class="label">${detailArg.name}</div>
+                <div class="value">${detailArg.value}</div>
+              </div>
+            </div>
+          `;
+    })}
+      </div>
+    `;
+  }
+  async firstUpdated() {
+  }
+};
+DeesDataviewStatusobject.demo = demoFunc2;
 DeesDataviewStatusobject.styles = [
   cssManager.defaultStyles,
   i`
@@ -71583,7 +71636,7 @@ DeesDataviewStatusobject.styles = [
 
       .copyMain {
         cursor: pointer;
-        font-size: 8px;
+        font-size: 10px;
         font-weight: 600;
         text-transform: uppercase;
         border: 1px solid ${cssManager.bdTheme("#999", "#444")};
@@ -71591,6 +71644,7 @@ DeesDataviewStatusobject.styles = [
         padding: 4px;
         border-radius: 3px;
         margin-right: 16px;
+        color: #ffffff80
       }
 
       .statusdot.ok {
@@ -71610,7 +71664,7 @@ DeesDataviewStatusobject.styles = [
         align-items: center;
         display: grid;
         grid-template-columns: 40px auto;
-        border-top: 1px dotted ${cssManager.bdTheme("#999", "#444")};
+        border-top: 1px dotted ${cssManager.bdTheme("#999", "#282828")};
       }
 
       .detail .detailsText {
@@ -71622,10 +71676,11 @@ DeesDataviewStatusobject.styles = [
 
       .detail .detailsText .label {
         font-size: 12px;
+        color: #ffffff80
       }
 
       .detail .detailsText .value {
-        font-size: 16px;
+        font-size: 14px;
         font-family: 'Intel One Mono';
       }
     `
@@ -75806,6 +75861,7 @@ var DeesPdf = class extends DeesElement {
       <canvas id="pdfcanvas" .height=${0} .width=${0}></canvas>
     `;
   }
+  // typeof pdfjsTypes;
   async connectedCallback() {
     super.connectedCallback();
     if (!DeesPdf.pdfJsReady) {
@@ -76664,7 +76720,7 @@ DeesTable.demo = () => x`
         position: absolute;
         width: 100%;
         height: 100%;
-        padding: 60px;
+        padding: 20px;
         background: #000000;
       }
     </style>
@@ -76752,7 +76808,7 @@ DeesTable.styles = [
         color: ${cssManager.bdTheme("#333", "#fff")};
         font-family: 'Mona Sans', 'Inter', sans-serif;
         font-weight: 400;
-        font-size: 16px;
+        font-size: 14px;
         padding: 16px;
         display: block;
         width: 100%;