xmlui 0.10.19 → 0.10.20

package/dist/scripts/src/components/ModalDialog/ConfirmationModalContextProvider.js

@@ -32,15 +32,6 @@ var __importStar = (this && this.__importStar) || (function () {
         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 });
 exports.ConfirmationModalContextProvider = exports.useConfirm = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
@@ -49,7 +40,7 @@ const ButtonNative_1 = require("../Button/ButtonNative");
 const StackNative_1 = require("../Stack/StackNative");
 const Dialog_1 = require("./Dialog");
 const ConfirmationModalContext = react_1.default.createContext({
-    confirm: (title, message, actionLabel) => __awaiter(void 0, void 0, void 0, function* () { return false; }),
+    confirm: (title, message, actionLabel) => Promise.resolve(false),
 });
 const useConfirm = () => (0, react_1.useContext)(ConfirmationModalContext);
 exports.useConfirm = useConfirm;
@@ -73,7 +64,7 @@ const ConfirmationModalContextProvider = ({ children }) => {
             }, 0);
         }
     }, [showConfirmationModal]);
-    const handleShow = (0, react_1.useCallback)((title, message, actionLabel) => __awaiter(void 0, void 0, void 0, function* () {
+    const handleShow = (0, react_1.useCallback)((title, message, actionLabel) => {
         if (typeof title === "string") {
             setTitle(title);
             setButtons([
@@ -93,7 +84,7 @@ const ConfirmationModalContextProvider = ({ children }) => {
         return new Promise(function (resolve) {
             resolver.current = resolve;
         });
-    }), []);
+    }, []);
     const handleOk = (0, react_1.useCallback)((value) => {
         if (resolver.current) {
             resolver.current(value);

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

@@ -25,7 +25,7 @@ exports.ModalDialogMd = (0, metadata_helpers_1.createMetadata)({
         },
         title: {
             description: "The title area of the modal dialog.",
-        }
+        },
     },
     props: {
         fullScreen: {
@@ -81,5 +81,5 @@ exports.modalViewComponentRenderer = (0, renderers_1.createComponentRenderer)(CO
                 return ((0, jsx_runtime_1.jsx)(container_helpers_1.MemoizedItem, { node: node, renderChild: renderChild, layoutContext: { _insideModalFrame: true }, contextVars: { $param: openParams === null || openParams === void 0 ? void 0 : openParams[0], $params: openParams } }));
             } }));
     }
-    return ((0, jsx_runtime_1.jsx)(ModalDialogNative_1.ModalDialog, { className: className, fullScreen: extractValue.asOptionalBoolean((_a = node.props) === null || _a === void 0 ? void 0 : _a.fullScreen), title: extractValue((_b = node.props) === null || _b === void 0 ? void 0 : _b.title), closeButtonVisible: extractValue.asOptionalBoolean(node.props.closeButtonVisible), children: renderChild(node.children, { type: "Stack" }) }));
+    return ((0, jsx_runtime_1.jsx)(ModalDialogNative_1.ModalDialog, { className: className, fullScreen: extractValue.asOptionalBoolean((_a = node.props) === null || _a === void 0 ? void 0 : _a.fullScreen), title: extractValue((_b = node.props) === null || _b === void 0 ? void 0 : _b.title), closeButtonVisible: extractValue.asOptionalBoolean(node.props.closeButtonVisible), externalAnimation: extractValue.asOptionalBoolean(node.props.externalAnimation), children: renderChild(node.children, { type: "Stack" }) }));
 });

package/dist/scripts/src/components/ModalDialog/ModalDialogNative.js

@@ -130,7 +130,7 @@ function useModalOpenState(isInitiallyOpen = true, onOpen, onClose) {
     return modalStateContext || modalLocalOpenState;
 }
 exports.ModalDialog = react_1.default.forwardRef((_a, ref) => {
-    var { children, style, isInitiallyOpen, fullScreen = exports.defaultProps.fullScreen, title, closeButtonVisible = exports.defaultProps.closeButtonVisible, className, onOpen, onClose } = _a, rest = __rest(_a, ["children", "style", "isInitiallyOpen", "fullScreen", "title", "closeButtonVisible", "className", "onOpen", "onClose"]);
+    var { children, style, isInitiallyOpen, fullScreen = exports.defaultProps.fullScreen, title, closeButtonVisible = exports.defaultProps.closeButtonVisible, className, onOpen, onClose, externalAnimation = true } = _a, rest = __rest(_a, ["children", "style", "isInitiallyOpen", "fullScreen", "title", "closeButtonVisible", "className", "onOpen", "onClose", "externalAnimation"]);
     const { root } = (0, ThemeContext_1.useTheme)();
     // NOTE: at this point, we can't use useAppContext here,
     // since the ModalDialog context provider (via ConfirmationModalContextProvider) is mounted outside of the AppContext,
@@ -180,9 +180,12 @@ exports.ModalDialog = react_1.default.forwardRef((_a, ref) => {
     if (!root) {
         return null;
     }
-    const Content = ((0, jsx_runtime_1.jsxs)(Dialog.Content, Object.assign({}, rest, { "data-part-id": PART_CONTENT, className: (0, classnames_1.default)(ModalDialog_module_scss_1.default.content, className), onPointerDownOutside: (event) => {
+    const Content = ((0, jsx_runtime_1.jsxs)(Dialog.Content, Object.assign({}, rest, { "data-part-id": PART_CONTENT, className: (0, classnames_1.default)({
+            [ModalDialog_module_scss_1.default.contentAnimation]: !externalAnimation,
+        }, ModalDialog_module_scss_1.default.content, className), onPointerDownOutside: (event) => {
             if (event.target instanceof Element &&
-                (event.target.closest("._debug-inspect-button") !== null || event.target.localName === "com-1password-button")) {
+                (event.target.closest("._debug-inspect-button") !== null ||
+                    event.target.localName === "com-1password-button")) {
                 //we prevent the auto modal close on clicking the inspect button
                 event.preventDefault();
             }

package/dist/scripts/src/components/NestedApp/AppWithCodeViewNative.js

@@ -70,7 +70,7 @@ function AppWithCodeViewNative({ markdown, splitView, withFrame = true, noHeader
                                                         [NestedApp_module_scss_1.default.show]: !showCode,
                                                         [NestedApp_module_scss_1.default.hide]: showCode,
                                                     }), children: "UI" })] })] })), (0, jsx_runtime_1.jsxs)("div", { className: NestedApp_module_scss_1.default.wrapper, style: { width: controlsWidth }, children: [allowPlaygroundPopup && ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { trigger: (0, jsx_runtime_1.jsx)("button", { className: NestedApp_module_scss_1.default.headerButton, onClick: () => {
-                                                    openPlayground();
+                                                    void openPlayground();
                                                 }, children: (0, jsx_runtime_1.jsx)(rx_1.RxOpenInNewWindow, {}) }), label: "View and edit in new full-width window" })), (0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { trigger: (0, jsx_runtime_1.jsx)("button", { className: NestedApp_module_scss_1.default.headerButton, onClick: () => {
                                                     setShowCode(false);
                                                     setRefreshVersion(refreshVersion + 1);

package/dist/scripts/src/components/NestedApp/NestedAppNative.js

@@ -137,7 +137,7 @@ function NestedApp({ api, app, components = constants_1.EMPTY_ARRAY, config, act
                 return null;
             }));
             // When your component mounts and the shadow root is available...
-            Promise.all(sheetPromises).then((sheets) => {
+            void Promise.all(sheetPromises).then((sheets) => {
                 // Filter out any sheets that failed to load
                 const validSheets = sheets.filter(Boolean);
                 // Apply the array of constructed stylesheets to the shadow root
@@ -217,7 +217,7 @@ function NestedApp({ api, app, components = constants_1.EMPTY_ARRAY, config, act
                     [NestedApp_module_scss_1.default.initialized]: initialized,
                 }) })] }));
 }
-function NestedAppRoot({ children, themeStylesToReset }) {
+function NestedAppRoot({ children, themeStylesToReset, }) {
     // css variables are leaking into to shadow dom, so we reset them here
     const themeVarReset = (0, react_1.useMemo)(() => {
         const vars = {};
@@ -227,5 +227,5 @@ function NestedAppRoot({ children, themeStylesToReset }) {
         return vars;
     }, [themeStylesToReset]);
     const resetClassName = (0, StyleContext_1.useStyles)(themeVarReset, { prepend: true });
-    return (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(resetClassName, NestedApp_module_scss_1.default.shadowRoot), id: "nested-app-root", children: (0, jsx_runtime_1.jsx)("div", { className: NestedApp_module_scss_1.default.content, children: children }) });
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(resetClassName, NestedApp_module_scss_1.default.shadowRoot), id: "nested-app-root", children: (0, jsx_runtime_1.jsx)("div", { className: NestedApp_module_scss_1.default.content, children: children }) }));
 }

package/dist/scripts/src/components/NumberBox/NumberBox.spec.js

@@ -201,9 +201,9 @@ fixtures_1.test.describe("Basic Functionality", () => {
         yield initTestBed(`<NumberBox zeroOrPositive="true" initialValue="1" />`);
         const driver = yield createNumberBoxDriver();
         yield driver.decrement();
-        (0, fixtures_1.expect)(driver.input).toHaveValue("0");
+        yield (0, fixtures_1.expect)(driver.input).toHaveValue("0");
         yield driver.decrement();
-        (0, fixtures_1.expect)(driver.input).toHaveValue("0");
+        yield (0, fixtures_1.expect)(driver.input).toHaveValue("0");
     }));
     // --- Range validation (min/max)
     (0, fixtures_1.test)("minValue prevents values below minimum spinner button", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createNumberBoxDriver, }) {

package/dist/scripts/src/components/Pagination/Pagination.spec.js

@@ -634,6 +634,11 @@ fixtures_1.test.describe("Accessibility", () => {
         yield page.keyboard.press("Tab");
         yield (0, fixtures_1.expect)(page.getByRole("button", { name: "Page 2" })).toBeFocused();
     }));
+    (0, fixtures_1.test)("page size selector is focused when label is clicked", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page }) {
+        yield initTestBed(`<Pagination itemCount="50" pageSize="10" pageSizeOptions="{[5, 10, 20]}"/>`);
+        yield page.getByText("Items per page").click();
+        yield (0, fixtures_1.expect)(page.locator("select")).toBeFocused();
+    }));
 });
 // =============================================================================
 // INTERACTION TESTS

