@quandis/qbo4.configuration 4.0.1-CI-20241017-182709 → 4.0.1-CI-20241019-132152

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quandis/qbo4.configuration",
-  "version": "4.0.1-CI-20241017-182709",
+  "version": "4.0.1-CI-20241019-132152",
   "type": "module",
   "types": "./src/Program.d.ts",
   "exports": {
@@ -35,7 +35,7 @@
     "mini-css-extract-plugin": "^2.9.1",
     "postcss-cli": "^11.0.0",
     "postcss-loader": "^8.1.1",
-    "sass": "^1.80.1",
+    "sass": "^1.80.3",
     "sass-loader": "^16.0.2",
     "style-loader": "^4.0.0",
     "typescript": "^5.6.3",

package/src/IApiService.d.ts

@@ -0,0 +1,21 @@
+import { InjectionToken } from "tsyringe";
+/**
+  * Defines a contract for API calls.
+  */
+export interface IApiService {
+    /**
+     * The relative path to the API endpoint.
+     */
+    relativePath: string;
+    /**
+     * Fetch data from the API.
+     * @param relativePath The relative path to the API endpoint.
+     * @param payload The payload to send to the API.
+     */
+    fetch(relativePath: string | null, payload?: Record<string, string> | null | undefined): Promise<any>;
+    clone(relativePath: string | null): IApiService;
+}
+/**
+ *  Define a token for the IApiService interface
+ */
+export declare const IApiServiceToken: InjectionToken<IApiService>;

package/src/IApiService.js

@@ -0,0 +1,5 @@
+/**
+ *  Define a token for the IApiService interface
+ */
+export const IApiServiceToken = 'ApiServiceToken';
+//# sourceMappingURL=IApiService.js.map

package/src/IApiService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IApiService.js","sourceRoot":"","sources":["IApiService.ts"],"names":[],"mappings":"AAsBA;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAgC,iBAAiB,CAAC"}

package/src/IApiService.ts

@@ -0,0 +1,27 @@
+import { InjectionToken } from "tsyringe";
+
+/**
+  * Defines a contract for API calls.
+  */
+export interface IApiService {
+    /**
+     * The relative path to the API endpoint.
+     */
+    relativePath: string;
+
+    /**
+     * Fetch data from the API.
+     * @param relativePath The relative path to the API endpoint.
+     * @param payload The payload to send to the API.
+     */
+    fetch(relativePath: string | null, payload?: Record<string, string> | null | undefined): Promise<any>;
+
+    
+    clone(relativePath: string | null): IApiService;
+}
+
+/**
+ *  Define a token for the IApiService interface
+ */
+export const IApiServiceToken: InjectionToken<IApiService> = 'ApiServiceToken';
+

package/src/Library.d.ts

@@ -0,0 +1,7 @@
+export declare function getArray(json: any, arrayName?: string): Array<{
+    [key: string]: string;
+}> | null;
+export declare function substitute(inputString: string, ...jsonData: any): string;
+export declare function replicate(target: HTMLElement | null, template: HTMLTemplateElement | null, sourceData: Array<{
+    [key: string]: string;
+}>, emptyContent?: boolean): void;

package/src/Library.js

@@ -0,0 +1,87 @@
+/* @description Find an array in a JSON object
+ * @param json {object} A Json object or array.
+ * @param arrayName {array} The name of a key that represents an array to use. If not specified, the first array found will be returned.
+ * @returns {Array} An array if found, otherwise null.
+*/
+export function getArray(json, arrayName) {
+    if (typeof json === 'string') {
+        try {
+            json = JSON.parse(json);
+        }
+        catch (error) {
+            console.error('Error parsing JSON string:', error);
+            return null;
+        }
+    }
+    if (Array.isArray(json)) {
+        return json;
+    }
+    if (typeof json === 'object' && json !== null) {
+        for (const key in json) {
+            const value = json[key];
+            if (Array.isArray(value)) {
+                return value;
+            }
+            else if (typeof value === 'object') {
+                const nestedResult = getArray(value, arrayName);
+                if (nestedResult) {
+                    return nestedResult;
+                }
+            }
+        }
+    }
+    return null; // No array found
+}
+/* @description Perform string substitution on a template using a JSON object
+*/
+function interpolate(template, data) {
+    try {
+        return new Function("return `" + template + "`;").call(data);
+    }
+    catch (err) {
+        document.dispatchEvent(new CustomEvent('qbo-warning', { detail: { 'error': err, 'message': 'Unable to substitute template.', 'template': template, 'data': data } }));
+        return template;
+    }
+}
+/* @description Perform string substitution of ${expression} using one or more JSON objects.
+ * @example substitute('Hello ${name}!', { name: 'World' }) => 'Hello World!'
+*/
+export function substitute(inputString, ...jsonData) {
+    // Use a regular expression to match ${key} expressions
+    const regex = /\${(.*?)}/g;
+    let resultString = inputString;
+    for (let i = 0; i < jsonData.length; i++) {
+        const data = jsonData[i];
+        resultString = resultString.replace(regex, (match, expression) => {
+            const parts = expression.split(/\.|\[|\]/).filter(part => part !== '');
+            let currentValue = data;
+            // Iterate over the parts to access the desired value
+            for (let part of parts) {
+                if (currentValue[part] === undefined)
+                    return match;
+                currentValue = currentValue[part];
+            }
+            return currentValue;
+        });
+    }
+    resultString = resultString.replace(regex, () => '');
+    return resultString;
+}
+/* @description Replicates content in a target element for each item in a JSON array.
+*/
+export function replicate(target, template, sourceData, emptyContent = true) {
+    if (target != null && template != null) {
+        while (emptyContent && target.firstChild) {
+            target.removeChild(target.firstChild);
+        }
+        sourceData.map((data, index) => {
+            const row = template.content.cloneNode(true);
+            if (row.firstElementChild != null) {
+                row.firstElementChild.setAttribute("data-index", `${index}`);
+                row.firstElementChild.innerHTML = substitute(row.firstElementChild?.innerHTML ?? '', data);
+            }
+            target.appendChild(row);
+        });
+    }
+}
+//# sourceMappingURL=Library.js.map

package/src/Library.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Library.js","sourceRoot":"","sources":["Library.ts"],"names":[],"mappings":"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"}

package/src/Library.ts

@@ -0,0 +1,94 @@
+
+/* @description Find an array in a JSON object
+ * @param json {object} A Json object or array.
+ * @param arrayName {array} The name of a key that represents an array to use. If not specified, the first array found will be returned.
+ * @returns {Array} An array if found, otherwise null.
+*/
+export function getArray(json: any, arrayName?: string): Array<{ [key: string]: string }> | null {
+    if (typeof json === 'string') {
+        try {
+            json = JSON.parse(json);
+        } catch (error) {
+            console.error('Error parsing JSON string:', error);
+            return null;
+        }
+    }
+
+    if (Array.isArray(json)) {
+        return json;
+    }
+
+    if (typeof json === 'object' && json !== null) {
+        for (const key in json) {
+            const value = json[key];
+            if (Array.isArray(value)) {
+                return value;
+            } else if (typeof value === 'object') {
+                const nestedResult = getArray(value, arrayName);
+                if (nestedResult) {
+                    return nestedResult;
+                }
+            }
+        }
+    }
+
+    return null; // No array found
+}
+
+/* @description Perform string substitution on a template using a JSON object
+*/
+function interpolate(template: string, data: { [key: string]: string }) {
+    try {
+        return new Function("return `" + template + "`;").call(data);
+    } catch (err) {
+        document.dispatchEvent(new CustomEvent('qbo-warning', { detail: { 'error': err, 'message': 'Unable to substitute template.', 'template': template, 'data': data } }));
+        return template;
+    }
+}
+
+/* @description Perform string substitution of ${expression} using one or more JSON objects.
+ * @example substitute('Hello ${name}!', { name: 'World' }) => 'Hello World!'
+*/
+export function substitute(inputString: string, ...jsonData: any): string {
+    // Use a regular expression to match ${key} expressions
+    const regex = /\${(.*?)}/g;
+    let resultString = inputString;
+    for (let i = 0; i < jsonData.length; i++) {
+        const data = jsonData[i] as Record<string, any>;
+        resultString = resultString.replace(regex, (match: string, expression: string) => {
+            const parts = expression.split(/\.|\[|\]/).filter(part => part !== '');
+            let currentValue: any = data;
+
+            // Iterate over the parts to access the desired value
+            for (let part of parts) {
+                if (currentValue[part] === undefined)
+                    return match;
+                currentValue = currentValue[part];
+            }
+            return currentValue;
+        });
+    }
+    resultString = resultString.replace(regex, () => '');
+
+    return resultString;
+}
+
+
+/* @description Replicates content in a target element for each item in a JSON array.
+*/
+export function replicate(target: HTMLElement | null, template: HTMLTemplateElement | null, sourceData: Array<{ [key: string]: string }>, emptyContent: boolean = true) {
+    if (target != null && template != null) {
+        while (emptyContent && target.firstChild) {
+            target.removeChild(target.firstChild);
+        }
+        sourceData.map((data, index) => {
+            const row = template.content.cloneNode(true) as DocumentFragment;
+            if (row.firstElementChild != null) {
+                row.firstElementChild.setAttribute("data-index", `${index}`);
+                row.firstElementChild.innerHTML = substitute(row.firstElementChild?.innerHTML ?? '', data)
+            }
+            target.appendChild(row);
+        });
+    }
+}
+

package/src/Program.d.ts

@@ -1,5 +1,4 @@
-import { TemplateFunction } from './qbo-template.js';
-import { Services } from './Services.js';
+import 'reflect-metadata';
 declare global {
     interface HTMLElement {
         attachInternals(): ElementInternals;
@@ -10,15 +9,23 @@ declare global {
             configuration?: {
                 templates?: Map<string, Map<string, TemplateFunction>>;
                 html?: any;
+                css?: any;
             };
         };
     }
 }
-import 'reflect-metadata';
-export { html } from 'lit';
+import { IApiService } from './IApiService.js';
+import { TemplateFunction } from './qbo-template.js';
+import { Services } from './Services.js';
+export { html, css } from 'lit';
+export * from './IApiService.js';
+export * from './RestApiService.js';
 export * from './Services.js';
 export * from './IConfiguration.js';
 export * from './Configuration.js';
 export * from './qbo-config-editor.js';
 export * from './qbo-template.js';
 export * from './qbo-css.js';
+export * from './qbo-api.js';
+export declare function getApiService(url: string): IApiService;
+export declare function redefineCustomElements(): void;

package/src/Program.js

@@ -1,9 +1,34 @@
 import 'reflect-metadata';
-export { html } from 'lit';
+import { RestApiService } from './RestApiService.js';
+import { services } from './Services.js';
+export { html, css } from 'lit';
+export * from './IApiService.js';
+export * from './RestApiService.js';
 export * from './Services.js';
 export * from './IConfiguration.js';
 export * from './Configuration.js';
 export * from './qbo-config-editor.js';
 export * from './qbo-template.js';
 export * from './qbo-css.js';
+export * from './qbo-api.js';
+export function getApiService(url) {
+    const parts = url.match(/api:\/\/([^/]+)/);
+    const name = parts ? parts[1] : url;
+    const relativePath = parts ? url.substring(`api://${name}`.length + 1) : '';
+    const service = services.container.isRegistered(name)
+        ? services.container.resolve(name)
+        : new RestApiService(url);
+    return (relativePath) ? service.clone(relativePath) : service;
+}
+export function redefineCustomElements() {
+    // Store the original customElements.define method
+    const originalDefine = window.customElements.define;
+    // Override customElements.define
+    window.customElements.define = function (tagName, elementClass, options) {
+        if (!window.customElements.get(tagName))
+            originalDefine.call(this, tagName, elementClass, options);
+        else
+            console.error(`Custom element ${tagName} already defined`);
+    };
+}
 //# sourceMappingURL=Program.js.map

package/src/Program.js.map

@@ -1 +1 @@
-{"version":3,"file":"Program.js","sourceRoot":"","sources":["Program.ts"],"names":[],"mappings":"AAmBA,OAAO,kBAAkB,CAAC;AAE1B,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC"}
+{"version":3,"file":"Program.js","sourceRoot":"","sources":["Program.ts"],"names":[],"mappings":"AAAA,OAAO,kBAAkB,CAAC;AAqB1B,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,QAAQ,EAAY,MAAM,eAAe,CAAC;AAEnD,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAChC,cAAc,kBAAkB,CAAC;AACjC,cAAc,qBAAqB,CAAC;AACpC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,MAAM,UAAU,aAAa,CAAC,GAAW;IACrC,MAAM,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,iBAAiB,CAAC,CAAC;IAC3C,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC;IACpC,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,SAAS,CAAC,SAAS,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5E,MAAM,OAAO,GAAgB,QAAQ,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC;QAC9D,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,OAAO,CAAc,IAAI,CAAC;QAC/C,CAAC,CAAC,IAAI,cAAc,CAAC,GAAG,CAAC,CAAC;IAE9B,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;AAClE,CAAC;AAED,MAAM,UAAU,sBAAsB;IAClC,kDAAkD;IAClD,MAAM,cAAc,GAAG,MAAM,CAAC,cAAc,CAAC,MAAM,CAAC;IAEpD,iCAAiC;IACjC,MAAM,CAAC,cAAc,CAAC,MAAM,GAAG,UAAU,OAAO,EAAE,YAAY,EAAE,OAAO;QACnE,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC;YACnC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,OAAO,CAAC,CAAC;;YAE1D,OAAO,CAAC,KAAK,CAAC,kBAAkB,OAAO,kBAAkB,CAAC,CAAC;IACnE,CAAC,CAAC;AACN,CAAC"}

package/src/Program.ts

@@ -1,5 +1,4 @@
-import { TemplateFunction, templates } from './qbo-template.js';
-import { Services } from './Services.js';
+import 'reflect-metadata';
 
 // Extend the HTMLElement interface to include attachInternals
 declare global {
@@ -12,18 +11,47 @@ declare global {
             configuration?: {
                 templates?: Map<string, Map<string, TemplateFunction>>;
                 html?: any;
+                css?: any;
             };
         };
     }
 }
 
