@povio/ui 3.4.0-rc.19 → 3.4.0-rc.20

package/dist/{components/segment/Segment.js → Segment-Cndlojxv.js}

@@ -1,16 +1,119 @@
-import { UIOverrides } from "../../config/uiOverrides.context.js";
-import { FieldController } from "../inputs/shared/form.binding.js";
-import { FormField } from "../form-field.js";
-import { segmentDefinition } from "./segment.cva.js";
-import { SegmentItem } from "./SegmentItem.js";
-import { c } from "react/compiler-runtime";
-import { clsx } from "clsx";
+import { t as FormField } from "./FormField-DoGaUqFm.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { z as $5dc95899b306f630$export$c9058316764c140e } from "./useHover-DwfnacVy.js";
+import { i as $4547d1bf40011fdf$export$dd5580ae642f110f, n as $84b7d8702d4ff4a8$export$40258cc1d95ff477, r as $ad999b7f496648d1$export$8deac67f4addf270, t as $efde0372d7a700fe$export$d2b052e7b4be1756 } from "./ToggleButton-D94yRla8.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as FieldController } from "./form.binding-DyZ4fH8l.js";
 import { Fragment, useRef } from "react";
-import { ToggleButtonGroup } from "react-aria-components";
+import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useToggleButtonGroup } from "react-aria";
-import { mergeRefs } from "@react-aria/utils";
-import { useToggleGroupState } from "react-stately";
+//#region src/components/segment/segment.cva.ts
+const segmentDefinition = UIOverrides.defineConfig({ base: [
+	"group/segment grid w-fit items-center gap-segmented-control-side-segmented-control p-segmented-control-side-segmented-control",
+	"bg-elevation-fill-default-3",
+	"rounded-segmented-control-rounding-segmented-control"
+] });
+const segmentItemDefinition = UIOverrides.defineConfig({
+	base: [
+		"flex items-center justify-center gap-segmented-control-gap-content-icon-to-text transition-all duration-200",
+		"border border-support-transparent-outline",
+		"py-segmented-control-height-segment",
+		"rounded-segmented-control-rounding-segment",
+		"text-interactive-subtle-secondary-on-idle",
+		"hover:border-interactive-subtle-secondary-hover hover:bg-interactive-subtle-secondary-hover hover:text-interactive-subtle-secondary-on-hover",
+		"pressed:border-interactive-subtle-secondary-pressed pressed:bg-interactive-subtle-secondary-pressed pressed:text-interactive-subtle-secondary-on-pressed",
+		"disabled:border-support-transparent-outline disabled:text-interactive-subtle-secondary-on-disabled",
+		"selected:border-interactive-subtle-secondary-toggled-idle selected:bg-interactive-subtle-secondary-toggled-idle selected:text-interactive-subtle-secondary-on-toggled-idle",
+		"selected:disabled:border-interactive-subtle-secondary-toggled-disabled selected:disabled:bg-interactive-subtle-secondary-toggled-disabled selected:disabled:text-interactive-subtle-secondary-on-toggled-disabled"
+	],
+	config: {
+		variants: { iconOnly: {
+			true: "px-segmented-control-height-segment",
+			false: "px-segmented-control-side-segment"
+		} },
+		defaultVariants: { iconOnly: false }
+	}
+});
+//#endregion
+//#region src/components/segment/SegmentItem.tsx
+const SegmentItem = (t0) => {
+	const $ = c(23);
+	let className;
+	let icon;
+	let id;
+	let isDisabled;
+	let label;
+	let props;
+	if ($[0] !== t0) {
+		({label, icon, id, isDisabled, className, ...props} = t0);
+		$[0] = t0;
+		$[1] = className;
+		$[2] = icon;
+		$[3] = id;
+		$[4] = isDisabled;
+		$[5] = label;
+		$[6] = props;
+	} else {
+		className = $[1];
+		icon = $[2];
+		id = $[3];
+		isDisabled = $[4];
+		label = $[5];
+		props = $[6];
+	}
+	const IconComponent = icon;
+	const iconOnly = !!(icon && !label);
+	const segmentItemCva = UIOverrides.useCva("segment.itemCva", segmentItemDefinition);
+	let t1;
+	if ($[7] !== className || $[8] !== iconOnly || $[9] !== segmentItemCva) {
+		t1 = segmentItemCva({
+			iconOnly,
+			className
+		});
+		$[7] = className;
+		$[8] = iconOnly;
+		$[9] = segmentItemCva;
+		$[10] = t1;
+	} else t1 = $[10];
+	let t2;
+	if ($[11] !== IconComponent || $[12] !== icon) {
+		t2 = icon && /* @__PURE__ */ jsx(IconComponent, { className: "size-6" });
+		$[11] = IconComponent;
+		$[12] = icon;
+		$[13] = t2;
+	} else t2 = $[13];
+	let t3;
+	if ($[14] !== label) {
+		t3 = label && /* @__PURE__ */ jsx(Typography, {
+			size: "label-2",
+			as: "span",
+			className: "overflow-hidden text-ellipsis text-center",
+			children: label
+		});
+		$[14] = label;
+		$[15] = t3;
+	} else t3 = $[15];
+	let t4;
+	if ($[16] !== id || $[17] !== isDisabled || $[18] !== props || $[19] !== t1 || $[20] !== t2 || $[21] !== t3) {
+		t4 = /* @__PURE__ */ jsxs($efde0372d7a700fe$export$d2b052e7b4be1756, {
+			...props,
+			id,
+			className: t1,
+			isDisabled,
+			children: [t2, t3]
+		});
+		$[16] = id;
+		$[17] = isDisabled;
+		$[18] = props;
+		$[19] = t1;
+		$[20] = t2;
+		$[21] = t3;
+		$[22] = t4;
+	} else t4 = $[22];
+	return t4;
+};
+//#endregion
 //#region src/components/segment/Segment.tsx
 const SegmentBase = (t0) => {
 	const $ = c(49);
@@ -69,8 +172,8 @@ const SegmentBase = (t0) => {
 	} else t3 = $[16];
 	const props = t3;
 	const buttonGroupRef = useRef(null);
-	const state = useToggleGroupState(props);
-	const { groupProps } = useToggleButtonGroup(props, state, buttonGroupRef);
+	const state = $ad999b7f496648d1$export$8deac67f4addf270(props);
+	const { groupProps } = $4547d1bf40011fdf$export$dd5580ae642f110f(props, state, buttonGroupRef);
 	const segmentCva = UIOverrides.useCva("segment.cva", segmentDefinition);
 	let t4;
 	if ($[17] !== error || $[18] !== props.isDisabled) {
@@ -148,7 +251,7 @@ const SegmentBase = (t0) => {
 	} else t10 = $[37];
 	let t11;
 	if ($[38] !== groupProps || $[39] !== onSelectionChange || $[40] !== props || $[41] !== t10 || $[42] !== t8 || $[43] !== t9) {
-		t11 = /* @__PURE__ */ jsx(ToggleButtonGroup, {
+		t11 = /* @__PURE__ */ jsx($84b7d8702d4ff4a8$export$40258cc1d95ff477, {
 			...props,
 			...groupProps,
 			ref: buttonGroupRef,
@@ -203,7 +306,7 @@ const Segment = (props) => {
 				const { error } = t2;
 				return /* @__PURE__ */ jsx(SegmentBase, {
 					...innerProps,
-					ref: mergeRefs(ref, field_0.ref),
+					ref: $5dc95899b306f630$export$c9058316764c140e(ref, field_0.ref),
 					value: field_0.value,
 					onChange: field_0.onChange,
 					isDisabled: field_0.disabled || props.isDisabled,
@@ -242,4 +345,4 @@ function _temp(_, i) {
 	return i % 2 === 0 ? "1fr" : "auto";
 }
 //#endregion
-export { Segment };
+export { segmentDefinition as n, segmentItemDefinition as r, Segment as t };

package/dist/{components/segment/Segment.d.ts → Segment-IpdajE4h.d.ts}

@@ -1,7 +1,7 @@
-import { FieldValues } from "../inputs/shared/form.binding.js";
-import { ControlledSegmentProps } from "./segment.types.js";
-import { Key } from "react-aria-components";
+import { D as Key } from "./types-BV15_DBT.js";
+import { n as FieldValues } from "./form.binding-DWlFTecs.js";
+import { t as ControlledSegmentProps } from "./segment.types-POFeFf4n.js";
 //#region src/components/segment/Segment.d.ts
 declare const Segment: <TFieldValues extends FieldValues, TKey extends Key = Key>(props: ControlledSegmentProps<TFieldValues, TKey>) => import("react/jsx-runtime").JSX.Element;
 //#endregion
-export { Segment };
+export { Segment as t };

package/dist/{components/inputs/Selection/Select/Select.js → Select-CCNQ4Bso.js}

@@ -1,17 +1,13 @@
-import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { FieldController } from "../../shared/form.binding.js";
-import { selectInputTagsContentWrapperDefinition } from "../shared/selectInput.cva.js";
-import { InputFrame } from "../../Skeleton/InputFrame.js";
-import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
-import { SelectBase } from "../shared/SelectBase.js";
-import { StaticSelectTrailingContent } from "../shared/StaticSelectTrailingContent.js";
-import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
-import { clsx } from "clsx";
+import { t as UIConfig } from "./uiConfig.context-SBtRegKv.js";
+import { l as selectInputTagsContentWrapperDefinition, n as StaticSelectTrailingContent, r as SelectBase, t as getStaticSelectValue } from "./staticSelect.utils-DkiDwfGr.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { z as $5dc95899b306f630$export$c9058316764c140e } from "./useHover-DwfnacVy.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { t as Typography } from "./Typography-AcUd9df8.js";
+import { t as FieldController } from "./form.binding-DyZ4fH8l.js";
+import { n as InputFrame, t as useStaticInputHandoff } from "./useStaticInputHandoff-COJdSrME.js";
 import { memo, useRef, useState } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
-import { mergeRefs } from "@react-aria/utils";
 //#region src/components/inputs/Selection/Select/Select.tsx
 function SelectInner({ renderStaticInput, isFormControlDisabled, ...props }) {
 	const ui = UIConfig.useConfig();
@@ -125,7 +121,7 @@ function SelectInner({ renderStaticInput, isFormControlDisabled, ...props }) {
 	}
 	return /* @__PURE__ */ jsx(SelectBase, {
 		...props,
-		ref: mergeRefs(props.ref, rootRef)
+		ref: $5dc95899b306f630$export$c9058316764c140e(props.ref, rootRef)
 	});
 }
 function SelectComponent({ renderStaticInput, ...props }) {
@@ -137,7 +133,7 @@ function SelectComponent({ renderStaticInput, ...props }) {
 			name: field.name,
 			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(SelectInner, {
 				...innerProps,
-				ref: mergeRefs(ref, field.ref),
+				ref: $5dc95899b306f630$export$c9058316764c140e(ref, field.ref),
 				value: field.value,
 				onChange: field.onChange,
 				onBlur: field.onBlur,
@@ -156,4 +152,4 @@ function SelectComponent({ renderStaticInput, ...props }) {
 }
 const Select = memo(SelectComponent);
 //#endregion
-export { Select };
+export { Select as t };

package/dist/{components/inputs/Selection/Select/Select.d.ts → Select-CNTaUjfL.d.ts}

@@ -1,9 +1,8 @@
-import { FieldValues } from "../../shared/form.binding.js";
-import { DefaultInitialSelectItem, GroupedSelectControlProps, GroupedSelectProps, SelectAsyncProps } from "../shared/select.types.js";
-import { SelectBaseProps } from "../shared/SelectBase.js";
-import { OmitDiscriminatedUnion } from "../../../../types/common.js";
+import { D as Key } from "./types-BV15_DBT.js";
+import { n as FieldValues } from "./form.binding-DWlFTecs.js";
+import { i as GroupedSelectProps, n as DefaultInitialSelectItem, o as SelectAsyncProps, r as GroupedSelectControlProps, t as SelectBaseProps } from "./SelectBase-C4lPY7Hc.js";
+import { s as OmitDiscriminatedUnion } from "./common-UBFya8WY.js";
 import { ReactElement } from "react";
-import { Key } from "react-aria-components";
 //#region src/components/inputs/Selection/Select/Select.d.ts
 type SelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = OmitDiscriminatedUnion<SelectBaseProps<TKey, TInitialSelectItem>, keyof SelectAsyncProps> & {
   renderStaticInput?: boolean;
@@ -13,4 +12,4 @@ declare function SelectComponent<TKey extends Key = Key, TInitialSelectItem = De
 declare function SelectComponent<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>>(props: ControlledSelectProps<TFieldValues, TKey, TInitialSelectItem>): ReactElement;
 declare const Select: typeof SelectComponent;
 //#endregion
-export { ControlledSelectProps, Select, SelectProps };
+export { Select as n, SelectProps as r, ControlledSelectProps as t };

package/dist/SelectBase-C4lPY7Hc.d.ts

@@ -0,0 +1,97 @@
+import { D as Key, E as AriaButtonProps } from "./types-BV15_DBT.js";
+import { n as BottomSheetProps } from "./BottomSheet-BWKej2PR.js";
+import { n as FieldValues } from "./form.binding-DWlFTecs.js";
+import { t as ControlProps } from "./form.types-B9Vp8q2g.js";
+import { n as FormFieldProps } from "./FormField-FvutosEE.js";
+import { n as InputVariantProps } from "./input.cva-CfgCOIQW.js";
+import { FocusEventHandler, MouseEventHandler, ReactElement, ReactNode, Ref } from "react";
+//#region src/components/inputs/Selection/shared/select.types.d.ts
+interface SelectItem<TKey extends Key = Key> {
+  id: TKey;
+  label: string;
+  content?: string | ReactNode;
+  isDisabled?: boolean;
+}
+interface DefaultInitialSelectItem<TKey extends Key = Key> {
+  id: TKey;
+  label?: string;
+  name?: string;
+}
+interface SingleSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> {
+  selectionMode?: "single";
+  value?: TKey | undefined | null;
+  onChange?: (value: TKey | null) => void;
+  showSelectionBar?: never;
+  showSelectAllOption?: never;
+  initialSelection?: TInitialSelectItem | null;
+  showSelectionContent?: boolean;
+}
+interface MultiSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> {
+  selectionMode: "multiple";
+  value?: TKey[];
+  onChange?: (value: TKey[]) => void;
+  showSelectionBar?: boolean;
+  showSelectAllOption?: boolean;
+  initialSelection?: TInitialSelectItem[] | null;
+  showSelectionContent?: never;
+}
+type GroupedSelectProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = MultiSelectProps<TKey, TInitialSelectItem> | SingleSelectProps<TKey, TInitialSelectItem>;
+type GroupedSelectControlProps<TFieldValues extends FieldValues, TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = ({
+  selectionMode: MultiSelectProps["selectionMode"];
+} & ControlProps<MultiSelectProps<TKey, TInitialSelectItem>, TFieldValues>) | ({
+  selectionMode?: SingleSelectProps["selectionMode"];
+} & ControlProps<SingleSelectProps<TKey, TInitialSelectItem>, TFieldValues>);
+interface SelectNewItemProps {
+  showNewItemOption?: boolean;
+  newItemMinLength?: number;
+  onNewItemOption?: (value: string) => void;
+  newItemRender?: (label: string) => ReactElement;
+}
+interface SelectAsyncProps {
+  isLoading?: boolean;
+  hasLoadMore?: boolean;
+  onLoadMore?: () => void;
+}
+interface SelectVirtualizationProps {
+  totalItems?: number;
+  virtualizerOptions?: {
+    rowHeight?: number;
+    estimatedRowHeight?: number;
+    padding?: number;
+    gap?: number;
+  };
+}
+//#endregion
+//#region src/components/inputs/Selection/shared/SelectBase.d.ts
+type SelectBaseProps<TKey extends Key = Key, TInitialSelectItem = DefaultInitialSelectItem<TKey>> = FormFieldProps & GroupedSelectProps<TKey, TInitialSelectItem> & SelectNewItemProps & SelectAsyncProps & SelectVirtualizationProps & InputVariantProps & Pick<AriaButtonProps, "onBlur"> & {
+  ref?: Ref<HTMLDivElement>;
+  className?: string;
+  isDirty?: boolean;
+  placeholder?: string;
+  hideDropdownIcon?: boolean;
+  hideSearchIcon?: boolean;
+  isSearchable?: boolean;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  isClientSearchDisabled?: boolean;
+  ignoreInputValueFiltering?: boolean;
+  ignoreTriggerWidth?: boolean;
+  items: SelectItem<TKey>[];
+  inputClassName?: string;
+  containerClassName?: string;
+  leadingContent?: ReactNode;
+  trailingContent?: ReactNode;
+  customTrigger?: ReactElement;
+  selectedTagsType?: "tags" | "list";
+  collapseAfter?: number;
+  searchDebounceDelay?: number;
+  multiSelectAutoConfirm?: boolean;
+  onInputChange?: (value: string) => void;
+  onSearchChange?: (value: string) => void;
+  mapInitialToSelectItem?: (item: TInitialSelectItem) => SelectItem<TKey>;
+  onMouseEnter?: MouseEventHandler<HTMLDivElement>;
+  onFocusCapture?: FocusEventHandler<HTMLDivElement>;
+  bottomSheetProps?: Partial<Omit<BottomSheetProps, "children" | "isOpen" | "onOpenChange" | "onStateChange" | "label" | "footer">>;
+};
+//#endregion
+export { MultiSelectProps as a, SingleSelectProps as c, GroupedSelectProps as i, DefaultInitialSelectItem as n, SelectAsyncProps as o, GroupedSelectControlProps as r, SelectItem as s, SelectBaseProps as t };