@quandis/qbo4.ui 4.0.1-CI-20240515-222031 → 4.0.1-CI-20240604-124747

package/package.json

@@ -3,7 +3,7 @@
   "author": "Quandis, Inc.",
   "license": "MIT",
   "type": "module",
-  "version": "4.0.1-CI-20240515-222031",
+  "version": "4.0.1-CI-20240604-124747",
   "workspaces": [
     "code"
   ],
@@ -23,31 +23,31 @@
     "src/"
   ],
   "dependencies": {
-    "@codemirror/commands": "^6.4.0",
+    "@codemirror/commands": "^6.5.0",
     "@codemirror/lang-html": "^6.4.9",
-    "@joint/core": "^4.0.2",
-    "@quandis/qbo4.logging": "^4.0.1-CI-20240407-122601",
+    "@joint/core": "^4.0.4",
+    "@quandis/qbo4.logging": "^4.0.1-CI-20240528-220411",
     "bootstrap": "^5.3.3",
     "bootstrap-icons": "^1.11.3",
-    "codemirror": "^6.0.1",
+    "codemirror": "6.0.1",
     "lit": "^3.1.3",
     "reflect-metadata": "^0.2.2",
     "tsyringe": "^4.8.0",
-    "zero-md": "^2.5.3"
+    "zero-md": "^3.0.0"
   },
   "devDependencies": {
     "@esm-bundle/chai": "^4.3.4",
-    "@fullhuman/postcss-purgecss": "^5.0.0",
+    "@fullhuman/postcss-purgecss": "^6.0.0",
     "autoprefixer": "^10.4.19",
     "clean-css": "^5.3.3",
-    "glob": "^10.3.10",
-    "html-webpack-plugin": "^5.5.3",
-    "mini-css-extract-plugin": "^2.7.6",
+    "glob": "^10.4.1",
+    "html-webpack-plugin": "^5.6.0",
+    "mini-css-extract-plugin": "^2.9.0",
     "postcss": "^8.4.38",
     "postcss-loader": "^8.1.1",
-    "sass": "^1.72.0",
-    "typescript": "^5.4.3",
-    "webpack": "^5.88.2",
+    "sass": "^1.77.4",
+    "typescript": "^5.4.5",
+    "webpack": "^5.91.0",
     "webpack-cli": "^5.1.4",
     "webpack-merge": "^5.10.0"
   }

package/src/qbo/qbo-markdown.js