package/dist/scripts/src/components/Pagination/PaginationNative.js

@@ -140,9 +140,7 @@ exports.PaginationNative = (0, react_1.forwardRef)(function PaginationNative(_a,
                 visiblePages.map((pageNum) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { variant: pageNum === currentPageNumber ? "solid" : "ghost", disabled: !enabled, size: "sm", onClick: () => handlePageChange(pageNum - 1), contextualLabel: `Page ${pageNum}`, "aria-current": pageNum === currentPageNumber || undefined, "aria-label": `Page ${pageNum}${pageNum === currentPageNumber ? " (current)" : ""}`, children: pageNum }) }, `page-${pageNum}`))), visiblePages.length <= 2 && ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { variant: "ghost", size: "sm", disabled: !enabled || isLastPage, onClick: () => handlePageChange(currentPage + 1), contextualLabel: "Next page", style: { minHeight: "36px", padding: "8px" }, "aria-label": "Next page", children: (0, jsx_runtime_1.jsx)(IconNative_1.Icon, { name: `next:Pagination`, fallback: orientation === "vertical" ? "chevrondown" : "chevronright", size: "sm" }) }) })), (0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(ButtonNative_1.Button, { variant: "ghost", size: "sm", disabled: !enabled || isLastPage, onClick: () => handlePageChange(totalPages - 1), contextualLabel: "Last page", style: { minHeight: "36px", padding: "8px" }, "aria-label": "Last page", children: (0, jsx_runtime_1.jsx)(IconNative_1.Icon, { name: `last:Pagination`, fallback: orientation === "vertical" ? "doublechevrondown" : "doublechevronright", size: "sm" }) }) })] }));
     const pageSizeSelector = showPageSizeSelector &&
         pageSizeOptions &&
