@uxf/ui 11.31.0 → 11.33.0

package/paper/paper.js

@@ -28,6 +28,6 @@ const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importStar(require("react"));
 exports.Paper = (0, react_1.forwardRef)((props, ref) => {
     const paperClassName = (0, cx_1.cx)("uxf-paper", props.className);
-    return (react_1.default.createElement("div", { ref: ref, className: paperClassName }, props.children));
+    return (react_1.default.createElement("div", { className: paperClassName, ref: ref }, props.children));
 });
 exports.Paper.displayName = "UxfUiPaper";

package/paper/paper.stories.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.Default = Default;
 const react_1 = __importDefault(require("react"));
 const paper_1 = require("./paper");
 exports.default = {
@@ -15,4 +15,3 @@ function Default() {
         react_1.default.createElement(paper_1.Paper, null,
             react_1.default.createElement("div", { className: "flex items-center justify-center p-24" }, "Paper default"))));
 }
-exports.Default = Default;

package/radio/radio.stories.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.Default = Default;
 const react_1 = __importDefault(require("react"));
 const index_1 = require("./index");
 exports.default = {
@@ -14,21 +14,20 @@ function Default() {
     const radios = (react_1.default.createElement("div", { className: "dark:text-white" },
         react_1.default.createElement("div", { className: "mb-2 mt-4 font-semibold" }, "Default"),
         react_1.default.createElement("div", { className: "flex flex-row gap-4" },
-            react_1.default.createElement(index_1.Radio, { checked: false, value: 1, name: "radio-1" }),
-            react_1.default.createElement(index_1.Radio, { checked: true, value: 2, name: "radio-2" })),
+            react_1.default.createElement(index_1.Radio, { checked: false, name: "radio-1", value: 1 }),
+            react_1.default.createElement(index_1.Radio, { checked: true, name: "radio-2", value: 2 })),
         react_1.default.createElement("div", { className: "mb-2 mt-4 font-semibold" }, "Invalid"),
         react_1.default.createElement("div", { className: "flex flex-row gap-4" },
-            react_1.default.createElement(index_1.Radio, { checked: false, isInvalid: true, value: 1, name: "radio-invalid-1" }),
-            react_1.default.createElement(index_1.Radio, { checked: true, isInvalid: true, value: 2, name: "radio-invalid-2" })),
+            react_1.default.createElement(index_1.Radio, { checked: false, isInvalid: true, name: "radio-invalid-1", value: 1 }),
+            react_1.default.createElement(index_1.Radio, { checked: true, isInvalid: true, name: "radio-invalid-2", value: 2 })),
         react_1.default.createElement("div", { className: "mb-2 mt-4 font-semibold" }, "Disabled"),
         react_1.default.createElement("div", { className: "flex flex-row gap-4" },
-            react_1.default.createElement(index_1.Radio, { checked: false, isDisabled: true, value: 1, name: "radio-disabled-1" }),
-            react_1.default.createElement(index_1.Radio, { checked: true, isDisabled: true, value: 2, name: "radio-disabled-2" })),
+            react_1.default.createElement(index_1.Radio, { checked: false, isDisabled: true, name: "radio-disabled-1", value: 1 }),
+            react_1.default.createElement(index_1.Radio, { checked: true, isDisabled: true, name: "radio-disabled-2", value: 2 })),
         react_1.default.createElement("div", { className: "mb-2 mt-4 font-semibold" }, "size lg"),
         react_1.default.createElement("div", { className: "flex flex-row gap-4" },
-            react_1.default.createElement(index_1.Radio, { checked: false, size: "lg", value: 1, name: "radio-size-lg-1" }),
-            react_1.default.createElement(index_1.Radio, { checked: true, size: "lg", value: 2, name: "radio-size-lg-2" }))));
+            react_1.default.createElement(index_1.Radio, { checked: false, name: "radio-size-lg-1", size: "lg", value: 1 }),
+            react_1.default.createElement(index_1.Radio, { checked: true, name: "radio-size-lg-2", size: "lg", value: 2 }))));
     return (react_1.default.createElement("div", { className: "flex" },
         react_1.default.createElement("div", { className: "p-20" }, radios)));
 }
-exports.Default = Default;

package/radio-group/radio-group.js

@@ -45,7 +45,7 @@ exports.RadioGroup = (0, react_2.forwardRef)((props, ref) => {
         react_2.default.createElement("div", { className: "uxf-form-component__input" },
             react_2.default.createElement("div", { className: "uxf-radio-group__options-wrapper" }, props.options.map((option) => (react_2.default.createElement(react_1.RadioGroup.Option, { className: (0, cx_1.cx)("uxf-radio-group__option", props.isDisabled && classes_1.CLASSES.IS_DISABLED), disabled: option.disabled, key: option.id.toString(), value: option.id }, (o) => (react_2.default.createElement("div", { className: (0, cx_1.cx)("uxf-radio-group__option-wrapper", o.checked && classes_1.CLASSES.IS_SELECTED) },
                 react_2.default.createElement("span", { className: "uxf-radio-group__option-label" }, option.label),
-                react_2.default.createElement(radio_1.Radio, { checked: o.checked, isDisabled: props.isDisabled || o.disabled, isInvalid: props.isInvalid, ref: o.checked ? innerRef : undefined, size: radioSize, value: option.id, name: props.name }))))))),
+                react_2.default.createElement(radio_1.Radio, { checked: o.checked, isDisabled: props.isDisabled || o.disabled, isInvalid: props.isInvalid, name: props.name, ref: o.checked ? innerRef : undefined, size: radioSize, value: option.id }))))))),
             props.helperText && (react_2.default.createElement("div", { className: (0, cx_1.cx)("uxf-helper-text", props.isInvalid && classes_1.CLASSES.IS_INVALID), id: errorId }, props.helperText)))));
 });
 exports.RadioGroup.displayName = "UxfUiRadioGroup";

