@povio/ui 2.2.9-rc.25 → 2.2.9-rc.27

package/dist/components/inputs/Selection/Select/QuerySelect.d.ts

@@ -1,10 +1,10 @@
-import { GroupedSelectControlProps, GroupedSelectProps, SelectItem } from '../shared/select.types';
-import { SelectBaseProps } from '../shared/SelectBase';
+import { DefaultInitialSelectItem, GroupedSelectControlProps, GroupedSelectProps, SelectItem } from '../shared/select.types';
+import { SelectProps } from './Select';
 import { QueryDataType, QueryFn } from '../shared/querySelect.utils';
 import { OmitDiscriminatedUnion } from '../../../../types/common';
 import { Key } from 'react-aria-components';
 import { FieldValues } from 'react-hook-form';
-export type QuerySelectProps<TFieldValues extends FieldValues, TQueryFn extends QueryFn, TKey extends Key = Key> = OmitDiscriminatedUnion<SelectBaseProps<TKey>, "items" | "isLoading" | keyof GroupedSelectProps> & GroupedSelectControlProps<TFieldValues, TKey> & {
+export type QuerySelectProps<TFieldValues extends FieldValues, TQueryFn extends QueryFn, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = OmitDiscriminatedUnion<SelectProps<TKey, TInitialSelectItem>, "items" | "totalItems" | keyof GroupedSelectProps> & GroupedSelectControlProps<TFieldValues, TKey, TInitialSelectItem> & {
     query: TQueryFn;
     queryParams?: Parameters<TQueryFn>[0];
     queryOptions?: Parameters<TQueryFn>[1];

package/dist/components/inputs/Selection/Select/QuerySelect.js

@@ -1,10 +1,8 @@
 import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { SelectBase } from "../shared/SelectBase.js";
+import { Select } from "./Select.js";
 import { getQueryItems } from "../shared/querySelect.utils.js";
 import { useQueryAutocomplete } from "../../../../hooks/useQueryAutocomplete.js";
 import { jsx } from "react/jsx-runtime";
-import { mergeRefs } from "@react-aria/utils";
-import { Controller } from "react-hook-form";
 //#region src/components/inputs/Selection/Select/QuerySelect.tsx
 var QuerySelect = ({ query, queryParams, queryOptions, queryMap, ...props }) => {
 	const ui = UIConfig.useConfig();
@@ -15,41 +13,14 @@ var QuerySelect = ({ query, queryParams, queryOptions, queryMap, ...props }) =>
 		mapItems: (data) => getQueryItems(data, queryMap),
 		initialQueryState: props.isInitialQueryDisabled ?? ui.querySelect?.isInitialQueryDisabled
 	});
-	if ("formControl" in props && props.formControl) {
-		const { formControl, ref, isInitialQueryDisabled: _, ...innerProps } = props;
-		return /* @__PURE__ */ jsx(Controller, {
-			control: formControl.control,
-			name: formControl.name,
-			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(SelectBase, {
-				...innerProps,
-				ref: mergeRefs(ref, field.ref),
-				items,
-				isLoading,
-				totalItems,
-				hasLoadMore: hasNextPage,
-				onLoadMore: fetchNextPage,
-				value: field.value,
-				onChange: (value) => {
-					field.onChange(value);
-					field.onBlur?.();
-				},
-				onBlur: field.onBlur,
-				isDirty,
-				isDisabled: field.disabled || props.isDisabled,
-				error: props.error ?? error?.message,
-				onMouseEnter: handleEnableQuery,
-				onFocusCapture: handleEnableQuery
-			})
-		});
-	}
-	const { isInitialQueryDisabled: _, ...restProps } = props;
-	return /* @__PURE__ */ jsx(SelectBase, {
-		...restProps,
+	const { isInitialQueryDisabled: _, ...selectProps } = props;
+	return /* @__PURE__ */ jsx(Select, {
+		...selectProps,
 		items,
 		isLoading,
 		totalItems,
 		hasLoadMore: hasNextPage,
-		onLoadMore: fetchNextPage ? () => void fetchNextPage() : void 0,
+		onLoadMore: fetchNextPage,
 		onMouseEnter: handleEnableQuery,
 		onFocusCapture: handleEnableQuery
 	});

package/dist/components/inputs/Selection/Select/Select.js

@@ -1,6 +1,6 @@
 import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
 import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { StaticInput } from "../../shared/StaticInput.js";
+import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { SelectBase } from "../shared/SelectBase.js";
 import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -67,25 +67,16 @@ function Select({ renderStaticInput, ...props }) {
 			selectedTagsType: props.selectedTagsType ?? ui.select.selectedTagsType
 		});
 		const trailingContent = props.trailingContent || !props.hideDropdownIcon ? /* @__PURE__ */ jsxs(Fragment, { children: [props.trailingContent, !props.hideDropdownIcon ? /* @__PURE__ */ jsx(ArrowDropDownIcon, { className: `size-6 shrink-0 ${isDisabled ? "text-interactive-text-secondary-disabled" : "text-interactive-text-secondary-idle"}` }) : void 0] }) : void 0;
-		return /* @__PURE__ */ jsx(StaticInput, {
+		const placeholder = as === "floating" ? null : props.placeholder;
+		const shouldRenderPlaceholderAfterValue = mode !== "single" && props.placeholder && !isEmpty;
+		return /* @__PURE__ */ jsxs(InputFrame, {
 			...props,
-			onInteract: (focus) => {
-				setShouldFocus(focus);
-				setRenderInput(true);
-			},
-			as,
-			typographySize: "label-1",
-			size: props.size ?? ui.input.size,
-			variant: props.variant ?? ui.input.variant,
 			isHeaderHidden: props.isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
 			hideLabel: props.hideLabel ?? ui.input.hideLabel,
 			isDisabled,
 			className: clsx("w-full", props.containerClassName),
 			inputClassName: clsx(props.className, props.inputClassName),
-			placeholder: props.placeholder,
-			showPlacholderIfFilled: mode !== "single",
-			displayValue,
-			isEmpty,
+			typographySize: "label-1",
 			dataAttributes: {
 				dataIsEmpty: isEmpty,
 				dataIsFilled: !isEmpty,
@@ -97,9 +88,28 @@ function Select({ renderStaticInput, ...props }) {
 				dataHasSelection: !isEmpty,
 				dataHasSearch: false
 			},
-			leadingContent: props.leadingContent,
-			hasClearIcon: isClearable,
-			trailingContent
+			renderStatic: true,
+			onStaticInteract: (focus) => {
+				setShouldFocus(focus);
+				setRenderInput(true);
+			},
+			as,
+			size: props.size ?? ui.input.size,
+			variant: props.variant ?? ui.input.variant,
+			actionContent: props.leadingContent && /* @__PURE__ */ jsx("div", {
+				className: "ml-input-side-default flex shrink-0 items-center",
+				children: props.leadingContent
+			}),
+			isClearable,
+			showClear: false,
+			trailingContent,
+			children: [isEmpty ? /* @__PURE__ */ jsx("span", {
+				className: "text-text-default-3",
+				children: placeholder
+			}) : displayValue, shouldRenderPlaceholderAfterValue && /* @__PURE__ */ jsx("div", {
+				className: "shrink-0 text-text-default-3",
+				children: props.placeholder
+			})]
 		});
 	}
 	return /* @__PURE__ */ jsx(_Select, {

package/dist/components/inputs/Skeleton/InputFrame.d.ts

@@ -0,0 +1,54 @@
+import { FC, ReactElement, ReactNode, Ref, SVGProps } from 'react';
+import { InlineIconButtonProps } from '../../buttons/InlineIconButton/InlineIconButton';
+import { FormFieldProps } from '../FormField/FormField';
+import { FormFieldHeaderProps } from '../FormField/FormFieldHeader';
+import { InputVariantProps } from '../shared/input.cva';
+import { TypographyVariantProps } from '../../text/Typography/typography.cva';
+type InputFrameIcon = FC<SVGProps<SVGSVGElement>> | ReactElement;
+interface InputFrameAction {
+    icon: InlineIconButtonProps["icon"];
+    onClick: () => void;
+    altText: string;
+    className?: string;
+}
+interface InputFrameDataAttributes {
+    dataDisabled?: boolean;
+    dataHasSearch?: boolean;
+    dataHasSelection?: boolean;
+    dataInvalid?: boolean;
+    dataIsDirty?: boolean;
+    dataIsDisabled?: boolean;
+    dataIsEmpty?: boolean;
+    dataIsFilled?: boolean;
+    dataIsRequired?: boolean;
+}
+export interface InputFrameProps extends InputVariantProps, Partial<FormFieldProps> {
+    ref?: Ref<HTMLDivElement>;
+    children: ReactNode;
+    formFieldRef?: Ref<HTMLDivElement>;
+    labelProps?: FormFieldHeaderProps["labelProps"];
+    headerProps?: FormFieldHeaderProps;
+    leadingContent?: ReactNode;
+    leadingIcon?: InputFrameIcon;
+    actionContent?: ReactNode;
+    trailingContent?: ReactNode;
+    trailingIcon?: InputFrameIcon;
+    trailingAction?: ReactNode;
+    unit?: string;
+    isLoading?: boolean;
+    action?: InputFrameAction;
+    isClearable?: boolean;
+    showClear?: boolean;
+    renderStatic?: boolean;
+    onStaticInteract?: (shouldFocus: boolean) => void;
+    clearClassName?: string;
+    onClear?: () => void;
+    dataAttributes?: InputFrameDataAttributes;
+    typographySize?: TypographyVariantProps["size"];
+    inputClassName?: string;
+    contentClassName?: string;
+    contentWrapperClassName?: string;
+    trailingClassName?: string;
+}
+export declare const InputFrame: ({ ref, children, formFieldRef, labelProps, headerProps, error, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isHeaderHidden, hideLabel, headerClassName, errorClassName, className, leadingContent, leadingIcon, actionContent, trailingContent, trailingIcon, trailingAction, unit, isLoading, action, isClearable, showClear, renderStatic, onStaticInteract, clearClassName, onClear, dataAttributes, typographySize, inputClassName, contentClassName, contentWrapperClassName, trailingClassName, variant, as, size, }: InputFrameProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/inputs/Skeleton/InputFrame.js

@@ -0,0 +1,167 @@
+import { UIStyle } from "../../../config/uiStyle.context.js";
+import { typography } from "../../text/Typography/typography.cva.js";
+import { Loader } from "../../status/Loader/Loader.js";
+import { InlineIconButton } from "../../buttons/InlineIconButton/InlineIconButton.js";
+import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
+import { InputClear } from "../shared/InputClear.js";
+import { inputBase, inputContentWrapper, inputSize } from "../shared/input.cva.js";
+import { FormField } from "../FormField/FormField.js";
+import { TooltipWrapper } from "../shared/TooltipWrapper.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { clsx } from "clsx";
+import { isValidElement } from "react";
+//#region src/components/inputs/Skeleton/InputFrame.tsx
+var InputFrame = ({ ref, children, formFieldRef, labelProps, headerProps, error, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isHeaderHidden, hideLabel, headerClassName, errorClassName, className, leadingContent, leadingIcon, actionContent, trailingContent, trailingIcon, trailingAction, unit, isLoading, action, isClearable, showClear, renderStatic, onStaticInteract, clearClassName, onClear, dataAttributes, typographySize, inputClassName, contentClassName, contentWrapperClassName, trailingClassName, variant, as, size }) => {
+	const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
+	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
+	const inputContentWrapperCva = UIStyle.useCva("input.contentWrapperCva", inputContentWrapper);
+	const typographyCva = UIStyle.useCva("typography.cva", typography);
+	const hasClear = !!isClearable;
+	const isLeadingIconElement = leadingIcon && isValidElement(leadingIcon);
+	const isTrailingIconElement = trailingIcon && isValidElement(trailingIcon);
+	const hasTrailingContent = hasClear || !!trailingContent || !!unit || !!isLoading || !!action || !!trailingIcon || !!trailingAction;
+	const isTrailingInteractive = !!action || !!trailingAction || !!isTrailingIconElement || hasClear && !!showClear || !!trailingContent;
+	const dataAttributeProps = getInputFrameDataAttributeProps(dataAttributes);
+	const formFieldProps = {
+		error,
+		label: label ?? "",
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
+		hideLabel,
+		isDisabled,
+		headerClassName,
+		errorClassName,
+		className
+	};
+	const resolvedHeaderProps = headerProps ?? {
+		label: label ?? "",
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	return /* @__PURE__ */ jsx(TooltipWrapper, {
+		as,
+		error,
+		triggerTabIndex: as === "inline" ? -1 : void 0,
+		children: /* @__PURE__ */ jsx(FormField, {
+			...formFieldProps,
+			...dataAttributeProps,
+			ref: formFieldRef,
+			as,
+			labelProps,
+			tabIndex: as === "inline" ? -1 : void 0,
+			onMouseEnter: () => {
+				if (renderStatic) onStaticInteract?.(false);
+			},
+			onFocusCapture: () => {
+				if (renderStatic) onStaticInteract?.(true);
+			},
+			children: /* @__PURE__ */ jsxs("div", {
+				ref,
+				...dataAttributeProps,
+				className: clsx("relative flex cursor-text has-disabled:cursor-default", inputBaseCva({
+					variant,
+					as
+				}), inputClassName),
+				tabIndex: renderStatic ? isDisabled ? -1 : 0 : void 0,
+				onFocus: () => {
+					if (renderStatic) onStaticInteract?.(true);
+				},
+				onClick: () => {
+					if (renderStatic) onStaticInteract?.(true);
+				},
+				onPointerDown: () => {
+					if (renderStatic) onStaticInteract?.(true);
+				},
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: clsx("group/input-frame flex min-w-0 w-full items-center gap-input-gap-input-text-to-elements pr-0!", as === "inline" && "h-full", inputSizeCva({
+						size,
+						as
+					}), typographySize && typographyCva({ size: typographySize }), contentClassName),
+					children: [
+						leadingContent,
+						leadingIcon && /* @__PURE__ */ jsx("div", {
+							className: clsx(!isLeadingIconElement && "pointer-events-none"),
+							children: renderIconVisual(leadingIcon)
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: clsx(inputContentWrapperCva({ as }), contentWrapperClassName),
+							children: [
+								as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
+									as,
+									size,
+									...resolvedHeaderProps
+								}),
+								actionContent,
+								children
+							]
+						})
+					]
+				}), hasTrailingContent && /* @__PURE__ */ jsxs("div", {
+					className: clsx("flex items-center gap-input-gap-trailing-elements py-0! pl-0!", inputSizeCva({
+						size,
+						as
+					}), !isTrailingInteractive && "pointer-events-none", trailingClassName),
+					children: [
+						hasClear && /* @__PURE__ */ jsx(InputClear, {
+							onClear: () => onClear?.(),
+							className: clearClassName,
+							show: !!showClear,
+							renderStatic
+						}),
+						trailingContent,
+						unit && /* @__PURE__ */ jsx("span", {
+							className: typographyCva({
+								size: "label-2",
+								sizeMobile: "label-2",
+								variant: "prominent-1",
+								className: "text-text-default-3"
+							}),
+							children: unit
+						}),
+						isLoading && /* @__PURE__ */ jsx("div", {
+							className: "inline-flex",
+							children: /* @__PURE__ */ jsx(Loader, {})
+						}),
+						!isLoading && action && /* @__PURE__ */ jsx(InlineIconButton, {
+							color: "secondary",
+							icon: action.icon,
+							isDisabled,
+							onPress: action.onClick,
+							excludeFromTabOrder: true,
+							label: action.altText,
+							className: clsx("border-0!", action.className)
+						}),
+						!isLoading && !action && trailingIcon && renderIconVisual(trailingIcon),
+						trailingAction
+					]
+				})]
+			})
+		})
+	});
+};
+var renderIconVisual = (icon) => {
+	if (isValidElement(icon)) return icon;
+	return /* @__PURE__ */ jsx(icon, { className: "size-6 text-interactive-text-secondary-idle" });
+};
+var getInputFrameDataAttributeProps = (dataAttributes) => ({
+	"data-is-empty": dataAttributes?.dataIsEmpty || void 0,
+	"data-is-filled": dataAttributes?.dataIsFilled || void 0,
+	"data-is-dirty": dataAttributes?.dataIsDirty || void 0,
+	"data-is-required": dataAttributes?.dataIsRequired || void 0,
+	"data-is-disabled": dataAttributes?.dataIsDisabled || void 0,
+	"data-disabled": dataAttributes?.dataDisabled || void 0,
+	"data-has-search": dataAttributes?.dataHasSearch || void 0,
+	"data-invalid": dataAttributes?.dataInvalid || void 0,
+	"data-has-selection": dataAttributes?.dataHasSelection || void 0
+});
+//#endregion
+export { InputFrame };

package/dist/components/inputs/shared/InputClear.d.ts

@@ -2,8 +2,9 @@ import { CSSProperties } from 'react';
 interface InputClearProps {
     onClear: () => void;
     show?: boolean;
+    renderStatic?: boolean;
     className?: string;
     style?: CSSProperties;
 }
-export declare const InputClear: ({ onClear, className, style, show }: InputClearProps) => import("react/jsx-runtime").JSX.Element;
+export declare const InputClear: ({ onClear, className, style, show, renderStatic }: InputClearProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/inputs/shared/InputClear.js

@@ -5,7 +5,19 @@ import { jsx } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useTranslation } from "react-i18next";
 //#region src/components/inputs/shared/InputClear.tsx
-var InputClear = ({ onClear, className, style, show }) => {
+var InputClear = ({ onClear, className, style, show, renderStatic }) => {
+	if (renderStatic) return /* @__PURE__ */ jsx("div", {
+		className: clsx("size-6 shrink-0", className),
+		style
+	});
+	return /* @__PURE__ */ jsx(InputClearButton, {
+		onClear,
+		className,
+		style,
+		show
+	});
+};
+var InputClearButton = ({ onClear, className, style, show }) => {
 	const { t } = useTranslation("ui");
 	return /* @__PURE__ */ jsx(InlineIconButton, {
 		color: "secondary",

package/dist/config/uiConfig.context.d.ts

@@ -34,7 +34,7 @@ export declare namespace UIConfig {
         };
         toggle: Pick<ToggleProps, "variant">;
         slider: Pick<SliderProps, "minValue" | "maxValue">;
-        dateInput: Pick<DatePickerProps, "todayIcon" | "todayIconButtonSize" | "shouldForceLeadingZeros" | "disableManualEntry" | "autoFixYear"> & {
+        dateInput: Pick<DatePickerProps, "todayIcon" | "todayIconButtonSize" | "todayIconPlacement" | "shouldForceLeadingZeros" | "disableManualEntry" | "autoFixYear"> & {
             calendarIcon?: ReactElement;
             dateTimeIcon?: ReactElement;
             timeIcon?: ReactElement;

package/dist/config/uiConfig.context.js

@@ -48,6 +48,7 @@ var UIConfig;
 		dateInput: {
 			todayIcon: false,
 			todayIconButtonSize: "none",
+			todayIconPlacement: "content",
 			shouldForceLeadingZeros: false,
 			disableManualEntry: false,
 			autoFixYear: false,

package/dist/index.js

@@ -67,9 +67,9 @@ import { ToggleButton } from "./components/buttons/ToggleButton/ToggleButton.js"
 import { Checkbox } from "./components/inputs/Checkbox/Checkbox.js";
 import { useLongPressRepeat } from "./hooks/useLongPressRepeat.js";
 import { useScrollableListBox } from "./hooks/useScrollableListBox.js";
+import { DateTimeUtils } from "./utils/date-time.utils.js";
 import { FormField } from "./components/inputs/FormField/FormField.js";
 import { useDebounceCallback } from "./hooks/useDebounceCallback.js";
-import { DateTimeUtils } from "./utils/date-time.utils.js";
 import { DatePicker } from "./components/inputs/DateTime/DatePicker/DatePicker.js";
 import { Tag } from "./components/text/Tag/Tag.js";
 import { useIntersectionObserver } from "./hooks/useIntersectionObserver.js";

package/dist/utils/date-time.utils.d.ts

@@ -3,11 +3,18 @@ export declare namespace DateTimeUtils {
     interface LocalizedDateFormatOptions {
         shouldForceLeadingZeros?: boolean;
     }
+    export interface LocalizedDatePart {
+        type: Intl.DateTimeFormatPartTypes;
+        value: string;
+        placeholder: string;
+        isPlaceholder: boolean;
+    }
     export function getDatePlaceholder(locale?: string, options?: LocalizedDateFormatOptions): string;
     export function getTimePlaceholder(locale?: string): string;
     export function getDateTimePlaceholder(locale?: string, options?: LocalizedDateFormatOptions): string;
     export function getDateRangePlaceholder(locale?: string, options?: LocalizedDateFormatOptions): string;
     export function formatCalendarDateLocalized(calendarDate: CalendarDate, locale?: string, options?: LocalizedDateFormatOptions): string;
+    export function formatCalendarDatePartsLocalized(calendarDate?: CalendarDate | null, locale?: string, options?: LocalizedDateFormatOptions): LocalizedDatePart[];
     export function formatTimeLocalized(timeValue: {
         hour: number;
         minute: number;

package/dist/utils/date-time.utils.js

@@ -67,6 +67,18 @@ var DateTimeUtils;
 			return part.value;
 		}).join(""));
 	};
+	const formatLocalizedDatePartList = (formatter, date, isPlaceholder, options) => {
+		const locale = formatter.resolvedOptions().locale;
+		return formatter.formatToParts(date).map((part) => {
+			const value = options?.shouldForceLeadingZeros === false && (part.type === "day" || part.type === "month") ? removeLeadingZero(part.value) : part.value.replace(/\s+/gu, "");
+			return {
+				type: part.type,
+				value,
+				placeholder: mapTypeToPlaceholder(part.type, locale) ?? part.value.replace(/\s+/gu, ""),
+				isPlaceholder
+			};
+		});
+	};
 	function getDatePlaceholder(locale, options) {
 		return formatPlaceholder(getDatePlaceholderFormatter(locale, options), DATE_SAMPLE_DATE_UTC);
 	}
@@ -88,6 +100,10 @@ var DateTimeUtils;
 		return formatLocalizedDateParts(getDateFormatter(locale, options), calendarDate.toDate("UTC"), options);
 	}
 	_DateTimeUtils.formatCalendarDateLocalized = formatCalendarDateLocalized;
+	function formatCalendarDatePartsLocalized(calendarDate, locale, options) {
+		return formatLocalizedDatePartList(getDateFormatter(locale, options), calendarDate?.toDate("UTC") ?? DATE_SAMPLE_DATE_UTC, !calendarDate, options);
+	}
+	_DateTimeUtils.formatCalendarDatePartsLocalized = formatCalendarDatePartsLocalized;
 	function formatTimeLocalized(timeValue, locale) {
 		const dateTime = new CalendarDateTime(2e3, 11, 22, timeValue.hour, timeValue.minute);
 		return getTimeFormatter(locale).format(dateTime.toDate("UTC"));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "2.2.9-rc.25",
+  "version": "2.2.9-rc.27",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",