-        pageSizeOptions.length > 1 && ((0, jsx_runtime_1.jsx)("div", { "data-component": `page-size-selector-container`, className: (0, classnames_1.default)(Pagination_module_scss_1.default.selectorContainer), children: (0, jsx_runtime_1.jsx)(ItemWithLabel_1.ItemWithLabel, { id: `${id}-page-size-selector`, label: "Items per page", enabled: enabled, style: style, className: className, labelPosition: orientation === "vertical" ? "top" : "start", 
-            // NOTE: This is a band-aid solution to handle the multiple IDs issue - remove after resolving focus bug
-            isInputTemplateUsed: true, children: (0, jsx_runtime_1.jsx)("select", { id: `${id}-page-size-selector`, value: pageSize, onChange: (e) => handlePageSizeChange(Number(e.target.value)), disabled: !enabled, className: Pagination_module_scss_1.default.pageSizeSelect, children: pageSizeOptions.map((size) => ((0, jsx_runtime_1.jsx)("option", { value: size, children: size }, size))) }) }) }));
+        pageSizeOptions.length > 1 && ((0, jsx_runtime_1.jsx)("div", { "data-component": `page-size-selector-container`, className: (0, classnames_1.default)(Pagination_module_scss_1.default.selectorContainer), children: (0, jsx_runtime_1.jsx)(ItemWithLabel_1.ItemWithLabel, { id: `${id}-page-size-selector`, label: "Items per page", enabled: enabled, style: style, className: className, labelPosition: orientation === "vertical" ? "top" : "start", children: (0, jsx_runtime_1.jsx)("select", { id: `${id}-page-size-selector`, value: pageSize, onChange: (e) => handlePageSizeChange(Number(e.target.value)), disabled: !enabled, className: Pagination_module_scss_1.default.pageSizeSelect, children: pageSizeOptions.map((size) => ((0, jsx_runtime_1.jsx)("option", { value: size, children: size }, size))) }) }) }));
     const pageInfo = showPageInfo && ((0, jsx_runtime_1.jsx)("div", { "data-component": `page-info`, className: (0, classnames_1.default)(Pagination_module_scss_1.default.pageInfo), children: (0, jsx_runtime_1.jsxs)(TextNative_1.Text, { variant: "secondary", children: ["Page ", currentPageNumber, " of ", totalPages, " (", itemCount, " items)"] }) }));
     // Used the following resource to provide a11y:
     // https://a11ymatters.com/pattern/pagination/

