xmlui 0.10.7 → 0.10.8

package/dist/scripts/package.json

@@ -1,6 +1,6 @@
 {
     "name": "xmlui",
-    "version": "0.10.7",
+    "version": "0.10.8",
     "sideEffects": false,
     "scripts": {
         "start-test-bed": "cd src/testing/infrastructure && xmlui start",

package/dist/scripts/src/components/ComponentProvider.js

@@ -81,6 +81,7 @@ const DataLoader_1 = require("../components-core/loader/DataLoader");
 const DatePicker_1 = require("./DatePicker/DatePicker");
 const DateInput_1 = require("./DateInput/DateInput");
 const TimeInput_1 = require("./TimeInput/TimeInput");
+const Timer_1 = require("./Timer/Timer");
 const Redirect_1 = require("./Redirect/Redirect");
 const Tabs_1 = require("./Tabs/Tabs");
 const Bookmark_1 = require("./Bookmark/Bookmark");
@@ -390,6 +391,7 @@ class ComponentRegistry {
             this.registerCoreComponent(DatePicker_1.datePickerComponentRenderer);
             this.registerCoreComponent(DateInput_1.dateInputComponentRenderer);
             this.registerCoreComponent(TimeInput_1.timeInputComponentRenderer);
+            this.registerCoreComponent(Timer_1.timerComponentRenderer);
         }
         if (process.env.VITE_INCLUDE_REST_COMPONENTS !== "false") {
             //TODO, if it proves to be a working solution, make these components skippable, too

package/dist/scripts/src/components/Table/Table.js

@@ -42,22 +42,25 @@ exports.TableMd = (0, metadata_helpers_1.createMetadata)({
             description: "This property holds an array of page sizes (numbers) the user can select for " +
                 "pagination. If this property is not defined, the component allows only a page size of 10 items.",
         },
-        showPageInfo: (0, metadata_helpers_1.d)("Whether to show page information", undefined, "boolean", TableNative_1.defaultProps.showPageInfo),
-        showPageSizeSelector: (0, metadata_helpers_1.d)("Whether to show the page size selector", undefined, "boolean", TableNative_1.defaultProps.showPageSizeSelector),
-        showCurrentPage: (0, metadata_helpers_1.d)("Whether to show the current page indicator", undefined, "boolean", TableNative_1.defaultProps.showCurrentPage),
+        showPageInfo: (0, metadata_helpers_1.d)("Whether to show page information. It works the same as the [Pagination component property](./Pagination#showpageinfo).", undefined, "boolean", TableNative_1.defaultProps.showPageInfo),
+        showPageSizeSelector: (0, metadata_helpers_1.d)("Whether to show the page size selector. It works the same as the [Pagination component property](./Pagination#showpagesizeselector).", undefined, "boolean", TableNative_1.defaultProps.showPageSizeSelector),
+        showCurrentPage: (0, metadata_helpers_1.d)("Whether to show the current page indicator. It works the same as the [Pagination component property](./Pagination#showcurrentpage).", undefined, "boolean", TableNative_1.defaultProps.showCurrentPage),
         pageSizeSelectorPosition: {
-            description: "Determines where to place the page size selector in the layout.",
+            description: "Determines where to place the page size selector in the layout. " +
+                "It works the same as the [Pagination component property](./Pagination#pagesizeselectorposition).",
             options: PaginationNative_1.PositionValues,
             type: "string",
             default: TableNative_1.defaultProps.pageSizeSelectorPosition,
         },
         pageInfoPosition: {
-            description: "Determines where to place the page information in the layout.",
+            description: "Determines where to place the page information in the layout. " +
+                "It works the same as the [Pagination component property](./Pagination#pageinfoposition).",
             options: PaginationNative_1.PositionValues,
             type: "string",
             default: TableNative_1.defaultProps.pageInfoPosition,
         },
-        buttonRowPosition: (0, metadata_helpers_1.d)("Determines where to place the pagination button row in the layout.", PaginationNative_1.PositionValues, "string", TableNative_1.defaultProps.buttonRowPosition),
+        buttonRowPosition: (0, metadata_helpers_1.d)("Determines where to place the pagination button row in the layout. " +
+            "It works the same as the [Pagination component property](./Pagination#buttonrowposition).", PaginationNative_1.PositionValues, "string", TableNative_1.defaultProps.buttonRowPosition),
         rowDisabledPredicate: (0, metadata_helpers_1.d)(`This property defines a predicate function with a return value that determines if the ` +
             `row should be disabled. The function retrieves the item to display and should return ` +
             `a Boolean-like value.`),

package/dist/scripts/src/components/Timer/Timer.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.timerComponentRenderer = exports.TimerMd = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const renderers_1 = require("../../components-core/renderers");
+const TimerNative_1 = require("./TimerNative");
+const metadata_helpers_1 = require("../metadata-helpers");
+const COMP = "Timer";
+exports.TimerMd = (0, metadata_helpers_1.createMetadata)({
+    status: "stable",
+    description: "`Timer` is a non-visual component that fires events at regular intervals. " +
+        "It can be enabled or disabled and ensures that the timer event handler " +
+        "completes before firing the next event.",
+    props: {
+        enabled: {
+            description: "Whether the timer is enabled and should fire events.",
+            valueType: "boolean",
+            defaultValue: TimerNative_1.defaultProps.enabled,
+        },
+        interval: {
+            description: "The interval in milliseconds between timer events.",
+            valueType: "number",
+            defaultValue: TimerNative_1.defaultProps.interval,
+        },
+        initialDelay: {
+            description: "The delay in milliseconds before the first timer event.",
+            valueType: "number",
+            defaultValue: TimerNative_1.defaultProps.initialDelay,
+        },
+        once: {
+            description: "Whether the timer should stop after firing its first tick event.",
+            valueType: "boolean",
+            defaultValue: TimerNative_1.defaultProps.once,
+        },
+    },
+    events: {
+        tick: {
+            description: "This event is triggered at each interval when the ${COMP} is enabled.",
+        },
+    },
+    apis: {
+        pause: {
+            description: "Pauses the timer. The timer can be resumed later from where it left off.",
+            signature: "pause()",
+        },
+        resume: {
+            description: "Resumes a paused timer. If the timer is not paused, this method has no effect.",
+            signature: "resume()",
+        },
+        isPaused: {
+            description: "Returns whether the timer is currently paused.",
+            signature: "isPaused(): boolean",
+        },
+        isRunning: {
+            description: "Returns whether the timer is currently running (enabled and not paused).",
+            signature: "isRunning(): boolean",
+        },
+    },
+});
+exports.timerComponentRenderer = (0, renderers_1.createComponentRenderer)(COMP, exports.TimerMd, ({ node, extractValue, lookupEventHandler, registerComponentApi }) => {
+    return ((0, jsx_runtime_1.jsx)(TimerNative_1.Timer, { enabled: extractValue.asOptionalBoolean(node.props.enabled), interval: extractValue.asOptionalNumber(node.props.interval), initialDelay: extractValue.asOptionalNumber(node.props.initialDelay), once: extractValue.asOptionalBoolean(node.props.once), onTick: lookupEventHandler("tick"), registerComponentApi: registerComponentApi }));
+});

package/dist/scripts/src/components/Timer/TimerNative.js

@@ -0,0 +1,179 @@
+"use strict";
+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());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Timer = exports.defaultProps = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+exports.defaultProps = {
+    enabled: true,
+    interval: 1000,
+    once: false,
+    initialDelay: 0,
+};
+exports.Timer = (0, react_1.forwardRef)(function Timer(_a, forwardedRef) {
+    var { enabled = exports.defaultProps.enabled, interval = exports.defaultProps.interval, once = exports.defaultProps.once, initialDelay = exports.defaultProps.initialDelay, onTick, registerComponentApi, style, className } = _a, rest = __rest(_a, ["enabled", "interval", "once", "initialDelay", "onTick", "registerComponentApi", "style", "className"]);
+    const [isPaused, setIsPaused] = (0, react_1.useState)(false);
+    const [hasExecutedOnce, setHasExecutedOnce] = (0, react_1.useState)(false);
+    const [hasEverStarted, setHasEverStarted] = (0, react_1.useState)(false);
+    const intervalRef = (0, react_1.useRef)(null);
+    const initialDelayRef = (0, react_1.useRef)(null);
+    const handlerRunningRef = (0, react_1.useRef)(false);
+    // Refs for current values to ensure handleTick has stable dependencies
+    const enabledRef = (0, react_1.useRef)(enabled);
+    const isPausedRef = (0, react_1.useRef)(isPaused);
+    const intervalRef2 = (0, react_1.useRef)(interval);
+    const onTickRef = (0, react_1.useRef)(onTick);
+    const onceRef = (0, react_1.useRef)(once);
+    const hasExecutedOnceRef = (0, react_1.useRef)(hasExecutedOnce);
+    const hasEverStartedRef = (0, react_1.useRef)(hasEverStarted);
+    // Update refs when values change
+    enabledRef.current = enabled;
+    isPausedRef.current = isPaused;
+    intervalRef2.current = interval;
+    onTickRef.current = onTick;
+    onceRef.current = once;
+    hasExecutedOnceRef.current = hasExecutedOnce;
+    hasEverStartedRef.current = hasEverStarted;
+    // Derived state
+    const isRunning = enabled && !isPaused && (intervalRef.current !== null || initialDelayRef.current !== null);
+    const isInInitialDelay = initialDelayRef.current !== null;
+    // Timer API methods
+    const pause = (0, react_1.useCallback)(() => {
+        // Pause if timer is enabled and currently running (not already paused)
+        if (enabled && !isPaused) {
+            setIsPaused(true);
+            if (intervalRef.current) {
+                clearInterval(intervalRef.current);
+                intervalRef.current = null;
+            }
+            if (initialDelayRef.current) {
+                clearTimeout(initialDelayRef.current);
+                initialDelayRef.current = null;
+            }
+        }
+    }, [enabled, isPaused]);
+    const resume = (0, react_1.useCallback)(() => {
+        // Resume if timer is enabled and currently paused
+        if (enabled && isPaused) {
+            setIsPaused(false);
+            // The useEffect will handle restarting the timer
+        }
+    }, [enabled, isPaused]);
+    // Create API object once
+    const timerApi = (0, react_1.useMemo)(() => ({
+        pause,
+        resume,
+        isPaused: () => isPaused,
+        isRunning: () => isRunning && !isPaused,
+    }), [pause, resume, isPaused, isRunning]);
+    // Register both APIs together
+    (0, react_1.useImperativeHandle)(forwardedRef, () => timerApi, [timerApi]);
+    (0, react_1.useEffect)(() => {
+        if (registerComponentApi) {
+            registerComponentApi(timerApi);
+        }
+    }, [registerComponentApi, timerApi]);
+    const handleTick = (0, react_1.useCallback)(() => __awaiter(this, void 0, void 0, function* () {
+        // Check if timer should still be running (enabled, not paused, valid interval)
+        if (!enabledRef.current || isPausedRef.current || intervalRef2.current <= 0) {
+            return;
+        }
+        // Prevent re-firing if the previous event hasn't completed yet
+        if (handlerRunningRef.current) {
+            return;
+        }
+        if (onTickRef.current) {
+            handlerRunningRef.current = true;
+            try {
+                yield onTickRef.current();
+                // Mark that the timer has actually started executing (for initial delay logic)
+                if (!hasEverStartedRef.current) {
+                    setHasEverStarted(true);
+                }
+                // If this is a "once" timer and it's the very first execution, mark it as executed
+                // After the first execution, the timer becomes a regular timer that can be paused/resumed
+                if (onceRef.current && !hasExecutedOnceRef.current) {
+                    setHasExecutedOnce(true);
+                }
+            }
+            finally {
+                handlerRunningRef.current = false;
+            }
+        }
+    }), []);
+    (0, react_1.useEffect)(() => {
+        // Clear any existing timers first
+        if (intervalRef.current) {
+            clearInterval(intervalRef.current);
+            intervalRef.current = null;
+        }
+        if (initialDelayRef.current) {
+            clearTimeout(initialDelayRef.current);
+            initialDelayRef.current = null;
+        }
+        // If "once" is true and the timer has already executed, don't start the timer
+        if (once && hasExecutedOnce) {
+            return;
+        }
+        if (enabled && !isPaused && interval > 0) {
+            // Helper to start the actual timer
+            const startTicking = () => {
+                intervalRef.current = (once && !hasExecutedOnce)
+                    ? setTimeout(handleTick, interval)
+                    : setInterval(handleTick, interval);
+            };
+            // Only apply initial delay if timer has never been started before
+            if (initialDelay > 0 && !hasEverStarted) {
+                initialDelayRef.current = setTimeout(() => {
+                    initialDelayRef.current = null;
+                    startTicking();
+                }, initialDelay);
+            }
+            else {
+                startTicking();
+            }
+        }
+        return () => {
+            if (intervalRef.current) {
+                clearInterval(intervalRef.current);
+                intervalRef.current = null;
+            }
+            if (initialDelayRef.current) {
+                clearTimeout(initialDelayRef.current);
+                initialDelayRef.current = null;
+            }
+        };
+    }, [enabled, interval, once, hasExecutedOnce, isPaused, initialDelay, hasEverStarted]);
+    // Reset state when enabled changes
+    (0, react_1.useEffect)(() => {
+        if (enabled && once) {
+            // Reset hasExecutedOnce when enabled changes from false to true for "once" timers
+            setHasExecutedOnce(false);
+        }
+        if (!enabled) {
+            // Reset pause state when timer is disabled
+            setIsPaused(false);
+        }
+    }, [enabled, once]);
+    // Timer is a non-visual component
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: forwardedRef, style: Object.assign({ display: "none" }, style), className: className, "data-timer-enabled": enabled, "data-timer-interval": interval, "data-timer-initial-delay": initialDelay, "data-timer-once": once, "data-timer-running": isRunning, "data-timer-paused": isPaused, "data-timer-in-initial-delay": isInInitialDelay, "data-timer-has-executed": hasExecutedOnce }, rest)));
+});

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

