infinity-ui-elements 1.14.20 → 1.14.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js
CHANGED
|
@@ -3700,8 +3700,15 @@ const Select = React__namespace.forwardRef(({ className, options = [], value: co
|
|
|
3700
3700
|
setIsOpen(newOpen);
|
|
3701
3701
|
}
|
|
3702
3702
|
};
|
|
3703
|
-
const
|
|
3704
|
-
|
|
3703
|
+
const handleTriggerContainerClick = (event) => {
|
|
3704
|
+
if (isDisabled || isLoading)
|
|
3705
|
+
return;
|
|
3706
|
+
const target = event.target;
|
|
3707
|
+
// Let clear/other explicit buttons and links behave normally.
|
|
3708
|
+
if (target.closest("button") || target.closest("a"))
|
|
3709
|
+
return;
|
|
3710
|
+
// Open the dropdown when clicking anywhere on the trigger area.
|
|
3711
|
+
handleOpenChange(true);
|
|
3705
3712
|
};
|
|
3706
3713
|
const handleSelect = (option) => {
|
|
3707
3714
|
if (controlledValue === undefined) {
|
|
@@ -3849,7 +3856,7 @@ const Select = React__namespace.forwardRef(({ className, options = [], value: co
|
|
|
3849
3856
|
const displaySuffix = suffix ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [suffix, chevronIcon] })) : (chevronIcon);
|
|
3850
3857
|
// Render dropdown menu content
|
|
3851
3858
|
const renderDropdownContent = () => (jsxRuntime.jsx(DropdownMenu, { items: menuItems, sectionHeading: sectionHeading, isEmpty: options.length === 0, emptyTitle: emptyTitle, emptyDescription: emptyDescription, emptyIcon: emptyIcon, disableFooter: true, onClose: () => handleOpenChange(false), className: menuClassName, width: isMobile ? "full" : widthStyle, unstyled: isMobile }));
|
|
3852
|
-
return (jsxRuntime.jsxs("div", { ref: containerRef, className: "relative w-full", children: [jsxRuntime.jsx(TextField, { ref: inputRef, label: label, helperText: helperText, errorText: errorText, successText: successText, validationState: validationState, isDisabled: isDisabled, isRequired: isRequired, isOptional: isOptional, isLoading: isLoading, size: size, prefix: displayPrefix, suffix: displaySuffix, showClearButton: showClearButton && hasValue && !isLoading, onClear: handleClear, placeholder: placeholder, value: displayValue, readOnly: true, containerClassName: cn("w-full", containerClassName), labelClassName: labelClassName, className: cn("cursor-pointer", triggerClassName, className), inputClassName: "cursor-pointer", infoHeading: infoHeading, infoDescription: infoDescription, LinkComponent: LinkComponent, linkText: linkText, linkHref: linkHref, onLinkClick: onLinkClick, onClick:
|
|
3859
|
+
return (jsxRuntime.jsxs("div", { ref: containerRef, className: "relative w-full", onClickCapture: handleTriggerContainerClick, children: [jsxRuntime.jsx(TextField, { ref: inputRef, label: label, helperText: helperText, errorText: errorText, successText: successText, validationState: validationState, isDisabled: isDisabled, isRequired: isRequired, isOptional: isOptional, isLoading: isLoading, size: size, prefix: displayPrefix, suffix: displaySuffix, showClearButton: showClearButton && hasValue && !isLoading, onClear: handleClear, placeholder: placeholder, value: displayValue, readOnly: true, containerClassName: cn("w-full", containerClassName), labelClassName: labelClassName, className: cn("cursor-pointer", triggerClassName, className), inputClassName: "cursor-pointer", infoHeading: infoHeading, infoDescription: infoDescription, LinkComponent: LinkComponent, linkText: linkText, linkHref: linkHref, onLinkClick: onLinkClick, onClick: () => handleOpenChange(true), onKeyDown: handleKeyDown, role: "combobox", "aria-haspopup": "listbox", "aria-expanded": isOpen, ...props }), isOpen && !isDisabled && !isLoading && (isMobile ? (jsxRuntime.jsx(BottomSheet, { isOpen: isOpen, onClose: () => handleOpenChange(false), title: sectionHeading || label, variant: "default", showDragHandle: true, closeOnOverlayClick: true, closeOnEscape: true, closeOnSwipeDown: true, children: renderDropdownContent() })) : (jsxRuntime.jsx("div", { ref: dropdownContainerRef, className: cn("absolute z-50 left-0 right-0", dropdownPlacement === "bottom"
|
|
3853
3860
|
? "top-full mt-1"
|
|
3854
3861
|
: "bottom-full mb-1"), children: renderDropdownContent() })))] }));
|
|
3855
3862
|
});
|
|
@@ -4818,6 +4825,13 @@ const selectTriggerVariants = classVarianceAuthority.cva("flex items-center gap-
|
|
|
4818
4825
|
},
|
|
4819
4826
|
});
|
|
4820
4827
|
const SelectTextField = React__namespace.forwardRef(({ textValue: controlledTextValue, defaultTextValue, onTextChange, selectOptions = [], selectValue: controlledSelectValue, defaultSelectValue, onSelectChange, selectPlaceholder = "Select", selectTriggerClassName, selectMenuClassName, selectMenuWidth = "auto", selectSectionHeading, selectEmptyTitle = "No options available", selectEmptyDescription = "There are no options to select from.", selectEmptyIcon, position = "suffix", isSelectDisabled = false, isTextFieldDisabled = false, label, helperText, errorText, successText, validationState = "none", isDisabled = false, isRequired = false, isOptional = false, size = "medium", containerClassName, labelClassName, inputClassName, className, ...textFieldProps }, ref) => {
|
|
4828
|
+
const valuesMatch = React__namespace.useCallback((left, right) => {
|
|
4829
|
+
if (left === right)
|
|
4830
|
+
return true;
|
|
4831
|
+
if (left === undefined || right === undefined)
|
|
4832
|
+
return false;
|
|
4833
|
+
return String(left) === String(right);
|
|
4834
|
+
}, []);
|
|
4821
4835
|
const [uncontrolledTextValue, setUncontrolledTextValue] = React__namespace.useState(defaultTextValue || "");
|
|
4822
4836
|
const [uncontrolledSelectValue, setUncontrolledSelectValue] = React__namespace.useState(defaultSelectValue);
|
|
4823
4837
|
const [isSelectOpen, setIsSelectOpen] = React__namespace.useState(false);
|
|
@@ -4847,8 +4861,14 @@ const SelectTextField = React__namespace.forwardRef(({ textValue: controlledText
|
|
|
4847
4861
|
// isDisabled disables both; individual props allow disabling each independently
|
|
4848
4862
|
const effectiveSelectDisabled = isDisabled || isSelectDisabled;
|
|
4849
4863
|
const effectiveTextFieldDisabled = isDisabled || isTextFieldDisabled;
|
|
4850
|
-
// Find the selected option
|
|
4851
|
-
const selectedOption = selectOptions.find((opt) => opt.value
|
|
4864
|
+
// Find the selected option (supports number/string equivalence like 1.14 vs "1.14")
|
|
4865
|
+
const selectedOption = selectOptions.find((opt) => valuesMatch(opt.value, selectValue));
|
|
4866
|
+
// Keep uncontrolled default in sync when defaultSelectValue changes
|
|
4867
|
+
React__namespace.useEffect(() => {
|
|
4868
|
+
if (controlledSelectValue === undefined) {
|
|
4869
|
+
setUncontrolledSelectValue(defaultSelectValue);
|
|
4870
|
+
}
|
|
4871
|
+
}, [controlledSelectValue, defaultSelectValue]);
|
|
4852
4872
|
// Determine which helper text to show
|
|
4853
4873
|
const displayHelperText = errorText || successText || helperText;
|
|
4854
4874
|
const currentValidationState = errorText
|