-import 'reflect-metadata';
+import { IApiService } from './IApiService.js';
+import { TemplateFunction, templates } from './qbo-template.js';
+import { RestApiService } from './RestApiService.js';
+import { services, Services } from './Services.js';
 
-export { html } from 'lit';
+export { html, css } from 'lit';
+export * from './IApiService.js';
+export * from './RestApiService.js';
 export * from './Services.js';
 export * from './IConfiguration.js';
 export * from './Configuration.js';
 export * from './qbo-config-editor.js';
 export * from './qbo-template.js';
 export * from './qbo-css.js';
+export * from './qbo-api.js';
+export function getApiService(url: string) {
+    const parts = url.match(/api:\/\/([^/]+)/);
+    const name = parts ? parts[1] : url;
+    const relativePath = parts ? url.substring(`api://${name}`.length + 1) : '';
+    const service: IApiService = services.container.isRegistered(name)
+        ? services.container.resolve<IApiService>(name)
+        : new RestApiService(url);
 
+    return (relativePath) ? service.clone(relativePath) : service;
+}
+
+export function redefineCustomElements() {
+    // Store the original customElements.define method
+    const originalDefine = window.customElements.define;
+
+    // Override customElements.define
+    window.customElements.define = function (tagName, elementClass, options) {
+        if (!window.customElements.get(tagName))
+            originalDefine.call(this, tagName, elementClass, options);
+        else
+            console.error(`Custom element ${tagName} already defined`);
+    };
+}

