xmlui 0.7.13 → 0.7.15

package/dist/scripts/src/components-core/RestApiProxy.js

@@ -0,0 +1,354 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const lodash_es_1 = require("lodash-es");
+const extractParam_1 = require("@components-core/utils/extractParam");
+const misc_1 = require("@components-core/utils/misc");
+const EngineError_1 = require("@components-core/EngineError");
+const process_statement_sync_1 = require("@components-core/script-runner/process-statement-sync");
+function isAxiosResponse(response) {
+    return "data" in response;
+}
+function parseResponseJson(response) {
+    return __awaiter(this, void 0, void 0, function* () {
+        let resp;
+        if (isAxiosResponse(response)) {
+            resp = response.data;
+        }
+        else {
+            try {
+                resp = yield response.clone().json();
+            }
+            catch (e) {
+                try {
+                    resp = yield response.clone().text();
+                }
+                catch (e) {
+                    console.error("Failed to parse response as text or JSON", response.body);
+                }
+            }
+        }
+        return resp;
+    });
+}
+//TODO illesg unit test.....
+function appendFormFieldValue({ key, value }, formData, prevKey = key) {
+    if (value === undefined || value === null) {
+        return;
+    }
+    if (value instanceof File || value instanceof Blob) {
+        formData.append(key, value);
+        return;
+    }
+    if (Array.isArray(value)) {
+        value.forEach((val) => {
+            appendFormFieldValue({ key, value: val }, formData, prevKey);
+        });
+    }
+    else if ((0, lodash_es_1.isPlainObject)(value)) {
+        Object.entries(value).forEach(([objKey, objVal]) => {
+            const concatenatedObjectKey = `${prevKey}.${objKey}`;
+            appendFormFieldValue({
+                key: concatenatedObjectKey,
+                value: objVal,
+            }, formData, concatenatedObjectKey);
+        });
+    }
+    else {
+        formData.append(key, value.toString());
+    }
+}
+class RestApiProxy {
+    constructor(appContext) {
+        var _a;
+        this.execute = (_a) => __awaiter(this, [_a], void 0, function* ({ abortSignal, operation, params, parseOptions, resolveBindingExpressions = false, transactionId = (0, misc_1.randomUUID)(), onProgress, }) {
+            return yield this.executeOperation({
+                operation,
+                abortSignal,
+                contextParams: params,
+                resolveBindingExpressions,
+                parseResponse: (parseOptions === null || parseOptions === void 0 ? void 0 : parseOptions.asFile)
+                    ? (response) => __awaiter(this, void 0, void 0, function* () {
+                        var _a;
+                        //we can't access content-disposition header if it's a CORS request: The suggested workaround was adding Access-Control-Expose-Headers:Content-Disposition to the response header on the server.
+                        // more info here: https://github.com/matthew-andrews/isomorphic-fetch/issues/67
+                        let fileName = operation.fileName || "unknown";
+                        if (response.headers && response.headers.get && typeof response.headers.get === "function") {
+                            const contentDisposition = (_a = response.headers.get("Content-Disposition")) === null || _a === void 0 ? void 0 : _a.toString();
+                            if (contentDisposition) {
+                                const fileNameMatch = contentDisposition.match(/filename="(.+)"/);
+                                if (fileNameMatch && fileNameMatch.length === 2)
+                                    fileName = fileNameMatch[1];
+                            }
+                        }
+                        return isAxiosResponse(response) ? response.data : new File([yield response.clone().blob()], fileName);
+                    })
+                    : undefined,
+                transactionId,
+                onUploadProgress: onProgress,
+            });
+        });
+        this.upload = (_a) => __awaiter(this, [_a], void 0, function* ({ operation, params = {}, chunk, onUploadProgress, abortSignal, transactionId = (0, misc_1.randomUUID)(), resolveBindingExpressions = false, }) {
+            const { file, asForm, formParams } = this.extractParam(resolveBindingExpressions, operation, params);
+            const uploadParams = {
+                chunkStart: chunk === null || chunk === void 0 ? void 0 : chunk.chunkStart,
+                chunkEnd: chunk ? (chunk === null || chunk === void 0 ? void 0 : chunk.chunkEnd) - 1 : undefined,
+                chunkLength: chunk ? (chunk === null || chunk === void 0 ? void 0 : chunk.chunkEnd) - (chunk === null || chunk === void 0 ? void 0 : chunk.chunkStart) : undefined,
+                fileSize: file.size,
+                urlSafeName: encodeURIComponent(file.name),
+                fileName: file.name,
+            };
+            const contextParams = Object.assign(Object.assign({}, params), { $uploadParams: uploadParams });
+            if (asForm) {
+                const data = new FormData();
+                data.append(file.name, (chunk === null || chunk === void 0 ? void 0 : chunk.blob) || file);
+                if (formParams) {
+                    Object.entries(this.extractParam(resolveBindingExpressions, formParams, params)).forEach(([key, value]) => {
+                        data.append(key, value);
+                    });
+                }
+                return yield this.executeOperation({
+                    operation,
+                    contextParams,
+                    resolveBindingExpressions,
+                    rawBody: data,
+                    headers: Object.assign(Object.assign({}, this.extractParam(resolveBindingExpressions, operation.headers || {}, contextParams)), { 
+                        // https://muffinman.io/blog/uploading-files-using-fetch-multipart-form-data/
+                        // the browser sets the content-type in this case
+                        "Content-Type": undefined }),
+                    onUploadProgress,
+                    abortSignal,
+                    transactionId,
+                });
+            }
+            return new Promise((resolve, reject) => {
+                const reader = new FileReader();
+                reader.readAsArrayBuffer((chunk === null || chunk === void 0 ? void 0 : chunk.blob) || file);
+                reader.onload = (evt) => __awaiter(this, void 0, void 0, function* () {
+                    try {
+                        if (evt.target === null) {
+                            reject();
+                            return;
+                        }
+                        resolve(yield this.executeOperation({
+                            operation,
+                            contextParams,
+                            resolveBindingExpressions,
+                            rawBody: evt.target.result,
+                            headers: Object.assign(Object.assign({}, this.extractParam(resolveBindingExpressions, operation.headers || {}, contextParams)), { "Content-Type": file.type }),
+                            onUploadProgress,
+                            abortSignal,
+                            transactionId,
+                        }));
+                    }
+                    catch (e) {
+                        reject(e);
+                    }
+                });
+                reader.onerror = () => {
+                    reject();
+                };
+            });
+        });
+        this.resolveUrl = ({ operation, params = {}, resolveBindingExpressions = false, }) => {
+            return this.generateFullApiUrl(this.extractParam(resolveBindingExpressions, operation.url, params), this.extractParam(resolveBindingExpressions, operation.queryParams, params));
+        };
+        this.extractParam = (resolveAsBindingExpression, value, params = {}, strict) => {
+            var _a, _b;
+            const localContext = Object.assign({ $adapterConfig: this.config }, params);
+            if (resolveAsBindingExpression) {
+                return (0, extractParam_1.extractParam)(localContext, value, this.appContext, strict);
+            }
+            if (value === null || value === void 0 ? void 0 : value._ARROW_EXPR_) {
+                //TODO illesg review, this whole processstatement is because of the chunked uploads (headers as function)
+                const evalContext = {
+                    eventArgs: [localContext],
+                };
+                try {
+                    const arrowStmt = {
+                        type: "ArrowS",
+                        expression: value,
+                    };
+                    (0, process_statement_sync_1.processStatementQueue)([arrowStmt], evalContext);
+                    if ((_b = (_a = evalContext.mainThread) === null || _a === void 0 ? void 0 : _a.blocks) === null || _b === void 0 ? void 0 : _b.length) {
+                        return evalContext.mainThread.blocks[evalContext.mainThread.blocks.length - 1].returnValue;
+                    }
+                    return undefined;
+                }
+                catch (e) {
+                    console.error(e);
+                    return undefined;
+                }
+            }
+            return value;
+        };
+        this.executeOperation = (_a) => __awaiter(this, [_a], void 0, function* ({ operation, contextParams, abortSignal, resolveBindingExpressions, relativePath = this.extractParam(resolveBindingExpressions, operation.url, contextParams), method = this.extractParam(resolveBindingExpressions, operation.method, contextParams), queryParams = this.extractParam(resolveBindingExpressions, operation.queryParams, contextParams), body = this.extractParam(resolveBindingExpressions, operation.body, contextParams, true), rawBody = this.extractParam(resolveBindingExpressions, operation.rawBody, contextParams), headers = this.extractParam(resolveBindingExpressions, operation.headers, contextParams), payloadType = this.extractParam(resolveBindingExpressions, operation.payloadType, contextParams) || "json", onUploadProgress, parseResponse = this.tryParseResponse, transactionId, }) {
+            const includeClientTxId = method && method !== "get" && !!transactionId;
+            const headersWithoutContentType = Object.assign(Object.assign({}, this.getHeaders()), { ["Content-Type"]: undefined });
+            const aggregatedHeaders = (0, lodash_es_1.omitBy)(Object.assign(Object.assign({}, (body ? this.getHeaders() : headersWithoutContentType)), headers), lodash_es_1.isUndefined);
+            if (includeClientTxId) {
+                aggregatedHeaders["x-ue-client-tx-id"] = transactionId;
+            }
+            let requestBody;
+            if (rawBody) {
+                requestBody = rawBody;
+            }
+            else {
+                if (payloadType === "multipart-form" || payloadType === "form") {
+                    const formData = new FormData();
+                    Object.entries(body).forEach(([key, value]) => {
+                        appendFormFieldValue({ key, value }, formData);
+                    });
+                    if (payloadType === "multipart-form") {
+                        requestBody = formData;
+                        // https://muffinman.io/blog/uploading-files-using-fetch-multipart-form-data/
+                        // the browser sets the content-type in this case
+                        delete aggregatedHeaders["Content-Type"];
+                    }
+                    else {
+                        requestBody = new URLSearchParams(formData).toString();
+                        aggregatedHeaders["Content-Type"] = "application/x-www-form-urlencoded";
+                    }
+                }
+                else {
+                    requestBody = body ? JSON.stringify(body) : undefined;
+                }
+            }
+            const options = {
+                method: method,
+                headers: aggregatedHeaders,
+                signal: abortSignal,
+                body: requestBody,
+            };
+            if (onUploadProgress) {
+                console.log("Falling back to axios. Reason: onUploadProgress specified");
+                const axios = (yield Promise.resolve().then(() => __importStar(require("axios")))).default;
+                try {
+                    const response = yield axios.request({
+                        url: this.generateFullApiUrl(relativePath, queryParams),
+                        method: options.method,
+                        headers: aggregatedHeaders,
+                        data: options.body,
+                        onUploadProgress,
+                    });
+                    return yield parseResponse(response);
+                }
+                catch (error) {
+                    if (axios.isAxiosError(error) && error.response) {
+                        throw yield this.raiseError(error.response);
+                    }
+                    else {
+                        throw error;
+                    }
+                }
+            }
+            else {
+                const response = yield fetch(this.generateFullApiUrl(relativePath, queryParams), options);
+                if (!response.clone().ok) {
+                    throw yield this.raiseError(response);
+                }
+                return yield parseResponse(response.clone());
+            }
+        });
+        this.tryParseResponse = (response) => __awaiter(this, void 0, void 0, function* () {
+            return yield parseResponseJson(response);
+        });
+        this.raiseError = (response) => __awaiter(this, void 0, void 0, function* () {
+            if ("config" in response) {
+                //poor man's axios response type guard
+                try {
+                    return new EngineError_1.GenericBackendError(this.config.errorResponseTransform
+                        ? this.extractParam(true, this.config.errorResponseTransform, { $response: response.data })
+                        : response.data, response.status);
+                }
+                catch (_a) { }
+            }
+            else {
+                try {
+                    const respObject = yield response.json();
+                    return new EngineError_1.GenericBackendError(this.config.errorResponseTransform
+                        ? this.extractParam(true, this.config.errorResponseTransform, { $response: respObject })
+                        : respObject, response.status);
+                }
+                catch (_b) { }
+            }
+            return new Error(`[!] Server responded with an error: ${response.status} - ${response.statusText}`);
+        });
+        this.getHeaders = () => {
+            var _a;
+            return Object.assign({ ["Content-Type"]: "application/json; charset=UTF-8" }, ((_a = this.config.headers) !== null && _a !== void 0 ? _a : {}));
+        };
+        const conf = (appContext === null || appContext === void 0 ? void 0 : appContext.appGlobals) || { apiUrl: "" };
+        const { apiUrl, errorResponseTransform } = conf;
+        this.appContext = appContext;
+        this.config = {
+            apiUrl,
+            errorResponseTransform,
+            headers: Object.assign({}, (_a = appContext === null || appContext === void 0 ? void 0 : appContext.appGlobals) === null || _a === void 0 ? void 0 : _a.headers)
+        };
+    }
+    generateFullApiUrl(relativePath, queryParams) {
+        let queryString = "";
+        if (queryParams) {
+            const params = new URLSearchParams();
+            Object.entries(queryParams).forEach(([key, value]) => {
+                if (Array.isArray(value)) {
+                    value.forEach((item) => {
+                        params.append(key, item);
+                    });
+                }
+                else if (value !== undefined) {
+                    params.append(key, value);
+                }
+            });
+            queryString = `?${params}`;
+        }
+        if (relativePath.startsWith("http://") || relativePath.startsWith("https://")) {
+            return `${relativePath}${queryString}`;
+        }
+        //TODO check if autoEncode is enabled
+        return `${this.config.apiUrl || ""}${relativePath}${queryString}`;
+    }
+}
+exports.default = RestApiProxy;

package/dist/scripts/src/components-core/ScrollContext.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ScrollContext = void 0;
+const react_1 = __importDefault(require("react"));
+/**
+ * Allows storing context information for components that support scrolling.
+ */
+exports.ScrollContext = react_1.default.createContext(null);

package/dist/scripts/src/components-core/Slot.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SlotHolder = exports.SlotMd = void 0;
+const ComponentDefs_1 = require("@abstractions/ComponentDefs");
+const renderers_1 = require("@components-core/renderers");
+const COMP = "Slot";
+exports.SlotMd = (0, ComponentDefs_1.createMetadata)({
+    status: "experimental",
+    description: "Placeholder in a reusable component. " +
+        "Signs the slot where the component's injected children should be rendered.",
+    props: {
+        name: (0, ComponentDefs_1.d)(`This optional property defines the name of the slot.`),
+    },
+    allowArbitraryProps: true,
+    opaque: true
+});
+exports.SlotHolder = (0, renderers_1.createPropHolderComponent)(COMP, exports.SlotMd);