@uxf/ui 1.0.0-beta.147 → 1.0.0-beta.149

package/button-list/button-list.js

@@ -11,6 +11,7 @@ const cx_1 = require("@uxf/core/utils/cx");
 const icon_1 = require("../icon");
 const useAnchorProps_1 = require("@uxf/core/hooks/useAnchorProps");
 const use_dropdown_1 = require("../hooks/use-dropdown");
+const react_3 = require("@floating-ui/react");
 const MenuButton = (props) => {
     // eslint-disable-next-line react/destructuring-assignment,@typescript-eslint/no-unused-vars
     const { variant, color, isIconButton, isFullWidth, size, icon, label, className, ...restProps } = props;
@@ -23,7 +24,7 @@ const MenuButton = (props) => {
         label && react_1.default.createElement("span", { className: "uxf-button-list__menu-button-label" }, label)));
 };
 const ButtonList = (props) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+    var _a, _b, _c, _d, _e, _f;
     const buttonsToRender = props.buttons.slice(0, props.visibleButtonsCount);
     const restButtons = props.buttons.slice(props.visibleButtonsCount, props.buttons.length);
     const openButtonIcon = ((_a = props.openButton) === null || _a === void 0 ? void 0 : _a.icon) === null ? null : (_c = (_b = props.openButton) === null || _b === void 0 ? void 0 : _b.icon) !== null && _c !== void 0 ? _c : "ellipsis-vertical";
@@ -37,15 +38,19 @@ const ButtonList = (props) => {
                 icon && react_1.default.createElement(icon_1.Icon, { name: icon, className: "uxf-button-list__button-icon" }),
                 label && react_1.default.createElement("span", { className: "uxf-button-list__button-label" }, label)));
         }),
-        restButtons.length > 0 && (react_1.default.createElement(react_2.Menu, { as: "div", className: "uxf-button-list__menu" },
-            react_1.default.createElement(react_2.Menu.Button, { as: button_1.Button, ...props.openButton, color: (_h = (_g = props.openButton) === null || _g === void 0 ? void 0 : _g.color) !== null && _h !== void 0 ? _h : props.color, size: (_k = (_j = props.openButton) === null || _j === void 0 ? void 0 : _j.size) !== null && _k !== void 0 ? _k : props.size, variant: (_m = (_l = props.openButton) === null || _l === void 0 ? void 0 : _l.variant) !== null && _m !== void 0 ? _m : props.variant, className: (0, cx_1.cx)((_o = props.openButton) === null || _o === void 0 ? void 0 : _o.className, "uxf-button-list__open-button"), isIconButton: !!openButtonIcon && !openButtonLabel, ref: dropdown.reference },
-                openButtonIcon && react_1.default.createElement(icon_1.Icon, { name: openButtonIcon, className: "uxf-button-list__open-button-icon" }),
-                openButtonLabel && (react_1.default.createElement("span", { className: "uxf-button-list__open-button-label" }, openButtonLabel))),
-            react_1.default.createElement(react_2.Menu.Items, { className: "uxf-button-list__menu-items", ref: dropdown.floating }, restButtons.map((button, index) => {
-                var _a, _b, _c;
-                return (react_1.default.createElement(react_2.Menu.Item, { key: index },
-                    react_1.default.createElement(MenuButton, { ...button, color: (_a = button.color) !== null && _a !== void 0 ? _a : props.color, size: (_b = button.size) !== null && _b !== void 0 ? _b : props.size, variant: (_c = button.variant) !== null && _c !== void 0 ? _c : props.variant })));
-            }))))));
+        restButtons.length > 0 && (react_1.default.createElement(react_2.Menu, { as: "div", className: "uxf-button-list__menu" }, ({ open }) => {
+            var _a, _b, _c, _d, _e, _f, _g;
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(react_2.Menu.Button, { as: button_1.Button, ...props.openButton, color: (_b = (_a = props.openButton) === null || _a === void 0 ? void 0 : _a.color) !== null && _b !== void 0 ? _b : props.color, size: (_d = (_c = props.openButton) === null || _c === void 0 ? void 0 : _c.size) !== null && _d !== void 0 ? _d : props.size, variant: (_f = (_e = props.openButton) === null || _e === void 0 ? void 0 : _e.variant) !== null && _f !== void 0 ? _f : props.variant, className: (0, cx_1.cx)((_g = props.openButton) === null || _g === void 0 ? void 0 : _g.className, "uxf-button-list__open-button"), isIconButton: !!openButtonIcon && !openButtonLabel, ref: dropdown.reference },
+                    openButtonIcon && (react_1.default.createElement(icon_1.Icon, { name: openButtonIcon, className: "uxf-button-list__open-button-icon" })),
+                    openButtonLabel && (react_1.default.createElement("span", { className: "uxf-button-list__open-button-label" }, openButtonLabel))),
+                open && (react_1.default.createElement(react_3.FloatingPortal, null,
+                    react_1.default.createElement(react_2.Menu.Items, { className: "uxf-button-list__menu-items", ref: dropdown.floating }, restButtons.map((button, index) => {
+                        var _a, _b, _c;
+                        return (react_1.default.createElement(react_2.Menu.Item, { key: index },
+                            react_1.default.createElement(MenuButton, { ...button, color: (_a = button.color) !== null && _a !== void 0 ? _a : props.color, size: (_b = button.size) !== null && _b !== void 0 ? _b : props.size, variant: (_c = button.variant) !== null && _c !== void 0 ? _c : props.variant })));
+                    }))))));
+        }))));
 };
 exports.ButtonList = ButtonList;
 exports.ButtonList.displayName = "UxfUiButtonList";