package/radio-group/radio-group.stories.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.Default = Default;
 const react_1 = __importStar(require("react"));
 const action_1 = require("../utils/action");
 const index_1 = require("./index");
@@ -46,15 +46,14 @@ const options = [
     },
 ];
 function Default() {
-    const [value, setValue] = (0, react_1.useState)(options[0].id);
+    var _a, _b;
+    const [value, setValue] = (0, react_1.useState)((_b = (_a = options.at(0)) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : null);
     const onChange = (0, action_1.action)("onChange", setValue);
     const testRadioGroups = (react_1.default.createElement("div", { className: "space-y-10" },
-        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Light Radio group", onChange: onChange, options: options, value: value, name: "radio-group-light" }),
-        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant radio button", onChange: onChange, options: options, value: value, variant: "radioButton", name: "radio-group" }),
-        react_1.default.createElement(index_1.RadioGroup, { hiddenLabel: true, id: "radiogroup", label: "Radio group variant row with hidden label", onChange: onChange, options: options, value: value, variant: "row", name: "radio-group-hidden-label" }),
-        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant column, radioSize default", onChange: onChange, options: options, value: value, variant: "column", radioSize: "default", name: "radio-group-variant-column" }),
-        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant row, radioSize lg", onChange: onChange, options: options, value: value, variant: "row", radioSize: "lg", name: "radio-group-variant-row" })));
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { className: "rounded p-8" }, testRadioGroups)));
+        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Light Radio group", name: "radio-group-light", onChange: onChange, options: options, value: value }),
+        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant radio button", name: "radio-group", onChange: onChange, options: options, value: value, variant: "radioButton" }),
+        react_1.default.createElement(index_1.RadioGroup, { hiddenLabel: true, id: "radiogroup", label: "Radio group variant row with hidden label", name: "radio-group-hidden-label", onChange: onChange, options: options, value: value, variant: "row" }),
+        react_1.default.createElement(index_1.RadioGroup, { id: "radiogroup", label: "Radio group variant column, radioSize default", name: "radio-group-variant-column", onChange: onChange, options: options, radioSize: "default", value: value, variant: "column" }),
+        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" })));
+    return react_1.default.createElement("div", { className: "rounded p-8" }, testRadioGroups);
 }
-exports.Default = Default;

package/raster-image/empty-image.js

@@ -3,11 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.EmptyImage = void 0;
+exports.EmptyImage = EmptyImage;
 const react_1 = __importDefault(require("react"));
 function EmptyImage(props) {
     return (react_1.default.createElement("picture", { className: `uxf-raster-image--no-image ${props.className}` },
         react_1.default.createElement("img", { alt: props.alt, className: props.imgClassName, height: 1, src: "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==", width: 1 }),
         props.noImageContent));
 }
-exports.EmptyImage = EmptyImage;

package/raster-image/img-sources.js

@@ -3,14 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ImgSources = void 0;
+exports.ImgSources = ImgSources;
 const hide_1 = require("@uxf/core-react/components/hide");
 const image_1 = require("@uxf/core/utils/image");
 const is_empty_1 = require("@uxf/core/utils/is-empty");
 const is_not_nil_1 = require("@uxf/core/utils/is-not-nil");
 const react_1 = __importDefault(require("react"));
 function ImgSources(props) {
-    var _a, _b, _c, _d, _e;
+    var _a, _b;
     if ((0, image_1.isSrcString)(props.src) && (0, is_empty_1.isEmpty)(props.src)) {
         return null;
     }
@@ -27,19 +27,18 @@ function ImgSources(props) {
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement(hide_1.Hide, { when: Boolean((_a = props.options) === null || _a === void 0 ? void 0 : _a.isAvifDisabled) },
             react_1.default.createElement("source", { media: media, srcSet: (0, image_1.getImgSrcSet)(props.src, props.width, props.height, {
-                    ...((_b = props.options) !== null && _b !== void 0 ? _b : {}),
+                    ...props.options,
                     quality: (0, image_1.getImgQuality)(props.quality, "avif"),
                     toFormat: "avif",
                 }), type: "image/avif" })),
-        react_1.default.createElement(hide_1.Hide, { when: Boolean((_c = props.options) === null || _c === void 0 ? void 0 : _c.isWebPDisabled) },
+        react_1.default.createElement(hide_1.Hide, { when: Boolean((_b = props.options) === null || _b === void 0 ? void 0 : _b.isWebPDisabled) },
             react_1.default.createElement("source", { media: media, srcSet: (0, image_1.getImgSrcSet)(props.src, props.width, props.height, {
-                    ...((_d = props.options) !== null && _d !== void 0 ? _d : {}),
+                    ...props.options,
                     quality: (0, image_1.getImgQuality)(props.quality, "webp"),
                     toFormat: "webp",
                 }), type: "image/webp" })),
         react_1.default.createElement("source", { media: media, srcSet: (0, image_1.getImgSrcSet)(props.src, props.width, props.height, {
-                ...((_e = props.options) !== null && _e !== void 0 ? _e : {}),
+                ...props.options,
                 quality: (0, image_1.getImgQuality)(props.quality, "original"),
             }) })));
 }
