@ultraviolet/ui 3.12.3 → 3.13.1

package/dist/components/SelectInput/components/DropdownOption.js

@@ -1,163 +0,0 @@
-'use client';
-import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
-import { Stack, init_Stack } from "../../Stack/index.js";
-import { Tooltip, init_Tooltip } from "../../Tooltip/index.js";
-import { Text, init_Text } from "../../Text/index.js";
-import { init_styles_css, selectInputStyle } from "../styles.css.js";
-import { useMemo } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/SelectInput/components/DropdownOption.tsx
-var DisplayOption;
-var init_DropdownOption = __esmMin(() => {
-	init_Stack();
-	init_Text();
-	init_Tooltip();
-	init_styles_css();
-	DisplayOption = ({ option, optionalInfoPlacement, descriptionDirection, textVariant }) => {
-		const captionSize = useMemo(() => {
-			if (textVariant === "body") return "bodySmall";
-			if (textVariant === "bodySmall") return "caption";
-			return "captionSmall";
-		}, [textVariant]);
-		if (descriptionDirection === "row" && optionalInfoPlacement === "left") {
-			var _option$optionalInfo;
-			return /* @__PURE__ */ jsx(Tooltip, {
-				disableAnimation: true,
-				text: option.tooltip,
-				children: /* @__PURE__ */ jsx(Stack, {
-					"data-testid": `option-stack-${option.value}`,
-					direction: "row",
-					gap: .5,
-					justifyContent: "left",
-					children: /* @__PURE__ */ jsxs(Stack, {
-						alignItems: "center",
-						className: selectInputStyle.dropdownInfoContainer,
-						direction: "row",
-						gap: .5,
-						children: [
-							(_option$optionalInfo = option.optionalInfo) !== null && _option$optionalInfo !== void 0 ? _option$optionalInfo : null,
-							/* @__PURE__ */ jsx(Text, {
-								as: "span",
-								className: selectInputStyle.dropdownInfoTextItem,
-								placement: "left",
-								variant: textVariant,
-								children: option.label
-							}),
-							option.description ? /* @__PURE__ */ jsx(Text, {
-								as: "span",
-								placement: "left",
-								prominence: "weak",
-								sentiment: option.disabled ? void 0 : "neutral",
-								variant: captionSize,
-								children: option.description
-							}) : null
-						]
-					})
-				})
-			});
-		}
-		if (descriptionDirection === "row" && optionalInfoPlacement === "right") return /* @__PURE__ */ jsx(Tooltip, {
-			disableAnimation: true,
-			text: option.tooltip,
-			children: /* @__PURE__ */ jsxs(Stack, {
-				alignItems: "baseline",
-				"data-testid": `option-stack-${option.value}`,
-				direction: "row",
-				gap: .5,
-				justifyContent: "space-between",
-				children: [/* @__PURE__ */ jsxs(Stack, {
-					alignItems: "baseline",
-					className: selectInputStyle.dropdownInfoContainer,
-					direction: "row",
-					gap: .5,
-					children: [/* @__PURE__ */ jsx(Text, {
-						as: "span",
-						className: selectInputStyle.dropdownInfoTextItem,
-						placement: "left",
-						variant: textVariant,
-						children: option.label
-					}), option.description ? /* @__PURE__ */ jsx(Text, {
-						as: "span",
-						placement: "left",
-						variant: captionSize,
-						children: option.description
-					}) : null]
-				}), option.optionalInfo ? /* @__PURE__ */ jsx("div", {
-					className: selectInputStyle.dropdownInfo,
-					children: option.optionalInfo
-				}) : null]
-			})
-		});
-		if (descriptionDirection === "column" && optionalInfoPlacement === "left") {
-			var _option$optionalInfo2;
-			return /* @__PURE__ */ jsx(Tooltip, {
-				disableAnimation: true,
-				text: option.tooltip,
-				children: /* @__PURE__ */ jsxs(Stack, {
-					alignItems: "normal",
-					direction: "row",
-					gap: .5,
-					justifyContent: option.optionalInfo ? "left" : "space-between",
-					children: [(_option$optionalInfo2 = option.optionalInfo) !== null && _option$optionalInfo2 !== void 0 ? _option$optionalInfo2 : null, /* @__PURE__ */ jsxs(Stack, {
-						className: selectInputStyle.dropdownInfoContainer,
-						"data-testid": `option-stack-${option.value}`,
-						direction: "column",
-						gap: .5,
-						children: [/* @__PURE__ */ jsx(Text, {
-							as: "span",
-							className: selectInputStyle.dropdownInfoTextItem,
-							placement: "left",
-							variant: textVariant,
-							children: option.label
-						}), option.description ? /* @__PURE__ */ jsx(Text, {
-							as: "span",
-							placement: "left",
-							prominence: "weak",
-							sentiment: option.disabled ? void 0 : "neutral",
-							variant: captionSize,
-							children: option.description
-						}) : null]
-					})]
-				})
-			});
-		}
-		return /* @__PURE__ */ jsx(Tooltip, {
-			disableAnimation: true,
-			text: option.tooltip,
-			children: /* @__PURE__ */ jsxs(Stack, {
-				alignItems: "normal",
-				"data-testid": `option-stack-${option.value}`,
-				direction: "column",
-				gap: .5,
-				children: [/* @__PURE__ */ jsxs(Stack, {
-					className: selectInputStyle.dropdownInfoContainer,
-					direction: "row",
-					gap: .5,
-					justifyContent: "space-between",
-					children: [/* @__PURE__ */ jsx(Text, {
-						as: "span",
-						className: selectInputStyle.dropdownInfoTextItem,
-						placement: "left",
-						variant: textVariant,
-						children: option.label
-					}), option.optionalInfo ? /* @__PURE__ */ jsx("div", {
-						className: selectInputStyle.dropdownInfo,
-						children: option.optionalInfo
-					}) : null]
-				}), option.description ? /* @__PURE__ */ jsx(Text, {
-					as: "span",
-					placement: "left",
-					prominence: "weak",
-					sentiment: option.disabled ? void 0 : "neutral",
-					variant: captionSize,
-					children: option.description
-				}) : null]
-			})
-		});
-	};
-});
-
-//#endregion
-init_DropdownOption();
-export { DisplayOption, init_DropdownOption };