package/src/RestApiService.d.ts

@@ -0,0 +1,11 @@
+import { IApiService } from "./IApiService.js";
+export declare class RestApiService implements IApiService {
+    private headers;
+    private apiEndpoint;
+    private method;
+    relativePath: string;
+    constructor(apiEndpoint: string, headers?: HeadersInit, method?: string | null);
+    fetch(relativePath: string | null, payload?: Record<string, string> | null | undefined): Promise<any>;
+    clone(relativePath: string | null): IApiService;
+}
+export declare function registerRestApi(name: string, apiEndpoint: string, headers?: HeadersInit, method?: string | null): void;

package/src/RestApiService.js

@@ -0,0 +1,39 @@
+import { substitute } from "./Library.js";
+import { services } from "./Services.js";
+export class RestApiService {
+    constructor(apiEndpoint, headers = { 'Content-Type': 'application/json' }, method = null) {
+        this.relativePath = '';
+        this.apiEndpoint = apiEndpoint;
+        this.headers = headers;
+        this.method = method;
+    }
+    async fetch(relativePath, payload) {
+        const endpoint = substitute(new URL(relativePath ?? this.relativePath, this.apiEndpoint).href, payload);
+        const method = this.method ?? (payload ? 'POST' : 'GET');
+        const headers = new Headers(this.headers || {});
+        if (payload && !headers.has('Content-Type')) {
+            headers.append('Content-Type', 'application/json');
+        }
+        const response = await fetch(endpoint, {
+            method: method,
+            headers: headers,
+            body: (method === 'POST' && payload) ? JSON.stringify(payload) : null
+        });
+        if (!response.ok) {
+            throw new Error(`API request failed with status ${response.status}`);
+        }
+        return response.json();
+    }
+    clone(relativePath) {
+        const clone = new RestApiService(this.apiEndpoint, this.headers, this.method);
+        clone.relativePath = relativePath ?? '';
+        return clone;
+    }
+}
+// Register a RestApiService with the default name 'default' and the base URL of the current page
+services.container.registerInstance('default', new RestApiService(document.querySelector('base[href]')?.getAttribute('href') || window.location.origin));
+// Sugar for registering a RestApiService with registerRestApi('myName', 'https://my.api.com')
+export function registerRestApi(name, apiEndpoint, headers = { 'Content-Type': 'application/json' }, method) {
+    services.container.registerInstance(name, new RestApiService(apiEndpoint, headers, method));
+}
+//# sourceMappingURL=RestApiService.js.map