package/dist/scripts/src/components/Queue/Queue.spec.js

@@ -14,7 +14,7 @@ const fixtures_1 = require("../../testing/fixtures");
 // BASIC FUNCTIONALITY TESTS
 // =============================================================================
 fixtures_1.test.describe("Basic Functionality", () => {
-    (0, fixtures_1.test)("component initializes and provides API methods", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+    (0, fixtures_1.test)("component initializes and provides API methods", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
         const { testStateDriver } = yield initTestBed(`
       <Fragment>
         <Queue id="testQueue" />
@@ -27,8 +27,8 @@ fixtures_1.test.describe("Basic Functionality", () => {
         }" />
       </Fragment>
     `);
-        const buttonDriver = createButtonDriver("checkApi");
-        (yield buttonDriver).component.click();
+        const buttonDriver = yield createButtonDriver("checkApi");
+        yield buttonDriver.component.click();
         yield fixtures_1.expect.poll(testStateDriver.testState).toEqual({
             hasEnqueueItem: true,
             hasEnqueueItems: true,
@@ -41,7 +41,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     // ENQUEUE ITEM API TESTS
     // =============================================================================
     fixtures_1.test.describe("enqueueItem API", () => {
-        (0, fixtures_1.test)("enqueueItem adds item to queue and returns ID", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("enqueueItem adds item to queue and returns ID", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -61,7 +61,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
                 hasValidId: true,
             });
         }));
-        (0, fixtures_1.test)("enqueueItem handles different data types", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("enqueueItem handles different data types", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -107,7 +107,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     // ENQUEUE ITEMS API TESTS
     // =============================================================================
     fixtures_1.test.describe("enqueueItems API", () => {
-        (0, fixtures_1.test)("enqueueItems adds multiple items and returns array of IDs", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("enqueueItems adds multiple items and returns array of IDs", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -156,7 +156,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     // GET QUEUE LENGTH API TESTS
     // =============================================================================
     fixtures_1.test.describe("getQueueLength API", () => {
-        (0, fixtures_1.test)("getQueueLength returns 0 for empty queue", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("getQueueLength returns 0 for empty queue", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -167,7 +167,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe(0);
         }));
-        (0, fixtures_1.test)("getQueueLength updates after adding items", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("getQueueLength updates after adding items", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -177,9 +177,9 @@ fixtures_1.test.describe("Basic Functionality", () => {
             const afterOne = testQueue.getQueueLength();
             const ids = testQueue.enqueueItems(['item2', 'item3']);
             const afterThree = testQueue.getQueueLength();
-            testState = { 
-              initial, 
-              afterOne, 
+            testState = {
+              initial,
+              afterOne,
               afterThree,
               hasId1: !!id1,
               hasIds: ids.length === 2
@@ -194,7 +194,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
                 afterOne: 0,
                 afterThree: 0,
                 hasId1: true,
-                hasIds: true
+                hasIds: true,
             });
         }));
     });
@@ -202,7 +202,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     // GET QUEUED ITEMS API TESTS
     // =============================================================================
     fixtures_1.test.describe("getQueuedItems API", () => {
-        (0, fixtures_1.test)("getQueuedItems returns empty array for empty queue", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("getQueuedItems returns empty array for empty queue", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -213,7 +213,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toEqual([]);
         }));
-        (0, fixtures_1.test)("getQueuedItems returns items with correct structure", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("getQueuedItems returns items with correct structure", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" />
@@ -233,7 +233,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield fixtures_1.expect.poll(testStateDriver.testState).toEqual({
                 hasItemId: true,
                 itemsLength: 0,
-                isArray: true
+                isArray: true,
             });
         }));
     });
@@ -266,7 +266,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
                 lengthBefore: 0,
                 lengthAfter: 0,
                 hasItemId: true,
-                hasKeepId: true
+                hasKeepId: true,
             });
         }));
         (0, fixtures_1.test)("remove handles invalid ID gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
@@ -278,8 +278,8 @@ fixtures_1.test.describe("Basic Functionality", () => {
             const lengthBefore = testQueue.getQueueLength();
             testQueue.remove('invalid-id');
             const lengthAfter = testQueue.getQueueLength();
-            testState = { 
-              lengthBefore, 
+            testState = {
+              lengthBefore,
               lengthAfter,
               hasItemId: !!itemId
             };
@@ -291,7 +291,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield fixtures_1.expect.poll(testStateDriver.testState).toEqual({
                 lengthBefore: 0,
                 lengthAfter: 0,
-                hasItemId: true
+                hasItemId: true,
             });
         }));
     });
@@ -310,10 +310,10 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe("processed");
         }));
