@design.estate/dees-catalog 1.0.185 → 1.0.188

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%;