package/src/RestApiService.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RestApiService.js","sourceRoot":"","sources":["RestApiService.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,MAAM,OAAO,cAAc;IAOvB,YAAY,WAAmB,EAAE,UAAuB,EAAE,cAAc,EAAE,kBAAkB,EAAE,EAAE,SAAwB,IAAI;QAFrH,iBAAY,GAAW,EAAE,CAAC;QAG7B,IAAI,CAAC,WAAW,GAAG,WAAW,CAAC;QAC/B,IAAI,CAAC,OAAO,GAAG,OAAO,CAAC;QACvB,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;IACzB,CAAC;IAED,KAAK,CAAC,KAAK,CAAC,YAA2B,EAAE,OAAmD;QACxF,MAAM,QAAQ,GAAG,UAAU,CAAC,IAAI,GAAG,CAAC,YAAY,IAAI,IAAI,CAAC,YAAY,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QACxG,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;QACzD,MAAM,OAAO,GAAG,IAAI,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,EAAE,CAAC,CAAC;QAChD,IAAI,OAAO,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,EAAE,CAAC;YAC1C,OAAO,CAAC,MAAM,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAC;QACvD,CAAC;QAED,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,QAAQ,EAAE;YACnC,MAAM,EAAE,MAAM;YACd,OAAO,EAAE,OAAO;YAChB,IAAI,EAAE,CAAC,MAAM,KAAK,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;SACxE,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;YACf,MAAM,IAAI,KAAK,CAAC,kCAAkC,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC;QACzE,CAAC;QAED,OAAO,QAAQ,CAAC,IAAI,EAAE,CAAC;IAC3B,CAAC;IAED,KAAK,CAAC,YAA2B;QAC7B,MAAM,KAAK,GAAG,IAAI,cAAc,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;QAC9E,KAAK,CAAC,YAAY,GAAG,YAAY,IAAI,EAAE,CAAC;QACxC,OAAO,KAAK,CAAC;IACjB,CAAC;CACJ;AAED,iGAAiG;AACjG,QAAQ,CAAC,SAAS,CAAC,gBAAgB,CAAc,SAAS,EAAE,IAAI,cAAc,CAAC,QAAQ,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE,YAAY,CAAC,MAAM,CAAC,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC;AAEtK,8FAA8F;AAC9F,MAAM,UAAU,eAAe,CAAC,IAAY,EAAE,WAAmB,EAAE,UAAuB,EAAE,cAAc,EAAE,kBAAkB,EAAE,EAAE,MAAsB;IACpJ,QAAQ,CAAC,SAAS,CAAC,gBAAgB,CAAc,IAAI,EAAE,IAAI,cAAc,CAAC,WAAW,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC;AAC7G,CAAC"}

