@uxf/ui 11.117.2 → 11.118.2

package/button/button.stories.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
 export declare function Basic(): React.JSX.Element;
 export declare function Default(): React.JSX.Element;
+export declare function OnlyForE2ETests(): React.JSX.Element;
 export declare function LoadingButton(): React.JSX.Element;

package/button/button.stories.js

@@ -35,6 +35,7 @@ var __importStar = (this && this.__importStar) || (function () {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Basic = Basic;
 exports.Default = Default;
+exports.OnlyForE2ETests = OnlyForE2ETests;
 exports.LoadingButton = LoadingButton;
 const button_1 = require("@uxf/ui/button");
 const icon_1 = require("@uxf/ui/icon");
@@ -95,6 +96,16 @@ function Default() {
         react_1.default.createElement(button_1.Button, { color: color, isFullWidth: true, onClick: onClick, size: size, variant: variant }, "Full width"),
         react_1.default.createElement("hr", null))))))))))));
 }
+function OnlyForE2ETests() {
+    const onClick = console.log;
+    return (react_1.default.createElement("div", { className: "space-y-2 p-20" },
+        react_1.default.createElement("div", { "data-testid": "card-a" },
+            react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm")),
+        react_1.default.createElement("div", { "data-testid": "card-b" },
+            react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm")),
+        react_1.default.createElement("div", { "data-testid": "card-c" },
+            react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm"))));
+}
 function LoadingButton() {
     const clickHandler = () => new Promise((resolve) => setTimeout(resolve, 3000));
     return (react_1.default.createElement("div", { className: "p-4" },

package/combobox/combobox.stories.d.ts

@@ -1,3 +1,4 @@
 import React from "react";
 export declare function SynchronousOptions(): React.JSX.Element;
+export declare function OnlyForE2ETests(): React.JSX.Element;
 export declare function AsynchronousOptions(): React.JSX.Element;

package/combobox/combobox.stories.js

@@ -34,6 +34,7 @@ var __importStar = (this && this.__importStar) || (function () {
 })();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SynchronousOptions = SynchronousOptions;
+exports.OnlyForE2ETests = OnlyForE2ETests;
 exports.AsynchronousOptions = AsynchronousOptions;
 const react_1 = __importStar(require("react"));
 const action_1 = require("../utils/action");
@@ -56,6 +57,46 @@ function SynchronousOptions() {
                 option.label,
                 isSelected && " (selected)")), value: value })));
 }
+const FRUITS = [
+    { id: "apple", label: "Apple" },
+    { id: "banana", label: "Banana" },
+    { id: "cherry", label: "Cherry" },
+    { id: "mango", label: "Mango" },
+];
+const COUNTRIES = [
+    { id: "cz", label: "Czech Republic" },
+    { id: "sk", label: "Slovakia" },
+    { id: "de", label: "Germany" },
+    { id: "at", label: "Austria" },
+];
+const COLORS = [
+    { id: "red", label: "Red" },
+    { id: "green", label: "Green" },
+    { id: "blue", label: "Blue" },
+    { id: "yellow", label: "Yellow" },
+];
+const SIZES = [
+    { id: "xs", label: "Extra Small" },
+    { id: "sm", label: "Small" },
+    { id: "md", label: "Medium" },
+    { id: "lg", label: "Large" },
+];
+const delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+const e2eLoadOptions = (data) => async (query) => {
+    await delay(300);
+    return data.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()));
+};
+function OnlyForE2ETests() {
+    const [fruit, setFruit] = (0, react_1.useState)(null);
+    const [country, setCountry] = (0, react_1.useState)(null);
+    const [color, setColor] = (0, react_1.useState)(null);
+    const [size, setSize] = (0, react_1.useState)(null);
+    return (react_1.default.createElement("div", { className: "space-y-4 p-4" },
+        react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Fruit", loadOptions: e2eLoadOptions(FRUITS), name: "fruit", onChange: setFruit, placeholder: "Select fruit...", value: fruit }),
+        react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Country", loadOptions: e2eLoadOptions(COUNTRIES), name: "country", onChange: setCountry, placeholder: "Select country...", value: country }),
+        react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Color", loadOptions: e2eLoadOptions(COLORS), name: "color", onChange: setColor, placeholder: "Select color...", value: color }),
+        react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Size", loadOptions: e2eLoadOptions(SIZES), name: "size", onChange: setSize, placeholder: "Select size...", value: size })));
+}
 function AsynchronousOptions() {
     const [value, setValue] = (0, react_1.useState)(null);
     const onChange = (0, action_1.action)("onChange", setValue);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@uxf/ui",
-    "version": "11.117.2",
+    "version": "11.118.2",
     "description": "",
     "publishConfig": {
         "access": "public"