-        (0, fixtures_1.test)("clearAfterFinish=true removes completed items", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("clearAfterFinish=true removes completed items", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
-          <Queue id="testQueue" clearAfterFinish="true" 
+          <Queue id="testQueue" clearAfterFinish="true"
                  onProcess="processing => {}"
                  onComplete="() => testState = testQueue.getQueuedItems().length" />
           <Button id="enqueueBtn" label="Enqueue" onClick="testQueue.enqueueItem('test');" />
@@ -339,10 +339,10 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe("test-data");
         }));
-        (0, fixtures_1.test)("onWillProcess event can skip items by returning false", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("onWillProcess event can skip items by returning false", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
-          <Queue id="testQueue" 
+          <Queue id="testQueue"
                  onWillProcess="processing => processing.item !== 'skip' ? true : (testState = 'skipped', false)"
                  onProcess="processing => testState = 'processed'" />
           <Button id="enqueueBtn" label="Enqueue" onClick="
@@ -355,11 +355,11 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe("processed");
         }));
-        (0, fixtures_1.test)("onDidProcess event fires after processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("onDidProcess event fires after processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue"
-                 onProcess="processing => {}" 
+                 onProcess="processing => {}"
                  onDidProcess="processing => testState = 'did-process-' + processing.item" />
           <Button id="enqueueBtn" label="Enqueue" onClick="testQueue.enqueueItem('test');" />
         </Fragment>
@@ -368,7 +368,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe("did-process-test");
         }));
-        (0, fixtures_1.test)("onProcessError event fires when processing throws", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("onProcessError event fires when processing throws", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue"
@@ -381,7 +381,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield fixtures_1.expect.poll(testStateDriver.testState).toBe("error-test");
         }));
-        (0, fixtures_1.test)("onComplete event fires when queue becomes empty", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("onComplete event fires when queue becomes empty", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" clearAfterFinish="true"
@@ -399,7 +399,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     // TEMPLATE PROPERTY TESTS
     // =============================================================================
     fixtures_1.test.describe("Template Properties", () => {
-        (0, fixtures_1.test)("progressFeedback renders during processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page, createButtonDriver }) {
+        (0, fixtures_1.test)("progressFeedback renders during processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page, createButtonDriver, }) {
             yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" onProcess="processing => { processing.reportProgress('50%'); }">
@@ -414,7 +414,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield (0, fixtures_1.expect)(page.getByText("Progress: 0 of 1")).toBeVisible();
         }));
-        (0, fixtures_1.test)("resultFeedback renders when queue completes", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page, createButtonDriver }) {
+        (0, fixtures_1.test)("resultFeedback renders when queue completes", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, page, createButtonDriver, }) {
             yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" clearAfterFinish="true" onProcess="processing => {}">
@@ -429,7 +429,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
             yield buttonDriver.component.click();
             yield (0, fixtures_1.expect)(page.getByText("All 1 items processed")).toBeVisible();
         }));