package/dist/components/SelectInput/components/SearchBarDropdown.js

@@ -1,118 +0,0 @@
-'use client';
-import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
-import { _objectSpread2, init_objectSpread2 } from "../../../_virtual/_@oxc-project_runtime@0.120.0/helpers/objectSpread2.js";
-import { TextInput, init_TextInput } from "../../TextInput/index.js";
-import { OPTION_SELECTOR, init_constants } from "../constants.js";
-import { init_SelectInputProvider, useSelectInput } from "../SelectInputProvider.js";
-import { init_styles_css, selectInputStyle } from "../styles.css.js";
-import { useEffect, useRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import { SearchIcon } from "@ultraviolet/icons/SearchIcon";
-import { isFuzzyMatch, normalizeString } from "@scaleway/fuzzy-search";
-
-//#region src/components/SelectInput/components/SearchBarDropdown.tsx
-var getReferenceText, searchRegex, findClosestOption, escapeRegExp, SearchBarDropdown;
-var init_SearchBarDropdown = __esmMin(() => {
-	init_TextInput();
-	init_constants();
-	init_SelectInputProvider();
-	init_styles_css();
-	init_objectSpread2();
-	getReferenceText = (option) => {
-		if (option.searchText) return normalizeString(option.searchText);
-		if (typeof option.label === "string") return normalizeString(option.label);
-		return "";
-	};
-	searchRegex = (data, query) => data.filter((option) => {
-		const referenceText = getReferenceText(option);
-		const regex = new RegExp(query, "i");
-		return (query.length > 2 ? isFuzzyMatch(query, referenceText) : referenceText.match(regex)) || typeof option.description === "string" && option.description.match(regex) || option.value.match(regex);
-	});
-	findClosestOption = (options, searchInput) => {
-		if (searchInput) if (Array.isArray(options)) {
-			const possibleOption = [...options].find((option) => !option.disabled);
-			if (possibleOption) return possibleOption;
-		} else {
-			const possibleOptions = _objectSpread2({}, options);
-			Object.keys(possibleOptions).map((group) => {
-				possibleOptions[group] = possibleOptions[group].filter((option) => !option.disabled);
-				return null;
-			});
-			if (Object.keys(possibleOptions).some((group) => possibleOptions[group].length > 0)) return Object.keys(possibleOptions).map((group) => possibleOptions[group][0]).find((value) => !!value);
-		}
-		return null;
-	};
-	escapeRegExp = (string) => string.replace(/[.*+?^{}()|[\]\\]/g, String.raw`\$&`);
-	SearchBarDropdown = ({ placeholder, displayedOptions, setSearchBarActive }) => {
-		const searchInputRef = useRef(null);
-		const { onChange, onSearch, setSearchInput, searchInput, options, multiselect, setSelectedData, selectedData, size } = useSelectInput();
-		const handleChange = (search) => {
-			if (search.length > 0) if (Array.isArray(options)) onSearch(searchRegex([...options], escapeRegExp(search.toString())));
-			else {
-				const filteredOptions = _objectSpread2({}, options);
-				Object.keys(filteredOptions).map((group) => {
-					filteredOptions[group] = searchRegex(filteredOptions[group], escapeRegExp(search.toString()));
-					return null;
-				});
-				onSearch(filteredOptions);
-			}
-			else onSearch(options);
-			setSearchInput(search);
-		};
-		const handleKeyDown = (event, search) => {
-			const { key } = event;
-			if (key === "Enter") {
-				const closestOption = findClosestOption(displayedOptions, search);
-				if (closestOption) if (multiselect) {
-					setSelectedData({
-						clickedOption: closestOption,
-						group: Array.isArray(options) ? void 0 : Object.keys(options).find((group) => options[group].includes(closestOption)),
-						type: "selectOption"
-					});
-					onChange === null || onChange === void 0 || onChange(selectedData.selectedValues.includes(closestOption.value) ? selectedData.selectedValues : [...selectedData.selectedValues, closestOption.value]);
-				} else {
-					var _selectedData$selecte;
-					setSelectedData({
-						clickedOption: closestOption,
-						type: "selectOption"
-					});
-					onChange === null || onChange === void 0 || onChange((_selectedData$selecte = selectedData.selectedValues[0]) !== null && _selectedData$selecte !== void 0 ? _selectedData$selecte : "");
-				}
-			} else if (key === "Tab" || key === "ArrowDown") {
-				event === null || event === void 0 || event.preventDefault();
-				const optionsDropdown = document.querySelectorAll(OPTION_SELECTOR);
-				if (optionsDropdown && optionsDropdown.length > 0) optionsDropdown[0].focus();
-			}
-		};
-		useEffect(() => {
-			const timeout = setTimeout(() => {
-				var _searchInputRef$curre;
-				(_searchInputRef$curre = searchInputRef.current) === null || _searchInputRef$curre === void 0 || _searchInputRef$curre.focus();
-			}, 50);
-			return () => {
-				if (timeout) clearTimeout(timeout);
-			};
-		}, []);
-		return /* @__PURE__ */ jsx(TextInput, {
-			"aria-label": "search-bar",
-			className: selectInputStyle.searchBar,
-			"data-testid": "search-bar",
-			onBlur: () => setSearchBarActive(false),
-			onChange: (event) => handleChange(event.target.value),
-			onFocus: () => setSearchBarActive(true),
-			onKeyDown: (event) => handleKeyDown(event, searchInput),
-			placeholder,
-			prefix: /* @__PURE__ */ jsx(SearchIcon, {
-				sentiment: "neutral",
-				size: size === "small" ? "xsmall" : "small"
-			}),
-			ref: searchInputRef,
-			size: size === "small" ? "small" : "medium",
-			value: searchInput
-		});
-	};
-});
-
-//#endregion
-init_SearchBarDropdown();
-export { SearchBarDropdown, init_SearchBarDropdown };

package/dist/components/SelectInput/components/SelectBar.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"SelectBar.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectInput/components/SelectBar.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjD,KAAK,cAAc,GAAG;IACpB,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IAClC,SAAS,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,GAAG,OAAO,CAAA;IACxB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,QAAQ,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAA;IAC1C,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,aAAa,EAAE,MAAM,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAsID,QAAA,MAAM,SAAS,oNA0Wd,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/components/SelectInput/components/SelectBar.js

@@ -1,306 +0,0 @@
-'use client';
-import { __esmMin, __name } from "../../../_virtual/_rolldown/runtime.js";
-import { Stack, init_Stack } from "../../Stack/index.js";
-import { Tooltip, init_Tooltip } from "../../Tooltip/index.js";
-import { Text, init_Text } from "../../Text/index.js";
-import { Button, init_Button } from "../../Button/index.js";
-import { SIZES_TAG, init_constants } from "../constants.js";
-import { init_SelectInputProvider, useSelectInput } from "../SelectInputProvider.js";
-import { init_styles_css, selectInputStyle } from "../styles.css.js";
-import { Tag, init_Tag } from "../../Tag/index.js";
-import { findOptionInOptions, init_findOptionInOptions } from "../findOptionInOptions.js";
-import { init_selectBar_css, maxWidthTag, minWidthTag } from "./selectBar.css.js";
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { cn } from "@ultraviolet/utils";
-import { assignInlineVars } from "@vanilla-extract/dynamic";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { ArrowDownIcon } from "@ultraviolet/icons/ArrowDownIcon";
-import { AlertCircleIcon } from "@ultraviolet/icons/AlertCircleIcon";
-import { CheckCircleIcon } from "@ultraviolet/icons/CheckCircleIcon";
-import { CloseIcon } from "@ultraviolet/icons/CloseIcon";
-import { PlusIcon } from "@ultraviolet/icons/PlusIcon";
-
-//#region src/components/SelectInput/components/SelectBar.tsx
-var DisplayValues, SelectBar;
-var init_SelectBar = __esmMin(() => {
-	init_Button();
-	init_Stack();
-	init_Tag();
-	init_Text();
-	init_Tooltip();
-	init_constants();
-	init_findOptionInOptions();
-	init_SelectInputProvider();
-	init_styles_css();
-	init_selectBar_css();
-	DisplayValues = ({ refTag, nonOverflowedValues, potentiallyNonOverflowedValues, disabled, readOnly, overflowed, overflowAmount, measureRef, lastElementMaxWidth, overflow, refPlusTag, displayShadowCopy, textVariant }) => {
-		var _findOptionInOptions;
-		const { multiselect, selectedData, setSelectedData, options, onChange } = useSelectInput();
-		return multiselect ? /* @__PURE__ */ jsxs(Stack, {
-			alignItems: "center",
-			className: selectInputStyle.multiselectStack,
-			direction: "row",
-			gap: "1",
-			ref: refTag,
-			wrap: "nowrap",
-			children: [
-				displayShadowCopy ? /* @__PURE__ */ jsx("div", {
-					ref: measureRef,
-					style: { position: "absolute" },
-					children: potentiallyNonOverflowedValues.map((option) => /* @__PURE__ */ jsx(Tag, {
-						className: cn(option.value, selectInputStyle.selectBarTags.hidden),
-						onClose: () => {},
-						children: option === null || option === void 0 ? void 0 : option.label
-					}, option.value))
-				}) : null,
-				nonOverflowedValues.map((option, index) => /* @__PURE__ */ jsx(Tag, {
-					className: selectInputStyle.selectBarTags.visible,
-					"data-testid": "selected-options-tags",
-					disabled,
-					onClose: readOnly ? void 0 : (event) => {
-						var _selectedData$selecte;
-						event.stopPropagation();
-						setSelectedData({
-							clickedOption: option,
-							type: "selectOption"
-						});
-						const newSelectedValues = (_selectedData$selecte = selectedData.selectedValues) === null || _selectedData$selecte === void 0 ? void 0 : _selectedData$selecte.filter((val) => val !== option.value);
-						onChange === null || onChange === void 0 || onChange(newSelectedValues);
-					},
-					sentiment: "neutral",
-					style: index === nonOverflowedValues.length - 1 && overflow ? assignInlineVars({
-						[minWidthTag]: "auto",
-						[maxWidthTag]: `${lastElementMaxWidth}px`
-					}) : void 0,
-					children: option === null || option === void 0 ? void 0 : option.label
-				}, option === null || option === void 0 ? void 0 : option.value)),
-				overflowed ? /* @__PURE__ */ jsx(Stack, {
-					justifyContent: "center",
-					ref: refPlusTag,
-					children: /* @__PURE__ */ jsxs(Tag, {
-						"aria-label": "Plus tag",
-						className: selectInputStyle.plusTag,
-						"data-testid": "plus-tag",
-						disabled,
-						sentiment: "neutral",
-						children: [/* @__PURE__ */ jsx(PlusIcon, { size: "xsmall" }), overflowAmount]
-					}, "+")
-				}) : null
-			]
-		}) : /* @__PURE__ */ jsx(Text, {
-			as: "span",
-			className: selectInputStyle.selectedValues,
-			disabled,
-			prominence: "default",
-			sentiment: "neutral",
-			variant: textVariant,
-			children: selectedData.selectedValues[0] ? (_findOptionInOptions = findOptionInOptions(options, selectedData.selectedValues[0])) === null || _findOptionInOptions === void 0 ? void 0 : _findOptionInOptions.label : null
-		});
-	};
-	SelectBar = ({ size, clearable, disabled, readOnly, placeholder, success, error, autoFocus, tooltip, innerRef, id, "data-testid": dataTestId, label, dropdownId }) => {
-		var _innerRef$current2;
-		const { isDropdownVisible, onChange, setIsDropdownVisible, options, selectedData, setSelectedData, multiselect } = useSelectInput();
-		const openable = !(readOnly || disabled);
-		const [displayShadowCopy, setDisplayShadowCopy] = useState(false);
-		const refTag = useRef(null);
-		const measureRef = useRef(null);
-		const arrowRef = useRef(null);
-		const refPlusTag = useRef(null);
-		const [overflowAmount, setOverflowAmount] = useState(0);
-		const [overflow, setOverflow] = useState(false);
-		const [lastElementMaxWidth, setLastElementMaxWidth] = useState(0);
-		const [nonOverflowedValues, setNonOverFlowedValues] = useState(() => {
-			if (selectedData.selectedValues[0]) {
-				const firstSelectOption = findOptionInOptions(options, selectedData.selectedValues[0]);
-				return firstSelectOption ? [firstSelectOption] : [];
-			}
-			return [];
-		});
-		const potentiallyNonOverflowedValues = useMemo(() => selectedData.selectedValues.map((selectedValue) => findOptionInOptions(options, selectedValue)).filter((option) => !!option), [options, selectedData.selectedValues]);
-		const state = useMemo(() => {
-			if (error) return "danger";
-			if (success) return "success";
-			return "neutral";
-		}, [error, success]);
-		useEffect(() => {
-			setDisplayShadowCopy(true);
-		}, [selectedData.selectedValues.length]);
-		const getWidth = useCallback(() => {
-			var _innerRef$current$off;
-			var _innerRef$current;
-			var _arrowRef$current$off;
-			var _arrowRef$current;
-			if (refTag.current) return refTag.current.offsetWidth;
-			return (_innerRef$current$off = (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.offsetWidth) !== null && _innerRef$current$off !== void 0 ? _innerRef$current$off : 0 - ((_arrowRef$current$off = (_arrowRef$current = arrowRef.current) === null || _arrowRef$current === void 0 ? void 0 : _arrowRef$current.offsetWidth) !== null && _arrowRef$current$off !== void 0 ? _arrowRef$current$off : 0) - SIZES_TAG.paddings;
-		}, [(_innerRef$current2 = innerRef.current) === null || _innerRef$current2 === void 0 ? void 0 : _innerRef$current2.offsetWidth]);
-		useLayoutEffect(() => {
-			if (selectedData.selectedValues.length === 0) {
-				setOverflowAmount(0);
-				setNonOverFlowedValues([]);
-			}
-			if (measureRef.current && selectedData.selectedValues.length > 0) {
-				var _refPlusTag$current$o;
-				var _refPlusTag$current;
-				const toMeasureElementsArray = [...measureRef.current.children];
-				const innerWidth = getWidth();
-				const { measuredVisibleTags, measuredHiddenTags, accumulatedWidth, lastVisibleElementWidth, lastVisibleLabel } = toMeasureElementsArray.reduce((accumulator, currentValue, index) => {
-					const elementWidth = currentValue.offsetWidth;
-					const newAccumulatedWidth = accumulator.accumulatedWidth + elementWidth + SIZES_TAG.gap;
-					const canBeVisible = newAccumulatedWidth <= innerWidth;
-					return {
-						accumulatedWidth: canBeVisible ? newAccumulatedWidth : accumulator.accumulatedWidth,
-						lastVisibleElementWidth: canBeVisible ? elementWidth : accumulator.lastVisibleElementWidth,
-						lastVisibleLabel: canBeVisible ? potentiallyNonOverflowedValues[index].label : accumulator.lastVisibleLabel,
-						measuredHiddenTags: accumulator.measuredHiddenTags + (canBeVisible ? 0 : 1),
-						measuredVisibleTags: [...accumulator.measuredVisibleTags, canBeVisible && potentiallyNonOverflowedValues[index]].filter(Boolean)
-					};
-				}, {
-					accumulatedWidth: 0,
-					lastVisibleElementWidth: 0,
-					lastVisibleLabel: "",
-					measuredHiddenTags: 0,
-					measuredVisibleTags: []
-				});
-				const additionnalElementsWidth = SIZES_TAG.paddings + ((_refPlusTag$current$o = (_refPlusTag$current = refPlusTag.current) === null || _refPlusTag$current === void 0 ? void 0 : _refPlusTag$current.offsetWidth) !== null && _refPlusTag$current$o !== void 0 ? _refPlusTag$current$o : 0);
-				const overflowPx = accumulatedWidth + (measuredHiddenTags ? additionnalElementsWidth : 0) - innerWidth;
-				const hasOverflow = overflowPx > 0;
-				const hasHiddenTags = measuredHiddenTags > 0;
-				const lastVisibleElementMaxSize = lastVisibleElementWidth - overflowPx;
-				if (measuredHiddenTags === 1 && measuredVisibleTags.length === 0) {
-					setOverflowAmount(0);
-					setNonOverFlowedValues([potentiallyNonOverflowedValues[0]]);
-					setLastElementMaxWidth(lastVisibleElementWidth - (lastVisibleElementWidth + (measuredHiddenTags > 1 ? additionnalElementsWidth : 0) - innerWidth));
-					setOverflow(true);
-				} else if (hasOverflow && hasHiddenTags && (lastVisibleElementMaxSize > 65 || measuredVisibleTags.length === 1 && lastVisibleElementMaxSize > 65) && typeof lastVisibleLabel === "string") {
-					setLastElementMaxWidth(lastVisibleElementMaxSize);
-					setOverflow(true);
-					setOverflowAmount(measuredHiddenTags);
-					setNonOverFlowedValues(measuredVisibleTags);
-				} else if (hasOverflow && hasHiddenTags) {
-					setLastElementMaxWidth(0);
-					setOverflow(false);
-					setOverflowAmount(measuredHiddenTags + 1);
-					setNonOverFlowedValues(measuredVisibleTags.slice(0, -1));
-				} else {
-					setOverflow(false);
-					setOverflowAmount(measuredHiddenTags);
-					setNonOverFlowedValues(measuredVisibleTags);
-				}
-			}
-			setDisplayShadowCopy(false);
-		}, [
-			displayShadowCopy,
-			potentiallyNonOverflowedValues,
-			selectedData.selectedValues.length,
-			getWidth
-		]);
-		useEffect(() => {
-			setSelectedData({ type: "update" });
-		}, [setSelectedData, options]);
-		const shouldDisplayValues = useMemo(() => {
-			if (multiselect) return potentiallyNonOverflowedValues.length > 0 || selectedData.selectedValues.some((selectedValue) => findOptionInOptions(options, selectedValue) !== void 0);
-			return selectedData.selectedValues[0] !== void 0 && findOptionInOptions(options, selectedData.selectedValues[0]) !== void 0;
-		}, [
-			multiselect,
-			options,
-			potentiallyNonOverflowedValues.length,
-			selectedData.selectedValues
-		]);
-		const textVariant = useMemo(() => {
-			if (size === "large") return "body";
-			if (size === "medium") return "bodySmall";
-			return "caption";
-		}, [size]);
-		return /* @__PURE__ */ jsx(Tooltip, {
-			disableAnimation: true,
-			text: tooltip,
-			children: /* @__PURE__ */ jsxs("div", {
-				"aria-controls": dropdownId,
-				"aria-expanded": isDropdownVisible,
-				"aria-label": label,
-				autoFocus,
-				className: selectInputStyle.selectBar({
-					disabled,
-					dropdownVisible: isDropdownVisible,
-					readOnly,
-					size,
-					state
-				}),
-				"data-disabled": disabled,
-				"data-readonly": readOnly,
-				"data-testid": dataTestId,
-				id,
-				onClick: openable ? () => setIsDropdownVisible(!isDropdownVisible) : void 0,
-				onKeyDown: (event) => {
-					if (event.key === "ArrowDown") if (isDropdownVisible) {
-						var _document$getElementB;
-						(_document$getElementB = document.getElementById("option-0")) === null || _document$getElementB === void 0 || _document$getElementB.focus();
-					} else setIsDropdownVisible(true);
-					if (event.key === " ") event.preventDefault();
-					return ["Enter", " "].includes(event.key) && openable ? setIsDropdownVisible(!isDropdownVisible) : null;
-				},
-				ref: innerRef,
-				role: "combobox",
-				tabIndex: 0,
-				children: [shouldDisplayValues ? /* @__PURE__ */ jsx(DisplayValues, {
-					disabled,
-					displayShadowCopy,
-					lastElementMaxWidth,
-					measureRef,
-					nonOverflowedValues,
-					overflow,
-					overflowAmount,
-					overflowed: !!overflowAmount,
-					potentiallyNonOverflowedValues,
-					readOnly,
-					refPlusTag,
-					refTag,
-					textVariant
-				}) : /* @__PURE__ */ jsx(Text, {
-					as: "span",
-					className: selectInputStyle.placeholder,
-					disabled,
-					prominence: "weak",
-					sentiment: "neutral",
-					variant: textVariant,
-					children: placeholder
-				}), /* @__PURE__ */ jsxs(Stack, {
-					alignItems: "center",
-					className: selectInputStyle.selectbarState[size === "medium" ? "small" : size],
-					direction: "row",
-					gap: 1,
-					ref: arrowRef,
-					children: [
-						error ? /* @__PURE__ */ jsx(AlertCircleIcon, { sentiment: "danger" }) : null,
-						success && !error ? /* @__PURE__ */ jsx(CheckCircleIcon, { sentiment: "success" }) : null,
-						clearable && selectedData.selectedValues.length > 0 ? /* @__PURE__ */ jsx(Button, {
-							"aria-label": "clear value",
-							"data-testid": "clear-all",
-							disabled: disabled || !selectedData.selectedValues[0] || readOnly,
-							onClick: (event) => {
-								event.stopPropagation();
-								setSelectedData({ type: "clearAll" });
-								if (multiselect) onChange === null || onChange === void 0 || onChange([]);
-								else onChange === null || onChange === void 0 || onChange("");
-							},
-							sentiment: "neutral",
-							size: size === "large" ? "small" : "xsmall",
-							variant: "ghost",
-							children: /* @__PURE__ */ jsx(CloseIcon, {})
-						}) : null,
-						/* @__PURE__ */ jsx(ArrowDownIcon, {
-							"aria-label": "show dropdown",
-							disabled: disabled || readOnly,
-							sentiment: "neutral",
-							size: "small"
-						})
-					]
-				})]
-			})
-		});
-	};
-});
-
-//#endregion
-init_SelectBar();
-export { SelectBar, init_SelectBar };

package/dist/components/SelectInput/components/dropdown.css.d.ts

@@ -1,53 +0,0 @@
-export declare const dropdownWidth: `var(--${string})`;
-export declare const dropdown: string;
-export declare const dropdownContainer: string;
-export declare const dropdownContainerUnGrouped: string;
-export declare const dropdownGroup: string;
-export declare const dropdownGroupSelectable: import("@vanilla-extract/recipes").RuntimeFn<{
-    size: {
-        small: {
-            paddingLeft: `var(--${string})`;
-        };
-        default: {};
-    };
-}>;
-export declare const dropdownGroupWrapper: string;
-export declare const emptyStateGroupStyle: string;
-export declare const dropdownItemBase: string;
-export declare const dropdownItem: import("@vanilla-extract/recipes").RuntimeFn<{
-    selected: {
-        true: {
-            backgroundColor: `var(--${string})`;
-        };
-    };
-    size: {
-        default: {};
-        small: {
-            padding: `var(--${string})`;
-        };
-    };
-    disabled: {
-        true: {
-            backgroundColor: `var(--${string})`;
-            color: `var(--${string})`;
-            selectors: {
-                '&:hover, &:focus': {
-                    backgroundColor: `var(--${string})`;
-                    color: `var(--${string})`;
-                    cursor: "not-allowed";
-                    outline: "none";
-                };
-            };
-        };
-    };
-}>;
-export declare const footer: string;
-export declare const dropdownCheckbox: string;
-export declare const dropdownEmptyState: string;
-export declare const dropdownLoadMore: string;
-export declare const dropdownInfo: string;
-export declare const dropdownInfoTextItem: string;
-export declare const dropdownInfoContainer: string;
-export declare const searchBar: string;
-export declare const comboboxCreate: string;
-//# sourceMappingURL=dropdown.css.d.ts.map

package/dist/components/SelectInput/components/dropdown.css.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"dropdown.css.d.ts","sourceRoot":"","sources":["../../../../src/components/SelectInput/components/dropdown.css.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,aAAa,oBAAc,CAAA;AAExC,eAAO,MAAM,QAAQ,QASnB,CAAA;AAEF,eAAO,MAAM,iBAAiB,QAK5B,CAAA;AAEF,eAAO,MAAM,0BAA0B,QAErC,CAAA;AAEF,eAAO,MAAM,aAAa,QAmBxB,CAAA;AAEF,eAAO,MAAM,uBAAuB;;;;;;;EAqBlC,CAAA;AAEF,eAAO,MAAM,oBAAoB,QAG/B,CAAA;AAEF,eAAO,MAAM,oBAAoB,QAO/B,CAAA;AAEF,eAAO,MAAM,gBAAgB,QAK3B,CAAA;AAEF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;EA6CvB,CAAA;AAEF,eAAO,MAAM,MAAM,QAKjB,CAAA;AAEF,eAAO,MAAM,gBAAgB,QAM3B,CAAA;AAEF,eAAO,MAAM,kBAAkB,QAAqC,CAAA;AAEpE,eAAO,MAAM,gBAAgB,QAAyC,CAAA;AAEtE,eAAO,MAAM,YAAY,QAEvB,CAAA;AAEF,eAAO,MAAM,oBAAoB,QAM/B,CAAA;AAEF,eAAO,MAAM,qBAAqB,QAAgC,CAAA;AAElE,eAAO,MAAM,SAAS,QAGpB,CAAA;AAEF,eAAO,MAAM,cAAc,QAWzB,CAAA"}