package/src/RestApiService.ts

@@ -0,0 +1,52 @@
+import { IApiService } from "./IApiService.js";
+import { substitute } from "./Library.js";
+import { services } from "./Services.js";
+
+export class RestApiService implements IApiService {
+
+    private headers: HeadersInit;
+    private apiEndpoint: string;
+    private method: string | null;
+    public relativePath: string = '';
+
+    constructor(apiEndpoint: string, headers: HeadersInit = { 'Content-Type': 'application/json' }, method: string | null = null) {
+        this.apiEndpoint = apiEndpoint;
+        this.headers = headers;
+        this.method = method;
+    }
+
+    async fetch(relativePath: string | null, payload?: Record<string, string> | null | undefined): Promise<any> {
+        const endpoint = substitute(new URL(relativePath ?? this.relativePath, this.apiEndpoint).href, payload);
+        const method = this.method ?? (payload ? 'POST' : 'GET');
+        const headers = new Headers(this.headers || {});
+        if (payload && !headers.has('Content-Type')) {
+            headers.append('Content-Type', 'application/json');
+        }
+
+        const response = await fetch(endpoint, {
+            method: method,
+            headers: headers,
+            body: (method === 'POST' && payload) ? JSON.stringify(payload) : null
+        });
+
+        if (!response.ok) {
+            throw new Error(`API request failed with status ${response.status}`);
+        }
+
+        return response.json();
+    }
+
+    clone(relativePath: string | null): IApiService {
+        const clone = new RestApiService(this.apiEndpoint, this.headers, this.method);
+        clone.relativePath = relativePath ?? '';
+        return clone;
+    }
+}
+
+// Register a RestApiService with the default name 'default' and the base URL of the current page
+services.container.registerInstance<IApiService>('default', new RestApiService(document.querySelector('base[href]')?.getAttribute('href') || window.location.origin));
+
+// Sugar for registering a RestApiService with registerRestApi('myName', 'https://my.api.com')
+export function registerRestApi(name: string, apiEndpoint: string, headers: HeadersInit = { 'Content-Type': 'application/json' }, method?: string | null) {
+    services.container.registerInstance<IApiService>(name, new RestApiService(apiEndpoint, headers, method));
+}