package/date-picker-input/date-picker-input.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { InputWithPopoverProps } from "../_input-with-popover";
 export interface DatePickerInputProps extends Omit<InputWithPopoverProps<Date | null>, "children" | "placeholder"> {
-    placeholder?: Date;
+    placeholder?: string;
 }
 export declare const DatePickerInput: React.ForwardRefExoticComponent<DatePickerInputProps & React.RefAttributes<HTMLInputElement>>;

package/date-picker-input/date-picker-input.js

@@ -31,5 +31,5 @@ const dayjs_1 = __importDefault(require("dayjs"));
 const react_1 = __importStar(require("react"));
 const date_picker_provider_1 = require("./date-picker-provider");
 const _input_with_popover_1 = require("../_input-with-popover");
-exports.DatePickerInput = (0, react_1.forwardRef)((props, ref) => (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, onChange: props.onChange, placeholder: props.placeholder ? (0, dayjs_1.default)(props.placeholder).format("l") : "Vyberte datum...", ref: ref, value: props.value ? (0, dayjs_1.default)(props.value).format("l") : "" }, ({ close }) => (react_1.default.createElement(date_picker_provider_1.DatePickerProvider, { closePopoverHandler: close, onChange: props.onChange, selectedDate: props.value })))));
+exports.DatePickerInput = (0, react_1.forwardRef)((props, ref) => (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, onChange: props.onChange, placeholder: props.placeholder || "Vyberte datum...", ref: ref, value: props.value ? (0, dayjs_1.default)(props.value).format("l") : "" }, ({ close }) => (react_1.default.createElement(date_picker_provider_1.DatePickerProvider, { closePopoverHandler: close, onChange: props.onChange, selectedDate: props.value })))));
 exports.DatePickerInput.displayName = "UxfUiDatePickerInput";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/ui",
-  "version": "1.0.0-beta.147",
+  "version": "1.0.0-beta.149",
   "description": "",
   "publishConfig": {
     "access": "public"

package/time-picker-input/time-picker-input.d.ts

@@ -2,6 +2,6 @@ import { TimeType } from "@uxf/datepicker/hooks/use-time-picker";
 import React from "react";
 import { InputWithPopoverProps } from "../_input-with-popover";
 export interface TimePickerInputProps extends Omit<InputWithPopoverProps<TimeType | null>, "children" | "placeholder"> {
-    placeholder?: TimeType;
+    placeholder?: string;
 }
 export declare const TimePickerInput: React.ForwardRefExoticComponent<TimePickerInputProps & React.RefAttributes<HTMLInputElement>>;

package/time-picker-input/time-picker-input.js

@@ -30,7 +30,7 @@ const _input_with_popover_1 = require("../_input-with-popover");
 function formatTime(value) {
     return `${value.hour}:${value.minute < 10 ? "0" + value.minute : value.minute}`;
 }
-exports.TimePickerInput = (0, react_1.forwardRef)((props, ref) => (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, onChange: props.onChange, placeholder: props.placeholder ? formatTime(props.placeholder) : "Vyberte čas...", ref: ref, value: props.value ? formatTime(props.value) : "" }, ({ close }) => {
+exports.TimePickerInput = (0, react_1.forwardRef)((props, ref) => (react_1.default.createElement(_input_with_popover_1._InputWithPopover, { ...props, onChange: props.onChange, placeholder: props.placeholder || "Vyberte čas...", ref: ref, value: props.value ? formatTime(props.value) : "" }, ({ close }) => {
     var _a;
     return (react_1.default.createElement(time_picker_1.TimePicker, { closePopoverHandler: close, onChange: props.onChange, selectedTime: (_a = props.value) !== null && _a !== void 0 ? _a : null }));
 })));