-exports.ImgSources = ImgSources;

package/raster-image/raster-image.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RasterImage = void 0;
+exports.RasterImage = RasterImage;
 const cx_1 = require("@uxf/core/utils/cx");
 const image_1 = require("@uxf/core/utils/image");
 const resizer_1 = require("@uxf/core/utils/resizer");
@@ -11,7 +11,7 @@ const react_1 = __importDefault(require("react"));
 const empty_image_1 = require("./empty-image");
 const responsive_img_sources_1 = require("./responsive-img-sources");
 function RasterImage(props) {
-    var _a, _b, _c;
+    var _a, _b;
     const className = (0, cx_1.cx)("uxf-raster-image", props.mode === "contain" && "uxf-raster-image--contain", props.mode === "cover" && "uxf-raster-image--cover", props.className);
     const imgClassName = (0, cx_1.cx)("uxf-raster-image__img", props.mode === "contain" && "uxf-raster-image__img--contain", props.mode === "cover" && "uxf-raster-image__img--cover", props.imgClassName);
     if (!props.src) {
@@ -23,7 +23,7 @@ function RasterImage(props) {
             react_1.default.createElement("img", { alt: props.alt, className: imgClassName, height: props.height, loading: props.loading, src: svgUrl, width: props.width })));
     }
     const resizerSrc = (0, resizer_1.resizerImageUrl)(props.src, (_a = props.width) !== null && _a !== void 0 ? _a : "auto", (_b = props.height) !== null && _b !== void 0 ? _b : "auto", {
-        ...((_c = props.options) !== null && _c !== void 0 ? _c : {}),
+        ...props.options,
         quality: (0, image_1.getImgQuality)(props.quality, "original"),
     });
     if (resizerSrc) {
@@ -33,5 +33,4 @@ function RasterImage(props) {
     }
     return (react_1.default.createElement(empty_image_1.EmptyImage, { alt: props.alt, className: className, imgClassName: imgClassName, noImageContent: props.noImageContent }));
 }
-exports.RasterImage = RasterImage;
 RasterImage.displayName = "UxfUiRasterImage";

package/raster-image/raster-image.stories.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.Default = Default;
 const react_1 = __importDefault(require("react"));
 const index_1 = require("./index");
 exports.default = {
@@ -12,6 +12,5 @@ exports.default = {
 };
 function Default() {
     return (react_1.default.createElement("div", { className: "space-y-2" },
-        react_1.default.createElement(index_1.RasterImage, { alt: "Alt text", height: 100, width: 300, mode: "cover", src: undefined })));
+        react_1.default.createElement(index_1.RasterImage, { alt: "Alt text", height: 100, mode: "cover", src: undefined, width: 300 })));
 }
-exports.Default = Default;

package/raster-image/responsive-img-sources.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ResponsiveImgSources = void 0;
+exports.ResponsiveImgSources = ResponsiveImgSources;
 const react_1 = __importDefault(require("react"));
 const context_1 = require("../context");
 const img_sources_1 = require("./img-sources");
@@ -17,4 +17,3 @@ function ResponsiveImgSources(props) {
                 ? Math.ceil((props.height / props.width) * w)
                 : "auto", key: `${w}-${i}`, options: props.options, quality: props.quality, src: props.src, width: w }))).reverse()) !== null && _c !== void 0 ? _c : (react_1.default.createElement(img_sources_1.ImgSources, { height: (_d = props.height) !== null && _d !== void 0 ? _d : "auto", options: props.options, quality: props.quality, src: props.src, width: (_e = props.width) !== null && _e !== void 0 ? _e : "auto" }))));
 }
-exports.ResponsiveImgSources = ResponsiveImgSources;

