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

package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js

@@ -13,7 +13,7 @@ import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
 import { useDebounceCallback } from "../../../../hooks/useDebounceCallback.js";
 import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
 import { RangeCalendar } from "../shared/RangeCalendar.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { Button } from "react-aria-components";
@@ -626,20 +626,23 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
 		};
 		const start = formatStaticDate(rawValue?.start ?? null);
 		const end = formatStaticDate(rawValue?.end ?? null);
-		const displayValue = /* @__PURE__ */ jsxs(Fragment, { children: [
-			/* @__PURE__ */ jsx("span", {
-				className: rawValue?.start ? "" : "text-text-default-3",
-				children: rawValue?.start ? start : defaultDatePlaceholder
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: "pointer-events-none select-none",
-				children: "–"
-			}),
-			/* @__PURE__ */ jsx("span", {
-				className: rawValue?.end ? "" : "text-text-default-3",
-				children: rawValue?.end ? end : defaultDatePlaceholder
-			})
-		] });
+		const displayValue = /* @__PURE__ */ jsxs("div", {
+			className: datePickerInputContentRowCva({ size }),
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					className: rawValue?.start ? "" : "text-text-default-3",
+					children: rawValue?.start ? start : defaultDatePlaceholder
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: "pointer-events-none select-none",
+					children: "–"
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: rawValue?.end ? "" : "text-text-default-3",
+					children: rawValue?.end ? end : defaultDatePlaceholder
+				})
+			]
+		});
 		return /* @__PURE__ */ jsx(StaticInput, {
 			...props,
 			onInteract: (focus) => {

package/dist/components/inputs/Input/shared/InputContent.js

@@ -4,7 +4,7 @@ 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 { inputSize } from "../../shared/input.cva.js";
+import { inputContentWrapper, inputSize } from "../../shared/input.cva.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { clsx } from "clsx";
 import { isValidElement } from "react";
@@ -12,6 +12,7 @@ import { isValidElement } from "react";
 var InputContent = ({ leadingIcon: LeadingIcon, trailingIcon: TrailingIcon, unit, isLoading, isDisabled, action, isClearable, value, onChange, onBlur, children, headerProps, as, size }) => {
 	const typographyCva = UIStyle.useCva("typography.cva", typography);
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
+	const inputContentWrapperCva = UIStyle.useCva("input.contentWrapperCva", inputContentWrapper);
 	const isLeadingIconElement = LeadingIcon && isValidElement(LeadingIcon);
 	const isTrailingIconElement = TrailingIcon && isValidElement(TrailingIcon);
 	const showClear = value != null && value !== "" && !isDisabled;
@@ -26,7 +27,7 @@ var InputContent = ({ leadingIcon: LeadingIcon, trailingIcon: TrailingIcon, unit
 				className: clsx(!isLeadingIconElement && "pointer-events-none"),
 				children: isLeadingIconElement ? LeadingIcon : /* @__PURE__ */ jsx(LeadingIcon, { className: "size-6 text-interactive-text-secondary-idle" })
 			}), /* @__PURE__ */ jsxs("div", {
-				className: clsx("flex w-full", as === "floating" && "flex-col", as === "filter" && "gap-input-gap-input-text-to-elements"),
+				className: inputContentWrapperCva({ as }),
 				children: [as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
 					as,
 					size,

package/dist/components/inputs/shared/input.cva.d.ts

@@ -12,6 +12,11 @@ export declare const inputSize: (props?: ({
 } & ClassProp) | undefined) => string;
 export interface InputSizeProps extends VariantProps<typeof inputSize> {
 }
+export declare const inputContentWrapper: (props?: ({
+    as?: "filter" | "default" | "floating" | "inline" | null | undefined;
+} & ClassProp) | undefined) => string;
+export interface InputContentWrapperProps extends VariantProps<typeof inputContentWrapper> {
+}
 export declare const inputClearClass: (props?: ({
     as?: "filter" | "default" | "floating" | "inline" | null | undefined;
 } & ClassProp) | undefined) => string;

package/dist/components/inputs/shared/input.cva.js

@@ -191,6 +191,15 @@ var inputSize = cva("", {
 		as: "default"
 	}
 });
+var inputContentWrapper = cva("flex w-full", {
+	variants: { as: {
+		default: "",
+		floating: "flex-col",
+		filter: "gap-input-gap-input-text-to-elements",
+		inline: ""
+	} },
+	defaultVariants: { as: "default" }
+});
 var inputClearClass = cva("", {
 	variants: { as: {
 		default: "",
@@ -286,4 +295,4 @@ var useInputCva = () => {
 	};
 };
 //#endregion
-export { inputBase, inputClearClass, inputSide, inputSize, useInputCva };
+export { inputBase, inputClearClass, inputContentWrapper, inputSide, inputSize, useInputCva };

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

@@ -11,7 +11,7 @@ import { FormFieldHelperVariantProps } from '../components/inputs/FormField/form
 import { RadioVariantProps } from '../components/inputs/RadioGroup/radio.cva';
 import { SelectPopoverCva } from '../components/inputs/Selection/shared/selectDesktop.cva';
 import { SelectListBoxItemCva } from '../components/inputs/Selection/shared/selectItem.cva';
-import { InputBaseProps, InputClearClassProps, InputSideProps, InputSizeProps } from '../components/inputs/shared/input.cva';
+import { InputBaseProps, InputClearClassProps, InputContentWrapperProps, InputSideProps, InputSizeProps } from '../components/inputs/shared/input.cva';
 import { LabelBaseProps } from '../components/inputs/shared/label.cva';
 import { TooltipWrapperTriggerVariantProps } from '../components/inputs/shared/tooltipWrapper.cva';
 import { ToggleVariantProps } from '../components/inputs/Toggle/toggle.cva';
@@ -71,6 +71,7 @@ export declare namespace UIStyle {
         input: {
             baseCva?: Cva<InputBaseProps>;
             clearClassCva?: Cva<InputClearClassProps>;
+            contentWrapperCva?: Cva<InputContentWrapperProps>;
             sizeCva?: Cva<InputSizeProps>;
             sideCva?: Cva<InputSideProps>;
         };

package/package.json

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