-        (0, fixtures_1.test)("progressFeedback handles null gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+        (0, fixtures_1.test)("progressFeedback handles null gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
           <Queue id="testQueue" progressFeedback="{null}" onProcess="processing => testState = 'processed'" />
@@ -443,7 +443,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
         (0, fixtures_1.test)("resultFeedback handles null gracefully", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
             const { testStateDriver } = yield initTestBed(`
         <Fragment>
-          <Queue id="testQueue" resultFeedback="{null}" clearAfterFinish="true" 
+          <Queue id="testQueue" resultFeedback="{null}" clearAfterFinish="true"
                  onProcess="processing => {}"
                  onComplete="() => testState = 'complete'" />
           <Button id="enqueueBtn" label="Enqueue" onClick="testQueue.enqueueItem('test');" />
@@ -468,12 +468,12 @@ fixtures_1.test.describe("Other Edge Cases", () => {
           const id1 = testQueue.enqueueItem('item1');
           const id2 = testQueue.enqueueItem('item2');
           const ids = testQueue.enqueueItems(['item3', 'item4', 'item5']);
-          
+
           // Mix operations
           testQueue.remove(id1);
           const finalLength = testQueue.getQueueLength();
           const items = testQueue.getQueuedItems();
-          
+
           testState = {
             finalLength,
             itemCount: items.length,
@@ -491,10 +491,10 @@ fixtures_1.test.describe("Other Edge Cases", () => {
             itemCount: 0,
             hasId1: true,
             hasId2: true,
-            idsLength: 3
+            idsLength: 3,
         });
     }));
-    (0, fixtures_1.test)("handles processing with errors and recovery", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+    (0, fixtures_1.test)("handles processing with errors and recovery", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
         const { testStateDriver } = yield initTestBed(`
       <Fragment>
         <Queue id="testQueue"
@@ -512,11 +512,9 @@ fixtures_1.test.describe("Other Edge Cases", () => {
     `);
         const buttonDriver = yield createButtonDriver("enqueueBtn");
         yield buttonDriver.component.click();
-        yield fixtures_1.expect.poll(testStateDriver.testState).toEqual([
-            "processed-good1",
-            "error-error",
-            "processed-good2"
-        ]);
+        yield fixtures_1.expect
+            .poll(testStateDriver.testState)
+            .toEqual(["processed-good1", "error-error", "processed-good2"]);
     }));
     (0, fixtures_1.test)("handles very large queue operations", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
         const { testStateDriver } = yield initTestBed(`
@@ -528,7 +526,7 @@ fixtures_1.test.describe("Other Edge Cases", () => {
           for (let i = 0; i < 100; i++) {
             largeArray.push('item-' + i);
           }
-          
+
           const itemIds = testQueue.enqueueItems(largeArray);
           // Check uniqueness without Set
           const uniqueCheck = {};
@@ -556,7 +554,7 @@ fixtures_1.test.describe("Other Edge Cases", () => {
             allUniqueIds: true,
         });
     }));
-    (0, fixtures_1.test)("handles nested object and complex data types", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+    (0, fixtures_1.test)("handles nested object and complex data types", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
         const { testStateDriver } = yield initTestBed(`
       <Fragment>
         <Queue id="testQueue" onProcess="processing => testState = processing.item" />
@@ -577,7 +575,7 @@ fixtures_1.test.describe("Other Edge Cases", () => {
         (0, fixtures_1.expect)(result.nested.deep.value).toBe("test");
         (0, fixtures_1.expect)(result.array).toEqual([1, 2, { key: "value" }]);
     }));
-    (0, fixtures_1.test)("handles rapid state changes during processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+    (0, fixtures_1.test)("handles rapid state changes during processing", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
         const { testStateDriver } = yield initTestBed(`
       <Fragment>
         <Queue id="testQueue"
@@ -594,12 +592,12 @@ fixtures_1.test.describe("Other Edge Cases", () => {
         yield buttonDriver.component.click();
         yield fixtures_1.expect.poll(testStateDriver.testState).toBe(5);
     }));
-    (0, fixtures_1.test)("handles context variables in templates correctly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver }) {
+    (0, fixtures_1.test)("handles context variables in templates correctly", (_a) => __awaiter(void 0, [_a], void 0, function* ({ initTestBed, createButtonDriver, }) {
         const { testStateDriver } = yield initTestBed(`
       <Fragment>
         <Queue id="testQueue" clearAfterFinish="false"
-               onProcess="processing => { 
-                 processing.reportProgress(processing.item); 
+               onProcess="processing => {
+                 processing.reportProgress(processing.item);
                  testState = {
                    queuedItems: testQueue.getQueuedItems().length,
                    item: processing.item
@@ -620,7 +618,7 @@ fixtures_1.test.describe("Other Edge Cases", () => {
         // Verify that the queue processing works with template properties defined
         yield fixtures_1.expect.poll(testStateDriver.testState).toEqual({
             queuedItems: fixtures_1.expect.any(Number),
-            item: fixtures_1.expect.any(String)
+            item: fixtures_1.expect.any(String),
         });
     }));
 });

package/dist/scripts/src/components/Queue/QueueNative.js

@@ -276,7 +276,7 @@ renderProgressFeedback, renderResultFeedback, clearAfterFinish = exports.default
             return;
         }
         let queueItem = queue[0];
-        (() => __awaiter(this, void 0, void 0, function* () {
+        void (() => __awaiter(this, void 0, void 0, function* () {
             yield doSingle(queueItem);
         }))();
     }, [doComplete, doSingle, prevQueue, queue]);

package/dist/scripts/src/components/RadioGroup/RadioGroup.spec.js

@@ -411,7 +411,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     </RadioGroup>
   `);
     const labels = page.locator("label");
-    (0, fixtures_1.expect)(labels).toHaveCount(3);
+    yield (0, fixtures_1.expect)(labels).toHaveCount(3);
     const { left: optionLeft } = yield (0, component_test_helpers_1.getBounds)(labels.nth(1));
     const { right: labelRight } = yield (0, component_test_helpers_1.getBounds)(labels.nth(0));
     (0, fixtures_1.expect)(labelRight).toBeLessThan(optionLeft);
@@ -424,7 +424,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     </RadioGroup>
   `);
     const labels = page.locator("label");
-    (0, fixtures_1.expect)(labels).toHaveCount(3);
+    yield (0, fixtures_1.expect)(labels).toHaveCount(3);
     const { left: optionLeft } = yield (0, component_test_helpers_1.getBounds)(labels.nth(0));
     const { right: labelRight } = yield (0, component_test_helpers_1.getBounds)(labels.nth(2));
     (0, fixtures_1.expect)(labelRight).toBeLessThan(optionLeft);
@@ -437,7 +437,7 @@ fixtures_1.test.describe("Basic Functionality", () => {
     </RadioGroup>
   `);
     const labels = page.locator("label");
-    (0, fixtures_1.expect)(labels).toHaveCount(3);
+    yield (0, fixtures_1.expect)(labels).toHaveCount(3);
     const { left: optionLeft } = yield (0, component_test_helpers_1.getBounds)(labels.nth(0));
     const { right: labelRight } = yield (0, component_test_helpers_1.getBounds)(labels.nth(1));
     (0, fixtures_1.expect)(labelRight).toBeLessThan(optionLeft);
@@ -450,8 +450,8 @@ fixtures_1.test.describe("Basic Functionality", () => {
     </RadioGroup>
   `);
     const labels = page.locator("label");
-    (0, fixtures_1.expect)(labels).toHaveCount(3);
-    (0, fixtures_1.expect)(labels.nth(2)).toHaveText("Option 2");
+    yield (0, fixtures_1.expect)(labels).toHaveCount(3);
+    yield (0, fixtures_1.expect)(labels.nth(2)).toHaveText("Option 2");
     const { left: optionLeft } = yield (0, component_test_helpers_1.getBounds)(labels.nth(0));
     const { right: labelRight } = yield (0, component_test_helpers_1.getBounds)(labels.nth(2));
     (0, fixtures_1.expect)(optionLeft).toBeLessThan(labelRight);

package/dist/scripts/src/components/RealTimeAdapter/RealTimeAdapterNative.js

@@ -76,7 +76,7 @@ class PollClient {
         this.tries = 0;
         this.abortController = new AbortController();
         // console.log("poll client: start polling", this.handlers);
-        this.poll(this.abortController.signal);
+        void this.poll(this.abortController.signal);
     }
     stopPoll() {
         this.polling = false;

package/dist/scripts/src/components/Select/MultiSelectOption.js

@@ -0,0 +1,42 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultiSelectOption = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const SelectContext_1 = require("./SelectContext");
+const classnames_1 = __importDefault(require("classnames"));
+const Select_module_scss_1 = __importDefault(require("./Select.module.scss"));
+const IconNative_1 = __importDefault(require("../Icon/IconNative"));
+exports.MultiSelectOption = (0, react_1.forwardRef)(function MultiSelectOption(option, forwardedRef) {
+    const id = (0, react_1.useId)();
+    const { label, value, enabled = true, keywords, readOnly, children, isHighlighted = false, itemIndex, } = option;
+    const { value: selectedValue, onChange, multiSelect, setOpen, setSelectedIndex, optionRenderer, } = (0, SelectContext_1.useSelect)();
+    const selected = (0, react_1.useMemo)(() => {
+        return Array.isArray(selectedValue) && multiSelect
+            ? selectedValue.map((v) => String(v)).includes(value)
+            : String(selectedValue) === String(value);
+    }, [selectedValue, value, multiSelect]);
+    const handleClick = () => {
+        if (readOnly) {
+            setOpen(false);
+            return;
+        }
+        if (enabled) {
+            onChange(value);
+        }
+    };
+    return ((0, jsx_runtime_1.jsx)("div", { id: id, ref: forwardedRef, role: "option", "aria-disabled": !enabled, "aria-selected": selected, className: (0, classnames_1.default)(Select_module_scss_1.default.multiSelectOption, {
+            [Select_module_scss_1.default.disabledOption]: !enabled,
+            [Select_module_scss_1.default.highlighted]: isHighlighted,
+        }), onMouseDown: (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+        }, onMouseEnter: () => {
+            if (itemIndex !== undefined && setSelectedIndex && enabled) {
+                setSelectedIndex(itemIndex);
+            }
+        }, onClick: handleClick, "data-state": selected ? "checked" : undefined, children: (0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.multiSelectOptionContent, children: optionRenderer ? (optionRenderer({ label, value, enabled, keywords }, selectedValue, false)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children || label, selected && (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "checkmark" })] })) }) }));
+});

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

@@ -5,7 +5,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.selectComponentRenderer = exports.SelectMd = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const Select_module_scss_1 = __importDefault(require("../Select/Select.module.scss"));
+const Select_module_scss_1 = __importDefault(require("./Select.module.scss"));
 const renderers_1 = require("../../components-core/renderers");
 const themeVars_1 = require("../../components-core/theming/themeVars");
 const metadata_helpers_1 = require("../metadata-helpers");
@@ -24,7 +24,7 @@ exports.SelectMd = (0, metadata_helpers_1.createMetadata)({
         initialValue: (0, metadata_helpers_1.dInitialValue)(),
         value: {
             description: "This property sets the current value of the component.",
-            isInternal: true //TODO illesg temp
+            isInternal: true, //TODO illesg temp
         },
         autoFocus: Object.assign(Object.assign({}, (0, metadata_helpers_1.dAutoFocus)()), { defaultValue: SelectNative_1.defaultProps.autoFocus }),
         required: Object.assign(Object.assign({}, (0, metadata_helpers_1.dRequired)()), { defaultValue: SelectNative_1.defaultProps.required }),
@@ -103,7 +103,7 @@ exports.SelectMd = (0, metadata_helpers_1.createMetadata)({
         [`backgroundColor-${COMP}-badge--hover`]: "$color-primary-400",
         [`backgroundColor-${COMP}-badge--active`]: "$color-primary-500",
         [`textColor-item-${COMP}--disabled`]: "$color-surface-200",
-        [`textColor-${COMP}-badge`]: "$color-surface-50",
+        [`textColor-${COMP}-badge`]: "$const-color-surface-50",
         [`backgroundColor-item-${COMP}`]: "$backgroundColor-dropdown-item",
         [`backgroundColor-item-${COMP}--hover`]: "$backgroundColor-dropdown-item--hover",
         [`backgroundColor-item-${COMP}--active`]: "$backgroundColor-dropdown-item--active",