package/readmes.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="mdx" />
 import alertBubbleReadme from "./alert-bubble/README.md";
 export declare const readmes: {
     readonly "alert-bubble": typeof alertBubbleReadme;

package/select/select.js

@@ -23,7 +23,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Select = void 0;
+exports.Select = Select;
 const react_1 = require("@floating-ui/react");
 const react_2 = require("@headlessui/react");
 const show_1 = require("@uxf/core-react/components/show");
@@ -79,11 +79,11 @@ function Select(props) {
             react_3.default.createElement("div", { className: "uxf-form-component__label" },
                 react_3.default.createElement(react_2.Listbox.Label, { as: label_1.Label, isHidden: props.hiddenLabel, onClick: isNotInteractive ? undefined : input.focus }, props.label)),
             react_3.default.createElement("div", { className: "uxf-form-component__input" },
-                react_3.default.createElement(react_2.Listbox.Button, { as: input_1.Input, "aria-invalid": props.isInvalid, "aria-describedby": errorId, className: (0, cx_1.cx)("uxf-select__button", dropdown.placement === "bottom" && `${classes_1.CLASSES.IS_OPEN}--bottom`, dropdown.placement === "top" && `${classes_1.CLASSES.IS_OPEN}--top`, renderProps.open && classes_1.CLASSES.IS_OPEN), customInputElementDisplayName: (_a = SelectedValue.displayName) !== null && _a !== void 0 ? _a : "", inputFocus: input, inputGroupRef: stableRef, inputWrapperRef: props.inputWrapperRef, isDisabled: props.isDisabled, isFocused: renderProps.open, isInvalid: props.isInvalid, isReadOnly: props.isReadOnly, ref: props.inputRef, size: props.size, variant: props.variant },
+                react_3.default.createElement(react_2.Listbox.Button, { "aria-describedby": errorId, "aria-invalid": props.isInvalid, as: input_1.Input, className: (0, cx_1.cx)("uxf-select__button", dropdown.placement === "bottom" && `${classes_1.CLASSES.IS_OPEN}--bottom`, dropdown.placement === "top" && `${classes_1.CLASSES.IS_OPEN}--top`, renderProps.open && classes_1.CLASSES.IS_OPEN), customInputElementDisplayName: (_a = SelectedValue.displayName) !== null && _a !== void 0 ? _a : "", inputFocus: input, inputGroupRef: stableRef, inputWrapperRef: props.inputWrapperRef, isDisabled: props.isDisabled, isFocused: renderProps.open, isInvalid: props.isInvalid, isReadOnly: props.isReadOnly, ref: props.inputRef, size: props.size, variant: props.variant },
                     props.leftAddon && react_3.default.createElement(input_1.Input.LeftAddon, null, props.leftAddon),
                     props.leftElement && react_3.default.createElement(input_1.Input.LeftElement, null, props.leftElement),
                     react_3.default.createElement(SelectedValue, { isEmpty: (0, is_nil_1.isNil)(selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) }, selectedOption
-                        ? (_c = (_b = props.renderSelectedOption) === null || _b === void 0 ? void 0 : _b.call(props, selectedOption)) !== null && _c !== void 0 ? _c : selectedOption.label
+                        ? ((_c = (_b = props.renderSelectedOption) === null || _b === void 0 ? void 0 : _b.call(props, selectedOption)) !== null && _c !== void 0 ? _c : selectedOption.label)
                         : props.placeholder),
                     react_3.default.createElement(input_1.Input.RightElement, null,
                         react_3.default.createElement(show_1.Show, { when: Boolean(props.isClearable) && (0, is_not_nil_1.isNotNil)(value) && !isNotInteractive },
@@ -97,5 +97,4 @@ function Select(props) {
                     react_3.default.createElement("div", { className: (0, cx_1.cx)("uxf-helper-text", props.isInvalid && classes_1.CLASSES.IS_INVALID), id: errorId }, props.helperText)))));
     }));
 }
-exports.Select = Select;
 Select.displayName = "UxfUiSelect";

package/select/select.stories.js

@@ -26,7 +26,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentStructure = exports.Default = void 0;
+exports.Default = Default;
+exports.ComponentStructure = ComponentStructure;
 const react_1 = __importStar(require("react"));
 const action_1 = require("../utils/action");
 const component_structure_analyzer_1 = __importDefault(require("../utils/component-structure-analyzer"));
