xmlui 0.9.6 → 0.9.8

package/dist/{apiInterceptorWorker-BPCEQ5nI.mjs → apiInterceptorWorker-DOyaK_s_.mjs}

@@ -12,7 +12,7 @@ var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "acce
 var _executor, _DeferredPromise_instances, decorate_fn, _a2;
 import { delay as delay$1, HttpResponse, http } from "msw";
 import { isArray, isObject as isObject$1, mapValues } from "lodash-es";
-import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-B18vblD8.mjs";
+import { r as runEventHandlerCode, g as getDate, d as delay, m as miscellaneousUtils, a as dateFunctions, o as orderBy, T as ThrowStatementError } from "./index-CUYSE1U7.mjs";
 import Dexie from "dexie";
 var POSITIONALS_EXP = /(%?)(%([sdijo]))/g;
 function serializePositional(positional, flag) {

package/dist/{index-B18vblD8.mjs → index-CUYSE1U7.mjs}

@@ -7,7 +7,7 @@ import { useQuery, useInfiniteQuery, QueryClientProvider, QueryClient } from "@t
 import produce, { createDraft, finishDraft, enableMapSet } from "immer";
 import { throttle, get, isNil, omitBy, isUndefined, noop as noop$2, isPlainObject, isEqual, union, uniq, orderBy as orderBy$1, isEmpty, isObject, isArray, groupBy, sortBy, omit, isNumber, isString, cloneDeep, merge, defaultTo, capitalize, unset, setWith, keyBy, pick } from "lodash-es";
 import { formatDistanceToNow, parse, format, parseISO, isValid, isTomorrow, isYesterday, isToday, isThisWeek, formatRelative, isThisYear, isSameDay, differenceInMinutes } from "date-fns";
-import { v as validationStatusMd, l as labelPositionMd, o as orientationOptionMd, a as alignmentOptionValues, L as LinkTargetMd, b as alignmentOptionMd, i as iconPositionMd, c as buttonTypesMd, s as sizeMd, d as buttonThemeMd, e as buttonVariantMd, P as Parser, T as T_CALCULATED_MEMBER_ACCESS_EXPRESSION, f as T_MEMBER_ACCESS_EXPRESSION, g as T_IDENTIFIER, h as T_PREFIX_OP_EXPRESSION, j as T_FUNCTION_DECLARATION, k as T_ARROW_EXPRESSION, m as createXmlUiTreeNodeId, n as T_EMPTY_STATEMENT, p as T_SWITCH_STATEMENT, q as T_TRY_STATEMENT, r as T_THROW_STATEMENT, t as T_FOR_OF_STATEMENT, u as T_FOR_IN_STATEMENT, w as T_FOR_STATEMENT, x as T_EXPRESSION_STATEMENT, y as T_BREAK_STATEMENT, z as T_CONTINUE_STATEMENT, A as T_DO_WHILE_STATEMENT, B as T_WHILE_STATEMENT, C as T_RETURN_STATEMENT, D as T_IF_STATEMENT, E as T_CONST_STATEMENT, F as T_LET_STATEMENT, G as T_ARROW_EXPRESSION_STATEMENT, H as T_BLOCK_STATEMENT, I as T_VAR_STATEMENT, J as T_ASSIGNMENT_EXPRESSION, K as T_LITERAL, M as T_SPREAD_EXPRESSION, N as T_FUNCTION_INVOCATION_EXPRESSION, O as T_POSTFIX_OP_EXPRESSION, Q as T_CONDITIONAL_EXPRESSION, R as T_BINARY_EXPRESSION, S as T_UNARY_EXPRESSION, U as T_OBJECT_LITERAL, V as T_ARRAY_LITERAL, W as T_SEQUENCE_EXPRESSION, X as T_TEMPLATE_LITERAL_EXPRESSION, Y as T_VAR_DECLARATION, Z as T_DESTRUCTURE, _ as TextVariantElement, $ as VariantPropsKeys, a0 as variantOptionsMd, a1 as scrollAnchoringValues, a2 as buttonThemeNames, a3 as iconPositionNames, a4 as buttonVariantNames, a5 as nodeToComponentDef, a6 as triggerPositionNames, a7 as statusColorMd, a8 as placementMd, a9 as httpMethodNames, aa as PARSED_MARK_PROP, ab as layoutOptionKeys, ac as viewportSizeNames, ad as componentFileExtension, ae as codeBehindFileExtension, af as getLintSeverity, ag as LintSeverity, ah as lintApp, ai as printComponentLints, aj as lintErrorsComponent, ak as collectCodeBehindFromSource, al as removeCodeBehindTokensFromTree } from "./lint-gX2osbkz.mjs";
+import { v as validationStatusMd, l as labelPositionMd, o as orientationOptionMd, a as alignmentOptionValues, L as LinkTargetMd, b as alignmentOptionMd, i as iconPositionMd, c as buttonTypesMd, s as sizeMd, d as buttonThemeMd, e as buttonVariantMd, P as Parser, T as T_CALCULATED_MEMBER_ACCESS_EXPRESSION, f as T_MEMBER_ACCESS_EXPRESSION, g as T_IDENTIFIER, h as T_PREFIX_OP_EXPRESSION, j as T_FUNCTION_DECLARATION, k as T_ARROW_EXPRESSION, m as createXmlUiTreeNodeId, n as T_EMPTY_STATEMENT, p as T_SWITCH_STATEMENT, q as T_TRY_STATEMENT, r as T_THROW_STATEMENT, t as T_FOR_OF_STATEMENT, u as T_FOR_IN_STATEMENT, w as T_FOR_STATEMENT, x as T_EXPRESSION_STATEMENT, y as T_BREAK_STATEMENT, z as T_CONTINUE_STATEMENT, A as T_DO_WHILE_STATEMENT, B as T_WHILE_STATEMENT, C as T_RETURN_STATEMENT, D as T_IF_STATEMENT, E as T_CONST_STATEMENT, F as T_LET_STATEMENT, G as T_ARROW_EXPRESSION_STATEMENT, H as T_BLOCK_STATEMENT, I as T_VAR_STATEMENT, J as T_ASSIGNMENT_EXPRESSION, K as T_LITERAL, M as T_SPREAD_EXPRESSION, N as T_FUNCTION_INVOCATION_EXPRESSION, O as T_POSTFIX_OP_EXPRESSION, Q as T_CONDITIONAL_EXPRESSION, R as T_BINARY_EXPRESSION, S as T_UNARY_EXPRESSION, U as T_OBJECT_LITERAL, V as T_ARRAY_LITERAL, W as T_SEQUENCE_EXPRESSION, X as T_TEMPLATE_LITERAL_EXPRESSION, Y as T_VAR_DECLARATION, Z as T_DESTRUCTURE, _ as TextVariantElement, $ as VariantPropsKeys, a0 as variantOptionsMd, a1 as scrollAnchoringValues, a2 as buttonThemeNames, a3 as iconPositionNames, a4 as buttonVariantNames, a5 as nodeToComponentDef, a6 as triggerPositionNames, a7 as statusColorMd, a8 as placementMd, a9 as httpMethodNames, aa as PARSED_MARK_PROP, ab as layoutOptionKeys, ac as viewportSizeNames, ad as componentFileExtension, ae as codeBehindFileExtension, af as getLintSeverity, ag as LintSeverity, ah as lintApp, ai as printComponentLints, aj as lintErrorsComponent, ak as collectCodeBehindFromSource, al as removeCodeBehindTokensFromTree } from "./lint-B9tKGcOX.mjs";
 import classnames from "classnames";
 import Color from "color";
 import TextareaAutosize from "react-textarea-autosize";
@@ -24487,7 +24487,8 @@ function Theme({
   tone,
   toastDuration = 5e3,
   themeVars: themeVars2 = EMPTY_OBJECT,
-  layoutContext
+  layoutContext,
+  children
 }) {
   const generatedId2 = useId();
   const { themes, resources, resourceMap, activeThemeId, setRoot, root: root2 } = useThemes();
@@ -24594,7 +24595,10 @@ function Theme({
             }
           },
           children: [
-            /* @__PURE__ */ jsx(ErrorBoundary, { node, location: "theme-root", children: renderChild2(node.children) }),
+            /* @__PURE__ */ jsxs(ErrorBoundary, { node, location: "theme-root", children: [
+              renderChild2(node.children),
+              children
+            ] }),
             /* @__PURE__ */ jsx(NotificationToast, { toastDuration })
           ]
         }
@@ -31671,7 +31675,7 @@ function IconProvider({ children }) {
     /* @__PURE__ */ jsx("svg", { style: { display: "none" }, ref: spriteRootRef })
   ] });
 }
