@ultraviolet/ui 3.9.0 → 3.10.0

package/dist/components/compositions/OfferList/components/Row.js

@@ -0,0 +1,175 @@
+'use client';
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { Tooltip } from "../../../Tooltip/index.js";
+import { Checkbox } from "../../../Checkbox/index.js";
+import { Button } from "../../../Button/index.js";
+import { List } from "../../../List/index.js";
+import { useOfferListContext } from "../OfferListProvider.js";
+import { expandablePadding, offerListBadge, offerListCellNoRadius, offerListNoPaddingCell, offerListRowBanner, offerListRowExpandable, offerListRowSelectableContainer, offerListRowSelected, offerListRowSelectedExpandable, offerListRowSelectedNotExpandable, offerListSelectedCell } from "../styles.css.js";
+import { OfferListRowContext } from "./OfferListRowProvider.js";
+import { Badge } from "../../../Badge/index.js";
+import { Radio } from "../../../Radio/index.js";
+import { Banner } from "./Banner.js";
+import { cn } from "@ultraviolet/utils";
+import { Children, useCallback, useMemo, useState } from "react";
+import { assignInlineVars } from "@vanilla-extract/dynamic";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { theme } from "@ultraviolet/themes";
+import { ArrowDownIcon } from "@ultraviolet/icons/ArrowDownIcon";
+import { ArrowUpIcon } from "@ultraviolet/icons/ArrowUpIcon";
+
+//#region src/components/compositions/OfferList/components/Row.tsx
+const Row = ({ children, disabled, id, banner, expandablePadding: expandablePadding$1, offerName, expandable: expandableContent, selectDisabled, highlightAnimation, expanded, className, "data-dragging": dataDragging, "data-testid": dataTestId, style, badge }) => {
+	const { selectable, radioSelectedRow, setRadioSelectedRow, checkboxSelectedRows, setCheckboxSelectedRows, expandable, loading, onChangeSelect, autoCollapse } = useOfferListContext();
+	const { expandedRowIds, collapseRow, expandRow } = List.useListContext();
+	const [isHovered, setHovered] = useState(false);
+	const childrenNumber = Children.count(children) + (selectable ? 1 : 0) + (expandable ? 1 : 0);
+	const toggleRowExpand = useCallback(() => {
+		if (!loading) if (expandedRowIds[id]) collapseRow(id);
+		else expandRow(id);
+	}, [
+		collapseRow,
+		expandRow,
+		expandedRowIds,
+		id,
+		loading
+	]);
+	const computedExpandableContent = useMemo(() => {
+		if (expandable && !loading && expandedRowIds[id] && banner) return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx("div", {
+			className: offerListRowExpandable,
+			style: assignInlineVars({ [expandablePadding]: theme.space[expandablePadding$1 !== null && expandablePadding$1 !== void 0 ? expandablePadding$1 : 2] }),
+			children: expandableContent
+		}), /* @__PURE__ */ jsx(Banner, {
+			disabled,
+			sentiment: banner.sentiment,
+			children: banner.text
+		})] });
+		if (expandable && !loading) return expandableContent;
+	}, [
+		expandable,
+		loading,
+		expandedRowIds,
+		banner,
+		expandablePadding$1,
+		id,
+		expandableContent,
+		disabled
+	]);
+	const isRowSelected = useMemo(() => {
+		if (selectable === "radio") return radioSelectedRow === offerName;
+		return checkboxSelectedRows.includes(offerName);
+	}, [
+		offerName,
+		checkboxSelectedRows,
+		radioSelectedRow,
+		selectable
+	]);
+	const isSelected = selectable === "radio" ? radioSelectedRow === offerName : checkboxSelectedRows.includes(offerName);
+	const handleChangeCheckbox = () => {
+		if (isRowSelected) {
+			const newSelectedList = checkboxSelectedRows.filter((element) => element !== offerName);
+			setCheckboxSelectedRows(newSelectedList);
+			onChangeSelect === null || onChangeSelect === void 0 || onChangeSelect(newSelectedList);
+		} else {
+			const newSelectedList = [...checkboxSelectedRows, offerName];
+			setCheckboxSelectedRows(newSelectedList);
+			onChangeSelect === null || onChangeSelect === void 0 || onChangeSelect(newSelectedList);
+		}
+		if (expandedRowIds[id]) expandRow(id);
+		else if (!autoCollapse) collapseRow(id);
+	};
+	const handleChangeRadio = () => {
+		setRadioSelectedRow(offerName);
+		onChangeSelect === null || onChangeSelect === void 0 || onChangeSelect(offerName);
+	};
+	const isSelectableDisable = disabled || loading || !!selectDisabled;
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs(List.Row, {
+		className: cn(className, banner ? offerListRowBanner : "", isSelected ? offerListRowSelected : "", expandable ? offerListRowSelectedExpandable : offerListRowSelectedNotExpandable),
+		"data-dragging": dataDragging,
+		"data-testid": dataTestId,
+		disabled,
+		expandable: computedExpandableContent,
+		expandablePadding: banner ? "0" : void 0,
+		expanded: expanded !== null && expanded !== void 0 ? expanded : expandedRowIds[id],
+		highlightAnimation,
+		id,
+		onClick: () => {
+			if (selectDisabled || disabled || expandable) return;
+			if (selectable === "radio") handleChangeRadio();
+			if (selectable === "checkbox") handleChangeCheckbox();
+		},
+		onMouseEnter: () => setHovered(true),
+		onMouseLeave: () => setHovered(false),
+		style,
+		children: [
+			/* @__PURE__ */ jsxs(List.Cell, {
+				className: cn(offerListNoPaddingCell, isSelected ? offerListSelectedCell : "", banner ? offerListCellNoRadius : ""),
+				children: [badge ? /* @__PURE__ */ jsx(Badge, {
+					className: offerListBadge,
+					disabled,
+					prominence: badge.prominence,
+					sentiment: badge.sentiment,
+					size: "small",
+					children: badge.text
+				}) : null, /* @__PURE__ */ jsx("div", {
+					className: offerListRowSelectableContainer,
+					children: /* @__PURE__ */ jsx(Tooltip, {
+						text: typeof selectDisabled === "string" ? selectDisabled : void 0,
+						children: selectable === "radio" ? /* @__PURE__ */ jsx(Radio, {
+							checked: isRowSelected,
+							disabled: isSelectableDisable,
+							id,
+							name: `radio-offer-list-${id}`,
+							onChange: () => {
+								if (expandable) handleChangeRadio();
+								if (expandedRowIds[id]) expandRow(id);
+								else if (!autoCollapse) collapseRow(id);
+							},
+							value: id
+						}) : /* @__PURE__ */ jsx(Checkbox, {
+							"aria-label": "select",
+							checked: isRowSelected,
+							disabled: isSelectableDisable,
+							id,
+							name: `checkbox-offer-list-${id}`,
+							onChange: () => {
+								if (expandable) handleChangeCheckbox();
+							},
+							value: id
+						})
+					})
+				})]
+			}),
+			expandable ? /* @__PURE__ */ jsx(List.Cell, {
+				className: cn(offerListNoPaddingCell, isSelected ? offerListSelectedCell : ""),
+				children: /* @__PURE__ */ jsx(Button, {
+					"aria-label": "expand",
+					"data-testid": "list-expand-button",
+					disabled: (disabled !== null && disabled !== void 0 ? disabled : !expandable) || loading,
+					onClick: toggleRowExpand,
+					sentiment: "neutral",
+					size: "small",
+					variant: "ghost",
+					children: expandedRowIds[id] ? /* @__PURE__ */ jsx(ArrowUpIcon, {}) : /* @__PURE__ */ jsx(ArrowDownIcon, {})
+				})
+			}) : null,
+			/* @__PURE__ */ jsx(OfferListRowContext.Provider, {
+				value: {
+					selected: isSelected,
+					banner: !!banner
+				},
+				children
+			})
+		]
+	}), banner && !expandedRowIds[id] ? /* @__PURE__ */ jsx(Banner, {
+		colSpan: childrenNumber,
+		disabled,
+		sentiment: banner.sentiment,
+		shouldHavePrimaryBorder: isHovered || isRowSelected,
+		type: "cell",
+		children: banner.text
+	}) : null] });
+};
+
+//#endregion
+export { Row };