package/src/qbo-api.d.ts

@@ -0,0 +1,8 @@
+import { LitElement } from 'lit';
+export declare class QboApiElement extends LitElement {
+    name: string | null;
+    apiEndpoint: string | null;
+    method: string | undefined;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+}

package/src/qbo-api.js

@@ -0,0 +1,66 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { LitElement, html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { registerRestApi } from './RestApiService.js';
+let QboApiElement = class QboApiElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.name = null;
+        this.apiEndpoint = null;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        const headers = {};
+        if (this.name == null)
+            console.error('qbo-api name is required.');
+        if (this.apiEndpoint == null)
+            console.error('qbo-api apiEndpoint is required.');
+        const headerElements = this.querySelectorAll('header');
+        headerElements.forEach(header => {
+            const name = header.getAttribute('name');
+            const value = header.textContent;
+            if (name && value) {
+                headers[name] = value;
+            }
+        });
+        // Adjust for correct header naming convention, if necessary
+        if (headers['ContentType']) {
+            headers['Content-Type'] = headers['ContentType'];
+            delete headers['ContentType'];
+        }
+        // container.registerInstance<IApiService>(this.name!, new RestApiService(this.apiEndpoint!, headers, this.method));
+        // Call the registerRestApi function with the extracted configuration
+        if (!this.apiEndpoint?.startsWith("http"))
+            this.apiEndpoint = new URL(this.apiEndpoint ?? '', document.location.origin).href;
+        registerRestApi(this.name, this.apiEndpoint, headers, this.method);
+    }
+    render() {
+        // Render nothing, as this component is for configuration purposes only
+        return html ``;
+    }
+};
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], QboApiElement.prototype, "name", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", Object)
+], QboApiElement.prototype, "apiEndpoint", void 0);
+__decorate([
+    property(),
+    __metadata("design:type", Object)
+], QboApiElement.prototype, "method", void 0);
+QboApiElement = __decorate([
+    customElement('qbo-api')
+], QboApiElement);
+export { QboApiElement };
+//# sourceMappingURL=qbo-api.js.map

