@uxf/ui 11.119.0 → 11.122.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/button/button.stories.js +8 -1
- package/combobox/combobox.stories.js +15 -1
- package/flash-messages/flash-messages.stories.d.ts +1 -0
- package/flash-messages/flash-messages.stories.js +7 -0
- package/icon-button/icon-button.stories.d.ts +1 -0
- package/icon-button/icon-button.stories.js +12 -0
- package/multi-select/multi-select.stories.d.ts +1 -0
- package/multi-select/multi-select.stories.js +18 -0
- package/package.json +7 -7
- package/radio-group/radio-group.stories.d.ts +1 -0
- package/radio-group/radio-group.stories.js +18 -0
- package/select/select.stories.d.ts +1 -0
- package/select/select.stories.js +18 -0
- package/typography/typography.stories.d.ts +1 -0
- package/typography/typography.stories.js +6 -0
package/button/button.stories.js
CHANGED
|
@@ -97,6 +97,7 @@ function Default() {
|
|
|
97
97
|
react_1.default.createElement("hr", null))))))))))));
|
|
98
98
|
}
|
|
99
99
|
function OnlyForE2ETests() {
|
|
100
|
+
const [lastClicked, setLastClicked] = (0, react_1.useState)(null);
|
|
100
101
|
const onClick = console.log;
|
|
101
102
|
return (react_1.default.createElement("div", { className: "space-y-2 p-20" },
|
|
102
103
|
react_1.default.createElement("div", { "data-testid": "card-a" },
|
|
@@ -104,7 +105,13 @@ function OnlyForE2ETests() {
|
|
|
104
105
|
react_1.default.createElement("div", { "data-testid": "card-b" },
|
|
105
106
|
react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm")),
|
|
106
107
|
react_1.default.createElement("div", { "data-testid": "card-c" },
|
|
107
|
-
react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm"))
|
|
108
|
+
react_1.default.createElement(button_1.Button, { onClick: onClick }, "Confirm")),
|
|
109
|
+
react_1.default.createElement(button_1.Button, { onClick: () => setLastClicked("Nevyřešené") }, "Nevy\u0159e\u0161en\u00E9"),
|
|
110
|
+
react_1.default.createElement(button_1.Button, { onClick: () => setLastClicked("Vyřešené") },
|
|
111
|
+
react_1.default.createElement(icon_1.Icon, { name: "check" }),
|
|
112
|
+
"Vy\u0159e\u0161en\u00E9"),
|
|
113
|
+
react_1.default.createElement(button_1.Button, { onClick: () => setLastClicked("Odeslat formulář") }, "Odeslat formul\u00E1\u0159"),
|
|
114
|
+
lastClicked !== null && react_1.default.createElement("div", { "data-testid": "last-clicked" }, lastClicked)));
|
|
108
115
|
}
|
|
109
116
|
function LoadingButton() {
|
|
110
117
|
const clickHandler = () => new Promise((resolve) => setTimeout(resolve, 3000));
|
|
@@ -86,16 +86,30 @@ const e2eLoadOptions = (data) => async (query) => {
|
|
|
86
86
|
await delay(300);
|
|
87
87
|
return data.filter((option) => !query || option.label.toLowerCase().includes(query.toLowerCase()));
|
|
88
88
|
};
|
|
89
|
+
const STAV_OPTIONS = [
|
|
90
|
+
{ id: "nevyresene", label: "Nevyřešené" },
|
|
91
|
+
{ id: "vyresene", label: "Vyřešené" },
|
|
92
|
+
];
|
|
93
|
+
const STAV_PARTIAL_OPTIONS = [
|
|
94
|
+
{ id: "otevrene", label: "Otevřené (5)" },
|
|
95
|
+
{ id: "uzavrene", label: "Uzavřené (12)" },
|
|
96
|
+
];
|
|
89
97
|
function OnlyForE2ETests() {
|
|
90
98
|
const [fruit, setFruit] = (0, react_1.useState)(null);
|
|
91
99
|
const [country, setCountry] = (0, react_1.useState)(null);
|
|
92
100
|
const [color, setColor] = (0, react_1.useState)(null);
|
|
93
101
|
const [size, setSize] = (0, react_1.useState)(null);
|
|
102
|
+
const [stav, setStav] = (0, react_1.useState)(null);
|
|
103
|
+
const [stavPartial, setStavPartial] = (0, react_1.useState)(null);
|
|
94
104
|
return (react_1.default.createElement("div", { className: "space-y-4 p-4" },
|
|
95
105
|
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Fruit", loadOptions: e2eLoadOptions(FRUITS), name: "fruit", onChange: setFruit, placeholder: "Select fruit...", value: fruit }),
|
|
96
106
|
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Country", loadOptions: e2eLoadOptions(COUNTRIES), name: "country", onChange: setCountry, placeholder: "Select country...", value: country }),
|
|
97
107
|
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Color", loadOptions: e2eLoadOptions(COLORS), name: "color", onChange: setColor, placeholder: "Select color...", value: color }),
|
|
98
|
-
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Size", loadOptions: e2eLoadOptions(SIZES), name: "size", onChange: setSize, placeholder: "Select size...", value: size })
|
|
108
|
+
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Size", loadOptions: e2eLoadOptions(SIZES), name: "size", onChange: setSize, placeholder: "Select size...", value: size }),
|
|
109
|
+
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Stav", loadOptions: e2eLoadOptions(STAV_OPTIONS), name: "stav", onChange: setStav, placeholder: "Vyberte stav...", value: stav }),
|
|
110
|
+
stav !== null && react_1.default.createElement("div", { "data-testid": "selected-stav" }, stav.id),
|
|
111
|
+
react_1.default.createElement(index_1.Combobox, { isClearable: true, label: "Stav (partial)", loadOptions: e2eLoadOptions(STAV_PARTIAL_OPTIONS), name: "stav-partial", onChange: setStavPartial, placeholder: "Vyberte stav...", value: stavPartial }),
|
|
112
|
+
stavPartial !== null && react_1.default.createElement("div", { "data-testid": "selected-stav-partial" }, stavPartial.id)));
|
|
99
113
|
}
|
|
100
114
|
function AsynchronousOptions() {
|
|
101
115
|
const [value, setValue] = (0, react_1.useState)(null);
|
|
@@ -4,6 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
6
|
exports.Default = Default;
|
|
7
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
7
8
|
const button_1 = require("@uxf/ui/button");
|
|
8
9
|
const icon_1 = require("@uxf/ui/icon");
|
|
9
10
|
const react_1 = __importDefault(require("react"));
|
|
@@ -50,3 +51,9 @@ function Default() {
|
|
|
50
51
|
message: "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Culpa ex fuga neque. Delectus error, esse eum exercitationem iste iure maiores mollitia officia quasi reiciendis saepe voluptates voluptatum? Commodi, nulla, quo!",
|
|
51
52
|
}) }, "Long text")));
|
|
52
53
|
}
|
|
54
|
+
function OnlyForE2ETests() {
|
|
55
|
+
return (react_1.default.createElement("div", { className: "inline-flex flex-col space-y-4" },
|
|
56
|
+
react_1.default.createElement(button_1.Button, { onClick: () => (0, flash_messages_service_1.flashMessage)({ autoDismiss: false, message: "Vyřešené", variant: "info" }) }, "Zobrazit Vy\u0159e\u0161en\u00E9"),
|
|
57
|
+
react_1.default.createElement(button_1.Button, { onClick: () => (0, flash_messages_service_1.flashMessage)({ autoDismiss: false, message: "Nevyřešené", variant: "info" }) }, "Zobrazit Nevy\u0159e\u0161en\u00E9"),
|
|
58
|
+
react_1.default.createElement(button_1.Button, { onClick: () => (0, flash_messages_service_1.flashMessage)({ autoDismiss: false, message: "Vyřešené - úspěšně zpracováno", variant: "info" }) }, "Zobrazit Vy\u0159e\u0161en\u00E9 (partial)")));
|
|
59
|
+
}
|
|
@@ -34,6 +34,9 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
34
34
|
})();
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
36
|
exports.Default = Default;
|
|
37
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
38
|
+
const button_1 = require("@uxf/ui/button");
|
|
39
|
+
const icon_1 = require("@uxf/ui/icon");
|
|
37
40
|
const storybook_config_1 = require("@uxf/ui/utils/storybook-config");
|
|
38
41
|
const react_1 = __importStar(require("react"));
|
|
39
42
|
const toggle_1 = require("../toggle");
|
|
@@ -65,3 +68,12 @@ function Default() {
|
|
|
65
68
|
config.variants.map((variant) => (react_1.default.createElement(react_1.Fragment, { key: variant }, config.sizes.map((size) => (react_1.default.createElement("div", { className: "flex items-center justify-center gap-2", key: `${size}${color}${variant}` },
|
|
66
69
|
react_1.default.createElement(icon_button_1.IconButton, { color: color, iconName: "user", isDisabled: isDisabled, isLoading: isLoading, label: "User", onClick: onClick, size: size, variant: variant })))))))))))));
|
|
67
70
|
}
|
|
71
|
+
function OnlyForE2ETests() {
|
|
72
|
+
const [lastClicked, setLastClicked] = (0, react_1.useState)(null);
|
|
73
|
+
return (react_1.default.createElement("div", { className: "space-y-4 p-8" },
|
|
74
|
+
react_1.default.createElement(icon_button_1.IconButton, { iconName: "xmark", label: "Zru\u0161it", onClick: () => setLastClicked("Zrušit"), title: "Zru\u0161it" }),
|
|
75
|
+
react_1.default.createElement(icon_button_1.IconButton, { iconName: "check", label: "Potvrdit", onClick: () => setLastClicked("Potvrdit"), title: "Potvrdit" }),
|
|
76
|
+
react_1.default.createElement(button_1.Button, { isIconButton: true, onClick: () => setLastClicked("Smazat"), title: "Smazat" },
|
|
77
|
+
react_1.default.createElement(icon_1.Icon, { name: "trash" })),
|
|
78
|
+
lastClicked !== null && react_1.default.createElement("div", { "data-testid": "last-clicked" }, lastClicked)));
|
|
79
|
+
}
|
|
@@ -34,6 +34,7 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
34
34
|
})();
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
36
|
exports.Default = Default;
|
|
37
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
37
38
|
const react_1 = __importStar(require("react"));
|
|
38
39
|
const action_1 = require("../utils/action");
|
|
39
40
|
const multi_select_1 = require("./multi-select");
|
|
@@ -67,3 +68,20 @@ function Default() {
|
|
|
67
68
|
option.label), value: value }),
|
|
68
69
|
react_1.default.createElement(multi_select_1.MultiSelect, { isDisabled: true, label: "Disabled", name: "disabled", onChange: onChange, options: options, value: value })));
|
|
69
70
|
}
|
|
71
|
+
const e2eOptions = [
|
|
72
|
+
{ id: "nevyresene", label: "Nevyřešené" },
|
|
73
|
+
{ id: "vyresene", label: "Vyřešené" },
|
|
74
|
+
];
|
|
75
|
+
const e2ePartialOptions = [
|
|
76
|
+
{ id: "otevrene", label: "Otevřené (5)" },
|
|
77
|
+
{ id: "uzavrene", label: "Uzavřené (12)" },
|
|
78
|
+
];
|
|
79
|
+
function OnlyForE2ETests() {
|
|
80
|
+
const [value, setValue] = (0, react_1.useState)(null);
|
|
81
|
+
const [partialValue, setPartialValue] = (0, react_1.useState)(null);
|
|
82
|
+
return (react_1.default.createElement("div", { className: "space-y-4 p-8" },
|
|
83
|
+
react_1.default.createElement(multi_select_1.MultiSelect, { label: "Stav", name: "stav", onChange: (v) => setValue(v), options: e2eOptions, placeholder: "Vyberte...", value: value }),
|
|
84
|
+
value !== null && react_1.default.createElement("div", { "data-testid": "selected-value" }, value.join(",")),
|
|
85
|
+
react_1.default.createElement(multi_select_1.MultiSelect, { label: "Stav (partial)", name: "stav-partial", onChange: (v) => setPartialValue(v), options: e2ePartialOptions, placeholder: "Vyberte...", value: partialValue }),
|
|
86
|
+
partialValue !== null && react_1.default.createElement("div", { "data-testid": "selected-partial-value" }, partialValue.join(","))));
|
|
87
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@uxf/ui",
|
|
3
|
-
"version": "11.
|
|
3
|
+
"version": "11.122.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -24,9 +24,9 @@
|
|
|
24
24
|
"@floating-ui/react": "^0.27.17",
|
|
25
25
|
"@headlessui/react": "1.7.19",
|
|
26
26
|
"@uxf/core": "11.114.0",
|
|
27
|
-
"@uxf/core-react": "11.
|
|
28
|
-
"@uxf/datepicker": "11.
|
|
29
|
-
"@uxf/localize": "11.
|
|
27
|
+
"@uxf/core-react": "11.120.0",
|
|
28
|
+
"@uxf/datepicker": "11.120.0",
|
|
29
|
+
"@uxf/localize": "11.120.0",
|
|
30
30
|
"@uxf/styles": "11.114.0",
|
|
31
31
|
"dayjs": "^1.11.19",
|
|
32
32
|
"react": ">= 18.2.0",
|
|
@@ -40,9 +40,9 @@
|
|
|
40
40
|
"@types/react": "18.3.27",
|
|
41
41
|
"@types/react-dom": "18.3.7",
|
|
42
42
|
"@uxf/core": "11.114.0",
|
|
43
|
-
"@uxf/core-react": "11.
|
|
44
|
-
"@uxf/datepicker": "11.
|
|
45
|
-
"@uxf/localize": "11.
|
|
43
|
+
"@uxf/core-react": "11.120.0",
|
|
44
|
+
"@uxf/datepicker": "11.120.0",
|
|
45
|
+
"@uxf/localize": "11.120.0",
|
|
46
46
|
"@uxf/styles": "11.114.0",
|
|
47
47
|
"dayjs": "^1.11.19",
|
|
48
48
|
"react-dropzone": "^14.4.0"
|
|
@@ -34,6 +34,7 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
34
34
|
})();
|
|
35
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
36
36
|
exports.Default = Default;
|
|
37
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
37
38
|
const react_1 = __importStar(require("react"));
|
|
38
39
|
const action_1 = require("../utils/action");
|
|
39
40
|
const index_1 = require("./index");
|
|
@@ -63,3 +64,20 @@ function Default() {
|
|
|
63
64
|
react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant row, radioSize lg", name: "radio-group-variant-row", onChange: onChange, options: options, radioSize: "lg", value: value, variant: "row" })));
|
|
64
65
|
return react_1.default.createElement("div", { className: "rounded p-8" }, testRadioGroups);
|
|
65
66
|
}
|
|
67
|
+
const e2eOptions = [
|
|
68
|
+
{ id: "nevyresene", label: "Nevyřešené" },
|
|
69
|
+
{ id: "vyresene", label: "Vyřešené" },
|
|
70
|
+
];
|
|
71
|
+
const e2ePartialOptions = [
|
|
72
|
+
{ id: "otevrene", label: "Otevřené (5)" },
|
|
73
|
+
{ id: "uzavrene", label: "Uzavřené (12)" },
|
|
74
|
+
];
|
|
75
|
+
function OnlyForE2ETests() {
|
|
76
|
+
const [value, setValue] = (0, react_1.useState)(null);
|
|
77
|
+
const [partialValue, setPartialValue] = (0, react_1.useState)(null);
|
|
78
|
+
return (react_1.default.createElement("div", { className: "space-y-4 p-8" },
|
|
79
|
+
react_1.default.createElement(index_1.RadioGroup, { id: "stav", label: "Stav", name: "stav", onChange: setValue, options: e2eOptions, value: value }),
|
|
80
|
+
value !== null && react_1.default.createElement("div", { "data-testid": "selected-value" }, value),
|
|
81
|
+
react_1.default.createElement(index_1.RadioGroup, { id: "stav-partial", label: "Stav (partial)", name: "stav-partial", onChange: setPartialValue, options: e2ePartialOptions, value: partialValue }),
|
|
82
|
+
partialValue !== null && react_1.default.createElement("div", { "data-testid": "selected-partial-value" }, partialValue)));
|
|
83
|
+
}
|
package/select/select.stories.js
CHANGED
|
@@ -37,6 +37,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
37
37
|
};
|
|
38
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
39
39
|
exports.Default = Default;
|
|
40
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
40
41
|
exports.ComponentStructure = ComponentStructure;
|
|
41
42
|
const react_1 = __importStar(require("react"));
|
|
42
43
|
const action_1 = require("../utils/action");
|
|
@@ -80,6 +81,23 @@ function Default() {
|
|
|
80
81
|
return (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" },
|
|
81
82
|
react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" }, storyComboboxes)));
|
|
82
83
|
}
|
|
84
|
+
const e2eOptions = [
|
|
85
|
+
{ id: "nevyresene", label: "Nevyřešené" },
|
|
86
|
+
{ id: "vyresene", label: "Vyřešené" },
|
|
87
|
+
];
|
|
88
|
+
const e2ePartialOptions = [
|
|
89
|
+
{ id: "otevrene", label: "Otevřené (5)" },
|
|
90
|
+
{ id: "uzavrene", label: "Uzavřené (12)" },
|
|
91
|
+
];
|
|
92
|
+
function OnlyForE2ETests() {
|
|
93
|
+
const [value, setValue] = (0, react_1.useState)(null);
|
|
94
|
+
const [partialValue, setPartialValue] = (0, react_1.useState)(null);
|
|
95
|
+
return (react_1.default.createElement("div", { className: "space-y-4 p-8" },
|
|
96
|
+
react_1.default.createElement(index_1.Select, { label: "Stav", name: "stav", onChange: setValue, options: e2eOptions, placeholder: "Vyberte...", value: value }),
|
|
97
|
+
value !== null && react_1.default.createElement("div", { "data-testid": "selected-value" }, String(value)),
|
|
98
|
+
react_1.default.createElement(index_1.Select, { label: "Stav (partial)", name: "stav-partial", onChange: setPartialValue, options: e2ePartialOptions, placeholder: "Vyberte...", value: partialValue }),
|
|
99
|
+
partialValue !== null && react_1.default.createElement("div", { "data-testid": "selected-partial-value" }, String(partialValue))));
|
|
100
|
+
}
|
|
83
101
|
function ComponentStructure() {
|
|
84
102
|
const [value, onChange] = (0, react_1.useState)(null);
|
|
85
103
|
return (react_1.default.createElement(component_structure_analyzer_1.default, null,
|
|
@@ -3,8 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.OnlyForE2ETests = OnlyForE2ETests;
|
|
6
7
|
exports.Default = Default;
|
|
7
8
|
const react_1 = __importDefault(require("react"));
|
|
9
|
+
function OnlyForE2ETests() {
|
|
10
|
+
return (react_1.default.createElement("div", null,
|
|
11
|
+
react_1.default.createElement("h1", null, "Text bez pevn\u00E9 mezery"),
|
|
12
|
+
react_1.default.createElement("h1", null, "Text s\u00A0pevnou mezerou")));
|
|
13
|
+
}
|
|
8
14
|
function Default() {
|
|
9
15
|
return (react_1.default.createElement("div", { className: "space-y-4 dark:text-white" },
|
|
10
16
|
react_1.default.createElement("h1", { className: "uxf-typo-h1" }, ".uxf-typo-h1"),
|