package/dist/components/compositions/OfferList/index.d.ts

@@ -0,0 +1,59 @@
+import type { ComponentProps, CSSProperties } from 'react';
+import { List } from '../../List';
+type OfferListProps = Omit<ComponentProps<typeof List>, 'selectable' | 'onSelectedChange' | 'colMode'> & {
+    /**
+     * Make offerList selectable by choosing its type
+     */
+    type?: 'radio' | 'checkbox';
+    onChangeSelect?: (selected: string | string[]) => void;
+    /**
+     * Pre-selected rows (using their offerName). Must be an array when `type = "checkbox"`.
+     */
+    selected?: string | string[];
+    ['data-testid']?: string;
+    className?: string;
+    style?: CSSProperties;
+};
+export declare function OfferList({ expandable, type, columns, children, loading, autoCollapse, selected, onChangeSelect, className, style, 'data-testid': dataTestId }: OfferListProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace OfferList {
+    var Row: ({ children, disabled, id, banner, expandablePadding, offerName, expandable: expandableContent, selectDisabled, highlightAnimation, expanded, className, 'data-dragging': dataDragging, 'data-testid': dataTestId, style, badge, }: {
+        children: import("react").ReactNode;
+        id: string;
+        expandable?: import("react").ReactNode;
+        selectDisabled?: string | boolean | undefined;
+        disabled?: boolean | undefined;
+        sentiment?: "danger" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | undefined;
+        expanded?: boolean | undefined;
+        className?: string | undefined;
+        expandablePadding?: "0" | "0.25" | "0.5" | "1" | "1.5" | "10" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | undefined;
+        highlightAnimation?: boolean | undefined;
+        'data-testid'?: string | undefined;
+        style?: CSSProperties | undefined;
+        'data-dragging'?: boolean | undefined;
+        onMouseEnter?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+        onMouseLeave?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+        onClick?: ((id: string) => void) | undefined;
+    } & import("react").RefAttributes<HTMLTableRowElement> & {
+        banner?: {
+            text: import("react").ReactNode;
+            sentiment?: "danger" | "neutral" | "primary" | "warning" | undefined;
+        } | undefined;
+        offerName: string;
+        badge?: {
+            text: string;
+            sentiment?: "black" | "danger" | "info" | "neutral" | "primary" | "secondary" | "success" | "warning" | "white" | undefined;
+            prominence?: "default" | "strong" | undefined;
+        } | undefined;
+        style?: CSSProperties | undefined;
+    }) => import("react/jsx-runtime").JSX.Element;
+}
+export declare namespace OfferList {
+    var Cell: ({ children, className, 'data-testid': dataTestId, colSpan, style, }: {
+        children?: import("react").ReactNode;
+        className?: string | undefined;
+        'data-testid'?: string | undefined;
+        colSpan?: number | undefined;
+        style?: CSSProperties | undefined;
+    } & import("react").RefAttributes<HTMLTableCellElement>) => import("react/jsx-runtime").JSX.Element;
+}
+//# sourceMappingURL=index.d.ts.map

package/dist/components/compositions/OfferList/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/OfferList/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAE1D,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAA;AAMjC,KAAK,cAAc,GAAG,IAAI,CACxB,cAAc,CAAC,OAAO,IAAI,CAAC,EAC3B,YAAY,GAAG,kBAAkB,GAAG,SAAS,CAC9C,GAAG;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;IAC3B,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,MAAM,EAAE,KAAK,IAAI,CAAA;IACtD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC5B,CAAC,aAAa,CAAC,CAAC,EAAE,MAAM,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,CAAA;kCAEyB,EACxB,UAAU,EACV,IAAc,EACd,OAAO,EACP,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,cAAc,EACd,SAAS,EACT,KAAK,EACL,aAAa,EAAE,UAAU,EAC1B,EAAE,cAAc"}

package/dist/components/compositions/OfferList/index.js

@@ -0,0 +1,53 @@
+'use client';
+import { __name } from "../../../_virtual/_rolldown/runtime.js";
+import { List } from "../../List/index.js";
+import { OfferListProvider } from "./OfferListProvider.js";
+import { offerList } from "./styles.css.js";
+import { Cell } from "./components/Cell.js";
+import { Row } from "./components/Row.js";
+import { cn } from "@ultraviolet/utils";
+import { useEffect, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/compositions/OfferList/index.tsx
+const OfferList = ({ expandable, type = "radio", columns, children, loading, autoCollapse, selected, onChangeSelect, className, style, "data-testid": dataTestId }) => {
+	const [radioSelectedRow, setRadioSelectedRow] = useState(typeof selected === "string" ? selected : void 0);
+	const [checkboxSelectedRows, setCheckboxSelectedRows] = useState(Array.isArray(selected) ? selected : []);
+	const computedColumns = [
+		{ label: "" },
+		expandable ? { label: "" } : null,
+		...columns
+	].filter((element) => !!element);
+	useEffect(() => {
+		if (selected) {
+			if (typeof selected === "string" && type === "radio") setRadioSelectedRow(selected);
+			if (Array.isArray(selected) && type === "checkbox") setCheckboxSelectedRows(selected);
+		}
+	}, [type, selected]);
+	return /* @__PURE__ */ jsx(OfferListProvider, {
+		autoCollapse,
+		checkboxSelectedRows,
+		expandable,
+		loading,
+		onChangeSelect,
+		radioSelectedRow,
+		selectable: type,
+		setCheckboxSelectedRows,
+		setRadioSelectedRow,
+		children: /* @__PURE__ */ jsx(List, {
+			autoCollapse,
+			className: cn(className, offerList),
+			columns: computedColumns,
+			"data-testid": dataTestId,
+			expandable: false,
+			selectable: false,
+			style,
+			children
+		})
+	});
+};
+OfferList.Row = Row;
+OfferList.Cell = Cell;
+
+//#endregion
+export { OfferList };

package/dist/components/compositions/OfferList/styles.css.d.ts

@@ -0,0 +1,44 @@
+export declare const expandablePadding: `var(--${string})`;
+export declare const offerList: string;
+export declare const offerListBanner: string;
+export declare const offerListBannerText: import("@vanilla-extract/recipes").RuntimeFn<{
+    disabled: {
+        true: {
+            border: `1px solid var(--${string})`;
+        };
+    };
+    primaryBorder: {
+        false: {
+            border: `1px solid var(--${string})`;
+            selectors: {
+                '&&': {
+                    borderTop: "1px solid transparent";
+                };
+            };
+        };
+    };
+    sentiment: {
+        [k: string]: {};
+    };
+}>;
+export declare const offerListBannerCell: string;
+export declare const offerListBannerStack: import("@vanilla-extract/recipes").RuntimeFn<{
+    sentiment: {
+        [k: string]: {
+            backgroundColor: `var(--${string})`;
+        };
+    };
+}>;
+export declare const offerListBadge: string;
+export declare const offerListNoPaddingCell: string;
+export declare const offerListRowSelected: string;
+export declare const offerListRowSelectedNotExpandable: string;
+export declare const offerListRowSelectedExpandable: string;
+export declare const offerListRowBanner: string;
+export declare const offerListCellNoRadius: string;
+export declare const offerListRowSelectableContainer: string;
+export declare const offerListRowExpandable: string;
+export declare const offerListCell: string;
+export declare const offerListLoadingCell: string;
+export declare const offerListSelectedCell: string;
+//# sourceMappingURL=styles.css.d.ts.map

package/dist/components/compositions/OfferList/styles.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.css.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/OfferList/styles.css.ts"],"names":[],"mappings":"AAcA,eAAO,MAAM,iBAAiB,oBAAc,CAAA;AAkB5C,eAAO,MAAM,SAAS,QAAY,CAAA;AAQlC,eAAO,MAAM,eAAe,QAQ1B,CAAA;AAEF,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;EAsD9B,CAAA;AAEF,eAAO,MAAM,mBAAmB,QAQ9B,CAAA;AAEF,eAAO,MAAM,oBAAoB;;;;;;EA8B/B,CAAA;AAEF,eAAO,MAAM,cAAc,QAIzB,CAAA;AAEF,eAAO,MAAM,sBAAsB,QAQjC,CAAA;AAEF,eAAO,MAAM,oBAAoB,QAE/B,CAAA;AACF,eAAO,MAAM,iCAAiC,QAE5C,CAAA;AACF,eAAO,MAAM,8BAA8B,QAAY,CAAA;AAEvD,eAAO,MAAM,kBAAkB,QAAY,CAAA;AAC3C,eAAO,MAAM,qBAAqB,QAShC,CAAA;AAEF,eAAO,MAAM,+BAA+B,QAA6B,CAAA;AAEzE,eAAO,MAAM,sBAAsB,QAEjC,CAAA;AAEF,eAAO,MAAM,aAAa,QAQxB,CAAA;AASF,eAAO,MAAM,oBAAoB,QAA4B,CAAA;AAE7D,eAAO,MAAM,qBAAqB,QAEhC,CAAA"}

package/dist/components/compositions/OfferList/styles.css.js

@@ -0,0 +1,124 @@
+/* empty css                      */
+import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
+
+//#region src/components/compositions/OfferList/styles.css.ts
+var expandablePadding = "var(--uv_1bq65we0)";
+var offerList = "uv_1bq65we1";
+var offerListBanner = "uv_1bq65we2";
+var offerListBannerText = createRuntimeFn({
+	defaultClassName: "uv_1bq65we3",
+	variantClassNames: {
+		disabled: { true: "uv_1bq65we4" },
+		primaryBorder: { false: "uv_1bq65we5" },
+		sentiment: {
+			primary: "uv_1bq65we6",
+			secondary: "uv_1bq65we7",
+			neutral: "uv_1bq65we8",
+			success: "uv_1bq65we9",
+			danger: "uv_1bq65wea",
+			warning: "uv_1bq65web",
+			info: "uv_1bq65wec"
+		}
+	},
+	defaultVariants: {
+		disabled: false,
+		primaryBorder: false,
+		sentiment: "neutral"
+	},
+	compoundVariants: [
+		[{
+			disabled: false,
+			sentiment: "primary"
+		}, "uv_1bq65wed"],
+		[{
+			disabled: false,
+			sentiment: "secondary"
+		}, "uv_1bq65wee"],
+		[{
+			disabled: false,
+			sentiment: "neutral"
+		}, "uv_1bq65wef"],
+		[{
+			disabled: false,
+			sentiment: "success"
+		}, "uv_1bq65weg"],
+		[{
+			disabled: false,
+			sentiment: "danger"
+		}, "uv_1bq65weh"],
+		[{
+			disabled: false,
+			sentiment: "warning"
+		}, "uv_1bq65wei"],
+		[{
+			disabled: false,
+			sentiment: "info"
+		}, "uv_1bq65wej"],
+		[{
+			disabled: true,
+			sentiment: "primary"
+		}, "uv_1bq65wek"],
+		[{
+			disabled: true,
+			sentiment: "secondary"
+		}, "uv_1bq65wel"],
+		[{
+			disabled: true,
+			sentiment: "neutral"
+		}, "uv_1bq65wem"],
+		[{
+			disabled: true,
+			sentiment: "success"
+		}, "uv_1bq65wen"],
+		[{
+			disabled: true,
+			sentiment: "danger"
+		}, "uv_1bq65weo"],
+		[{
+			disabled: true,
+			sentiment: "warning"
+		}, "uv_1bq65wep"],
+		[{
+			disabled: true,
+			sentiment: "info"
+		}, "uv_1bq65weq"],
+		[{
+			disabled: false,
+			primaryBorder: true
+		}, "uv_1bq65wer"],
+		[{
+			disabled: true,
+			primaryBorder: true
+		}, "uv_1bq65wes"]
+	]
+});
+var offerListBannerCell = "uv_1bq65wet";
+var offerListBannerStack = createRuntimeFn({
+	defaultClassName: "uv_1bq65weu",
+	variantClassNames: { sentiment: {
+		primary: "uv_1bq65wev",
+		secondary: "uv_1bq65wew",
+		neutral: "uv_1bq65wex",
+		success: "uv_1bq65wey",
+		danger: "uv_1bq65wez",
+		warning: "uv_1bq65we10",
+		info: "uv_1bq65we11"
+	} },
+	defaultVariants: { sentiment: "neutral" },
+	compoundVariants: []
+});
+var offerListBadge = "uv_1bq65we12";
+var offerListNoPaddingCell = "uv_1bq65we13";
+var offerListRowSelected = "uv_1bq65we14";
+var offerListRowSelectedNotExpandable = "uv_1bq65we15";
+var offerListRowSelectedExpandable = "uv_1bq65we16";
+var offerListRowBanner = "uv_1bq65we17";
+var offerListCellNoRadius = "uv_1bq65we18";
+var offerListRowSelectableContainer = "uv_1bq65we19";
+var offerListRowExpandable = "uv_1bq65we1a";
+var offerListCell = "uv_1bq65we1b";
+var offerListLoadingCell = "uv_1bq65we1c";
+var offerListSelectedCell = "uv_1bq65we1d";
+
+//#endregion
+export { expandablePadding, offerList, offerListBadge, offerListBanner, offerListBannerCell, offerListBannerStack, offerListBannerText, offerListCell, offerListCellNoRadius, offerListLoadingCell, offerListNoPaddingCell, offerListRowBanner, offerListRowExpandable, offerListRowSelectableContainer, offerListRowSelected, offerListRowSelectedExpandable, offerListRowSelectedNotExpandable, offerListSelectedCell };

package/dist/components/compositions/OptionSelector/__mock__/resources.d.ts

@@ -10,11 +10,11 @@ export declare const franceOptions: ({
     optionalInfo: import("react/jsx-runtime").JSX.Element;
     value: string;
 } | {
+    optionalInfo?: undefined;
     content: import("react/jsx-runtime").JSX.Element;
     hoverContent: import("react/jsx-runtime").JSX.Element;
     icon: import("react/jsx-runtime").JSX.Element;
     value: string;
-    optionalInfo?: undefined;
 })[];
 export declare const polandOptions: {
     content: import("react/jsx-runtime").JSX.Element;

package/dist/components/compositions/OptionSelector/components/ArrowIcon.d.ts

@@ -0,0 +1,5 @@
+export declare const Arrow: ({ direction, size, }: {
+    direction: "horizontal" | "vertical";
+    size: "large" | "medium" | "small";
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ArrowIcon.d.ts.map

package/dist/components/compositions/OptionSelector/components/ArrowIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ArrowIcon.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/OptionSelector/components/ArrowIcon.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,KAAK;;;6CAqBf,CAAA"}

package/dist/components/compositions/OptionSelector/components/ArrowIcon.js

@@ -0,0 +1,21 @@
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { arrow } from "../styles.css.js";
+import { jsx } from "react/jsx-runtime";
+import { RayStartArrowIcon } from "@ultraviolet/icons/RayStartArrowIcon";
+import { RayTopArrowIcon } from "@ultraviolet/icons/RayTopArrowIcon";
+
+//#region src/components/compositions/OptionSelector/components/ArrowIcon.tsx
+const Arrow = ({ direction, size }) => direction === "vertical" ? /* @__PURE__ */ jsx(RayTopArrowIcon, {
+	className: arrow.vertical,
+	prominence: "weak",
+	sentiment: "neutral",
+	size
+}) : /* @__PURE__ */ jsx(RayStartArrowIcon, {
+	className: arrow.horizontal,
+	prominence: "weak",
+	sentiment: "neutral",
+	size
+});
+
+//#endregion
+export { Arrow };

package/dist/components/compositions/OptionSelector/components/IconWithContent.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from 'react';
+export declare const IconWithContent: ({ content, icon, }: {
+    content: ReactNode;
+    icon: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=IconWithContent.d.ts.map

package/dist/components/compositions/OptionSelector/components/IconWithContent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconWithContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/OptionSelector/components/IconWithContent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,eAAO,MAAM,eAAe;;;6CAW3B,CAAA"}

package/dist/components/compositions/OptionSelector/components/IconWithContent.js

@@ -0,0 +1,14 @@
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { Stack } from "../../../Stack/index.js";
+import { jsxs } from "react/jsx-runtime";
+
+//#region src/components/compositions/OptionSelector/components/IconWithContent.tsx
+const IconWithContent = ({ content, icon }) => /* @__PURE__ */ jsxs(Stack, {
+	alignItems: "center",
+	direction: "row",
+	gap: "1.5",
+	children: [icon, content]
+});
+
+//#endregion
+export { IconWithContent };

package/dist/components/compositions/OptionSelector/components/RevealOnHover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RevealOnHover.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/OptionSelector/components/RevealOnHover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,eAAO,MAAM,aAAa;;;6CAezB,CAAA"}

package/dist/components/compositions/OptionSelector/components/RevealOnHover.js

@@ -0,0 +1,17 @@
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { revealOnHover } from "../styles.css.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/compositions/OptionSelector/components/RevealOnHover.tsx
+const RevealOnHover = ({ content, hoverContent }) => /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+	className: revealOnHover,
+	"data-visibility": "unhover",
+	children: content
+}), /* @__PURE__ */ jsx("div", {
+	className: revealOnHover,
+	"data-visibility": "hover",
+	children: hoverContent
+})] });
+
+//#endregion
+export { RevealOnHover };

package/dist/components/compositions/OptionSelector/components/Selector.d.ts

@@ -0,0 +1,10 @@
+import type { DataType } from '../../../SelectInput/types';
+import type { OptionSelectorProps } from '../types';
+export declare const Selector: ({ isFirst, isHorizontal, disabled, size, error, onChange, options, readOnly, required, value, direction, firstSelector: selector, }: Pick<OptionSelectorProps, "direction" | "disabled" | "error" | "firstSelector" | "readOnly" | "required" | "size"> & {
+    isFirst?: boolean | undefined;
+    isHorizontal: boolean;
+    onChange: (val: string) => void;
+    options: DataType;
+    value?: string | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Selector.d.ts.map

package/dist/components/compositions/OptionSelector/components/Selector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/OptionSelector/components/Selector.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,4BAA4B,CAAA;AAE1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAEnD,eAAO,MAAM,QAAQ;;;;;;6CAuDpB,CAAA"}

package/dist/components/compositions/OptionSelector/components/Selector.js

@@ -0,0 +1,33 @@
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { firstSelectInput, secondSelectInput } from "../styles.css.js";
+import { SelectInput } from "../../../SelectInput/index.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/compositions/OptionSelector/components/Selector.tsx
+const Selector = ({ isFirst, isHorizontal, disabled, size, error, onChange, options, readOnly, required, value, direction = "horizontal", firstSelector: selector }) => /* @__PURE__ */ jsx(SelectInput, {
+	"aria-label": selector["aria-label"],
+	className: isFirst ? firstSelectInput[direction] : secondSelectInput[direction],
+	"data-testid": isFirst ? "first-selector" : "second-selector",
+	disabled: selector.disabled || disabled,
+	emptyState: selector.emptyState,
+	error: isHorizontal ? error || !!selector.error : error || selector.error,
+	footer: selector.footer,
+	helper: isHorizontal ? void 0 : selector.helper,
+	isLoading: selector.isLoading,
+	label: isHorizontal ? void 0 : selector.label,
+	labelDescription: selector.labelDescription,
+	loadMore: selector.loadMore,
+	onChange,
+	optionalInfoPlacement: "right",
+	options,
+	placeholder: selector.placeholder,
+	readOnly,
+	required,
+	searchable: selector.searchable,
+	size,
+	tooltip: selector.tooltip,
+	value
+});
+
+//#endregion
+export { Selector };

package/dist/components/compositions/OptionSelector/components/SelectorLabel.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from 'react';
+export declare const SelectorHelper: ({ isError, error, helper, isFirst, }: {
+    isError: boolean;
+    helper?: ReactNode;
+    error?: string | boolean | undefined;
+    isFirst?: boolean | undefined;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SelectorLabel.d.ts.map

package/dist/components/compositions/OptionSelector/components/SelectorLabel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectorLabel.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/OptionSelector/components/SelectorLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,eAAO,MAAM,cAAc;;;;;6CAoB1B,CAAA"}

package/dist/components/compositions/OptionSelector/components/SelectorLabel.js

@@ -0,0 +1,17 @@
+import { __name } from "../../../../_virtual/_rolldown/runtime.js";
+import { Text } from "../../../Text/index.js";
+import { errorFirstSelector, errorSecondSelector } from "../styles.css.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/components/compositions/OptionSelector/components/SelectorLabel.tsx
+const SelectorHelper = ({ isError, error, helper, isFirst }) => /* @__PURE__ */ jsx(Text, {
+	as: "p",
+	className: isFirst ? errorFirstSelector : errorSecondSelector,
+	prominence: isError ? "default" : "weak",
+	sentiment: isError ? "danger" : "neutral",
+	variant: "caption",
+	children: isError ? error : helper
+});
+
+//#endregion
+export { SelectorHelper };

package/dist/components/compositions/OptionSelector/index.d.ts

@@ -3,5 +3,5 @@ import type { OptionSelectorProps } from './types';
  * A compound selection component that displays two sequential select inputs
  * where the first selection contextualizes and filters the options available in the second.
  */
-export declare const OptionSelector: ({ className, style, "data-testid": dataTestId, firstSelector, secondSelector, size, disabled, readOnly, "aria-label": ariaLabel, error, required, onChange, name, value, }: OptionSelectorProps) => import("react/jsx-runtime").JSX.Element;
+export declare const OptionSelector: ({ className, style, 'data-testid': dataTestId, firstSelector, secondSelector, size, disabled, readOnly, 'aria-label': ariaLabel, error, required, onChange, name, value, hideWhenEmpty, direction, }: OptionSelectorProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/dist/components/compositions/OptionSelector/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/OptionSelector/index.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,mBAAmB,EAAkB,MAAM,SAAS,CAAA;AA+ClE;;;GAGG;AACH,eAAO,MAAM,cAAc,GAAI,4KAe5B,mBAAmB,4CAsJrB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/compositions/OptionSelector/index.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,mBAAmB,EAAkB,MAAM,SAAS,CAAA;AAkClE;;;GAGG;AACH,eAAO,MAAM,cAAc,wQAkJ1B,CAAA"}