-const version = "0.9.6";
+const version = "0.9.8";
 const ApiInterceptorContext = createContext(null);
 function useApiInterceptorContext() {
   return useContext(ApiInterceptorContext);
@@ -33433,7 +33437,8 @@ const Container = memo(
     parentRenderContext,
     memoedVarsRef,
     isImplicit,
-    uidInfoRef: parentUidInfoRef
+    uidInfoRef: parentUidInfoRef,
+    children
   }, ref) {
     var _a;
     const { apiBoundContainer } = node;
@@ -33522,6 +33527,15 @@ const Container = memo(
               );
             }
             statements = parsedStatementsRef.current[source];
+          } else if (isParsedEventValue(source)) {
+            const parseId = source.parseId.toString();
+            if (!parsedStatementsRef.current[parseId]) {
+              parsedStatementsRef.current[parseId] = prepareHandlerStatements(
+                source.statements,
+                evalContext
+              );
+            }
+            statements = parsedStatementsRef.current[parseId];
           } else {
             statements = [
               {
@@ -33639,23 +33653,44 @@ const Container = memo(
     );
     const getOrCreateEventHandlerFn = useEvent(
       (src, uid, options2) => {
-        var _a2;
+        var _a2, _b;
         if (Array.isArray(src)) {
           throw new Error("Multiple event handlers are not supported");
         }
-        const stringSrc = typeof src === "string" ? src : src.statement.nodeId;
-        const fnCacheKey = `${options2 == null ? void 0 : options2.eventName};${stringSrc}`;
-        const handler = (...eventArgs) => {
-          return runCodeAsync(src, uid, options2, ...cloneDeep(eventArgs));
-        };
-        if (options2 == null ? void 0 : options2.ephemeral) {
-          return handler;
+        if (typeof src === "string") {
+          const fnCacheKey = `${options2 == null ? void 0 : options2.eventName};${src}`;
+          const handler = (...eventArgs) => {
+            return runCodeAsync(src, uid, options2, ...cloneDeep(eventArgs));
+          };
+          if (options2 == null ? void 0 : options2.ephemeral) {
+            return handler;
+          }
+          if (!((_a2 = fnsRef.current[uid]) == null ? void 0 : _a2[fnCacheKey])) {
+            fnsRef.current[uid] = fnsRef.current[uid] || {};
+            fnsRef.current[uid][fnCacheKey] = handler;
+          }
+          return fnsRef.current[uid][fnCacheKey];
         }
-        if (!((_a2 = fnsRef.current[uid]) == null ? void 0 : _a2[fnCacheKey])) {
-          fnsRef.current[uid] = fnsRef.current[uid] || {};
-          fnsRef.current[uid][fnCacheKey] = handler;
+        if (isParsedEventValue(src)) {
+          return (...eventArgs) => {
+            return runCodeAsync(src, uid, options2, ...cloneDeep(eventArgs));
+          };
         }
-        return fnsRef.current[uid][fnCacheKey];
+        if (isArrowExpression(src)) {
+          const fnCacheKey = `${options2 == null ? void 0 : options2.eventName};${src.statement.nodeId}`;
+          const handler = (...eventArgs) => {
+            return runCodeAsync(src, uid, options2, ...cloneDeep(eventArgs));
+          };
+          if (options2 == null ? void 0 : options2.ephemeral) {
+            return handler;
+          }
+          if (!((_b = fnsRef.current[uid]) == null ? void 0 : _b[fnCacheKey])) {
+            fnsRef.current[uid] = fnsRef.current[uid] || {};
+            fnsRef.current[uid][fnCacheKey] = handler;
+          }
+          return fnsRef.current[uid][fnCacheKey];
+        }
+        throw new Error("Invalid event handler");
       }
     );
     const getOrCreateSyncCallbackFn = useCallback(
@@ -33752,12 +33787,12 @@ const Container = memo(
         if (typeof childNode === "string") {
           throw Error("should be resolved for now");
         }
-        const children = isArray(childNode) ? childNode : [childNode];
-        if (!children || !children.length) {
+        const children2 = isArray(childNode) ? childNode : [childNode];
+        if (!children2 || !children2.length) {
           return null;
         }
-        const wrapWithFragment = children.length > 1;
-        const renderedChildren2 = children.map((child, childIndex) => {
+        const wrapWithFragment = children2.length > 1;
+        const renderedChildren2 = children2.map((child, childIndex) => {
           if (!child) {
             return void 0;
           }
@@ -33845,7 +33880,7 @@ const Container = memo(
     });
     const containerContent = /* @__PURE__ */ jsxs(Fragment, { children: [
       renderedLoaders,
-      renderedChildren
+      !!children && isValidElement(renderedChildren) ? cloneElement(renderedChildren, null, children) : renderedChildren
     ] });
     return /* @__PURE__ */ jsxs(
       Fragment$1,
@@ -33943,6 +33978,12 @@ function renderLoaders({
     );
   }
 }
+function isParsedEventValue(value) {
+  return value.__PARSED === true;
+}
+function isArrowExpression(value) {
+  return value.type === T_ARROW_EXPRESSION;
+}
 const StateContainer = memo(
   forwardRef(function StateContainer2({
     node,
@@ -33954,7 +33995,9 @@ const StateContainer = memo(
     parentRenderContext,
     layoutContextRef,
     uidInfoRef,
-    isImplicit
+    isImplicit,
+    children,
+    ...rest
   }, ref) {
     const [version2, setVersion] = useState(0);
     const routingParams = useRoutingParams();
@@ -34094,7 +34137,9 @@ const StateContainer = memo(
         memoedVarsRef: memoedVars,
         isImplicit,
         ref,
-        uidInfoRef
+        uidInfoRef,
+        ...rest,
+        children
       }
     ) });
   })
@@ -34299,7 +34344,9 @@ const ContainerWrapper = memo(
     parentDispatch,
     parentRenderContext,
     layoutContextRef,
-    uidInfoRef
+    uidInfoRef,
+    children,
+    ...rest
   }, ref) {
     const containerizedNode = useMemo(() => getWrappedWithContainer(node), [node]);
     return /* @__PURE__ */ jsx(ErrorBoundary, { node, location: "container", children: /* @__PURE__ */ jsx(
@@ -34315,7 +34362,9 @@ const ContainerWrapper = memo(
         layoutContextRef,
         uidInfoRef,
         isImplicit: node.type !== "Container" && containerizedNode.uses === void 0,
-        ref
+        ref,
+        ...rest,
+        children
       }
     ) });
   })
@@ -34679,6 +34728,7 @@ const ComponentAdapter = forwardRef(function ComponentAdapter2({
   memoedVarsRef,
   onUnmount,
   uidInfoRef,
+  children,
   ...rest
 }, ref) {
   var _a;
@@ -34730,9 +34780,9 @@ const ComponentAdapter = forwardRef(function ComponentAdapter2({
     [lookupAction, uid]
   );
   const memoedRenderChild = useCallback(
-    (children, layoutContext, pRenderContext) => {
+    (children2, layoutContext, pRenderContext) => {
       return renderChild2(
-        children,
+        children2,
         layoutContext,
         pRenderContext || parentRenderContext,
         uidInfoRef
@@ -34870,12 +34920,13 @@ const ComponentAdapter = forwardRef(function ComponentAdapter2({
     return /* @__PURE__ */ jsx(InvalidComponent, { errors: [renderingError], node: safeNode, children: renderedNode });
   }
   if ((ref || !isEmpty(mouseEventHandlers)) && renderedNode && React__default.isValidElement(renderedNode)) {
+    const childrenArray = !children ? [] : Array.isArray(children) ? children : [children];
     return cloneElement(renderedNode, {
       ref: ref ? composeRefs(ref, renderedNode.ref) : renderedNode.ref,
       ...mergeProps({ ...renderedNode.props, ...mouseEventHandlers }, rest)
-    });
+    }, ...childrenArray);
   }
-  return React__default.isValidElement(renderedNode) ? renderedNode : /* @__PURE__ */ jsx(Fragment, { children: renderedNode });
+  return React__default.isValidElement(renderedNode) && !!children ? cloneElement(renderedNode, null, children) : renderedNode;
 });
 function slotRenderer({ node, extractValue, renderChild: renderChild2, lookupAction, layoutContext }, parentRenderContext) {
   const templateName = extractValue.asOptionalString(node.props.name);
@@ -34976,6 +35027,7 @@ const ComponentWrapper = memo(
     memoedVarsRef,
     cleanup,
     uidInfoRef,
+    children,
     ...rest
   }, ref) {
     var _a;
@@ -35016,7 +35068,9 @@ const ComponentWrapper = memo(
           parentStatePartChanged: statePartChanged,
           parentRegisterComponentApi: registerComponentApi,
           uidInfoRef,
-          ref
+          ref,
+          ...rest,
+          children
         }
       );
     } else {
@@ -35037,7 +35091,8 @@ const ComponentWrapper = memo(
           layoutContextRef: stableLayoutContext,
           ref,
           uidInfoRef,
-          ...rest
+          ...rest,
+          children
         }
       );
     }
@@ -35516,10 +35571,7 @@ function AppContent({
     cleanup: noop$1,
     memoedVarsRef
   });
-  return /* @__PURE__ */ jsx(AppContext.Provider, { value: appContextValue, children: /* @__PURE__ */ jsxs(AppStateContext.Provider, { value: appStateContextValue, children: [
-    renderedRoot,
-    children
-  ] }) });
+  return /* @__PURE__ */ jsx(AppContext.Provider, { value: appContextValue, children: /* @__PURE__ */ jsx(AppStateContext.Provider, { value: appStateContextValue, children: !!children && isValidElement(renderedRoot) ? cloneElement(renderedRoot, null, children) : renderedRoot }) });
 }
 function signError(error2) {
   toast.error(typeof error2 === "string" ? error2 : error2.message || "Something went wrong");
@@ -35663,7 +35715,7 @@ function ApiInterceptorProvider({
       let interceptorWorker;
       (async () => {
         if (process.env.VITE_MOCK_ENABLED) {
-          const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-BPCEQ5nI.mjs");
+          const { createApiInterceptorWorker } = await import("./apiInterceptorWorker-DOyaK_s_.mjs");
           if (interceptor) {
             interceptorWorker = await createApiInterceptorWorker(interceptor, apiWorker);
             if (!apiWorker) {

package/dist/{lint-gX2osbkz.mjs → lint-B9tKGcOX.mjs}

@@ -1552,7 +1552,11 @@ class Parser {
         case TokenType.Function:
           return this.parseFunctionDeclaration();
         default:
-          return this.isExpressionStart(startToken) ? this.parseExpressionStatement(allowSequence) : null;
+          if (this.isExpressionStart(startToken)) {
+            return this.parseExpressionStatement(allowSequence);
+          }
+          this.reportError("W002", startToken, startToken.text);
+          return null;
       }
     } finally {
       this._statementLevel--;
@@ -3701,7 +3705,9 @@ class Parser {
     }
     this._parseErrors.push({
       code: errorCode,
-      text: errorText
+      text: errorText,
+      line: token.startLine,
+      column: token.startColumn
     });
     throw new ParserError$1(errorText, errorCode);
     function replace(input, placeholder, replacement) {
@@ -4808,8 +4814,7 @@ function parseScriptModule(moduleName, source) {
       exports,
       functions,
       statements,
-      sources: /* @__PURE__ */ new Map(),
-      executed: false
+      sources: /* @__PURE__ */ new Map()
     };
     parsedModules.set(moduleName2, parsedModule2);
     if (errors.length > 0) {
@@ -4864,7 +4869,7 @@ function collectCodeBehindFromSource(moduleName, source) {
         addFunctionDeclaration(stmt);
         break;
       default:
-        throw new Error(`'${stmt.type}' is not allowed in a code-behind module.`);
+        throw new Error(`Only reactive variable and function definitions are allowed in a code-behind module.`);
     }
   });
   return result;
@@ -4995,6 +5000,7 @@ const HelperNode = {
   item: "item",
   field: "field"
 };
+let lastParseId = 0;
 function nodeToComponentDef(node, originalGetText, fileId) {
   const getText = (node2) => {
     return node2.text ?? originalGetText(node2);
@@ -5202,7 +5208,7 @@ function nodeToComponentDef(node, originalGetText, fileId) {
             (name, value) => {
               if (!isComponent(comp)) return;
               comp.events ?? (comp.events = {});
-              comp.events[name] = value;
+              comp.events[name] = parseEvent(value);
             },
             (name) => {
               if (onPrefixRegex.test(name)) {
@@ -5311,11 +5317,11 @@ function nodeToComponentDef(node, originalGetText, fileId) {
           comp.api[name] = value;
         } else if (startSegment === "event") {
           comp.events ?? (comp.events = {});
-          comp.events[name] = value;
+          comp.events[name] = parseEvent(value);
         } else if (onPrefixRegex.test(name)) {
           comp.events ?? (comp.events = {});
           const eventName = name[2].toLowerCase() + name.substring(3);
-          comp.events[eventName] = value;
+          comp.events[eventName] = parseEvent(value);
         } else {
           comp.props ?? (comp.props = {});
           comp.props[name] = value;
@@ -5734,6 +5740,27 @@ function nodeToComponentDef(node, originalGetText, fileId) {
       }
     }
   }
+  function parseEvent(value) {
+    if (typeof value !== "string") {
+      return value;
+    }
+    const parser = new Parser(value);
+    try {
+      const statements = parser.parseStatements();
+      return {
+        __PARSED: true,
+        statements,
+        parseId: ++lastParseId,
+        // TODO: retrieve the event source code only in dev mode
+        source: value
+      };
+    } catch {
+      if (parser.errors.length > 0) {
+        const errMsg = parser.errors[0];
+        throw new ParserError2(`${errMsg.text} [${errMsg.line}: ${errMsg.column}]`, errMsg.code);
+      }
+    }
+  }
 }
 function createTextNodeCDataElement(textValue) {
   return {

package/dist/scripts/src/abstractions/scripting/Compilation.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/scripts/src/components/Theme/ThemeNative.js

@@ -31,7 +31,7 @@ function calculateHash(str) {
     }
     return hash;
 }
-function Theme({ id, isRoot = false, renderChild, node, tone, toastDuration = 5000, themeVars = constants_1.EMPTY_OBJECT, layoutContext, }) {
+function Theme({ id, isRoot = false, renderChild, node, tone, toastDuration = 5000, themeVars = constants_1.EMPTY_OBJECT, layoutContext, children }) {
     const generatedId = (0, react_1.useId)();
     const { themes, resources, resourceMap, activeThemeId, setRoot, root } = (0, ThemeContext_1.useThemes)();
     const { activeTheme, activeThemeTone } = (0, ThemeContext_1.useTheme)();
@@ -126,7 +126,7 @@ function Theme({ id, isRoot = false, renderChild, node, tone, toastDuration = 50
                         if (el) {
                             setRoot(el);
                         }
-                    }, children: [(0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { node: node, location: "theme-root", children: renderChild(node.children) }), (0, jsx_runtime_1.jsx)(NotificationToast_1.NotificationToast, { toastDuration: toastDuration })] })] }));
+                    }, children: [(0, jsx_runtime_1.jsxs)(ErrorBoundary_1.ErrorBoundary, { node: node, location: "theme-root", children: [renderChild(node.children), children] }), (0, jsx_runtime_1.jsx)(NotificationToast_1.NotificationToast, { toastDuration: toastDuration })] })] }));
     }
     return ((0, jsx_runtime_1.jsxs)(ThemeContext_1.ThemeContext.Provider, { value: currentThemeContextValue, children: [(0, jsx_runtime_1.jsx)("style", { children: `.${rangeClassName} {${css}}` }), (0, jsx_runtime_1.jsx)("style", { children: `.${className} {${css}}` }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Theme_module_scss_1.default.from, fromClass) }), renderChild(node.children, Object.assign(Object.assign({}, layoutContext), { themeClassName: className })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Theme_module_scss_1.default.to, toClass) }), root &&
                 (0, react_dom_1.createPortal)((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(className), ref: (el) => {

package/dist/scripts/src/components-core/rendering/ComponentAdapter.js

@@ -78,7 +78,7 @@ const layout_resolver_1 = require("../theming/layout-resolver");
  */
 const ComponentAdapter = (0, react_1.forwardRef)(function ComponentAdapter(_a, ref) {
     var _b;
-    var { node, state, appContext, dispatch, lookupAction, lookupSyncCallback, renderChild, registerComponentApi, layoutContextRef, parentRenderContext, memoedVarsRef, onUnmount, uidInfoRef } = _a, rest = __rest(_a, ["node", "state", "appContext", "dispatch", "lookupAction", "lookupSyncCallback", "renderChild", "registerComponentApi", "layoutContextRef", "parentRenderContext", "memoedVarsRef", "onUnmount", "uidInfoRef"]);
+    var { node, state, appContext, dispatch, lookupAction, lookupSyncCallback, renderChild, registerComponentApi, layoutContextRef, parentRenderContext, memoedVarsRef, onUnmount, uidInfoRef, children } = _a, rest = __rest(_a, ["node", "state", "appContext", "dispatch", "lookupAction", "lookupSyncCallback", "renderChild", "registerComponentApi", "layoutContextRef", "parentRenderContext", "memoedVarsRef", "onUnmount", "uidInfoRef", "children"]);
     // --- Make sure the component definition has `props` and `events` properties
     // --- (even if they are empty)
     const safeNode = (0, react_1.useMemo)(() => {
@@ -247,10 +247,11 @@ const ComponentAdapter = (0, react_1.forwardRef)(function ComponentAdapter(_a, r
     if ((ref || !(0, lodash_es_1.isEmpty)(mouseEventHandlers)) && renderedNode && react_1.default.isValidElement(renderedNode)) {
         // --- For radix UI/accessibility, read more here:
         // --- https://www.radix-ui.com/primitives/docs/guides/composition
-        return (0, react_1.cloneElement)(renderedNode, Object.assign({ ref: ref ? (0, react_compose_refs_1.composeRefs)(ref, renderedNode.ref) : renderedNode.ref }, (0, mergeProps_1.mergeProps)(Object.assign(Object.assign({}, renderedNode.props), mouseEventHandlers), rest)));
+        const childrenArray = !children ? [] : Array.isArray(children) ? children : [children];
+        return (0, react_1.cloneElement)(renderedNode, Object.assign({ ref: ref ? (0, react_compose_refs_1.composeRefs)(ref, renderedNode.ref) : renderedNode.ref }, (0, mergeProps_1.mergeProps)(Object.assign(Object.assign({}, renderedNode.props), mouseEventHandlers), rest)), ...(childrenArray));
     }
     // --- If the rendering resulted in multiple React nodes, wrap them in a fragment.
-    return react_1.default.isValidElement(renderedNode) ? renderedNode : (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: renderedNode });
+    return (react_1.default.isValidElement(renderedNode) && !!children) ? (0, react_1.cloneElement)(renderedNode, null, children) : renderedNode;
 });
 /**
  * This function renders the content of a slot. If the slot is named, it looks for a template

package/dist/scripts/src/components-core/rendering/ComponentWrapper.js

@@ -25,7 +25,7 @@ const ComponentAdapter_1 = __importDefault(require("./ComponentAdapter"));
  */
 exports.ComponentWrapper = (0, react_1.memo)((0, react_1.forwardRef)(function ComponentWrapper(_a, ref) {
     var _b;
-    var { node, resolvedKey, state, dispatch, appContext, lookupAction, lookupSyncCallback, registerComponentApi, renderChild, statePartChanged, layoutContext, parentRenderContext, memoedVarsRef, cleanup, uidInfoRef } = _a, rest = __rest(_a, ["node", "resolvedKey", "state", "dispatch", "appContext", "lookupAction", "lookupSyncCallback", "registerComponentApi", "renderChild", "statePartChanged", "layoutContext", "parentRenderContext", "memoedVarsRef", "cleanup", "uidInfoRef"]);
+    var { node, resolvedKey, state, dispatch, appContext, lookupAction, lookupSyncCallback, registerComponentApi, renderChild, statePartChanged, layoutContext, parentRenderContext, memoedVarsRef, cleanup, uidInfoRef, children } = _a, rest = __rest(_a, ["node", "resolvedKey", "state", "dispatch", "appContext", "lookupAction", "lookupSyncCallback", "registerComponentApi", "renderChild", "statePartChanged", "layoutContext", "parentRenderContext", "memoedVarsRef", "cleanup", "uidInfoRef", "children"]);
     // --- We pass the layout context to the child components, so we need to
     // --- make sure that it is stable
     const stableLayoutContext = (0, react_1.useRef)(layoutContext);
@@ -51,11 +51,11 @@ exports.ComponentWrapper = (0, react_1.memo)((0, react_1.forwardRef)(function Co
     }, [nodeWithTransformedLoaders, resolvedDataPropIsString, uidInfoRef]);
     if ((0, ContainerWrapper_1.isContainerLike)(nodeWithTransformedDatasourceProp)) {
         // --- This component should be rendered as a container
-        return ((0, jsx_runtime_1.jsx)(ContainerWrapper_1.ContainerWrapper, { resolvedKey: resolvedKey, node: nodeWithTransformedDatasourceProp, parentState: state, parentDispatch: dispatch, layoutContextRef: stableLayoutContext, parentRenderContext: parentRenderContext, parentStatePartChanged: statePartChanged, parentRegisterComponentApi: registerComponentApi, uidInfoRef: uidInfoRef, ref: ref }));
+        return ((0, jsx_runtime_1.jsx)(ContainerWrapper_1.ContainerWrapper, Object.assign({ resolvedKey: resolvedKey, node: nodeWithTransformedDatasourceProp, parentState: state, parentDispatch: dispatch, layoutContextRef: stableLayoutContext, parentRenderContext: parentRenderContext, parentStatePartChanged: statePartChanged, parentRegisterComponentApi: registerComponentApi, uidInfoRef: uidInfoRef, ref: ref }, rest, { children: children })));
     }
     else {
         // --- This component should be rendered as a regular component
-        return ((0, jsx_runtime_1.jsx)(ComponentAdapter_1.default, Object.assign({ onUnmount: cleanup, memoedVarsRef: memoedVarsRef, node: nodeWithTransformedDatasourceProp, state: state, dispatch: dispatch, appContext: appContext, lookupAction: lookupAction, lookupSyncCallback: lookupSyncCallback, registerComponentApi: registerComponentApi, renderChild: renderChild, parentRenderContext: parentRenderContext, layoutContextRef: stableLayoutContext, ref: ref, uidInfoRef: uidInfoRef }, rest)));
+        return ((0, jsx_runtime_1.jsx)(ComponentAdapter_1.default, Object.assign({ onUnmount: cleanup, memoedVarsRef: memoedVarsRef, node: nodeWithTransformedDatasourceProp, state: state, dispatch: dispatch, appContext: appContext, lookupAction: lookupAction, lookupSyncCallback: lookupSyncCallback, registerComponentApi: registerComponentApi, renderChild: renderChild, parentRenderContext: parentRenderContext, layoutContextRef: stableLayoutContext, ref: ref, uidInfoRef: uidInfoRef }, rest, { children: children })));
     }
 }));
 // --- Create a DataLoader component for each DataSource child within the

package/dist/scripts/src/components-core/rendering/Container.js

@@ -69,7 +69,7 @@ const ThemeContext_1 = require("../theming/ThemeContext");
 const LoaderComponent_1 = require("../LoaderComponent");
 const constants_1 = require("../constants");
 // React component to display a view container and implement its behavior
-exports.Container = (0, react_1.memo)((0, react_1.forwardRef)(function Container({ node, componentState, dispatch: containerDispatch, parentDispatch, resolvedKey, version, setVersion, statePartChanged, registerComponentApi: containerRegisterComponentApi, parentRegisterComponentApi, layoutContextRef, parentRenderContext, memoedVarsRef, isImplicit, uidInfoRef: parentUidInfoRef, }, ref) {
+exports.Container = (0, react_1.memo)((0, react_1.forwardRef)(function Container({ node, componentState, dispatch: containerDispatch, parentDispatch, resolvedKey, version, setVersion, statePartChanged, registerComponentApi: containerRegisterComponentApi, parentRegisterComponentApi, layoutContextRef, parentRenderContext, memoedVarsRef, isImplicit, uidInfoRef: parentUidInfoRef, children, }, ref) {
     var _a;
     const { apiBoundContainer } = node;
     const dispatch = isImplicit ? parentDispatch : containerDispatch;
@@ -160,6 +160,13 @@ exports.Container = (0, react_1.memo)((0, react_1.forwardRef)(function Container
                 }
                 statements = parsedStatementsRef.current[source];
             }
+            else if (isParsedEventValue(source)) {
+                const parseId = source.parseId.toString();
+                if (!parsedStatementsRef.current[parseId]) {
+                    parsedStatementsRef.current[parseId] = (0, statementUtils_1.prepareHandlerStatements)(source.statements, evalContext);
+                }
+                statements = parsedStatementsRef.current[parseId];
+            }
             else {
                 statements = [
                     {
@@ -293,23 +300,48 @@ exports.Container = (0, react_1.memo)((0, react_1.forwardRef)(function Container
         }
     }, [appContext]);
     const getOrCreateEventHandlerFn = (0, misc_1.useEvent)((src, uid, options) => {
-        var _a;
+        var _a, _b;
         if (Array.isArray(src)) {
             throw new Error("Multiple event handlers are not supported");
         }
-        const stringSrc = typeof src === "string" ? src : src.statement.nodeId;
-        const fnCacheKey = `${options === null || options === void 0 ? void 0 : options.eventName};${stringSrc}`;
-        const handler = (...eventArgs) => {
-            return runCodeAsync(src, uid, options, ...(0, lodash_es_1.cloneDeep)(eventArgs));
-        };
-        if (options === null || options === void 0 ? void 0 : options.ephemeral) {
-            return handler;
+        if (typeof src === "string") {
+            // --- We have a string event handler
+            const fnCacheKey = `${options === null || options === void 0 ? void 0 : options.eventName};${src}`;
+            const handler = (...eventArgs) => {
+                return runCodeAsync(src, uid, options, ...(0, lodash_es_1.cloneDeep)(eventArgs));
+            };
+            if (options === null || options === void 0 ? void 0 : options.ephemeral) {
+                return handler;
+            }
+            if (!((_a = fnsRef.current[uid]) === null || _a === void 0 ? void 0 : _a[fnCacheKey])) {
+                fnsRef.current[uid] = fnsRef.current[uid] || {};
+                fnsRef.current[uid][fnCacheKey] = handler;
+            }
+            return fnsRef.current[uid][fnCacheKey];
         }
-        if (!((_a = fnsRef.current[uid]) === null || _a === void 0 ? void 0 : _a[fnCacheKey])) {
-            fnsRef.current[uid] = fnsRef.current[uid] || {};
-            fnsRef.current[uid][fnCacheKey] = handler;
+        if (isParsedEventValue(src)) {
+            // --- We have the syntax tree to execute, no need to cache
+            return (...eventArgs) => {
+                return runCodeAsync(src, uid, options, ...(0, lodash_es_1.cloneDeep)(eventArgs));
+            };
+        }
+        if (isArrowExpression(src)) {
+            // --- We have an arrow expression to execute
+            const fnCacheKey = `${options === null || options === void 0 ? void 0 : options.eventName};${src.statement.nodeId}`;
+            const handler = (...eventArgs) => {
+                return runCodeAsync(src, uid, options, ...(0, lodash_es_1.cloneDeep)(eventArgs));
+            };
+            if (options === null || options === void 0 ? void 0 : options.ephemeral) {
+                return handler;
+            }
+            if (!((_b = fnsRef.current[uid]) === null || _b === void 0 ? void 0 : _b[fnCacheKey])) {
+                fnsRef.current[uid] = fnsRef.current[uid] || {};
+                fnsRef.current[uid][fnCacheKey] = handler;
+            }
+            return fnsRef.current[uid][fnCacheKey];
         }
-        return fnsRef.current[uid][fnCacheKey];
+        // --- We have an unknown event handler
+        throw new Error("Invalid event handler");
     });
     const getOrCreateSyncCallbackFn = (0, react_1.useCallback)((arrowExpression, uid) => {
         var _a;
@@ -512,7 +544,10 @@ exports.Container = (0, react_1.memo)((0, react_1.forwardRef)(function Container
         lookupSyncCallback,
         cleanup,
     });
-    const containerContent = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderedLoaders, renderedChildren] }));
+    //TODO illesg
+    const containerContent = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [renderedLoaders, !!children && (0, react_1.isValidElement)(renderedChildren)
+                ? (0, react_1.cloneElement)(renderedChildren, null, children)
+                : renderedChildren] }));
     return ((0, jsx_runtime_1.jsxs)(react_1.Fragment, { children: [showContainer && ((0, jsx_runtime_1.jsx)(StateViewerNative_1.StateViewer, { state: componentState, showBoundary: stateViewProps === null || stateViewProps === void 0 ? void 0 : stateViewProps.showBoundary, blink: stateViewProps === null || stateViewProps === void 0 ? void 0 : stateViewProps.blink, children: containerContent })), !showContainer && containerContent] }, node.uid
         ? `${resolvedKey}>${(0, extractParam_1.extractParam)(componentState, node.uid, appContext, true)}`
         : undefined));
@@ -565,3 +600,9 @@ function renderLoaders({ uidInfo, uidInfoRef, loaders = constants_1.EMPTY_ARRAY,
         return ((0, jsx_runtime_1.jsx)(LoaderComponent_1.LoaderComponent, { onUnmount: cleanup, node: loader, state: componentState, dispatch: dispatch, registerComponentApi: registerComponentApi, lookupAction: lookupAction, lookupSyncCallback: lookupSyncCallback, memoedVarsRef: memoedVarsRef, appContext: appContext }));
     }
 }
+function isParsedEventValue(value) {
+    return value.__PARSED === true;
+}
+function isArrowExpression(value) {
+    return value.type === ScriptingSourceTree_1.T_ARROW_EXPRESSION;
+}

package/dist/scripts/src/components-core/rendering/ContainerWrapper.js

@@ -1,4 +1,15 @@
 "use strict";
+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.ContainerWrapper = void 0;
 exports.isContainerLike = isContainerLike;
@@ -30,10 +41,11 @@ function isContainerLike(node) {
  * provides a context for the children to access the state and the API of the
  * parent component.
  */
-exports.ContainerWrapper = (0, react_1.memo)((0, react_1.forwardRef)(function ContainerWrapper({ node, resolvedKey, parentState, parentStatePartChanged, parentRegisterComponentApi, parentDispatch, parentRenderContext, layoutContextRef, uidInfoRef, }, ref) {
+exports.ContainerWrapper = (0, react_1.memo)((0, react_1.forwardRef)(function ContainerWrapper(_a, ref) {
+    var { node, resolvedKey, parentState, parentStatePartChanged, parentRegisterComponentApi, parentDispatch, parentRenderContext, layoutContextRef, uidInfoRef, children } = _a, rest = __rest(_a, ["node", "resolvedKey", "parentState", "parentStatePartChanged", "parentRegisterComponentApi", "parentDispatch", "parentRenderContext", "layoutContextRef", "uidInfoRef", "children"]);
     // --- Make sure the component node is wrapped with a container
     const containerizedNode = (0, react_1.useMemo)(() => getWrappedWithContainer(node), [node]);
-    return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { node: node, location: "container", children: (0, jsx_runtime_1.jsx)(StateContainer_1.StateContainer, { node: containerizedNode, resolvedKey: resolvedKey, parentState: parentState, parentStatePartChanged: parentStatePartChanged, parentRegisterComponentApi: parentRegisterComponentApi, parentDispatch: parentDispatch, parentRenderContext: parentRenderContext, layoutContextRef: layoutContextRef, uidInfoRef: uidInfoRef, isImplicit: node.type !== "Container" && containerizedNode.uses === undefined, ref: ref }) }));
+    return ((0, jsx_runtime_1.jsx)(ErrorBoundary_1.ErrorBoundary, { node: node, location: "container", children: (0, jsx_runtime_1.jsx)(StateContainer_1.StateContainer, Object.assign({ node: containerizedNode, resolvedKey: resolvedKey, parentState: parentState, parentStatePartChanged: parentStatePartChanged, parentRegisterComponentApi: parentRegisterComponentApi, parentDispatch: parentDispatch, parentRenderContext: parentRenderContext, layoutContextRef: layoutContextRef, uidInfoRef: uidInfoRef, isImplicit: node.type !== "Container" && containerizedNode.uses === undefined, ref: ref }, rest, { children: children })) }));
 }));
 /**
  * Wraps the specified component node with a container