fis-component 0.0.70 → 0.0.71

package/dist/cjs/index.js

@@ -71043,7 +71043,7 @@ function mergeRefs(...refs) {
 }
 
 const FISInputDate = React.forwardRef((props, ref) => {
-    const { value, textLabel = "", iconLabel, required, message = "", disabled, negative, positive, format = "DD/MM/YYYY", onClickIconLabel, onChange, getPopupContainer, minDate, maxDate, ...restProps } = props;
+    const { className, value, textLabel = "", iconLabel, required, message = "", disabled, negative, positive, format = "DD/MM/YYYY", onClickIconLabel, onChange, getPopupContainer, minDate, maxDate, ...restProps } = props;
     const [open, setOpen] = React.useState(false);
     const [inputValue, setInputValue] = React.useState(value ? dayjs(value).format(format) : "");
     const [dateValue, setDateValue] = React.useState(value ? dayjs(value) : null);
@@ -71086,7 +71086,7 @@ const FISInputDate = React.forwardRef((props, ref) => {
             onChange?.(null);
         }
     };
-    return (jsxRuntime.jsxs(DivWrapperSC$2, { children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsxs(DivInputWrapperSC$1, { children: [jsxRuntime.jsx(FISInputField, { ...restProps, ref: mergeRef, typeSuffix: "icon", iconSuffix: jsxRuntime.jsx(DateIcon, {}), value: inputValue, negative: negative, disabled: disabled, onFocus: () => setOpen(true), onChange: handleInputChange, onClickSuffix: () => setOpen(true) }), jsxRuntime.jsx(HiddenDatePickerSC, { open: open, value: dateValue, onChange: (value) => handleChange(value), onOpenChange: handleOpenChange, format: format, getPopupContainer: getPopupContainer, minDate: minDate, maxDate: maxDate })] }), message && (jsxRuntime.jsx(DivHintWrapperSC$1, { children: jsxRuntime.jsx(SpanHintSC$3, { className: classNames({
+    return (jsxRuntime.jsxs(DivWrapperSC$2, { className: className, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsxs(DivInputWrapperSC$1, { children: [jsxRuntime.jsx(FISInputField, { ...restProps, ref: mergeRef, typeSuffix: "icon", iconSuffix: jsxRuntime.jsx(DateIcon, {}), value: inputValue, negative: negative, disabled: disabled, onFocus: () => setOpen(true), onChange: handleInputChange, onClickSuffix: () => setOpen(true) }), jsxRuntime.jsx(HiddenDatePickerSC, { open: open, value: dateValue, onChange: (value) => handleChange(value), onOpenChange: handleOpenChange, format: format, getPopupContainer: getPopupContainer, minDate: minDate, maxDate: maxDate })] }), message && (jsxRuntime.jsx(DivHintWrapperSC$1, { children: jsxRuntime.jsx(SpanHintSC$3, { className: classNames({
                         disabled,
                         negative,
                         positive,
@@ -73086,10 +73086,27 @@ const DivWrapperSC$1 = styled.div `
   flex-direction: column;
   gap: ${getTheme("com/input/vertical-gap")};
 `;
+const preventSelection = styled.css `
+  user-select: none !important;
+  -webkit-user-select: none !important;
+  -moz-user-select: none !important;
+  -ms-user-select: none !important;
+  cursor: pointer !important;
+`;
 const DivInputWrapperSC = styled.div `
   position: relative;
   display: inline-block;
   width: 100%;
+
+  ${(props) => props.$hasValue &&
+    styled.css `
+      ${preventSelection}
+
+      input {
+        ${preventSelection}
+        pointer-events: none;
+      }
+    `}
 `;
 const DivDropdownMenuSC = styled.div `
   /* margin-top: ${getTheme("com/select/vertical-gap")}; */
@@ -73219,7 +73236,7 @@ const DivIconSuffixSC = styled.div `
   flex-shrink: 0;
   align-items: center;
   justify-content: center;
-  cursor: pointer;
+  cursor: ${(props) => (props.$disabled ? "not-allowed" : "pointer")};
   color: ${getTheme("com/select/field/right-icon/color-icon")};
 
   ${(props) => {
@@ -73362,7 +73379,7 @@ const FISSelectItem = React.forwardRef((props, ref) => {
     return (jsxRuntime.jsx(DivContainerSC, { className: classNames({
             iconPrefix: iconPrefix,
             negative: negative,
-        }), "$size": size, children: jsxRuntime.jsxs(DivWrapperSC, { children: [iconPrefix && (jsxRuntime.jsx(DivIconPrefixSC, { "$size": size, children: iconPrefix })), jsxRuntime.jsx(InputSC, { ...rest, ref: ref, disabled: disabled, "$size": size }), iconSuffix && (jsxRuntime.jsx(DivIconSuffixSC, { "$size": size, children: iconSuffix }))] }) }));
+        }), "$size": size, children: jsxRuntime.jsxs(DivWrapperSC, { children: [iconPrefix && (jsxRuntime.jsx(DivIconPrefixSC, { "$size": size, children: iconPrefix })), jsxRuntime.jsx(InputSC, { ...rest, ref: ref, disabled: disabled, "$size": size }), iconSuffix && (jsxRuntime.jsx(DivIconSuffixSC, { "$size": size, "$disabled": disabled, children: iconSuffix }))] }) }));
 });
 FISSelectItem.displayName = "FISSelectItem";
 
@@ -73455,8 +73472,10 @@ const FISSelect = React.forwardRef(({ className, style, size = "md", options, va
             onChange(values);
         }
         else {
-            onChange(values[0]);
-            setIsOpen(false);
+            if (values.length > 0) {
+                onChange(values[0]);
+                setIsOpen(false);
+            }
         }
     }, [multi, onChange]);
     const handleMenuClick = React.useCallback(() => {
@@ -73505,7 +73524,7 @@ const FISSelect = React.forwardRef(({ className, style, size = "md", options, va
         document.addEventListener("mousedown", handleClickOutside);
         return () => document.removeEventListener("mousedown", handleClickOutside);
     }, [referenceElement, popperElement]);
-    return (jsxRuntime.jsxs(DivWrapperSC$1, { className: className, style: style, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(DivInputWrapperSC, { ref: setReferenceElement, onClick: handleToggle, children: jsxRuntime.jsx(FISSelectItem, { ...restProps, ref: ref, size: size, iconSuffix: isOpen ? jsxRuntime.jsx(ArrowUpIcon, {}) : jsxRuntime.jsx(ArrowDownIcon, {}), value: computedDisplayValue(), disabled: disabled, activeDropdown: isOpen, negative: negative }) }), message && (jsxRuntime.jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsxRuntime.jsx(SelectedTagsWrapper, { children: jsxRuntime.jsx(MultipleValue, { options: selectedItems, onRemove: handleOptionRemove }) })), isOpen && (jsxRuntime.jsx(Portal, { portal: portal, children: jsxRuntime.jsx(DivDropdownMenuSC, { ref: setPopperElement, style: {
+    return (jsxRuntime.jsxs(DivWrapperSC$1, { className: className, style: style, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(DivInputWrapperSC, { ref: setReferenceElement, onClick: handleToggle, "$hasValue": !!value, children: jsxRuntime.jsx(FISSelectItem, { ...restProps, ref: ref, size: size, iconSuffix: isOpen ? jsxRuntime.jsx(ArrowUpIcon, {}) : jsxRuntime.jsx(ArrowDownIcon, {}), value: computedDisplayValue(), disabled: disabled, activeDropdown: isOpen, negative: negative }) }), message && (jsxRuntime.jsx(SpanHintSC$3, { className: classNames({ disabled, negative, positive }), children: message })), multi && value.length > 0 && (jsxRuntime.jsx(SelectedTagsWrapper, { children: jsxRuntime.jsx(MultipleValue, { options: selectedItems, onRemove: handleOptionRemove }) })), isOpen && (jsxRuntime.jsx(Portal, { portal: portal, children: jsxRuntime.jsx(DivDropdownMenuSC, { ref: setPopperElement, style: {
                         ...styles.popper,
                         width: referenceElement?.offsetWidth,
                         zIndex: 9999,