@@ -51,29 +52,27 @@ function Default() {
         setValue(v);
     });
     const storyComboboxes = (react_1.default.createElement("div", { className: "space-y-8" },
-        react_1.default.createElement(index_1.Select, { dropdownMaxHeight: 350, helperText: "Helper text", label: "Default select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select" }),
-        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isInvalid: true, label: "Invalid select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, isClearable: true, name: "select-invalid" }),
-        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isDisabled: true, label: "Disabled select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-disabled" }),
-        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isReadOnly: true, label: "Read only select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-read-only" }),
-        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isRequired: true, label: "Required select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-required" }),
-        react_1.default.createElement(index_1.Select, { dropdownPlacement: "top", isRequired: true, label: "Select with dropdown top", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-required-dropdown-top" }),
-        react_1.default.createElement(index_1.Select, { helperText: "Helper text of Select with hidden label", hiddenLabel: true, label: "Hidden label", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-hidden-label" }),
-        react_1.default.createElement(index_1.Select, { label: "Size sm", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, size: "small", name: "select-size-sm" }),
-        react_1.default.createElement(index_1.Select, { label: "Size default", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, name: "select-size-default" }),
-        react_1.default.createElement(index_1.Select, { label: "Size lg", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, size: "large", name: "select-size-lg" }),
-        react_1.default.createElement(index_1.Select, { label: "RenderOption & RenderSelectedOption", onChange: onChange, options: options, placeholder: "Vyberte...", value: value, renderOption: (option, isSelected) => (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(index_1.Select, { dropdownMaxHeight: 350, helperText: "Helper text", label: "Default select", name: "select", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isClearable: true, isInvalid: true, label: "Invalid select", name: "select-invalid", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isDisabled: true, label: "Disabled select", name: "select-disabled", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isReadOnly: true, label: "Read only select", name: "select-read-only", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { helperText: "Helper text", isRequired: true, label: "Required select", name: "select-required", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { dropdownPlacement: "top", isRequired: true, label: "Select with dropdown top", name: "select-required-dropdown-top", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { helperText: "Helper text of Select with hidden label", hiddenLabel: true, label: "Hidden label", name: "select-hidden-label", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { label: "Size sm", name: "select-size-sm", onChange: onChange, options: options, placeholder: "Vyberte...", size: "small", value: value }),
+        react_1.default.createElement(index_1.Select, { label: "Size default", name: "select-size-default", onChange: onChange, options: options, placeholder: "Vyberte...", value: value }),
+        react_1.default.createElement(index_1.Select, { label: "Size lg", name: "select-size-lg", onChange: onChange, options: options, placeholder: "Vyberte...", size: "large", value: value }),
+        react_1.default.createElement(index_1.Select, { label: "RenderOption & RenderSelectedOption", name: "select-render-option", onChange: onChange, options: options, placeholder: "Vyberte...", renderOption: (option, isSelected) => (react_1.default.createElement(react_1.default.Fragment, null,
                 "Option: ",
                 option.label,
                 isSelected && " (selected)")), renderSelectedOption: (option) => react_1.default.createElement(react_1.default.Fragment, null,
                 "Selected: ",
-                option.label), name: "select-render-option" })));
+                option.label), value: value })));
     return (react_1.default.createElement("div", { className: "flex flex-col lg:flex-row" },
         react_1.default.createElement("div", { className: "space-y-2 p-20 lg:w-1/2" }, storyComboboxes)));
 }
-exports.Default = Default;
 function ComponentStructure() {
     const [value, onChange] = (0, react_1.useState)(null);
     return (react_1.default.createElement(component_structure_analyzer_1.default, null,
-        react_1.default.createElement(index_1.Select, { id: "select-1", name: "select", label: "Choose option...", options: options, onChange: onChange, value: value })));
+        react_1.default.createElement(index_1.Select, { id: "select-1", label: "Choose option...", name: "select", onChange: onChange, options: options, value: value })));
 }
-exports.ComponentStructure = ComponentStructure;

package/tabs/components/tabs-button-list.js

@@ -23,14 +23,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabsButtonList = exports.Component = void 0;
+exports.TabsButtonList = void 0;
+exports.Component = Component;
 const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importStar(require("react"));
 function Component(props, ref) {
     var _a;
     return (
     // eslint-disable-next-line jsx-a11y/interactive-supports-focus
-    react_1.default.createElement("div", { ref: ref, className: (0, cx_1.cx)("uxf-tabs__button-list", props.isVertical ? "uxf-tabs__button-list--vertical" : "uxf-tabs__button-list--horizontal", `uxf-tabs__button-list--variant-${(_a = props.variant) !== null && _a !== void 0 ? _a : "default"}`, props.className), role: "tablist", onKeyDown: props.onKeyDown, style: props.style }, props.children));
+    react_1.default.createElement("div", { className: (0, cx_1.cx)("uxf-tabs__button-list", props.isVertical ? "uxf-tabs__button-list--vertical" : "uxf-tabs__button-list--horizontal", `uxf-tabs__button-list--variant-${(_a = props.variant) !== null && _a !== void 0 ? _a : "default"}`, props.className), onKeyDown: props.onKeyDown, ref: ref, role: "tablist", style: props.style }, props.children));
 }
-exports.Component = Component;
 exports.TabsButtonList = (0, react_1.forwardRef)(Component);

package/tabs/components/tabs-button.js

@@ -23,7 +23,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabsButton = exports.Component = void 0;
+exports.TabsButton = void 0;
+exports.Component = Component;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importStar(require("react"));
@@ -33,7 +34,6 @@ function Component(props, ref) {
         return null;
     }
     const className = (0, cx_1.cx)("uxf-tabs__button", `uxf-tabs__button--variant-${(_a = props.variant) !== null && _a !== void 0 ? _a : "default"}`, props.isVertical ? "uxf-tabs__button--vertical" : "uxf-tabs__button--horizontal", props.isActive && `uxf-tabs__button--${classes_1.CLASSES.IS_ACTIVE} ${classes_1.CLASSES.IS_ACTIVE}`, props.isDisabled && `uxf-tabs__button--${classes_1.CLASSES.IS_DISABLED} ${classes_1.CLASSES.IS_DISABLED}`, props.className);
-    return (react_1.default.createElement("button", { id: props.id, ref: ref, className: className, onClick: props.isDisabled ? undefined : props.onClick, role: "tab", tabIndex: props.isActive ? undefined : -1, "aria-selected": props.isActive }, props.children));
+    return (react_1.default.createElement("button", { "aria-selected": props.isActive, className: className, id: props.id, onClick: props.isDisabled ? undefined : props.onClick, ref: ref, role: "tab", tabIndex: props.isActive ? undefined : -1 }, props.children));
 }
-exports.Component = Component;
 exports.TabsButton = (0, react_1.forwardRef)(Component);

package/tabs/components/tabs-panel.js

@@ -3,11 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabsPanel = void 0;
+exports.TabsPanel = TabsPanel;
 const classes_1 = require("@uxf/core/constants/classes");
 const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importDefault(require("react"));
 function TabsPanel(props) {
     return props.isAlwaysMounted || props.isActive ? (react_1.default.createElement("div", { className: (0, cx_1.cx)("uxf-tabs__panel", !props.isActive && `uxf-tabs__panel--${classes_1.CLASSES.IS_HIDDEN} ${classes_1.CLASSES.IS_HIDDEN}`, props.className) }, props.children)) : null;
 }
-exports.TabsPanel = TabsPanel;

package/tabs/components/tabs-panels.js