@@ -9,7 +9,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
 };
 import { html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { ZeroMd } from 'zero-md';
+import ZeroMd from 'zero-md';
 const md = ZeroMd;
 /**
   * Renders CodeMirror to edit HTML.

package/src/qbo/qbo-markdown.ts

@@ -1,6 +1,6 @@
 import { html, css, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { ZeroMd } from 'zero-md'
+import ZeroMd from 'zero-md'
 const md = ZeroMd;
 /**
   * Renders CodeMirror to edit HTML.

package/src/qbo/qbo-select.js

@@ -20,7 +20,7 @@ import { QboFormElement, getApiService } from './Program.js';
 let QboSelect = class QboSelect extends QboFormElement {
     constructor() {
         super(...arguments);
-        this.apiEndpoint = 'qbo';
+        this.apiEndpoint = 'default';
         this.loading = false;
         this.optionText = null;
         this.optionValue = null;
@@ -40,8 +40,10 @@ let QboSelect = class QboSelect extends QboFormElement {
     async connectedCallback() {
         this.optionText ??= this.optionValue;
         super.connectedCallback();
-        const service = getApiService(this.apiEndpoint);
-        this.jsonData = await service.fetch(null, {});
+        if (this.jsonData !== null) {
+            const service = getApiService(this.apiEndpoint);
+            this.jsonData = await service.fetch(null, {});
+        }
     }
     createRenderRoot() {
         return this.renderInHost ? this : super.createRenderRoot();

package/src/qbo/qbo-select.ts

@@ -14,7 +14,7 @@ import { IApiService, QboFormElement, getApiService } from './Program.js';
 export class QboSelect extends QboFormElement
 {
     @property({ type: String })
-    apiEndpoint = 'qbo';
+    apiEndpoint = 'default';
 
     @property({ type: Boolean })
     loading = false;
@@ -53,9 +53,10 @@ export class QboSelect extends QboFormElement
     async connectedCallback() {
         this.optionText ??= this.optionValue;
         super.connectedCallback();
-
-        const service: IApiService = getApiService(this.apiEndpoint);
-        this.jsonData = await service.fetch(null, { });
+        if (this.jsonData !== null) {
+            const service: IApiService = getApiService(this.apiEndpoint);
+            this.jsonData = await service.fetch(null, {});
+        }
     }
 
     createRenderRoot() {

package/src/qbo-code/qbo-code.d.ts

@@ -8,5 +8,6 @@ export declare class QboCode extends LitElement {
     get value(): string | undefined;
     connectedCallback(): Promise<void>;
     editor: EditorView | null;
-    render(): void;
+    firstUpdated(): Promise<void>;
+    render(): import("lit-html").TemplateResult<1>;
 }

package/src/qbo-code/qbo-code.js

@@ -8,12 +8,11 @@ var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
 import 'reflect-metadata';
-import { LitElement } from 'lit';
+import { html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { basicSetup } from "codemirror";
-import { EditorView, keymap } from "@codemirror/view";
+import { EditorView } from "@codemirror/view";
 import { html as htmlcode } from "@codemirror/lang-html";
-import { indentWithTab } from "@codemirror/commands";
 /**
   * Renders CodeMirror to edit HTML.
   */
@@ -27,21 +26,27 @@ let QboCode = class QboCode extends LitElement {
     async connectedCallback() {
         super.connectedCallback();
     }
-    render() {
+    async firstUpdated() {
         const code = this.querySelector('*[slot=code]')?.innerHTML ?? this.innerHTML;
+        console.log('basicSetup: ', basicSetup);
+        console.log('htmlcode: ', htmlcode);
         this.editor ??= new EditorView({
             doc: code.trim(),
             extensions: [
                 basicSetup,
-                htmlcode(),
-                keymap.of([indentWithTab]),
-                EditorView.updateListener.of((e) => {
-                    this.dispatchEvent(new CustomEvent('change', { detail: { code: this.value } }));
-                })
+                htmlcode()
+                //keymap.of([indentWithTab]),
+                //EditorView.updateListener.of((e) => {
+                //    this.dispatchEvent(new CustomEvent('change', { detail: { code: this.value } }));
+                //})
             ],
-            parent: this.shadowRoot,
+            parent: this.shadowRoot?.querySelector('div')
+            // parent: <DocumentFragment>this.shadowRoot,
         });
     }
+    render() {
+        return html `<div></div>`;
+    }
 };
 __decorate([
     property(),

package/src/qbo-code/qbo-code.ts

@@ -21,20 +21,27 @@ export class QboCode extends LitElement
 
     editor: EditorView | null = null;
 
-    render() {
+    async firstUpdated() {
         const code = this.querySelector('*[slot=code]')?.innerHTML ?? this.innerHTML;
+        console.log('basicSetup: ', basicSetup);
+        console.log('htmlcode: ', htmlcode);
         this.editor ??= new EditorView({
             doc: code.trim(),
             extensions: [
                 basicSetup,
-                htmlcode(),
-                keymap.of([indentWithTab]),
-                EditorView.updateListener.of((e) => {
-                    this.dispatchEvent(new CustomEvent('change', { detail: { code: this.value } }));
-                })
+                htmlcode()
+                //keymap.of([indentWithTab]),
+                //EditorView.updateListener.of((e) => {
+                //    this.dispatchEvent(new CustomEvent('change', { detail: { code: this.value } }));
+                //})
             ],
-            parent: <DocumentFragment>this.shadowRoot,
+            parent: this.shadowRoot?.querySelector('div') as HTMLElement
+            // parent: <DocumentFragment>this.shadowRoot,
         });
     }
+
+    render() {
+        return html`<div></div>`;
+    }
 }