package/src/qbo-api.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"qbo-api.js","sourceRoot":"","sources":["qbo-api.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAG/C,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAEH,SAAI,GAAkB,IAAI,CAAC;QAG3B,gBAAW,GAAkB,IAAI,CAAC;IA0CtC,CAAC;IArCG,iBAAiB;QACb,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAE1B,MAAM,OAAO,GAAgB,EAAE,CAAC;QAEhC,IAAI,IAAI,CAAC,IAAI,IAAI,IAAI;YACjB,OAAO,CAAC,KAAK,CAAC,2BAA2B,CAAC,CAAC;QAC/C,IAAI,IAAI,CAAC,WAAW,IAAI,IAAI;YACxB,OAAO,CAAC,KAAK,CAAC,kCAAkC,CAAC,CAAC;QAEtD,MAAM,cAAc,GAAG,IAAI,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;QACvD,cAAc,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;YAC5B,MAAM,IAAI,GAAG,MAAM,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;YACzC,MAAM,KAAK,GAAG,MAAM,CAAC,WAAW,CAAC;YACjC,IAAI,IAAI,IAAI,KAAK,EAAE,CAAC;gBAChB,OAAO,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC;YAC1B,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,4DAA4D;QAC5D,IAAI,OAAO,CAAC,aAAa,CAAC,EAAE,CAAC;YACzB,OAAO,CAAC,cAAc,CAAC,GAAG,OAAO,CAAC,aAAa,CAAC,CAAC;YACjD,OAAO,OAAO,CAAC,aAAa,CAAC,CAAC;QAClC,CAAC;QAED,oHAAoH;QAEpH,qEAAqE;QACrE,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC,MAAM,CAAC;YACrC,IAAI,CAAC,WAAW,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,WAAW,IAAI,EAAE,EAAE,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC;QACtF,eAAe,CAAC,IAAI,CAAC,IAAK,EAAE,IAAI,CAAC,WAAY,EAAE,OAAO,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;IACzE,CAAC;IAED,MAAM;QACF,uEAAuE;QACvE,OAAO,IAAI,CAAA,EAAE,CAAC;IAClB,CAAC;CACJ,CAAA;AA7CG;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;2CACA;AAG3B;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;kDACO;AAGlC;IADC,QAAQ,EAAE;;6CACgB;AARlB,aAAa;IADzB,aAAa,CAAC,SAAS,CAAC;GACZ,aAAa,CA+CzB"}

package/src/qbo-api.ts

@@ -0,0 +1,54 @@
+import { LitElement, html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { registerRestApi } from './RestApiService.js';
+
+@customElement('qbo-api')
+export class QboApiElement extends LitElement {
+    @property({ type: String })
+    name: string | null = null;
+
+    @property({ type: String })
+    apiEndpoint: string | null = null;
+
+    @property()
+    method: string | undefined;
+
+    connectedCallback() {
+        super.connectedCallback();
+
+        const headers: HeadersInit = {};
+
+        if (this.name == null)
+            console.error('qbo-api name is required.');
+        if (this.apiEndpoint == null)
+            console.error('qbo-api apiEndpoint is required.');
+
+        const headerElements = this.querySelectorAll('header');
+        headerElements.forEach(header => {
+            const name = header.getAttribute('name');
+            const value = header.textContent;
+            if (name && value) {
+                headers[name] = value;
+            }
+        });
+
+        // Adjust for correct header naming convention, if necessary
+        if (headers['ContentType']) {
+            headers['Content-Type'] = headers['ContentType'];
+            delete headers['ContentType'];
+        }
+
+        // container.registerInstance<IApiService>(this.name!, new RestApiService(this.apiEndpoint!, headers, this.method));
+
+        // Call the registerRestApi function with the extracted configuration
+        if (!this.apiEndpoint?.startsWith("http"))
+            this.apiEndpoint = new URL(this.apiEndpoint ?? '', document.location.origin).href;
+        registerRestApi(this.name!, this.apiEndpoint!, headers, this.method);
+    }
+
+    render() {
+        // Render nothing, as this component is for configuration purposes only
+        return html``;
+    }
+}
+