@@ -3,9 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabsPanels = void 0;
+exports.TabsPanels = TabsPanels;
 const react_1 = __importDefault(require("react"));
 function TabsPanels(props) {
     return react_1.default.createElement("div", { className: "uxf-tabs__panels" }, props.children);
 }
-exports.TabsPanels = TabsPanels;

package/tabs/components/tabs-root.js

@@ -3,11 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TabsRoot = void 0;
+exports.TabsRoot = TabsRoot;
 const cx_1 = require("@uxf/core/utils/cx");
 const react_1 = __importDefault(require("react"));
 function TabsRoot(props) {
     var _a;
     return (react_1.default.createElement("div", { className: (0, cx_1.cx)("uxf-tabs", `uxf-tabs--variant-${(_a = props.variant) !== null && _a !== void 0 ? _a : "default"}`, props.isVertical ? "uxf-tabs--vertical" : "uxf-tabs--horizontal", props.className) }, props.children));
 }
-exports.TabsRoot = TabsRoot;

package/tabs/panel.js

@@ -1,11 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TABS_PANEL_DISPLAY_NAME = exports.Panel = void 0;
+exports.TABS_PANEL_DISPLAY_NAME = void 0;
+exports.Panel = Panel;
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 function Panel(props) {
     // this is never rendered
     return null;
 }
-exports.Panel = Panel;
 exports.TABS_PANEL_DISPLAY_NAME = "UxfUiTabPanel";
 Panel.displayName = exports.TABS_PANEL_DISPLAY_NAME;

package/tabs/tabs.js

@@ -64,10 +64,12 @@ function Root(props) {
     };
     const hasPanelWithChildren = (0, is_not_nil_1.isNotNil)(tabPanels.find((panel) => (0, is_not_nil_1.isNotNil)(panel.props.children)));
     return (react_1.default.createElement(tabs_root_1.TabsRoot, { className: props.className, isVertical: props.isVertical, variant: props.variant },
-        react_1.default.createElement(tabs_button_list_1.TabsButtonList, { isVertical: props.isVertical, variant: props.variant, onKeyDown: onKeyDown, ref: buttonListRef, style: buttonListStyle, className: props.classNameButtonList }, tabPanels.map((panel, index) => (react_1.default.createElement(tabs_button_1.TabsButton, { key: panel.props.name, ref: (ref) => (tabRefs.current[index] = ref), className: panel.props.classNameButton, id: createId(id, panel.props.name), isActive: panel.props.name === props.value, isDisabled: panel.props.isDisabled, isHidden: panel.props.isHidden, isVertical: props.isVertical, onClick: () => props.onChange(panel.props.name), variant: props.variant }, typeof panel.props.label === "function"
+        react_1.default.createElement(tabs_button_list_1.TabsButtonList, { className: props.classNameButtonList, isVertical: props.isVertical, onKeyDown: onKeyDown, ref: buttonListRef, style: buttonListStyle, variant: props.variant }, tabPanels.map((panel, index) => (react_1.default.createElement(tabs_button_1.TabsButton, { className: panel.props.classNameButton, id: createId(id, panel.props.name), isActive: panel.props.name === props.value, isDisabled: panel.props.isDisabled, isHidden: panel.props.isHidden, isVertical: props.isVertical, key: panel.props.name, onClick: () => props.onChange(panel.props.name), ref: (ref) => {
+                tabRefs.current[index] = ref;
+            }, variant: props.variant }, typeof panel.props.label === "function"
             ? panel.props.label({ isActive: panel.props.name === props.value })
             : panel.props.label)))),
-        hasPanelWithChildren && (react_1.default.createElement(tabs_panels_1.TabsPanels, null, tabPanels.map((panel) => (react_1.default.createElement(tabs_panel_1.TabsPanel, { key: panel.props.name, className: panel.props.classNamePanel, isActive: panel.props.name === props.value, isHidden: panel.props.isHidden, isAlwaysMounted: panel.props.isAlwaysMounted }, panel.props.children)))))));
+        hasPanelWithChildren && (react_1.default.createElement(tabs_panels_1.TabsPanels, null, tabPanels.map((panel) => (react_1.default.createElement(tabs_panel_1.TabsPanel, { className: panel.props.classNamePanel, isActive: panel.props.name === props.value, isAlwaysMounted: panel.props.isAlwaysMounted, isHidden: panel.props.isHidden, key: panel.props.name }, panel.props.children)))))));
 }
 Root.displayName = "UxfUiTabs";
 exports.Tabs = Object.assign(Root, { Panel: panel_1.Panel });

package/tabs/tabs.stories.js

@@ -24,7 +24,8 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Segmented = exports.Default = void 0;
+exports.Default = Default;
+exports.Segmented = Segmented;
 const react_1 = __importStar(require("react"));
 const icon_1 = require("../icon");
 const toggle_1 = require("../toggle");
@@ -41,29 +42,27 @@ function Default() {
     const [activeTab, setActiveTab] = (0, react_1.useState)(TabEnum.Basic);
     const [isVertical, setIsVertical] = (0, react_1.useState)(false);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(toggle_1.Toggle, { label: "Vertical", value: isVertical, onChange: setIsVertical, name: "isVertical", className: "mb-5" }),
-        react_1.default.createElement(tabs_1.Tabs, { value: activeTab, onChange: setActiveTab, isVertical: isVertical },
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: TabEnum.Basic, label: "Basic" }, "Basic tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: TabEnum.Disabled, label: "Disabled", isDisabled: true }, "Disabled tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: TabEnum.Hidden, label: "Hidden", isHidden: true }, "Hidden"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: TabEnum.AlwaysMounted, label: "Always mounted", isAlwaysMounted: true }, "Always mounted tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: TabEnum.Custom, label: () => (react_1.default.createElement("span", { className: "flex items-center gap-2" },
-                    react_1.default.createElement(icon_1.Icon, { name: "camera", className: "size-4" }),
-                    " Custom button")) }, "Custom button tab"))));
+        react_1.default.createElement(toggle_1.Toggle, { className: "mb-5", label: "Vertical", name: "isVertical", onChange: setIsVertical, value: isVertical }),
+        react_1.default.createElement(tabs_1.Tabs, { isVertical: isVertical, onChange: setActiveTab, value: activeTab },
+            react_1.default.createElement(tabs_1.Tabs.Panel, { label: "Basic", name: TabEnum.Basic }, "Basic tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isDisabled: true, label: "Disabled", name: TabEnum.Disabled }, "Disabled tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isHidden: true, label: "Hidden", name: TabEnum.Hidden }, "Hidden"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isAlwaysMounted: true, label: "Always mounted", name: TabEnum.AlwaysMounted }, "Always mounted tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { label: () => (react_1.default.createElement("span", { className: "flex items-center gap-2" },
+                    react_1.default.createElement(icon_1.Icon, { className: "size-4", name: "camera" }),
+                    " Custom button")), name: TabEnum.Custom }, "Custom button tab"))));
 }