@@ -56,11 +56,12 @@ const ComponentDecorator = (0, react_1.forwardRef)((props, forwardedRef) => {
         }
         if (node) {
             Object.entries(shallowAttrs).forEach(([key, value]) => {
+                var _a, _b;
                 if (value !== undefined) {
-                    node.setAttribute(key, value);
+                    (_a = node.setAttribute) === null || _a === void 0 ? void 0 : _a.call(node, key, value);
                 }
                 else {
-                    node.removeAttribute(key);
+                    (_b = node.removeAttribute) === null || _b === void 0 ? void 0 : _b.call(node, key);
                 }
             });
         }

package/dist/scripts/src/components-core/interception/Backend.js

@@ -106,7 +106,14 @@ class Backend {
                 localContext: localContext,
                 eventArgs: args,
                 appContext: Object.assign(Object.assign(Object.assign({}, date_functions_1.dateFunctions), misc_utils_1.miscellaneousUtils), { delay: misc_1.delay,
-                    Errors: Errors_1.default, createFile: (...args) => new File(args[0], args[1], args[2]), getDate: date_utils_1.getDate }),
+                    Errors: Errors_1.default, createFile: (...args) => new File(args[0], args[1], args[2]), appendBlob: (blob1, blob2) => {
+                        if (!blob1 && !blob2)
+                            return;
+                        const newBlob = new Blob([blob1, blob2], {
+                            type: (blob1 === null || blob1 === void 0 ? void 0 : blob1.type) || (blob2 === null || blob2 === void 0 ? void 0 : blob2.type) || "application/octet-stream",
+                        });
+                        return newBlob;
+                    }, getDate: date_utils_1.getDate }),
             });
             yield (0, statementUtils_1.runEventHandlerCode)(src, evalContext);
             return ((_g = (_f = evalContext.mainThread) === null || _f === void 0 ? void 0 : _f.blocks) === null || _g === void 0 ? void 0 : _g.length)