-exports.Default = Default;
 function Segmented() {
     const [activeTab, setActiveTab] = (0, react_1.useState)("tab-basic");
     const [isVertical, setIsVertical] = (0, react_1.useState)(false);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(toggle_1.Toggle, { label: "Vertical", value: isVertical, onChange: setIsVertical, name: "isVertical", className: "mb-5" }),
-        react_1.default.createElement(tabs_1.Tabs, { value: activeTab, onChange: setActiveTab, variant: "segmented", isVertical: isVertical },
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: "tab-basic", label: "Basic" }, "Basic tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: "tab-disabled", label: "Disabled", isDisabled: true }, "Disabled tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: "tab-hidden", label: "Hidden", isHidden: true }, "Hidden"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: "tab-always-mounted", label: "Always mounted", isAlwaysMounted: true }, "Always mounted tab"),
-            react_1.default.createElement(tabs_1.Tabs.Panel, { name: "tab-custom", label: () => (react_1.default.createElement("span", { className: "flex items-center gap-2" },
-                    react_1.default.createElement(icon_1.Icon, { name: "camera", className: "size-4" }),
-                    " Custom button")) }, "Custom button tab"))));
+        react_1.default.createElement(toggle_1.Toggle, { className: "mb-5", label: "Vertical", name: "isVertical", onChange: setIsVertical, value: isVertical }),
+        react_1.default.createElement(tabs_1.Tabs, { isVertical: isVertical, onChange: setActiveTab, value: activeTab, variant: "segmented" },
+            react_1.default.createElement(tabs_1.Tabs.Panel, { label: "Basic", name: "tab-basic" }, "Basic tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isDisabled: true, label: "Disabled", name: "tab-disabled" }, "Disabled tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isHidden: true, label: "Hidden", name: "tab-hidden" }, "Hidden"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { isAlwaysMounted: true, label: "Always mounted", name: "tab-always-mounted" }, "Always mounted tab"),
+            react_1.default.createElement(tabs_1.Tabs.Panel, { label: () => (react_1.default.createElement("span", { className: "flex items-center gap-2" },
+                    react_1.default.createElement(icon_1.Icon, { className: "size-4", name: "camera" }),
+                    " Custom button")), name: "tab-custom" }, "Custom button tab"))));
 }
-exports.Segmented = Segmented;

package/text-input/text-input.stories.js

@@ -26,7 +26,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ComponentStructure = exports.Default = void 0;
+exports.Default = Default;
+exports.ComponentStructure = ComponentStructure;
 const copy_to_clipboard_1 = require("@uxf/core/utils/copy-to-clipboard");
 const button_1 = require("@uxf/ui/button");
 const flash_messages_service_1 = require("@uxf/ui/flash-messages/flash-messages-service");
@@ -48,18 +49,16 @@ function Default() {
         });
     });
     return (react_1.default.createElement("div", { className: "space-y-2 p-20" },
-        react_1.default.createElement(text_input_1.TextInput, { name: "default", label: "Default input", value: value, onChange: onChange, helperText: "Helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder..." }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "error", label: "Error input", value: value, onChange: onChange, helperText: "Error helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder...", isInvalid: true }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "readOnly", label: "Read only input", value: value, onChange: onChange, helperText: "Error helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder...", isReadOnly: true }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "disabled", label: "Disabled input", value: value, onChange: onChange, helperText: "Error helper text", leftAddon: "https://", rightAddon: ".cz", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", placeholder: "Some beautiful placeholder...", isDisabled: true }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "defaultHtmlTime", label: "Default html time input", value: timeValue, onChange: onTimeChange, placeholder: "Some beautiful placeholder...", type: "time" }),
-        react_1.default.createElement(text_input_1.TextInput, { name: "copyToClipboard", label: "Copy to clipboard input", leftAddon: "I can be copied!", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: react_1.default.createElement(button_1.Button, { className: "size-full rounded-l-none border-none", isDisabled: value === "", onClick: onCopy, variant: "secondary" },
+        react_1.default.createElement(text_input_1.TextInput, { helperText: "Helper text", label: "Default input", leftAddon: "https://", leftElement: "\uD83C\uDF37", name: "default", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: ".cz", rightElement: "\uD83D\uDD14", value: value }),
+        react_1.default.createElement(text_input_1.TextInput, { helperText: "Error helper text", isInvalid: true, label: "Error input", leftAddon: "https://", leftElement: "\uD83C\uDF37", name: "error", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: ".cz", rightElement: "\uD83D\uDD14", value: value }),
+        react_1.default.createElement(text_input_1.TextInput, { helperText: "Error helper text", isReadOnly: true, label: "Read only input", leftAddon: "https://", leftElement: "\uD83C\uDF37", name: "readOnly", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: ".cz", rightElement: "\uD83D\uDD14", value: value }),
+        react_1.default.createElement(text_input_1.TextInput, { helperText: "Error helper text", isDisabled: true, label: "Disabled input", leftAddon: "https://", leftElement: "\uD83C\uDF37", name: "disabled", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: ".cz", rightElement: "\uD83D\uDD14", value: value }),
+        react_1.default.createElement(text_input_1.TextInput, { label: "Default html time input", name: "defaultHtmlTime", onChange: onTimeChange, placeholder: "Some beautiful placeholder...", type: "time", value: timeValue }),
+        react_1.default.createElement(text_input_1.TextInput, { label: "Copy to clipboard input", leftAddon: "I can be copied!", name: "copyToClipboard", onChange: onChange, placeholder: "Some beautiful placeholder...", rightAddon: react_1.default.createElement(button_1.Button, { className: "size-full rounded-l-none border-none", isDisabled: value === "", onClick: onCopy, variant: "secondary" },
                 react_1.default.createElement(icon_1.Icon, { className: "w-4", name: "copy" })), value: value })));
 }
-exports.Default = Default;
 function ComponentStructure() {
     const [value, onChange] = (0, react_1.useState)("");
     return (react_1.default.createElement(component_structure_analyzer_1.default, null,
-        react_1.default.createElement(text_input_1.TextInput, { label: "Label", placeholder: "Placeholder", leftElement: "\uD83C\uDF37", rightElement: "\uD83D\uDD14", leftAddon: "https://", rightAddon: ".cz", value: value, onChange: onChange, isInvalid: false, helperText: "Helper text", name: "text-input" })));
+        react_1.default.createElement(text_input_1.TextInput, { helperText: "Helper text", isInvalid: false, label: "Label", leftAddon: "https://", leftElement: "\uD83C\uDF37", name: "text-input", onChange: onChange, placeholder: "Placeholder", rightAddon: ".cz", rightElement: "\uD83D\uDD14", value: value })));
 }
-exports.ComponentStructure = ComponentStructure;

package/text-link/text-link.stories.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Default = void 0;
+exports.Default = Default;
 const react_1 = __importDefault(require("react"));
 const index_1 = require("./index");
 exports.default = {
@@ -19,4 +19,3 @@ function Default() {
                 "Pokra\u010Dujte ",
                 react_1.default.createElement(index_1.TextLink, { onClick: onClick }, "t\u00EDmto odkazem")))));
 }
-exports.Default = Default;

package/textarea/textarea.js

@@ -68,6 +68,6 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
     const onWrapperClick = () => { var _a; return (_a = innerRef.current) === null || _a === void 0 ? void 0 : _a.focus(); };
     return (react_1.default.createElement(form_component_1.FormComponent, { className: rootClassName, errorId: errorId, form: props.form, helperText: props.helperText, hiddenLabel: props.hiddenLabel, inputId: id, isRequired: props.isRequired, label: props.label, name: props.name },
         react_1.default.createElement("div", { className: "uxf-textarea__wrapper", onClick: onWrapperClick, style: props.style },
-            react_1.default.createElement("textarea", { "aria-describedby": errorId, "aria-invalid": props.isInvalid, autoComplete: props.autoComplete, className: "uxf-textarea__element", disabled: props.isDisabled, form: props.form, id: id, maxLength: props.maxLength, minLength: props.minLength, name: props.name, onBlur: input.onBlur, onChange: (event) => props.onChange(event.target.value, event), onFocus: input.onFocus, placeholder: props.placeholder, readOnly: props.isReadOnly, rows: props.rows, ref: (0, compose_refs_1.composeRefs)(innerRef, ref), required: props.isRequired, value: props.value }))));
+            react_1.default.createElement("textarea", { "aria-describedby": errorId, "aria-invalid": props.isInvalid, autoComplete: props.autoComplete, className: "uxf-textarea__element", disabled: props.isDisabled, form: props.form, id: id, maxLength: props.maxLength, minLength: props.minLength, name: props.name, onBlur: input.onBlur, onChange: (event) => props.onChange(event.target.value, event), onFocus: input.onFocus, placeholder: props.placeholder, readOnly: props.isReadOnly, ref: (0, compose_refs_1.composeRefs)(innerRef, ref), required: props.isRequired, rows: props.rows, value: props.value }))));
 });
 exports.Textarea.displayName = "UxfUiTextarea";